fix display homepage

navigation/index.tsx

@@ -61,7 +61,7 @@ function BottomTabNavigator() {
 
   return (
     <BottomTab.Navigator
-      initialRouteName="WatchLater"
+      initialRouteName="Home"
       screenOptions={{
         tabBarActiveTintColor: "purple",
 

screens/HomeScreen.tsx

@@ -73,10 +73,16 @@ export default function HomeScreen({ navigation }: RootStackScreenProps<'Home'>)
     });
 
 
-
     const dispatch = useDispatch();
 
-
+    useEffect(() => {
+        const loadTrendingID = async () => {
+            // @ts-ignore
+            await dispatch(getTrendingID());
+        };
+        console.log("test1:", trendingMovies);
+        loadTrendingID();
+    }, [dispatch]);
 
     type ItemProps = {
         movie : Movie
@@ -88,7 +94,9 @@ export default function HomeScreen({ navigation }: RootStackScreenProps<'Home'>)
        dispatch(removeMovieTrending(props));
     }
 
-return(
+    return(
+        <>
+        {trendingMovies.length !== 0 && (
         <SafeAreaView style={styles.background}>
                 <ImageBackground blurRadius={20}
                                  style={{
@@ -160,8 +168,9 @@ return(
 
                     </TouchableOpacity>
                 </View>
-        </SafeAreaView>);
+            </SafeAreaView>)}
-    
+        </>
+)
 }
 type BadgeGenreProps = {
     name : String
@@ -170,7 +179,7 @@ type BadgeGenreProps = {
 }
 
 export function BadgeGenre(props: BadgeGenreProps) {
-    if(props.isSelected==false){
+    if(props.isSelected===false){
         return (
             <View style={{paddingHorizontal: 20,  marginHorizontal: 5,height: 35, backgroundColor: '#2E2E2E', borderRadius: 20, justifyContent: "center"}} >
                 <Text style={{color: "white"}}>{props.name}</Text>

screens/WatchLaterScreen.tsx

@@ -42,15 +42,7 @@ export default function WatchLaterScreen({ navigation }: RootTabScreenProps<'Wat
     const [isLoading, setLoading] = useState(true);
     // @ts-ignore
     const trendingMovies = useSelector(state => state.appReducer.watchLaterMovies);
-    const dispatch = useDispatch();
+
-    useEffect(() => {
-        const loadTrendingID = async () => {
-            // @ts-ignore
-            await dispatch(getTrendingID());
-        };
-        loadTrendingID();
-        console.log("test2:", trendingMovies);
-    }, [dispatch]);
   return (
       <SafeAreaView style={styles.container}>
           <View style={{height: 50, justifyContent: "flex-start",flexDirection: 'row', paddingHorizontal:20,  marginBottom: 15,marginVertical:5, alignItems:"flex-end"}} >