Add 'dependent camera' support.

src/components/viewer.ts

@@ -17,7 +17,7 @@ import { ref } from 'lit/directives/ref.js';
 import { AutoMediaPlugin } from './embla-plugins/automedia.js';
 import type {
   BrowseMediaNeighbors,
-  BrowseMediaQueryParametersBase,
+  BrowseMediaQueryParameters,
   FrigateBrowseMediaSource,
   CameraConfig,
   MediaShowInfo,
@@ -54,7 +54,7 @@ export class FrigateCardViewer extends LitElement {
   protected viewerConfig?: ViewerConfig;
 
   @property({ attribute: false })
-  protected cameraConfig?: CameraConfig;
+  protected cameras?: Map<string, CameraConfig>;
 
   @property({ attribute: false })
   protected resolvedMediaCache?: ResolvedMediaCache;
@@ -64,21 +64,19 @@ export class FrigateCardViewer extends LitElement {
    * @returns A rendered template.
    */
   protected render(): TemplateResult | void {
-    if (!this.hass || !this.view || !this.cameraConfig || !this.viewerConfig) {
+    if (!this.hass || !this.view || !this.cameras || !this.viewerConfig) {
       return;
     }
 
-    const browseMediaQueryParametersBase =
-      BrowseMediaUtil.getBrowseMediaQueryParametersBaseOrDispatchError(
+    const browseMediaQueryParameters =
+      BrowseMediaUtil.getFullDependentBrowseMediaQueryParametersOrDispatchError(
         this,
-        this.cameraConfig,
+        this.hass,
+        this.cameras,
+        this.view.camera,
       );
 
     if (!this.view.target) {
-      const browseMediaQueryParameters = BrowseMediaUtil.setMediaTypeFromView(
-        browseMediaQueryParametersBase,
-        this.view,
-      );
       if (!browseMediaQueryParameters) {
         return;
       }
@@ -101,7 +99,7 @@ export class FrigateCardViewer extends LitElement {
         .hass=${this.hass}
         .view=${this.view}
         .viewerConfig=${this.viewerConfig}
-        .browseMediaQueryParametersBase=${browseMediaQueryParametersBase}
+        .browseMediaQueryParameters=${browseMediaQueryParameters}
         .resolvedMediaCache=${this.resolvedMediaCache}
       >
       </frigate-card-viewer-carousel>
@@ -133,7 +131,7 @@ export class FrigateCardViewerCarousel extends FrigateCardMediaCarousel {
   protected viewerConfig?: ViewerConfig;
 
   @property({ attribute: false })
-  protected browseMediaQueryParametersBase?: BrowseMediaQueryParametersBase;
+  protected browseMediaQueryParameters?: BrowseMediaQueryParameters[] | null;
 
   @property({ attribute: false })
   protected resolvedMediaCache?: ResolvedMediaCache;
@@ -338,7 +336,7 @@ export class FrigateCardViewerCarousel extends FrigateCardMediaCarousel {
       !this.view.target ||
       !this.view.target.children ||
       !this.view.target.children.length ||
-      !this.browseMediaQueryParametersBase
+      !this.browseMediaQueryParameters
     ) {
       return null;
     }
@@ -379,13 +377,17 @@ export class FrigateCardViewerCarousel extends FrigateCardMediaCarousel {
 
     let clips: FrigateBrowseMediaSource | null;
 
-    try {
-      clips = await BrowseMediaUtil.browseMediaQuery(this.hass, {
-        ...this.browseMediaQueryParametersBase,
+    const params = BrowseMediaUtil.overrideMultiBrowseMediaQueryParameters(
+      this.browseMediaQueryParameters,
+      {
         mediaType: 'clips',
         before: latest,
         after: earliest,
-      });
+      },
+    );
+
+    try {
+      clips = await BrowseMediaUtil.multipleBrowseMediaQueryMerged(this.hass, params);
     } catch (e) {
       // This is best effort.
       return null;