Add birdseye live view (#10485)

* Add birdseye viewer and make it linkable

* Add on click from main dashboard

web/src/components/player/BirdseyeLivePlayer.tsx

@@ -3,15 +3,20 @@ import { BirdseyeConfig } from "@/types/frigateConfig";
 import ActivityIndicator from "../indicators/activity-indicator";
 import JSMpegPlayer from "./JSMpegPlayer";
 import MSEPlayer from "./MsePlayer";
+import { LivePlayerMode } from "@/types/live";
 
 type LivePlayerProps = {
+  className?: string;
   birdseyeConfig: BirdseyeConfig;
-  liveMode: string;
+  liveMode: LivePlayerMode;
+  onClick?: () => void;
 };
 
 export default function BirdseyeLivePlayer({
+  className,
   birdseyeConfig,
   liveMode,
+  onClick,
 }: LivePlayerProps) {
   let player;
   if (liveMode == "webrtc") {
@@ -45,7 +50,10 @@ export default function BirdseyeLivePlayer({
   }
 
   return (
-    <div className={`relative flex justify-center w-full cursor-pointer`}>
+    <div
+      className={`relative flex justify-center w-full cursor-pointer ${className ?? ""}`}
+      onClick={onClick}
+    >
       <div className="absolute top-0 inset-x-0 rounded-2xl z-10 w-full h-[30%] bg-gradient-to-b from-black/20 to-transparent pointer-events-none"></div>
       <div className="absolute bottom-0 inset-x-0 rounded-2xl z-10 w-full h-[10%] bg-gradient-to-t from-black/20 to-transparent pointer-events-none"></div>
       <div className="size-full">{player}</div>