Remove live mode from config (#11618)

* Use preferred mode as default

* Remove live mode from config

* Add deer icon

* remove from config schema

web/src/hooks/use-camera-live-mode.ts

@@ -6,7 +6,7 @@ import { LivePlayerMode } from "@/types/live";
 
 export default function useCameraLiveMode(
   cameraConfig: CameraConfig,
-  preferredMode?: string,
+  preferredMode?: LivePlayerMode,
 ): LivePlayerMode | undefined {
   const { data: config } = useSWR<FrigateConfig>("config");
 
@@ -23,18 +23,16 @@ export default function useCameraLiveMode(
     );
   }, [config, cameraConfig]);
   const defaultLiveMode = useMemo<LivePlayerMode | undefined>(() => {
-    if (config && cameraConfig) {
+    if (config) {
       if (restreamEnabled) {
-        return cameraConfig.ui.live_mode || config.ui.live_mode;
+        return preferredMode || "mse";
       }
 
       return "jsmpeg";
     }
 
     return undefined;
-    // config will be updated if camera config is updated
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [cameraConfig, restreamEnabled]);
+  }, [config, preferredMode, restreamEnabled]);
   const [viewSource] = usePersistence<LivePlayerMode>(
     `${cameraConfig.name}-source`,
     defaultLiveMode,

web/src/types/frigateConfig.ts

@@ -1,5 +1,4 @@
 import { IconName } from "@/components/icons/IconPicker";
-import { LivePlayerMode } from "./live";
 
 export interface UiConfig {
   timezone?: string;
@@ -7,8 +6,6 @@ export interface UiConfig {
   date_style?: "full" | "long" | "medium" | "short";
   time_style?: "full" | "long" | "medium" | "short";
   strftime_fmt?: string;
-  live_mode?: LivePlayerMode;
-  use_experimental?: boolean;
   dashboard: boolean;
   order: number;
 }

web/src/utils/iconUtil.tsx

@@ -12,7 +12,7 @@ import {
   FaFire,
   FaUps,
 } from "react-icons/fa";
-import { GiHummingbird } from "react-icons/gi";
+import { GiDeer, GiHummingbird } from "react-icons/gi";
 import { LuBox, LuLassoSelect } from "react-icons/lu";
 import * as LuIcons from "react-icons/lu";
 import { MdRecordVoiceOver } from "react-icons/md";
@@ -38,6 +38,8 @@ export function getIconForLabel(label: string, className?: string) {
       return <FaCarSide key={label} className={className} />;
     case "cat":
       return <FaCat key={label} className={className} />;
+    case "deer":
+      return <GiDeer key={label} className={className} />;
     case "animal":
     case "bark":
     case "dog":