feat(camera): add Camera Tab toggle

Author: f-io

src/main/shared/types/AppConfig.ts

@@ -25,6 +25,7 @@ export type ExtraConfig = DongleConfig & {
   kiosk: boolean
   uiZoomPercent: number
   camera: string
+  cameraEnabled: boolean
   telemetryEnabled: boolean
   telemetryDashboards?: TelemetryDashboardConfig[]
   appearanceMode: AppearanceMode

src/main/shared/types/DefaultConfig.ts

@@ -62,6 +62,7 @@ export const DEFAULT_EXTRA_CONFIG: ExtraConfig = {
   kiosk: false,
   uiZoomPercent: 100,
   camera: '',
+  cameraEnabled: false,
   cameraMirror: false,
   autoSwitchOnStream: false,
   autoSwitchOnPhoneCall: true,

src/renderer/src/components/navigation/useTabsConfig.tsx

@@ -16,6 +16,7 @@ export const useTabsConfig: (receivingVideo: boolean) => TabConfig[] = (receivin
   const isDongleConnected = useStatusStore((s) => s.isDongleConnected || s.isAaActive)
   const cameraFound = useStatusStore((s) => s.cameraFound)
   const clusterEnabled = useLiviStore((s) => s.settings?.clusterEnabled ?? false)
+  const cameraEnabled = useLiviStore((s) => s.settings?.cameraEnabled ?? true)
   const telemetryEnabled = useLiviStore((s) => s.settings?.telemetryEnabled ?? false)
 
   return [
@@ -65,12 +66,16 @@ export const useTabsConfig: (receivingVideo: boolean) => TabConfig[] = (receivin
         ]
       : []),
     { label: 'Media', path: ROUTES.MEDIA, icon: <PlayCircleOutlinedIcon sx={{ fontSize: 30 }} /> },
-    {
-      label: 'Camera',
-      path: ROUTES.CAMERA,
-      icon: <CameraswitchOutlinedIcon sx={{ fontSize: 30 }} />,
-      disabled: !cameraFound
-    },
+    ...(cameraEnabled
+      ? [
+          {
+            label: 'Camera',
+            path: ROUTES.CAMERA,
+            icon: <CameraswitchOutlinedIcon sx={{ fontSize: 30 }} />,
+            disabled: !cameraFound
+          }
+        ]
+      : []),
     {
       label: 'Settings',
       path: ROUTES.SETTINGS,

src/renderer/src/locales/de.json

@@ -146,6 +146,8 @@
     "clusterSafeAreaRightDescription": "Rechter Abstand des Cluster-Bildschirms in px.",
     "camera": "Kamera",
     "cameraMirror": "Spiegeln",
+    "cameraTab": "Kamera-Tab",
+    "reverseCamera": "Rückfahrkamera",
     "appearance": "Aussehen",
     "darkMode": "Dark Mode",
     "phoneAppearance": "Erscheinungsbild Telefon",

src/renderer/src/locales/en.json

@@ -146,6 +146,8 @@
     "clusterSafeAreaRightDescription": "Cluster screen right inset in px.",
     "camera": "Camera",
     "cameraMirror": "Mirroring",
+    "cameraTab": "Camera Tab",
+    "reverseCamera": "Reverse Camera",
     "appearance": "Appearance",
     "darkMode": "Dark Mode",
     "phoneAppearance": "Phone Appearance",

src/renderer/src/locales/ua.json

@@ -146,6 +146,8 @@
     "clusterSafeAreaRightDescription": "Правий відступ екрана кластера в px.",
     "camera": "Камера",
     "cameraMirror": "Дзеркалювання",
+    "cameraTab": "Вкладка камери",
+    "reverseCamera": "Камера заднього виду",
     "appearance": "Зовнішній вигляд",
     "darkMode": "Темний режим",
     "phoneAppearance": "Вигляд телефону",

src/renderer/src/routes/schemas/videoSchema.ts

@@ -328,12 +328,18 @@ export const videoSchema: SettingsNode<ExtraConfig> = {
     },
     {
       type: 'route',
-      label: 'Camera',
-      labelKey: 'settings.camera',
+      label: 'Reverse Camera',
+      labelKey: 'settings.reverseCamera',
       route: 'camera',
       path: '',
       displayValue: true,
       children: [
+        {
+          type: 'checkbox',
+          label: 'Camera Tab',
+          labelKey: 'settings.cameraTab',
+          path: 'cameraEnabled'
+        },
         {
           type: 'route',
           label: 'Camera',