@fdm-monster/client-next 2.2.1 → 2.2.3

package/screenshots/fixtures/data/auth.fixtures.ts

@@ -0,0 +1,79 @@
+/**
+ * Mock data for authentication-related API endpoints
+ */
+
+export interface WizardSettingsDto {
+  wizardCompleted: boolean;
+  wizardVersion: number;
+  latestWizardVersion: number;
+}
+
+export interface LoginRequiredResponse {
+  loginRequired: boolean;
+  registration: boolean;
+  wizardState: WizardSettingsDto;
+  isDemoMode: boolean;
+}
+
+export interface LoginResponse {
+  token: string;
+  refreshToken: string;
+}
+
+export const mockLoginRequired: LoginRequiredResponse = {
+  loginRequired: false,
+  registration: false,
+  wizardState: {
+    wizardCompleted: true,
+    wizardVersion: 1,
+    latestWizardVersion: 1,
+  },
+  isDemoMode: false,
+};
+
+export const mockLoginRequiredTrue: LoginRequiredResponse = {
+  loginRequired: true,
+  registration: false,
+  wizardState: {
+    wizardCompleted: true,
+    wizardVersion: 1,
+    latestWizardVersion: 1,
+  },
+  isDemoMode: false,
+};
+
+export const mockRegistrationEnabled: LoginRequiredResponse = {
+  loginRequired: false,
+  registration: true,
+  wizardState: {
+    wizardCompleted: true,
+    wizardVersion: 1,
+    latestWizardVersion: 1,
+  },
+  isDemoMode: false,
+};
+
+export const mockLoginRequiredWithWizard: LoginRequiredResponse = {
+  loginRequired: false,
+  registration: false,
+  wizardState: {
+    wizardCompleted: false,
+    wizardVersion: 0,
+    latestWizardVersion: 1,
+  },
+  isDemoMode: false,
+};
+
+export const mockLoginResponse: LoginResponse = {
+  token: 'mock-jwt-token-eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9',
+  refreshToken: 'mock-refresh-token-abcd1234efgh5678ijkl9012',
+};
+
+export const mockVerifyResponse = {
+  valid: true,
+  userId: 1,
+};
+
+export const mockRefreshResponse = {
+  token: 'mock-new-jwt-token-eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9',
+};

package/screenshots/fixtures/data/cameras.fixtures.ts

@@ -0,0 +1,48 @@
+/**
+ * Mock data for camera stream-related API endpoints
+ */
+
+export interface CameraStream {
+  id: number;
+  printerId?: number;
+  streamURL: string;
+  name?: string;
+  aspectRatio?: string;
+  rotationClockwise?: number;
+  flipHorizontal?: boolean;
+  flipVertical?: boolean;
+}
+
+export const mockCameras: CameraStream[] = [
+  {
+    id: 1,
+    printerId: 1,
+    streamURL: 'http://192.168.1.100/webcam/?action=stream',
+    name: 'Prusa i3 MK3S Camera',
+    aspectRatio: '16:9',
+    rotationClockwise: 0,
+    flipHorizontal: false,
+    flipVertical: false,
+  },
+  {
+    id: 2,
+    printerId: 2,
+    streamURL: 'http://192.168.1.101/webcam/?action=stream',
+    name: 'Ender 3 V2 Camera',
+    aspectRatio: '16:9',
+    rotationClockwise: 0,
+    flipHorizontal: false,
+    flipVertical: false,
+  },
+  {
+    id: 3,
+    streamURL: 'http://192.168.1.200/stream',
+    name: 'Workshop Overview',
+    aspectRatio: '16:9',
+    rotationClockwise: 0,
+    flipHorizontal: false,
+    flipVertical: false,
+  },
+];
+
+export const mockCamerasEmpty: CameraStream[] = [];

package/screenshots/fixtures/data/files.fixtures.ts

