feat(anime-screen): add see more to this and next season section

hoangvu12 · Nov 21, 2023 · bc3aecf · bc3aecf
1 parent b667f57
commit bc3aecf
Showing 1 changed file with 49 additions and 3 deletions.
diff --git a/src/screens/anime/screen.tsx b/src/screens/anime/screen.tsx
@@ -1,8 +1,16 @@
+import { useNavigation } from '@react-navigation/native';
 import * as React from 'react';
 import { ScrollView } from 'react-native';
 
 import useModuleLinking from '@/hooks/use-module-linking';
-import { FocusAwareStatusBar, Text, View } from '@/ui';
+import {
+  Button,
+  FocusAwareStatusBar,
+  getNextSeason,
+  getSeason,
+  Text,
+  View,
+} from '@/ui';
 import { BannerList } from '@/ui/banner-card';
 
 import AiringTodayList from './components/airing-today-list';
@@ -14,6 +22,8 @@ import WatchedList from './components/watched-list';
 export const AnimeHomeScreen = () => {
   useModuleLinking();
 
+  const navigation = useNavigation();
+
   return (
     <>
       <FocusAwareStatusBar />
@@ -37,13 +47,49 @@ export const AnimeHomeScreen = () => {
           </View>
 
           <View className="w-full space-y-2">
-            <Text variant="lg">Popular this season</Text>
+            <View className="flex flex-row items-center justify-between">
+              <Text variant="lg">Popular this season</Text>
+
+              <Button
+                onPress={() => {
+                  const thisSeason = getSeason();
+
+                  navigation.navigate('Search', {
+                    season: thisSeason.season,
+                    year: thisSeason.year,
+                  });
+                }}
+                className="bg-transparent p-0"
+              >
+                <Text variant="sm" className="text-gray-300">
+                  See more
+                </Text>
+              </Button>
+            </View>
 
             <PopularThisSeason />
           </View>
 
           <View className="w-full space-y-2">
-            <Text variant="lg">Upcoming next season</Text>
+            <View className="flex flex-row items-center justify-between">
+              <Text variant="lg">Upcoming next season</Text>
+
+              <Button
+                onPress={() => {
+                  const nextSeason = getNextSeason();
+
+                  navigation.navigate('Search', {
+                    season: nextSeason.season,
+                    year: nextSeason.year,
+                  });
+                }}
+                className="bg-transparent p-0"
+              >
+                <Text variant="sm" className="text-gray-300">
+                  See more
+                </Text>
+              </Button>
+            </View>
 
             <UpcomingNextSeason />
           </View>