Do not require all title popup options be specified.

src/components/title-control.ts

@@ -64,7 +64,14 @@ export class FrigateCardTitleControl extends LitElement {
   protected _toastRef: Ref<PaperToast> = createRef();
 
   protected render(): TemplateResult {
-    if (!this.text || !this.config || this.config.mode == 'none' || !this.fitInto) {
+    if (
+      !this.text ||
+      !this.config ||
+      !this.config.mode ||
+      this.config.duration_seconds === undefined ||
+      this.config.mode === 'none' ||
+      !this.fitInto
+    ) {
       return html``;
     }
 

src/config/types.ts

@@ -723,14 +723,16 @@ export type NextPreviousControlConfig = z.infer<typeof nextPreviousControlConfig
 // *************************************************************************
 
 const titleControlConfigSchema = z.object({
-  mode: z.enum([
-    'none',
-    'popup-top-right',
-    'popup-top-left',
-    'popup-bottom-right',
-    'popup-bottom-left',
-  ]),
-  duration_seconds: z.number().min(0).max(60),
+  mode: z
+    .enum([
+      'none',
+      'popup-top-right',
+      'popup-top-left',
+      'popup-bottom-right',
+      'popup-bottom-left',
+    ])
+    .optional(),
+  duration_seconds: z.number().min(0).max(60).optional(),
 });
 export type TitleControlConfig = z.infer<typeof titleControlConfigSchema>;
 

tests/config/types.test.ts

@@ -4,7 +4,7 @@ import {
   customSchema,
   dimensionsConfigSchema,
   frigateCardCustomActionsBaseSchema,
-  frigateCardPTZSchema
+  frigateCardPTZSchema,
 } from '../../src/config/types';
 import { createConfig } from '../test-utils';
 
@@ -419,3 +419,19 @@ describe('should handle custom frigate elements', () => {
     expect(result.success).toBeTruthy();
   });
 });
+
+// https://github.com/dermotduffy/frigate-hass-card/issues/1280
+it('should not require title controls to specify all options', () => {
+  expect(
+    createConfig({
+      cameras: [],
+      live: {
+        controls: {
+          title: {
+            mode: 'popup-top-left',
+          },
+        },
+      },
+    }),
+  ).toBeTruthy();
+});