@@ -0,0 +1,56 @@
+/**
+ * Mock data for file-related API endpoints
+ */
+
+export interface FileDto {
+  id: string;
+  name: string;
+  path: string;
+  size: number;
+  date: number;
+  type?: string;
+}
+
+export const mockFiles: FileDto[] = [
+  {
+    id: 'file-1',
+    name: 'benchy.gcode',
+    path: '/files/benchy.gcode',
+    size: 5242880, // 5 MB
+    date: Date.now() - 86400000,
+    type: 'model',
+  },
+  {
+    id: 'file-2',
+    name: 'cube_calibration.gcode',
+    path: '/files/cube_calibration.gcode',
+    size: 1048576, // 1 MB
+    date: Date.now() - 86400000 * 2,
+    type: 'model',
+  },
+  {
+    id: 'file-3',
+    name: 'phone_holder.gcode',
+    path: '/files/phone_holder.gcode',
+    size: 3145728, // 3 MB
+    date: Date.now() - 86400000 * 5,
+    type: 'model',
+  },
+  {
+    id: 'file-4',
+    name: 'vase_mode_spiral.gcode',
+    path: '/files/vase_mode_spiral.gcode',
+    size: 2097152, // 2 MB
+    date: Date.now() - 86400000 * 7,
+    type: 'model',
+  },
+];
+
+export const mockFilesEmpty: FileDto[] = [];
+
+export const mockFileUploadProgress = {
+  filename: 'test-model.gcode',
+  progress: 45,
+  total: 100,
+  status: 'uploading',
+};

package/screenshots/fixtures/data/floors.fixtures.ts

@@ -0,0 +1,39 @@
+/**
+ * Mock data for floor-related API endpoints
+ */
+
+export interface FloorDto {
+  id: number;
+  name: string;
+  order: number;
+  printers: PositionDto[];
+}
+
+export interface PositionDto {
+  x: number;
+  y: number;
+  printerId: number;
+  floorId: number;
+}
+
+export const mockFloors: FloorDto[] = [
+  {
+    id: 1,
+    name: 'Main Workshop',
+    order: 1,
+    printers: [
+      { x: 0, y: 0, printerId: 1, floorId: 1 },
+      { x: 1, y: 0, printerId: 2, floorId: 1 },
+    ],
+  },
+  {
+    id: 2,
+    name: 'Test Lab',
+    order: 2,
+    printers: [
+      { x: 0, y: 0, printerId: 3, floorId: 2 },
+    ],
+  },
+];
+
+export const mockFloorsEmpty: FloorDto[] = [];

package/screenshots/fixtures/data/jobs.fixtures.ts

