fix: Only show PTZ controls for selected camera in grid mode (#1619)

src/components/live/live.ts

@@ -581,10 +581,15 @@ export class FrigateCardLiveCarousel extends LitElement {
     const cameraMetadataPrevious = prevID
       ? this.cameraManager.getCameraMetadata(this._getSubstreamCameraID(prevID, view))
       : null;
-    const cameraID = this.viewFilterCameraID ?? view.camera;
     const cameraMetadataNext = nextID
       ? this.cameraManager.getCameraMetadata(this._getSubstreamCameraID(nextID, view))
       : null;
+    const forcePTZVisibility =
+      !this._mediaHasLoaded ||
+      this.viewFilterCameraID !== view.camera ||
+      view.context?.ptzControls?.enabled === false
+        ? false
+        : view.context?.ptzControls?.enabled;
 
     // Notes on the below:
     // - guard() is used to avoid reseting the carousel unless the
@@ -642,8 +647,8 @@ export class FrigateCardLiveCarousel extends LitElement {
       <frigate-card-ptz
         .config=${this.overriddenLiveConfig.controls.ptz}
         .cameraManager=${this.cameraManager}
-        .cameraID=${getStreamCameraID(view, cameraID)}
+        .cameraID=${getStreamCameraID(view, this.viewFilterCameraID)}
-        .forceVisibility=${this._mediaHasLoaded && view.context?.ptzControls?.enabled}
+        .forceVisibility=${forcePTZVisibility}
       >
       </frigate-card-ptz>
     `;

src/utils/substream.ts

@@ -1,7 +1,11 @@
 import { View } from '../view/view';
 
 export const getStreamCameraID = (view: View, cameraID?: string): string => {
-  return view.context?.live?.overrides?.get(cameraID ?? view.camera) ?? view.camera;
+  return (
+    view.context?.live?.overrides?.get(cameraID ?? view.camera) ??
+    cameraID ??
+    view.camera
+  );
 };
 
 export const hasSubstream = (view: View): boolean => {

tests/utils/substream.test.ts

@@ -5,11 +5,11 @@ import {
   removeSubstream,
 } from '../../src/utils/substream';
 import { View } from '../../src/view/view';
+import { createView } from '../test-utils';
 
 describe('hasSubstream/getStreamCameraID', () => {
   it('should detect substream', () => {
-    const view = new View({
+    const view = createView({
-      view: 'live',
       camera: 'camera',
       context: {
         live: {
@@ -21,16 +21,14 @@ describe('hasSubstream/getStreamCameraID', () => {
     expect(getStreamCameraID(view)).toBe('camera2');
   });
   it('should not detect substream when absent', () => {
-    const view = new View({
+    const view = createView({
-      view: 'live',
       camera: 'camera',
     });
     expect(hasSubstream(view)).toBeFalsy();
     expect(getStreamCameraID(view)).toBe('camera');
   });
   it('should not detect substream when main stream', () => {
-    const view = new View({
+    const view = createView({
-      view: 'live',
       camera: 'camera',
       context: {
         live: {
@@ -41,9 +39,9 @@ describe('hasSubstream/getStreamCameraID', () => {
     expect(hasSubstream(view)).toBeFalsy();
     expect(getStreamCameraID(view)).toBe('camera');
   });
-  it('should respect cameraID override', () => {
+  describe('should respect cameraID override', () => {
-    const view = new View({
+    it('should respect cameraID override when present in overrides', () => {
-      view: 'live',
+      const view = createView({
         camera: 'camera',
         context: {
           live: {
@@ -57,6 +55,13 @@ describe('hasSubstream/getStreamCameraID', () => {
       expect(hasSubstream(view)).toBeTruthy();
       expect(getStreamCameraID(view, 'camera3')).toBe('camera4');
     });
+
+    it('should respect cameraID override when not present in overrides', () => {
+      const view = createView();
+      expect(hasSubstream(view)).toBeFalsy();
+      expect(getStreamCameraID(view, 'camera3')).toBe('camera3');
+    });
+  });
 });
 
 describe('removeSubstream', () => {