i18n + vjs i18n fixes

- Reverted #7004 as it ended up preventing the rest of the components from being localized when there is an error. Replaced that with a `setLabel` that simply checks if the component exists before setting the label.

- Fix "Autoplay Next On" not localized on initial load -- it was only localized when the setting changes. It is unfortunate that we need to also set the label in an additional `useEffect` instead of just using vjs events, but so be it.

static/app-strings.json

@@ -155,7 +155,9 @@
   "Lost passwords cannot be recovered.": "Lost passwords cannot be recovered.",
   "Experimental settings": "Experimental settings",
   "Autoplay media files": "Autoplay media files",
-  "Autoplay video and audio files when navigating to a file, as well as the next related item when a file finishes playing.": "Autoplay video and audio files when navigating to a file, as well as the next related item when a file finishes playing.",
+  "Autoplay video and audio files when navigating to a file.": "Autoplay video and audio files when navigating to a file.",
+  "Autoplay next recommended content": "Autoplay next recommended content",
+  "Autoplay video and audio files as the next related item when a file finishes playing.": "Autoplay video and audio files as the next related item when a file finishes playing.",
   "Clear application cache": "Clear application cache",
   "Clear Cache": "Clear Cache",
   "This might fix issues that you are having. Your wallet will not be affected.": "This might fix issues that you are having. Your wallet will not be affected.",
@@ -1768,8 +1770,11 @@
   "Play (space)": "Play (space)",
   "Unmute (m)": "Unmute (m)",
   "Exit Fullscreen (f)": "Exit Fullscreen (f)",
-  "Toggle Theater mode (t)": "Toggle Theater mode (t)",
+  "Theater Mode (t)": "Theater Mode (t)",
+  "Default Mode (t)": "Default Mode (t)",
   "Quality": "Quality",
+  "Autoplay Next On": "Autoplay Next On",
+  "Autoplay Next Off": "Autoplay Next Off",
   "Announcements, updates, and rewards specific to users of LBRY Android.": "Announcements, updates, and rewards specific to users of LBRY Android.",
   "LBRY has special programs and opportunities for people in school.": "LBRY has special programs and opportunities for people in school.",
   "Creator specific news, automated reports, and other updates.": "Creator specific news, automated reports, and other updates.",

ui/component/viewers/videoViewer/internal/videojs.jsx

@@ -309,50 +309,55 @@ export default React.memo<Props>(function VideoJs(props: Props) {
     // on top of just 'loadstart'.
     // - videojs changes the MuteToggle text at 'loadstart', so this was chosen
     // as the listener to update static texts.
+
+    const setLabel = (controlBar, childName, label) => {
+      const c = controlBar.getChild(childName);
+      if (c) {
+        c.controlText(label);
+      }
+    };
+
     const player = playerRef.current;
     if (player) {
-      try {
+      const ctrlBar = player.getChild('controlBar');
-        const controlBar = player.getChild('controlBar');
       switch (e.type) {
         case 'play':
-          controlBar.getChild('PlayToggle').controlText(__('Pause (space)'));
+          setLabel(ctrlBar, 'PlayToggle', __('Pause (space)'));
           break;
         case 'pause':
-          controlBar.getChild('PlayToggle').controlText(__('Play (space)'));
+          setLabel(ctrlBar, 'PlayToggle', __('Play (space)'));
           break;
         case 'volumechange':
-          controlBar
+          ctrlBar
             .getChild('VolumePanel')
             .getChild('MuteToggle')
             .controlText(player.muted() || player.volume() === 0 ? __('Unmute (m)') : __('Mute (m)'));
           break;
         case 'fullscreenchange':
-          controlBar
+          setLabel(
-            .getChild('FullscreenToggle')
+            ctrlBar,
-            .controlText(player.isFullscreen() ? __('Exit Fullscreen (f)') : __('Fullscreen (f)'));
+            'FullscreenToggle',
+            player.isFullscreen() ? __('Exit Fullscreen (f)') : __('Fullscreen (f)')
+          );
           break;
         case 'loadstart':
           // --- Do everything ---
-          controlBar.getChild('PlaybackRateMenuButton').controlText(__('Playback Rate (<, >)'));
+          setLabel(ctrlBar, 'PlaybackRateMenuButton', __('Playback Rate (<, >)'));
-          controlBar.getChild('QualityButton').controlText(__('Quality'));
+          setLabel(ctrlBar, 'QualityButton', __('Quality'));
+          setLabel(ctrlBar, 'PlayNextButton', __('Play Next (SHIFT+N)'));
+          setLabel(ctrlBar, 'PlayPreviousButton', __('Play Previous (SHIFT+P)'));
+          setLabel(ctrlBar, 'TheaterModeButton', videoTheaterMode ? __('Default Mode (t)') : __('Theater Mode (t)'));
+          setLabel(ctrlBar, 'AutoplayNextButton', autoplaySetting ? __('Autoplay Next On') : __('Autoplay Next Off'));
+
           resolveCtrlText({ type: 'play' });
           resolveCtrlText({ type: 'pause' });
           resolveCtrlText({ type: 'volumechange' });
           resolveCtrlText({ type: 'fullscreenchange' });
-          controlBar
-            .getChild('TheaterModeButton')
-            .controlText(videoTheaterMode ? __('Default Mode (t)') : __('Theater Mode (t)'));
-          controlBar.getChild('PlayNextButton').controlText(__('Play Next (SHIFT+N)'));
-          controlBar.getChild('PlayPreviousButton').controlText(__('Play Previous (SHIFT+P)'));
           break;
         default:
           if (isDev) throw Error('Unexpected: ' + e.type);
           break;
       }
-      } catch {
-        // Just fail silently. It'll just be due to hidden ctrls, and if it is
-        // due to control hierarchy change, we'll notice that in the GUI.
-      }
     }
   }
 
@@ -648,7 +653,7 @@ export default React.memo<Props>(function VideoJs(props: Props) {
       const autoplayButton = controlBar.getChild('AutoplayNextButton');
 
       if (autoplayButton) {
-        const title = autoplaySetting ? 'Autoplay Next On' : 'Autoplay Next Off';
+        const title = autoplaySetting ? __('Autoplay Next On') : __('Autoplay Next Off');
 
         autoplayButton.controlText(title);
         autoplayButton.setAttribute('aria-label', title);

ui/modal/modalBlockChannel/view.jsx

@@ -118,12 +118,12 @@ export default function ModalBlockChannel(props: Props) {
 
     if (Number.isInteger(seconds) && seconds > 0) {
       if (seconds > ONE_HUNDRED_YEARS_IN_SECONDS) {
-        setInvalid('Wow, banned for more than 100 years?');
+        setInvalid(__('Wow, banned for more than 100 years?'));
       } else {
         setValid(seconds);
       }
     } else {
-      setInvalid('Invalid duration.');
+      setInvalid(__('Invalid duration.'));
     }
   }, [timeoutInput, timeoutInputErr, timeoutSec]);