feat: always focus input when search tab is pressed

apps/expo/src/app/(tabs)/search/SearchTabContext.tsx

@@ -0,0 +1,8 @@
+import React from "react";
+
+const SearchTabContext = React.createContext({
+  // eslint-disable-next-line @typescript-eslint/no-empty-function
+  focusSearchInputRef: { current: () => {} },
+});
+
+export default SearchTabContext;

apps/expo/src/app/(tabs)/search/Searchbar.tsx

@@ -1,10 +1,12 @@
-import { useCallback, useRef, useState } from "react";
+import { useCallback, useContext, useEffect, useRef, useState } from "react";
 import { TextInput, View } from "react-native";
 import { useFocusEffect } from "expo-router";
 import { FontAwesome5 } from "@expo/vector-icons";
 
 import Colors from "@movie-web/tailwind-config/colors";
 
+import SearchTabContext from "./SearchTabContext";
+
 export default function Searchbar({
   onSearchChange,
 }: {
@@ -13,6 +15,14 @@ export default function Searchbar({
   const [keyword, setKeyword] = useState("");
   const inputRef = useRef<TextInput>(null);
 
+  const { focusSearchInputRef } = useContext(SearchTabContext);
+
+  useEffect(() => {
+    focusSearchInputRef.current = () => {
+      inputRef.current?.focus();
+    };
+  }, [focusSearchInputRef]);
+
   useFocusEffect(
     useCallback(() => {
       // When the screen is focused