@@ -0,0 +1,172 @@
+/**
+ * Mock data for print job-related API endpoints
+ * Based on PrintJobDto and GlobalQueueResponse from backend services
+ */
+
+export interface PrintJobDto {
+  id: number;
+  printerId: number;
+  printerName: string;
+  fileName: string;
+  filePath: string;
+  createdAt: string;
+  startedAt?: string;
+  endedAt?: string;
+  status: 'QUEUED' | 'STARTING' | 'PRINTING' | 'PAUSED' | 'COMPLETED' | 'FAILED' | 'CANCELLED';
+  progress?: number;
+  statistics?: {
+    actualPrintTimeSeconds?: number;
+    estimatedPrintTimeSeconds?: number;
+  };
+}
+
+// Mock jobs with various statuses for testing dashboard statistics
+export const mockJobs: PrintJobDto[] = [
+  // Active printing job
+  {
+    id: 1,
+    printerId: 1,
+    printerName: 'Prusa i3 MK3S',
+    fileName: 'benchy.gcode',
+    filePath: '/files/benchy.gcode',
+    createdAt: new Date(Date.now() - 3600000).toISOString(), // 1 hour ago
+    startedAt: new Date(Date.now() - 3600000).toISOString(),
+    status: 'PRINTING',
+    progress: 45,
+    statistics: {
+      estimatedPrintTimeSeconds: 7200, // 2 hours
+      actualPrintTimeSeconds: 3600, // 1 hour so far
+    },
+  },
+  // Completed job from 1 day ago
+  {
+    id: 2,
+    printerId: 2,
+    printerName: 'Ender 3 V2',
+    fileName: 'cube_calibration.gcode',
+    filePath: '/files/cube_calibration.gcode',
+    createdAt: new Date(Date.now() - 86400000).toISOString(), // 1 day ago
+    startedAt: new Date(Date.now() - 86400000).toISOString(),
+    endedAt: new Date(Date.now() - 86400000 + 1800000).toISOString(), // 30 minutes later
+    status: 'COMPLETED',
+    progress: 100,
+    statistics: {
+      actualPrintTimeSeconds: 1800, // 30 minutes
+    },
+  },
+  // Completed job from 2 days ago
+  {
+    id: 3,
+    printerId: 3,
+    printerName: 'Artillery Sidewinder X1',
+    fileName: 'phone_holder.gcode',
+    filePath: '/files/phone_holder.gcode',
+    createdAt: new Date(Date.now() - 86400000 * 2).toISOString(), // 2 days ago
+    startedAt: new Date(Date.now() - 86400000 * 2).toISOString(),
+    endedAt: new Date(Date.now() - 86400000 * 2 + 5400000).toISOString(), // 1.5 hours later
+    status: 'COMPLETED',
+    progress: 100,
+    statistics: {
+      actualPrintTimeSeconds: 5400, // 1.5 hours
+    },
+  },
+  // Failed job from 3 days ago
+  {
+    id: 4,
+    printerId: 1,
+    printerName: 'Prusa i3 MK3S',
+    fileName: 'vase_mode_spiral.gcode',
+    filePath: '/files/vase_mode_spiral.gcode',
+    createdAt: new Date(Date.now() - 86400000 * 3).toISOString(), // 3 days ago
+    startedAt: new Date(Date.now() - 86400000 * 3).toISOString(),
+    endedAt: new Date(Date.now() - 86400000 * 3 + 3000000).toISOString(), // 50 minutes later
+    status: 'FAILED',
+    progress: 75,
+    statistics: {
+      actualPrintTimeSeconds: 3000, // 50 minutes
+    },
+  },
+  // Completed job from 12 hours ago
+  {
+    id: 5,
+    printerId: 4,
+    printerName: 'CR-10 S5',
+    fileName: 'large_model.gcode',
+    filePath: '/files/large_model.gcode',
+    createdAt: new Date(Date.now() - 43200000).toISOString(), // 12 hours ago
+    startedAt: new Date(Date.now() - 43200000).toISOString(),
+    endedAt: new Date(Date.now() - 43200000 + 14400000).toISOString(), // 4 hours later
+    status: 'COMPLETED',
+    progress: 100,
+    statistics: {
+      actualPrintTimeSeconds: 14400, // 4 hours
+    },
+  },
+];
+
+export const mockJobsEmpty: PrintJobDto[] = [];
+
+export const mockJobDetails: PrintJobDto = {
+  id: 1,
+  printerId: 1,
+  printerName: 'Prusa i3 MK3S',
+  fileName: 'benchy.gcode',
+  filePath: '/files/benchy.gcode',
+  createdAt: new Date(Date.now() - 3600000).toISOString(),
+  startedAt: new Date(Date.now() - 3600000).toISOString(),
+  status: 'PRINTING',
+  progress: 45,
+  statistics: {
+    estimatedPrintTimeSeconds: 7200,
+    actualPrintTimeSeconds: 3600,
+  },
+};
+
+// Mock print queue items (GlobalQueueResponse items structure)
+export interface QueueItemDto {
+  jobId: number;
+  fileName: string;
+  printerId: number;
+  printerName?: string;
+  queuePosition: number;
+  status: string;
+  createdAt: string;
+  estimatedTimeSeconds?: number;
+  filamentGrams?: number;
+}
+
+export const mockQueue: QueueItemDto[] = [
+  {
+    jobId: 10,
+    fileName: 'model_1.gcode',
+    printerId: 2,
+    printerName: 'Ender 3 V2',
+    queuePosition: 1,
+    status: 'queued',
+    createdAt: new Date().toISOString(),
+    estimatedTimeSeconds: 3600,
+    filamentGrams: 15.5,
+  },
+  {
+    jobId: 11,
+    fileName: 'model_2.gcode',
+    printerId: 2,
+    printerName: 'Ender 3 V2',
+    queuePosition: 2,
+    status: 'queued',
+    createdAt: new Date().toISOString(),
+    estimatedTimeSeconds: 5400,
+    filamentGrams: 22.3,
+  },
+  {
+    jobId: 12,
+    fileName: 'model_3.gcode',
+    printerId: 3,
+    printerName: 'Artillery Sidewinder X1',
+    queuePosition: 1,
+    status: 'queued',
+    createdAt: new Date().toISOString(),
+    estimatedTimeSeconds: 7200,
+    filamentGrams: 30.0,
+  },
+];

