refactor(settings): update tab structure and localization strings (#662)

* refactor(settings): update tab structure and localization strings in SettingsDialog

Signed-off-by: Pavel Pikta <devops@pavelpikta.com>

* feat(settings): add desktop-specific hint for VLC protocol in MobileAppSettings

Signed-off-by: Pavel Pikta <devops@pavelpikta.com>

---------

Signed-off-by: Pavel Pikta <devops@pavelpikta.com>

Author: pavelpikta

web/src/components/Settings/MobileAppSettings.jsx

@@ -1,5 +1,5 @@
-import { FormControlLabel, FormGroup, FormHelperText, Switch } from '@material-ui/core'
-import { isMacOS, isAppleDevice } from 'utils/Utils'
+import { FormControlLabel, FormGroup, FormHelperText, Switch, Link } from '@material-ui/core'
+import { isMacOS, isAppleDevice, isDesktop } from 'utils/Utils'
 import { useTranslation } from 'react-i18next'
 
 import { SecondarySettingsContent, SettingSectionLabel } from './style'
@@ -15,6 +15,7 @@ export default function MobileAppSettings({
   const { t } = useTranslation()
   const isMac = isMacOS()
   const isApple = isAppleDevice()
+  const isDesktopPlatform = isDesktop()
 
   return (
     <SecondarySettingsContent>
@@ -26,6 +27,19 @@ export default function MobileAppSettings({
           labelPlacement='start'
         />
         <FormHelperText margin='none'>{t('SettingsDialog.UseVLCHint')}</FormHelperText>
+        {isDesktopPlatform && (
+          <FormHelperText margin='none'>
+            {t('SettingsDialog.UseVLCDesktopHintPrefix')}{' '}
+            <Link
+              href='https://github.com/northsea4/vlc-protocol'
+              target='_blank'
+              rel='noopener noreferrer'
+              color='secondary'
+            >
+              vlc-protocol-handler
+            </Link>
+          </FormHelperText>
+        )}
         {isApple && (
           <>
             <FormControlLabel

web/src/components/Settings/SettingsDialog.jsx

@@ -142,9 +142,7 @@ export default function SettingsDialog({ handleClose }) {
 
           <StyledTab label={t('Search')} {...a11yProps(2)} />
 
-          <StyledTab label={t('TMDB.Settings')} {...a11yProps(3)} />
-
-          <StyledTab label={t('SettingsDialog.Tabs.App')} {...a11yProps(4)} />
+          <StyledTab label={t('SettingsDialog.Tabs.App')} {...a11yProps(3)} />
         </StyledTabs>
       </AppBar>
 
@@ -181,9 +179,6 @@ export default function SettingsDialog({ handleClose }) {
 
               <TabPanel value={selectedTab} index={3} dir={direction}>
                 <TMDBSettings settings={settings} updateSettings={updateSettings} />
-              </TabPanel>
-
-              <TabPanel value={selectedTab} index={4} dir={direction}>
                 <MobileAppSettings
                   isVlcUsed={isVlcUsed}
                   setIsVlcUsed={setIsVlcUsed}

web/src/locales/bg/translation.json

@@ -154,7 +154,7 @@
     "FriendlyName": "Име на DLNA сървъра",
     "FriendlyNameHint": "Оставете празно, за да използвате по подразбиране",
     "JsonFile": "JSON файл",
-    "MobileAppSettings": "Настройки на мобилното приложение",
+    "MobileAppSettings": "Плейъри",
     "PeersListenPort": "Порт за слушане на пиъри",
     "PeersListenPortHint": "1024 - 65535, 0 - случайно",
     "PreloadCache": "Предварително зареждане на кеша преди възпроизвеждане",
@@ -191,7 +191,7 @@
     "Tabs": {
       "Additional": "Допълнителен",
       "AdditionalDisabled": "(разрешете ПРО режим)",
-      "App": "Плейъри",
+      "App": "Приложение",
       "Main": "Основен"
     },
     "TorrentDisconnectTimeout": "Време на изчакване на връзката с торенти",
@@ -204,6 +204,7 @@
     "UseInfuseHint": "Добави бутон към Infuse плеъра за списъка с торенти",
     "UseVLC": "Подкана за отваряне на видео във VLC",
     "UseVLCHint": "Добави бутон към VLC плеъра за списъка с торенти",
+    "UseVLCDesktopHintPrefix": "На компютър е необходим",
     "UseIINA": "Подкана за отваряне на видео в IINA",
     "UseIINAHint": "Добави бутон към IINA плеъра за списъка с торенти (само macOS)",
     "ViewedHistoryStorage": "Съхранение на историята на прегледите:",

web/src/locales/en/translation.json

@@ -154,7 +154,7 @@
     "FriendlyName": "DLNA Server Name",
     "FriendlyNameHint": "Leave blank to use default",
     "JsonFile": "JSON File",
-    "MobileAppSettings": "Mobile app settings",
+    "MobileAppSettings": "Players",
     "PeersListenPort": "Peers Listen Port",
     "PeersListenPortHint": "1024 - 65535, 0 - random",
     "PreloadCache": "Preload Cache Before Play",
@@ -191,7 +191,7 @@
     "Tabs": {
       "Additional": "Additional",
       "AdditionalDisabled": "(enable PRO mode)",
-      "App": "Players",
+      "App": "Application",
       "Main": "Main"
     },
     "TorrentDisconnectTimeout": "Torrent Disconnect Timeout",
@@ -204,6 +204,7 @@
     "UseInfuseHint": "Add Infuse player button to torrent content list",
     "UseVLC": "Prompt to open video in VLC",
     "UseVLCHint": "Add VLC player button to torrent content list",
+    "UseVLCDesktopHintPrefix": "Desktop requires",
     "UseIINA": "Prompt to open video in IINA",
     "UseIINAHint": "Add IINA player button to torrent content list (macOS only)",
     "ViewedHistoryStorage": "Viewed History Storage:",

web/src/locales/fr/translation.json

@@ -154,7 +154,7 @@
     "FriendlyName": "Nom du serveur DLNA",
     "FriendlyNameHint": "Laisser vide pour utiliser la valeur par défaut",
     "JsonFile": "Fichier JSON",
-    "MobileAppSettings": "Paramètres de l'application mobile",
+    "MobileAppSettings": "Lecteurs",
     "PeersListenPort": "Port d'écoute des pairs",
     "PeersListenPortHint": "1024 - 65535, 0 - aléatoire",
     "PreloadCache": "Cache de préchargement avant la lecture",
@@ -191,7 +191,7 @@
     "Tabs": {
       "Additional": "Supplémentaire",
       "AdditionalDisabled": "(activer le mode PRO)",
-      "App": "Lecteurs",
+      "App": "Application",
       "Main": "Principal"
     },
     "TorrentDisconnectTimeout": "Délai de déconnexion du torrent",
@@ -204,6 +204,7 @@
     "UseInfuseHint": "Ajouter un bouton de lecteur Infuse à la liste de contenu du torrent",
     "UseVLC": "Demander d'ouvrir la vidéo dans VLC",
     "UseVLCHint": "Ajouter un bouton de lecteur VLC à la liste de contenu du torrent",
+    "UseVLCDesktopHintPrefix": "Sur PC nécessite",
     "UseIINA": "Demander d'ouvrir la vidéo dans IINA",
     "UseIINAHint": "Ajouter un bouton de lecteur IINA à la liste de contenu du torrent (macOS uniquement)",
     "ViewedHistoryStorage": "Stockage de l'historique des vues :",

web/src/locales/ro/translation.json

@@ -154,7 +154,7 @@
     "FriendlyName": "Numele serverului DLNA",
     "FriendlyNameHint": "Lăsați necompletat pentru a utiliza valoarea implicită",
     "JsonFile": "JSON File",
-    "MobileAppSettings": "Setări aplicație mobilă",
+    "MobileAppSettings": "Playere",
     "PeersListenPort": "Port pentru conexiuni de la peers",
     "PeersListenPortHint": "1024 - 65535, 0 - aleatoriu",
     "PreloadCache": "Preîncărcare cache înainte de redare",
@@ -191,7 +191,7 @@
     "Tabs": {
       "Additional": "Suplimentar",
       "AdditionalDisabled": "(activează modul PRO)",
-      "App": "Playere",
+      "App": "Aplicație",
       "Main": "Meniu Principal"
     },
     "TorrentDisconnectTimeout": "Timp de expirare pentru deconectarea torrentului",
@@ -204,6 +204,7 @@
     "UseInfuseHint": "Adăugați butonul Infuse player la lista de conținut torrent",
     "UseVLC": "Solicitare pentru deschiderea videoclipului în VLC",
     "UseVLCHint": "Adăugați butonul VLC player la lista de conținut torrent",
+    "UseVLCDesktopHintPrefix": "Pe desktop necesită",
     "UseIINA": "Solicitare pentru deschiderea videoclipului în IINA",
     "UseIINAHint": "Adăugați butonul IINA player la lista de conținut torrent (doar macOS)",
     "ViewedHistoryStorage": "Istoricul vizualizărilor stocate:",

web/src/locales/ru/translation.json

@@ -154,7 +154,7 @@
     "FriendlyName": "Имя сервера DLNA",
     "FriendlyNameHint": "Оставьте пустым, чтобы использовать значение по умолчанию.",
     "JsonFile": "JSON-файл",
-    "MobileAppSettings": "Настройки приложения",
+    "MobileAppSettings": "Плееры",
     "PeersListenPort": "Порт для входящих подключений",
     "PeersListenPortHint": "1024 - 65535, 0 - авто",
     "PreloadCache": "Буфер предзагрузки",
@@ -191,7 +191,7 @@
     "Tabs": {
       "Additional": "Расширенные",
       "AdditionalDisabled": "(включите ПРО-режим)",
-      "App": "Плееры",
+      "App": "Приложение",
       "Main": "Основные"
     },
     "TorrentDisconnectTimeout": "Тайм-аут отключения торрента",
@@ -204,6 +204,7 @@
     "UseInfuseHint": "Добавить кнопку проигрывателя Infuse в список торрент-контента",
     "UseVLC": "Предлагать открыть видео в VLC",
     "UseVLCHint": "Добавить кнопку проигрывателя VLC в список торрент-контента",
+    "UseVLCDesktopHintPrefix": "На ПК требуется",
     "UseIINA": "Предлагать открыть видео в IINA",
     "UseIINAHint": "Добавить кнопку проигрывателя IINA в список торрент-контента (только macOS)",
     "ViewedHistoryStorage": "Хранилище истории просмотров:",

web/src/locales/ua/translation.json

@@ -154,7 +154,7 @@
     "FriendlyName": "Ім'я сервера DLNA",
     "FriendlyNameHint": "Залиште порожнім, щоб використовувати значення за промовчанням.",
     "JsonFile": "JSON файл",
-    "MobileAppSettings": "Установки моб. програми",
+    "MobileAppSettings": "Плеєри",
     "PeersListenPort": "Порт для вхідних з'єднань",
     "PeersListenPortHint": "1024 - 65535, 0 - авто",
     "PreloadCache": "Буфер попер. завантаження",
@@ -191,7 +191,7 @@
     "Tabs": {
       "Additional": "Додаткові",
       "AdditionalDisabled": "(включіть ПРО-режим)",
-      "App": "Плеєри",
+      "App": "Застосунок",
       "Main": "Основні"
     },
     "TorrentDisconnectTimeout": "Час очікування відключення торрента",
@@ -204,6 +204,7 @@
     "UseInfuseHint": "Додати кнопку програвача Infuse до списку торрент-контенту",
     "UseVLC": "Пропонувати відкрити відео у VLC",
     "UseVLCHint": "Додати кнопку програвача VLC до списку торрент-контенту",
+    "UseVLCDesktopHintPrefix": "На ПК потрібен",
     "UseIINA": "Пропонувати відкрити відео в IINA",
     "UseIINAHint": "Додати кнопку програвача IINA до списку торрент-контенту (тільки macOS)",
     "ViewedHistoryStorage": "Збереження історії переглядів:",

web/src/locales/zh/translation.json

@@ -154,7 +154,7 @@
     "FriendlyName": "DLNA服务器名称",
     "FriendlyNameHint": "留空使用默认值",
     "JsonFile": "JSON文件",
-    "MobileAppSettings": "移动APP设置",
+    "MobileAppSettings": "播放器",
     "PeersListenPort": "Peers监听端口",
     "PeersListenPortHint": "1024 - 65535，0 - 自动",
     "PreloadCache": "播放前预加载缓存",
@@ -191,7 +191,7 @@
     "Tabs": {
       "Additional": "附加",
       "AdditionalDisabled": "（启用专业模式）",
-      "App": "播放器",
+      "App": "应用程序",
       "Main": "主要"
     },
     "TorrentDisconnectTimeout": "种子断开超时",
@@ -204,6 +204,7 @@
     "UseInfuseHint": "将 Infuse 播放器按钮添加到种子内容列表",
     "UseVLC": "提示在VLC中打开视频",
     "UseVLCHint": "将VLC播放器按钮添加到种子内容列表",
+    "UseVLCDesktopHintPrefix": "桌面端需要",
     "UseIINA": "提示在 IINA 中打开视频",
     "UseIINAHint": "将 IINA 播放器按钮添加到种子内容列表（仅 macOS）",
     "ViewedHistoryStorage": "查看历史存储：",

web/src/utils/Utils.js

@@ -113,6 +113,19 @@ export const isMacOS = () => {
   return isMac && !isIOS
 }
 
+export const isDesktop = () => {
+  if (typeof window === 'undefined' || typeof navigator === 'undefined') {
+    return false
+  }
+
+  const userAgent = navigator.userAgent || ''
+
+  const isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(userAgent)
+  const isTabletWithTouch = /Macintosh/i.test(userAgent) && navigator.maxTouchPoints > 1
+
+  return !isMobile && !isTabletWithTouch
+}
+
 /**
  * Formats bytes to classic size units (B, KB, MB, GB, TB)
  * Uses binary (1024) base for conversion