Bugfix - showing empty recent streams screen after deleting all streams

src/screens/recentStreams/RecentStreams.tsx

@@ -1,4 +1,5 @@
 import { Layout, Button } from '@dolbyio/uikit-react-native';
+import { useIsFocused } from '@react-navigation/native';
 import React, { useEffect } from 'react';
 import { useIntl } from 'react-intl';
 import { ScrollView, View, Pressable, LogBox } from 'react-native';
@@ -20,6 +21,7 @@ export const RecentStreams = ({ navigation }) => {
   const dispatch = useDispatch();
 
   const streamsList: StreamInfo[] = useSelector((state) => state.persistedSavedStreamsReducer.streams);
+  const isFocused = useIsFocused();
 
   const playNewStreamTitle = intl.formatMessage({
     id: 'playNewStream',
@@ -48,10 +50,18 @@ export const RecentStreams = ({ navigation }) => {
   };
 
   useEffect(() => {
-    if (streamsList.length === 0) {
+    navigateToUserInputIfRequired();
+    const unsubscribe = navigation.addListener('focus', () => {
+      navigateToUserInputIfRequired();
+    });
+    return unsubscribe;
+  }, [streamsList, isFocused]);
+
+  const navigateToUserInputIfRequired = () => {
+    if (streamsList.length === 0 && isFocused) {
       navigation.navigate(Routes.UserInput);
     }
-  }, [streamsList]);
+  };
 
   useEffect(() => {
     LogBox.ignoreLogs(['VirtualizedLists should never be nested']);

src/screens/savedStreams/SavedStreams.tsx

@@ -101,7 +101,7 @@ export const SavedStreams = ({ navigation }) => {
           </ScrollView>
         ) : (
           <View style={styles.noStreamsMessageWrapper}>
-            <Text id="noSavedStreamsTitleText" type="h1" align="center" numberOfLines={2} />
+            <Text id="noSavedStreamsTitleText" type="h2" align="center" numberOfLines={2} />
             <Text id="noSavedStreamssubtitleText" type="bodyDefault" color="secondary.200" />
           </View>
         )}

src/screens/userInput/UserInput.tsx

@@ -2,7 +2,7 @@ import { Layout, Input, Button, Icon, ValidationType } from '@dolbyio/uikit-reac
 import useTheme from '@dolbyio/uikit-react-native/hooks/useAppTheme';
 import React, { useState } from 'react';
 import { useIntl } from 'react-intl';
-import { Pressable, ScrollView, View } from 'react-native';
+import { Pressable, ScrollView, View, Platform } from 'react-native';
 import { SafeAreaView } from 'react-native-safe-area-context';
 import { useDispatch } from 'react-redux';
 
@@ -107,7 +107,7 @@ export const UserInput = ({ navigation }) => {
             textColor="white"
             onChangeText={onChangeStreamName}
             validation={validation}
-            autoFocus
+            autoFocus={!Platform.isTV}
           />
           <Input
             value={accountId}