package/screenshots/fixtures/data/printers.fixtures.ts

@@ -0,0 +1,132 @@
+/**
+ * Mock data for printer-related API endpoints
+ */
+
+export interface PrinterDto {
+  id: number;
+  printerType: number;
+  correlationToken?: string;
+  enabled: boolean;
+  dateAdded: number;
+  disabledReason: string;
+  name: string;
+  webSocketURL: string;
+  apiKey: string;
+  username: string;
+  password: string;
+  printerURL: string;
+}
+
+export const mockPrinters: PrinterDto[] = [
+  {
+    id: 1,
+    name: 'Prusa i3 MK3S',
+    printerType: 0,
+    enabled: true,
+    dateAdded: Date.now() - 86400000 * 30,
+    disabledReason: '',
+    printerURL: 'http://192.168.1.100',
+    webSocketURL: 'ws://192.168.1.100',
+    apiKey: 'mock-api-key-1',
+    username: '',
+    password: '',
+    correlationToken: 'token-1',
+  },
+  {
+    id: 2,
+    name: 'Ender 3 V2',
+    printerType: 0,
+    enabled: true,
+    dateAdded: Date.now() - 86400000 * 15,
+    disabledReason: '',
+    printerURL: 'http://192.168.1.101',
+    webSocketURL: 'ws://192.168.1.101',
+    apiKey: 'mock-api-key-2',
+    username: '',
+    password: '',
+    correlationToken: 'token-2',
+  },
+  {
+    id: 3,
+    name: 'Artillery Sidewinder X1',
+    printerType: 0,
+    enabled: true,
+    dateAdded: Date.now() - 86400000 * 7,
+    disabledReason: '',
+    printerURL: 'http://192.168.1.102',
+    webSocketURL: 'ws://192.168.1.102',
+    apiKey: 'mock-api-key-3',
+    username: '',
+    password: '',
+    correlationToken: 'token-3',
+  },
+  {
+    id: 4,
+    name: 'Creality CR-10',
+    printerType: 0,
+    enabled: false,
+    dateAdded: Date.now() - 86400000 * 60,
+    disabledReason: 'Maintenance required',
+    printerURL: 'http://192.168.1.103',
+    webSocketURL: 'ws://192.168.1.103',
+    apiKey: 'mock-api-key-4',
+    username: '',
+    password: '',
+    correlationToken: 'token-4',
+  },
+];
+
+export const mockPrinterEmpty: PrinterDto[] = [];
+
+export const mockPrinterStates = {
+  operational: {
+    state: {
+      text: 'Operational',
+      flags: {
+        operational: true,
+        printing: false,
+        paused: false,
+        error: false,
+      },
+    },
+  },
+  printing: {
+    state: {
+      text: 'Printing',
+      flags: {
+        operational: true,
+        printing: true,
+        paused: false,
+        error: false,
+      },
+    },
+    progress: {
+      completion: 45.5,
+      filepos: 1234567,
+      printTime: 3600,
+      printTimeLeft: 4200,
+    },
+  },
+  paused: {
+    state: {
+      text: 'Paused',
+      flags: {
+        operational: true,
+        printing: true,
+        paused: true,
+        error: false,
+      },
+    },
+  },
+  error: {
+    state: {
+      text: 'Error: Connection lost',
+      flags: {
+        operational: false,
+        printing: false,
+        paused: false,
+        error: true,
+      },
+    },
+  },
+};

package/screenshots/fixtures/data/settings.fixtures.ts

