fix(camera): derive WebUI camera state from resolved config

Author: GhostTypes

src/webui/server/routes/camera-routes.ts

@@ -4,7 +4,7 @@
 
 import type { Router, Response } from 'express';
 import type { AuthenticatedRequest } from '../auth-middleware';
-import { CameraStatusResponse, StandardAPIResponse } from '../../types/web-api.types';
+import type { CameraStatusResponse, StandardAPIResponse } from '../../types/web-api.types';
 import { toAppError } from '../../../utils/error.utils';
 import { resolveContext, sendErrorResponse, type RouteDependencies } from './route-helpers';
 
@@ -20,10 +20,25 @@ export function registerCameraRoutes(router: Router, deps: RouteDependencies): v
         );
       }
 
-      const isAvailable = deps.backendManager.isFeatureAvailable(
-        contextResult.contextId,
-        'camera'
+      const { contextId, context } = contextResult;
+      const features = deps.backendManager.getFeatures(contextId);
+      if (!features) {
+        return sendErrorResponse<StandardAPIResponse>(
+          res,
+          500,
+          'Failed to get printer features'
+        );
+      }
+
+      const { resolveCameraConfig, getCameraUserConfig } = await import(
+        '../../../utils/camera-utils'
       );
+      const cameraConfig = resolveCameraConfig({
+        printerIpAddress: context.printerDetails.IPAddress,
+        printerFeatures: features,
+        userConfig: getCameraUserConfig(contextId)
+      });
+      const isAvailable = cameraConfig.isAvailable;
 
       const response: CameraStatusResponse = {
         available: isAvailable,
@@ -97,7 +112,7 @@ export function registerCameraRoutes(router: Router, deps: RouteDependencies): v
         }
 
         let streamStatus = rtspStreamService.getStreamStatus(contextId);
-        if (!streamStatus) {
+        if (!streamStatus || streamStatus.rtspUrl !== cameraConfig.streamUrl) {
           try {
             const { rtspFrameRate, rtspQuality } = context.printerDetails;
             await rtspStreamService.setupStream(contextId, cameraConfig.streamUrl, {
@@ -131,7 +146,7 @@ export function registerCameraRoutes(router: Router, deps: RouteDependencies): v
       const cameraProxyService = getCameraProxyService();
       let status = cameraProxyService.getStatusForContext(contextId);
 
-      if (!status) {
+      if (!status || status.sourceUrl !== cameraConfig.streamUrl) {
         try {
           await cameraProxyService.setStreamUrl(contextId, cameraConfig.streamUrl);
           status = cameraProxyService.getStatusForContext(contextId);

src/webui/server/routes/printer-status-routes.ts

@@ -7,7 +7,7 @@
 
 import type { Router, Response } from 'express';
 import type { AuthenticatedRequest } from '../auth-middleware';
-import {
+import type {
   PrinterStatusResponse,
   PrinterFeatures,
   MaterialStationStatusResponse,
@@ -143,7 +143,7 @@ export function registerPrinterStatusRoutes(router: Router, deps: RouteDependenc
         );
       }
 
-      const { contextId } = contextResult;
+      const { contextId, context } = contextResult;
       const features = deps.backendManager.getFeatures(contextId);
 
       if (!features) {
@@ -154,8 +154,17 @@ export function registerPrinterStatusRoutes(router: Router, deps: RouteDependenc
         );
       }
 
+      const { resolveCameraConfig, getCameraUserConfig } = await import(
+        '../../../utils/camera-utils'
+      );
+      const cameraConfig = resolveCameraConfig({
+        printerIpAddress: context.printerDetails.IPAddress,
+        printerFeatures: features,
+        userConfig: getCameraUserConfig(contextId)
+      });
+
       const featureResponse: PrinterFeatures = {
-        hasCamera: deps.backendManager.isFeatureAvailable(contextId, 'camera'),
+        hasCamera: cameraConfig.isAvailable,
         hasLED: deps.backendManager.isFeatureAvailable(contextId, 'led-control'),
         hasFiltration: deps.backendManager.isFeatureAvailable(contextId, 'filtration'),
         hasMaterialStation: deps.backendManager.isFeatureAvailable(contextId, 'material-station'),

src/webui/static/features/camera.ts

@@ -72,6 +72,14 @@ export async function loadCameraStream(): Promise<void> {
   try {
     const config = await apiRequest<CameraProxyConfigResponse>('/api/camera/proxy-config');
 
+    if (!config.success) {
+      showElement('camera-placeholder');
+      hideElement('camera-stream');
+      hideElement('camera-canvas');
+      cameraPlaceholder.textContent = config.error || 'Camera unavailable';
+      return;
+    }
+
     if (config.streamType === 'rtsp') {
       if (config.ffmpegAvailable === false) {
         showElement('camera-placeholder');
@@ -143,7 +151,7 @@ export async function loadCameraStream(): Promise<void> {
 }
 
 export function initializeCamera(): void {
-  if (!state.printerFeatures?.hasCamera) {
+  if (state.printerFeatures && !state.printerFeatures.hasCamera) {
     teardownCameraStreamElements();
     return;
   }