open ReactNative;
open ReactNavigation;

// TODO: add to TextInput?
external elementToObj: TextInput.element => Js.t({..}) = "%identity";

[@react.component]
let make = (~navigation: Navigation.t) => {
  open Navigation;
  let (text, onChangeText) = React.useState(() => "Home");
  let ref = React.useRef(Js.Nullable.null);

  React.useEffect0(() => {
    let intervalId =
      Js.Global.setTimeout(
        () =>
          switch (ref->React.Ref.current->Js.Nullable.toOption) {
          | Some(_ref) => _ref->elementToObj##focus()
          | None => ()
          },
        5000,
      );
    Some(() => Js.Global.clearTimeout(intervalId));
  });

  <>
    <TouchableOpacity
      onPress={_ => navigation->Navigation.navigate("PrivacyPolicy")}>
      <Text> {React.string(text)} </Text>
    </TouchableOpacity>
    <TextInput ref onChangeText={text => onChangeText(_ => text)} />
  </>;
};