diff --git a/app/(auth)/(tabs)/home/_layout.tsx b/app/(auth)/(tabs)/(home)/_layout.tsx similarity index 80% rename from app/(auth)/(tabs)/home/_layout.tsx rename to app/(auth)/(tabs)/(home)/_layout.tsx index 94a68602..ad71dcec 100644 --- a/app/(auth)/(tabs)/home/_layout.tsx +++ b/app/(auth)/(tabs)/(home)/_layout.tsx @@ -1,8 +1,9 @@ import { Chromecast } from "@/components/Chromecast"; +import { HeaderBackButton } from "@/components/common/HeaderBackButton"; +import { nestedTabPageScreenOptions } from "@/components/stacks/NestedTabPageStack"; import { Feather } from "@expo/vector-icons"; import { Stack, useRouter } from "expo-router"; -import { Platform, View } from "react-native"; -import { TouchableOpacity } from "react-native"; +import { Platform, TouchableOpacity, View } from "react-native"; export default function IndexLayout() { const router = useRouter(); @@ -45,6 +46,9 @@ export default function IndexLayout() { ), }} /> + {Object.entries(nestedTabPageScreenOptions).map(([name, options]) => ( + + ))} ); } diff --git a/app/(auth)/(tabs)/home/index.tsx b/app/(auth)/(tabs)/(home)/index.tsx similarity index 100% rename from app/(auth)/(tabs)/home/index.tsx rename to app/(auth)/(tabs)/(home)/index.tsx diff --git a/app/(auth)/actors/[actorId].tsx b/app/(auth)/(tabs)/(home,libraries,search)/actors/[actorId].tsx similarity index 82% rename from app/(auth)/actors/[actorId].tsx rename to app/(auth)/(tabs)/(home,libraries,search)/actors/[actorId].tsx index 8cb2322e..446eb807 100644 --- a/app/(auth)/actors/[actorId].tsx +++ b/app/(auth)/(tabs)/(home,libraries,search)/actors/[actorId].tsx @@ -1,34 +1,23 @@ -import { Bitrate } from "@/components/BitrateSelector"; +import { ItemCardText } from "@/components/ItemCardText"; import { Loader } from "@/components/Loader"; import { OverviewText } from "@/components/OverviewText"; -import { Ratings } from "@/components/Ratings"; +import { ParallaxScrollView } from "@/components/ParallaxPage"; +import { InfiniteHorizontalScroll } from "@/components/common/InfiniteHorrizontalScroll"; import { Text } from "@/components/common/Text"; +import { TouchableItemRouter } from "@/components/common/TouchableItemRouter"; import { MoviesTitleHeader } from "@/components/movies/MoviesTitleHeader"; -import { SeriesTitleHeader } from "@/components/series/SeriesTitleHeader"; +import MoviePoster from "@/components/posters/MoviePoster"; import { apiAtom, userAtom } from "@/providers/JellyfinProvider"; -import { useSettings } from "@/utils/atoms/settings"; import { getBackdropUrl } from "@/utils/jellyfin/image/getBackdropUrl"; -import { getLogoImageUrlById } from "@/utils/jellyfin/image/getLogoImageUrlById"; -import { getStreamUrl } from "@/utils/jellyfin/media/getStreamUrl"; import { getUserItemData } from "@/utils/jellyfin/user-library/getUserItemData"; -import { chromecastProfile } from "@/utils/profiles/chromecast"; -import ios from "@/utils/profiles/ios"; -import native from "@/utils/profiles/native"; -import old from "@/utils/profiles/old"; -import { getItemsApi, getMediaInfoApi } from "@jellyfin/sdk/lib/utils/api"; +import { BaseItemDtoQueryResult } from "@jellyfin/sdk/lib/generated-client/models"; +import { getItemsApi } from "@jellyfin/sdk/lib/utils/api"; import { useQuery } from "@tanstack/react-query"; import { Image } from "expo-image"; import { useLocalSearchParams } from "expo-router"; import { useAtom } from "jotai"; -import { useCallback, useMemo, useState } from "react"; +import { useCallback, useMemo } from "react"; import { View } from "react-native"; -import { useCastDevice } from "react-native-google-cast"; -import { ParallaxScrollView } from "../../../components/ParallaxPage"; -import { InfiniteHorizontalScroll } from "@/components/common/InfiniteHorrizontalScroll"; -import { TouchableItemRouter } from "@/components/common/TouchableItemRouter"; -import MoviePoster from "@/components/posters/MoviePoster"; -import { ItemCardText } from "@/components/ItemCardText"; -import { BaseItemDtoQueryResult } from "@jellyfin/sdk/lib/generated-client/models"; const page: React.FC = () => { const local = useLocalSearchParams(); diff --git a/app/(auth)/albums/[albumId].tsx b/app/(auth)/(tabs)/(home,libraries,search)/albums/[albumId].tsx similarity index 93% rename from app/(auth)/albums/[albumId].tsx rename to app/(auth)/(tabs)/(home,libraries,search)/albums/[albumId].tsx index 0a4a991d..3e17610d 100644 --- a/app/(auth)/albums/[albumId].tsx +++ b/app/(auth)/(tabs)/(home,libraries,search)/albums/[albumId].tsx @@ -1,5 +1,6 @@ import { Chromecast } from "@/components/Chromecast"; import { Text } from "@/components/common/Text"; +import { TouchableItemRouter } from "@/components/common/TouchableItemRouter"; import { SongsList } from "@/components/music/SongsList"; import ArtistPoster from "@/components/posters/ArtistPoster"; import { apiAtom, userAtom } from "@/providers/JellyfinProvider"; @@ -102,16 +103,11 @@ export default function page() { {album.AlbumArtists?.map((a) => ( - { - router.push(`/artists/${a.Id}/page`); - }} - > + {album?.AlbumArtist} - + ))} diff --git a/app/(auth)/artists/[artistId]/page.tsx b/app/(auth)/(tabs)/(home,libraries,search)/artists/[artistId].tsx similarity index 100% rename from app/(auth)/artists/[artistId]/page.tsx rename to app/(auth)/(tabs)/(home,libraries,search)/artists/[artistId].tsx diff --git a/app/(auth)/artists/page.tsx b/app/(auth)/(tabs)/(home,libraries,search)/artists/index.tsx similarity index 95% rename from app/(auth)/artists/page.tsx rename to app/(auth)/(tabs)/(home,libraries,search)/artists/index.tsx index 3c3b6c8b..4827287e 100644 --- a/app/(auth)/artists/page.tsx +++ b/app/(auth)/(tabs)/(home,libraries,search)/artists/index.tsx @@ -1,4 +1,5 @@ import { Text } from "@/components/common/Text"; +import { TouchableItemRouter } from "@/components/common/TouchableItemRouter"; import ArtistPoster from "@/components/posters/ArtistPoster"; import MoviePoster from "@/components/posters/MoviePoster"; import { apiAtom, userAtom } from "@/providers/JellyfinProvider"; @@ -90,15 +91,13 @@ export default function page() { justifyContent: "space-between", }} renderItem={({ item, index }) => ( - { - router.push(`/artists/${item.Id}/page`); - }} + item={item} > {collection?.CollectionType === "movies" && ( @@ -110,7 +109,7 @@ export default function page() { {item.Name} {item.ProductionYear} - + )} keyExtractor={(item) => item.Id || ""} /> diff --git a/app/(auth)/collections/[collectionId].tsx b/app/(auth)/(tabs)/(home,libraries,search)/collections/[collectionId].tsx similarity index 98% rename from app/(auth)/collections/[collectionId].tsx rename to app/(auth)/(tabs)/(home,libraries,search)/collections/[collectionId].tsx index f1b85916..b9a657be 100644 --- a/app/(auth)/collections/[collectionId].tsx +++ b/app/(auth)/(tabs)/(home,libraries,search)/collections/[collectionId].tsx @@ -3,7 +3,6 @@ import { TouchableItemRouter } from "@/components/common/TouchableItemRouter"; import { FilterButton } from "@/components/filters/FilterButton"; import { ResetFiltersButton } from "@/components/filters/ResetFiltersButton"; import { ItemCardText } from "@/components/ItemCardText"; -import { Loader } from "@/components/Loader"; import MoviePoster from "@/components/posters/MoviePoster"; import { apiAtom, userAtom } from "@/providers/JellyfinProvider"; import { @@ -18,7 +17,6 @@ import { import { BaseItemDto, BaseItemDtoQueryResult, - BaseItemKind, } from "@jellyfin/sdk/lib/generated-client/models"; import { getFilterApi, @@ -27,7 +25,8 @@ import { } from "@jellyfin/sdk/lib/utils/api"; import { FlashList } from "@shopify/flash-list"; import { useInfiniteQuery, useQuery } from "@tanstack/react-query"; -import { Stack, useLocalSearchParams, useNavigation } from "expo-router"; +import { useLocalSearchParams, useNavigation } from "expo-router"; +import * as ScreenOrientation from "expo-screen-orientation"; import { useAtom } from "jotai"; import React, { useCallback, @@ -36,8 +35,7 @@ import React, { useMemo, useState, } from "react"; -import { FlatList, NativeScrollEvent, ScrollView, View } from "react-native"; -import * as ScreenOrientation from "expo-screen-orientation"; +import { FlatList, View } from "react-native"; const MemoizedTouchableItemRouter = React.memo(TouchableItemRouter); diff --git a/app/(auth)/downloads.tsx b/app/(auth)/(tabs)/(home,libraries,search)/downloads.tsx similarity index 100% rename from app/(auth)/downloads.tsx rename to app/(auth)/(tabs)/(home,libraries,search)/downloads.tsx diff --git a/app/(auth)/items/[id].tsx b/app/(auth)/(tabs)/(home,libraries,search)/items/[id].tsx similarity index 99% rename from app/(auth)/items/[id].tsx rename to app/(auth)/(tabs)/(home,libraries,search)/items/[id].tsx index f782633d..02945db5 100644 --- a/app/(auth)/items/[id].tsx +++ b/app/(auth)/(tabs)/(home,libraries,search)/items/[id].tsx @@ -3,6 +3,7 @@ import { Bitrate, BitrateSelector } from "@/components/BitrateSelector"; import { DownloadItem } from "@/components/DownloadItem"; import { Loader } from "@/components/Loader"; import { OverviewText } from "@/components/OverviewText"; +import { ParallaxScrollView } from "@/components/ParallaxPage"; import { PlayButton } from "@/components/PlayButton"; import { PlayedStatus } from "@/components/PlayedStatus"; import { Ratings } from "@/components/Ratings"; @@ -32,7 +33,6 @@ import { useAtom } from "jotai"; import { useMemo, useState } from "react"; import { View } from "react-native"; import { useCastDevice } from "react-native-google-cast"; -import { ParallaxScrollView } from "../../../components/ParallaxPage"; const page: React.FC = () => { const local = useLocalSearchParams(); diff --git a/app/(auth)/series/[id].tsx b/app/(auth)/(tabs)/(home,libraries,search)/series/[id].tsx similarity index 100% rename from app/(auth)/series/[id].tsx rename to app/(auth)/(tabs)/(home,libraries,search)/series/[id].tsx diff --git a/app/(auth)/settings.tsx b/app/(auth)/(tabs)/(home,libraries,search)/settings.tsx similarity index 97% rename from app/(auth)/settings.tsx rename to app/(auth)/(tabs)/(home,libraries,search)/settings.tsx index 052e8a99..ce8d5df5 100644 --- a/app/(auth)/settings.tsx +++ b/app/(auth)/(tabs)/(home,libraries,search)/settings.tsx @@ -1,15 +1,14 @@ import { Button } from "@/components/Button"; import { Text } from "@/components/common/Text"; import { ListItem } from "@/components/ListItem"; +import { SettingToggles } from "@/components/settings/SettingToggles"; +import { useFiles } from "@/hooks/useFiles"; import { apiAtom, useJellyfin, userAtom } from "@/providers/JellyfinProvider"; import { clearLogs, readFromLog } from "@/utils/log"; import { useQuery } from "@tanstack/react-query"; +import * as Haptics from "expo-haptics"; import { useAtom } from "jotai"; import { ScrollView, View } from "react-native"; -import * as Haptics from "expo-haptics"; -import { useFiles } from "@/hooks/useFiles"; -import { SettingToggles } from "@/components/settings/SettingToggles"; -import { WebSocketsTest } from "@/components/settings/WebsocketsText"; export default function settings() { const { logout } = useJellyfin(); diff --git a/app/(auth)/songs/[songId].tsx b/app/(auth)/(tabs)/(home,libraries,search)/songs/[songId].tsx similarity index 100% rename from app/(auth)/songs/[songId].tsx rename to app/(auth)/(tabs)/(home,libraries,search)/songs/[songId].tsx diff --git a/app/(auth)/(tabs)/libraries/[libraryId].tsx b/app/(auth)/(tabs)/(libraries)/[libraryId].tsx similarity index 100% rename from app/(auth)/(tabs)/libraries/[libraryId].tsx rename to app/(auth)/(tabs)/(libraries)/[libraryId].tsx diff --git a/app/(auth)/(tabs)/libraries/_layout.tsx b/app/(auth)/(tabs)/(libraries)/_layout.tsx similarity index 72% rename from app/(auth)/(tabs)/libraries/_layout.tsx rename to app/(auth)/(tabs)/(libraries)/_layout.tsx index 14c6abb3..ed2d8e6e 100644 --- a/app/(auth)/(tabs)/libraries/_layout.tsx +++ b/app/(auth)/(tabs)/(libraries)/_layout.tsx @@ -1,4 +1,5 @@ -import { Stack, useRouter } from "expo-router"; +import { nestedTabPageScreenOptions } from "@/components/stacks/NestedTabPageStack"; +import { Stack } from "expo-router"; import { Platform } from "react-native"; export default function IndexLayout() { @@ -25,6 +26,9 @@ export default function IndexLayout() { headerShadowVisible: false, }} /> + {Object.entries(nestedTabPageScreenOptions).map(([name, options]) => ( + + ))} ); } diff --git a/app/(auth)/(tabs)/libraries/index.tsx b/app/(auth)/(tabs)/(libraries)/index.tsx similarity index 93% rename from app/(auth)/(tabs)/libraries/index.tsx rename to app/(auth)/(tabs)/(libraries)/index.tsx index 3c02844e..ceee8783 100644 --- a/app/(auth)/(tabs)/libraries/index.tsx +++ b/app/(auth)/(tabs)/(libraries)/index.tsx @@ -1,4 +1,5 @@ import { Text } from "@/components/common/Text"; +import { TouchableItemRouter } from "@/components/common/TouchableItemRouter"; import { Loader } from "@/components/Loader"; import { apiAtom, userAtom } from "@/providers/JellyfinProvider"; import { getPrimaryImageUrl } from "@/utils/jellyfin/image/getPrimaryImageUrl"; @@ -62,8 +63,6 @@ interface Props { } const LibraryItemCard: React.FC = ({ library }) => { - const router = useRouter(); - const [api] = useAtom(apiAtom); const url = useMemo( @@ -78,11 +77,7 @@ const LibraryItemCard: React.FC = ({ library }) => { if (!url) return null; return ( - { - router.push(`/libraries/${library.Id}`); - }} - > + = ({ library }) => { {library.Name} - + ); }; diff --git a/app/(auth)/(tabs)/search/_layout.tsx b/app/(auth)/(tabs)/(search)/_layout.tsx similarity index 67% rename from app/(auth)/(tabs)/search/_layout.tsx rename to app/(auth)/(tabs)/(search)/_layout.tsx index 8ba7b396..9f8a7150 100644 --- a/app/(auth)/(tabs)/search/_layout.tsx +++ b/app/(auth)/(tabs)/(search)/_layout.tsx @@ -1,3 +1,4 @@ +import { nestedTabPageScreenOptions } from "@/components/stacks/NestedTabPageStack"; import { Stack } from "expo-router"; import { Platform } from "react-native"; @@ -15,6 +16,9 @@ export default function SearchLayout() { headerShadowVisible: false, }} /> + {Object.entries(nestedTabPageScreenOptions).map(([name, options]) => ( + + ))} ); } diff --git a/app/(auth)/(tabs)/search/index.tsx b/app/(auth)/(tabs)/(search)/index.tsx similarity index 99% rename from app/(auth)/(tabs)/search/index.tsx rename to app/(auth)/(tabs)/(search)/index.tsx index 750e9db8..9fadddbb 100644 --- a/app/(auth)/(tabs)/search/index.tsx +++ b/app/(auth)/(tabs)/(search)/index.tsx @@ -257,10 +257,10 @@ export default function search() { data={data} renderItem={(item) => ( - router.push(`/items/${item.Id}`)} + item={item} > @@ -269,7 +269,7 @@ export default function search() { {item.ProductionYear} - + )} /> )} diff --git a/app/(auth)/(tabs)/_layout.tsx b/app/(auth)/(tabs)/_layout.tsx index 9f6884dd..b8772e68 100644 --- a/app/(auth)/(tabs)/_layout.tsx +++ b/app/(auth)/(tabs)/_layout.tsx @@ -1,13 +1,10 @@ -import { router, Tabs } from "expo-router"; -import React, { useEffect } from "react"; -import * as NavigationBar from "expo-navigation-bar"; import { TabBarIcon } from "@/components/navigation/TabBarIcon"; import { Colors } from "@/constants/Colors"; -import { Platform, TouchableOpacity, View } from "react-native"; -import { Feather } from "@expo/vector-icons"; -import { Chromecast } from "@/components/Chromecast"; import { BlurView } from "expo-blur"; -import { StyleSheet } from "react-native"; +import * as NavigationBar from "expo-navigation-bar"; +import { Tabs } from "expo-router"; +import React, { useEffect } from "react"; +import { Platform, StyleSheet } from "react-native"; export default function TabLayout() { useEffect(() => { @@ -50,7 +47,7 @@ export default function TabLayout() { > - - - - - - - - - - = ({ width = 48, height = 48 }) => { +export const Chromecast: React.FC = ({ + width = 48, + height = 48, + background = "transparent", +}) => { const client = useRemoteMediaClient(); const castDevice = useCastDevice(); const devices = useDevices(); @@ -31,9 +35,19 @@ export const Chromecast: React.FC = ({ width = 48, height = 48 }) => { })(); }, [client, devices, castDevice, sessionManager, discoveryManager]); + if (background === "transparent") + return ( + + + + ); + return ( - + - + ); }; diff --git a/components/ParallaxPage.tsx b/components/ParallaxPage.tsx index d4aa87ec..4f955c6b 100644 --- a/components/ParallaxPage.tsx +++ b/components/ParallaxPage.tsx @@ -33,14 +33,14 @@ export const ParallaxScrollView: React.FC = ({ translateY: interpolate( scrollOffset.value, [-HEADER_HEIGHT, 0, HEADER_HEIGHT], - [-HEADER_HEIGHT / 2, 0, HEADER_HEIGHT * 0.75], + [-HEADER_HEIGHT / 2, 0, HEADER_HEIGHT * 0.75] ), }, { scale: interpolate( scrollOffset.value, [-HEADER_HEIGHT, 0, HEADER_HEIGHT], - [2, 1, 1], + [2, 1, 1] ), }, ], @@ -58,30 +58,6 @@ export const ParallaxScrollView: React.FC = ({ ref={scrollRef} scrollEventThrottle={16} > - router.back()} - className="absolute left-4 z-50 bg-black rounded-full p-2 border border-neutral-900" - style={{ - top: inset.top + 17, - }} - > - - - - - - - {logo && ( {logo} diff --git a/components/common/HeaderBackButton.tsx b/components/common/HeaderBackButton.tsx new file mode 100644 index 00000000..4ff4c38d --- /dev/null +++ b/components/common/HeaderBackButton.tsx @@ -0,0 +1,59 @@ +import { + TouchableOpacity, + TouchableOpacityProps, + View, + ViewProps, +} from "react-native"; +import { Text } from "@/components/common/Text"; +import { useRouter } from "expo-router"; +import { Ionicons } from "@expo/vector-icons"; +import { BlurView, BlurViewProps } from "expo-blur"; + +interface Props extends BlurViewProps { + background?: "blur" | "transparent"; + touchableOpacityProps?: TouchableOpacityProps; +} + +export const HeaderBackButton: React.FC = ({ + background = "transparent", + touchableOpacityProps, + ...props +}) => { + const router = useRouter(); + + if (background === "transparent") + return ( + + router.back()} + {...touchableOpacityProps} + > + + + + ); + + return ( + router.back()} + className=" bg-black rounded-full p-2 border border-neutral-900" + {...touchableOpacityProps} + > + + + ); +}; diff --git a/components/common/TouchableItemRouter.tsx b/components/common/TouchableItemRouter.tsx index f1a36760..8ca06867 100644 --- a/components/common/TouchableItemRouter.tsx +++ b/components/common/TouchableItemRouter.tsx @@ -1,14 +1,8 @@ -import { - TouchableOpacity, - TouchableOpacityProps, - View, - ViewProps, -} from "react-native"; -import { Text } from "@/components/common/Text"; import { BaseItemDto } from "@jellyfin/sdk/lib/generated-client/models"; -import { PropsWithChildren } from "react"; -import { useRouter } from "expo-router"; import * as Haptics from "expo-haptics"; +import { useRouter, useSegments } from "expo-router"; +import { PropsWithChildren } from "react"; +import { Alert, TouchableOpacity, TouchableOpacityProps } from "react-native"; interface Props extends TouchableOpacityProps { item: BaseItemDto; @@ -20,46 +14,69 @@ export const TouchableItemRouter: React.FC> = ({ ...props }) => { const router = useRouter(); - return ( - { - Haptics.impactAsync(Haptics.ImpactFeedbackStyle.Light); + const segments = useSegments(); - if (item.Type === "Series") { - router.push(`/series/${item.Id}`); - return; - } - if (item.Type === "Episode") { - router.push(`/items/${item.Id}`); - return; - } - if (item.Type === "MusicAlbum") { - router.push(`/albums/${item.Id}`); - return; - } - if (item.Type === "Audio") { - router.push(`/albums/${item.AlbumId}`); - return; - } - if (item.Type === "MusicArtist") { - router.push(`/artists/${item.Id}/page`); - return; - } - if (item.Type === "Person") { - router.push(`/actors/${item.Id}`); - return; - } + const from = segments[2]; - if (item.Type === "BoxSet") { - router.push(`/collections/${item.Id}`); - return; - } + if (from === "(home)" || from === "(search)" || from === "(libraries)") + return ( + { + console.log("[0]", item.Type); - router.push(`/items/${item.Id}`); - }} - {...props} - > - {children} - - ); + Haptics.impactAsync(Haptics.ImpactFeedbackStyle.Light); + + if (item.Type === "Series") { + router.push(`/(auth)/(tabs)/${from}/series/${item.Id}`); + return; + } + + if (item.Type === "MusicAlbum") { + router.push(`/(auth)/(tabs)/${from}/albums/${item.Id}`); + return; + } + + if (item.Type === "Audio") { + router.push(`/(auth)/(tabs)/${from}/albums/${item.AlbumId}`); + return; + } + + if (item.Type === "MusicArtist") { + router.push(`/(auth)/(tabs)/${from}/artists/${item.Id}`); + return; + } + + if (item.Type === "Person") { + router.push(`/(auth)/(tabs)/${from}/actors/${item.Id}`); + return; + } + + if (item.Type === "BoxSet") { + router.push(`/(auth)/(tabs)/${from}/collections/${item.Id}`); + return; + } + + if (item.Type === "UserView") { + Alert.alert("Not implemented"); + return; + } + + if (item.Type === "CollectionFolder") { + router.push(`/(auth)/(tabs)/(libraries)/${item.Id}`); + return; + } + + // Same as default + // if (item.Type === "Episode") { + // router.push(`/items/${item.Id}`); + // return; + // } + + router.push(`/(auth)/(tabs)/${from}/items/${item.Id}`); + }} + {...props} + > + {children} + + ); }; diff --git a/components/filters/_SortButton.tsx b/components/filters/_SortButton.tsx deleted file mode 100644 index bff476a0..00000000 --- a/components/filters/_SortButton.tsx +++ /dev/null @@ -1,93 +0,0 @@ -import * as DropdownMenu from "zeego/dropdown-menu"; -import { Text } from "@/components/common/Text"; -import { apiAtom, userAtom } from "@/providers/JellyfinProvider"; -import { Ionicons } from "@expo/vector-icons"; -import { useQuery } from "@tanstack/react-query"; -import { useAtom } from "jotai"; -import { TouchableOpacity, View, ViewProps } from "react-native"; -import { - sortByAtom, - sortOptions, - sortOrderAtom, - sortOrderOptions, -} from "@/utils/atoms/filters"; - -interface Props extends ViewProps { - title: string; -} - -export const SortButton: React.FC = ({ title, ...props }) => { - const [api] = useAtom(apiAtom); - const [user] = useAtom(userAtom); - - const [sortBy, setSortBy] = useAtom(sortByAtom); - const [sortOrder, setSortOrder] = useAtom(sortOrderAtom); - - return ( - - - - - Sort by - - - - - - {sortOptions?.map((g) => ( - { - if (next === "on") { - setSortBy(g); - } else { - setSortBy(sortOptions[0]); - } - }} - key={g.key} - textValue={g.value} - > - - - ))} - - - {sortOrderOptions.map((g) => ( - { - if (next === "on") { - setSortOrder(g); - } else { - setSortOrder(sortOrderOptions[0]); - } - }} - key={g.key} - textValue={g.value} - > - - - ))} - - - - ); -}; diff --git a/components/series/NextEpisodeButton.tsx b/components/series/NextEpisodeButton.tsx index 835d8334..709c9bfd 100644 --- a/components/series/NextEpisodeButton.tsx +++ b/components/series/NextEpisodeButton.tsx @@ -90,7 +90,7 @@ export const NextEpisodeButton: React.FC = ({ return (