diff --git a/app/(auth)/(tabs)/search/index.tsx b/app/(auth)/(tabs)/search/index.tsx index 53f54402..4b0b073d 100644 --- a/app/(auth)/(tabs)/search/index.tsx +++ b/app/(auth)/(tabs)/search/index.tsx @@ -1,3 +1,4 @@ +import { Button } from "@/components/Button"; import { HorizontalScroll } from "@/components/common/HorrizontalScroll"; import { Input } from "@/components/common/Input"; import { Text } from "@/components/common/Text"; @@ -11,6 +12,7 @@ import SeriesPoster from "@/components/posters/SeriesPoster"; import { apiAtom, userAtom } from "@/providers/JellyfinProvider"; import { useSettings } from "@/utils/atoms/settings"; import { getUserItemData } from "@/utils/jellyfin/user-library/getUserItemData"; +import { Ionicons } from "@expo/vector-icons"; import { Api } from "@jellyfin/sdk"; import { BaseItemDto, @@ -19,9 +21,21 @@ import { import { getItemsApi, getSearchApi } from "@jellyfin/sdk/lib/utils/api"; import { useQuery } from "@tanstack/react-query"; import axios from "axios"; -import { router, useNavigation } from "expo-router"; +import { + Href, + router, + useLocalSearchParams, + useNavigation, + usePathname, +} from "expo-router"; import { useAtom } from "jotai"; -import React, { useCallback, useLayoutEffect, useMemo, useState } from "react"; +import React, { + useCallback, + useEffect, + useLayoutEffect, + useMemo, + useState, +} from "react"; import { Platform, ScrollView, TouchableOpacity, View } from "react-native"; import { useDebounce } from "use-debounce"; @@ -35,6 +49,10 @@ const exampleSearches = [ ]; export default function search() { + const params = useLocalSearchParams(); + + const { q, prev } = params as { q: string; prev: Href }; + const [search, setSearch] = useState(""); const [debouncedSearch] = useDebounce(search, 500); @@ -48,6 +66,10 @@ export default function search() { return settings?.searchEngine || "Jellyfin"; }, [settings]); + useEffect(() => { + if (q && q.length > 0) setSearch(q); + }, [q]); + const searchFn = useCallback( async ({ types, @@ -95,7 +117,10 @@ export default function search() { navigation.setOptions({ headerSearchBarOptions: { placeholder: "Search...", - onChangeText: (e: any) => setSearch(e.nativeEvent.text), + onChangeText: (e: any) => { + router.setParams({ q: "" }); + setSearch(e.nativeEvent.text); + }, hideWhenScrolling: false, autoFocus: true, }, @@ -196,6 +221,13 @@ export default function search() { /> )} + {!!q && ( + + + Results for {q} + + + )} m.Id!)} diff --git a/components/series/CastAndCrew.tsx b/components/series/CastAndCrew.tsx index 1d33e0fb..6dcdaccd 100644 --- a/components/series/CastAndCrew.tsx +++ b/components/series/CastAndCrew.tsx @@ -10,11 +10,13 @@ import Poster from "../posters/Poster"; import { useAtom } from "jotai"; import { apiAtom } from "@/providers/JellyfinProvider"; import { getPrimaryImageUrl } from "@/utils/jellyfin/image/getPrimaryImageUrl"; -import { router } from "expo-router"; +import { router, usePathname } from "expo-router"; export const CastAndCrew = ({ item }: { item: BaseItemDto }) => { const [api] = useAtom(apiAtom); + const pathname = usePathname(); + return ( Cast & Crew @@ -23,7 +25,7 @@ export const CastAndCrew = ({ item }: { item: BaseItemDto }) => { renderItem={(item, index) => ( { - // TODO: Navigate to person + router.push(`/search?q=${item.Name}&prev=${pathname}`); }} key={item.Id} className="flex flex-col w-32"