@@ -0,0 +1,62 @@
+/**
+ * Mock data for settings-related API endpoints
+ */
+
+export interface ServerSettings {
+  sentryDiagnosticsEnabled: boolean;
+  whitelistEnabled: boolean;
+  loginRequired: boolean;
+  registration: boolean;
+}
+
+export interface User {
+  id: number;
+  username: string;
+  isRootUser: boolean;
+  isVerified: boolean;
+  needsPasswordChange: boolean;
+  roles: string[];
+}
+
+export const mockServerSettings: ServerSettings = {
+  sentryDiagnosticsEnabled: false,
+  whitelistEnabled: false,
+  loginRequired: false,
+  registration: false,
+};
+
+export const mockUsers: User[] = [
+  {
+    id: 1,
+    username: 'admin',
+    isRootUser: true,
+    isVerified: true,
+    needsPasswordChange: false,
+    roles: ['admin', 'operator'],
+  },
+  {
+    id: 2,
+    username: 'operator1',
+    isRootUser: false,
+    isVerified: true,
+    needsPasswordChange: false,
+    roles: ['operator'],
+  },
+  {
+    id: 3,
+    username: 'viewer1',
+    isRootUser: false,
+    isVerified: true,
+    needsPasswordChange: false,
+    roles: ['viewer'],
+  },
+];
+
+export const mockCurrentUser: User = {
+  id: 1,
+  username: 'admin',
+  isRootUser: true,
+  isVerified: true,
+  needsPasswordChange: false,
+  roles: ['admin', 'operator'],
+};

package/screenshots/fixtures/socketio-mock.ts

@@ -0,0 +1,76 @@
+import { Page } from '@playwright/test';
+
+/**
+ * Mock SocketIO to prevent "server disconnected" messages
+ * Sets flags that the app checks to skip Socket.IO setup entirely
+ * Also injects Socket.IO update data into stores
+ */
+export async function mockSocketIO(page: Page, data?: any): Promise<void> {
+  // Set test mode flags AND inject Socket.IO data BEFORE page loads
+  await page.addInitScript((mockData) => {
+    (window as any).__DISABLE_SOCKETIO__ = true;
+    (window as any).__SCREENSHOT_MODE__ = true;
+
+    // Store mock data to be consumed by stores
+    if (mockData) {
+      (window as any).__SOCKETIO_MOCK_DATA__ = mockData;
+    }
+  }, data);
+
+  // Block any Socket.IO network requests as a fallback (should not happen now)
+  await page.route('**/socket.io/**', (route) => {
+    console.warn('[Mock] Unexpected Socket.IO request blocked:', route.request().url());
+    route.abort('blockedbyclient');
+  });
+
+  // Hide "Server Disconnected" messages if they somehow appear
+  await page.addInitScript(() => {
+    const hideDisconnectedMessages = () => {
+      const cards = document.querySelectorAll('.v-card');
+      cards.forEach((card) => {
+        const text = card.textContent || '';
+        if (text.includes('Server Disconnected') || text.includes('Cannot connect to FDM Monster')) {
+          (card as HTMLElement).style.display = 'none';
+        }
+      });
+    };
+
+    if (document.readyState === 'loading') {
+      document.addEventListener('DOMContentLoaded', hideDisconnectedMessages);
+    } else {
+      hideDisconnectedMessages();
+    }
+
+    const observer = new MutationObserver(hideDisconnectedMessages);
+    const startObserving = () => {
+      if (document.body) {
+        observer.observe(document.body, { childList: true, subtree: true });
+      } else {
+        setTimeout(startObserving, 10);
+      }
+    };
+    startObserving();
+  });
+}
+
+/**
+ * Mock SocketIO with simulated data updates
+ */
+export async function mockSocketIOWithData(
+  page: Page,
+  data?: {
+    printers?: any[];
+    floors?: any[];
+    socketStates?: any;
+    printerEvents?: any;
+    trackedUploads?: any;
+  }
+): Promise<void> {
+  await mockSocketIO(page);
+
+  if (data) {
+    await page.addInitScript((mockData) => {
+      (window as any).__MOCK_SOCKETIO_DATA__ = mockData;
+    }, data);
+  }
+}