Consolidate deviceType.ts three switch statements into a single config object

[NotYuSheng]

Problem

frontend/src/utils/deviceType.ts exposes three separate functions (deviceTypeIcon, deviceTypeLabel, deviceTypeColor) each implemented as a switch statement over the same 6 DeviceType values. Adding a new device type or changing a value (icon, label, or colour) requires updating three places.

// Current: 3 separate switches over the same 6 values
export function deviceTypeIcon(deviceType: DeviceType): string { switch ... }
export function deviceTypeLabel(deviceType: DeviceType): string { switch ... }
export function deviceTypeColor(deviceType: DeviceType): string { switch ... }

Proposed Solution

Consolidate into a single DEVICE_TYPE_CONFIG record that holds all properties per type. The three functions become single-line wrappers.

interface DeviceTypeConfig {
  icon: string;
  label: string;
  color: string;
}

const DEVICE_TYPE_CONFIG: Record<DeviceType, DeviceTypeConfig> = {
  ROUTER:         { icon: '🔀', label: 'Router',           color: '#f97316' },
  MOBILE:         { icon: '📱', label: 'Mobile',           color: '#8b5cf6' },
  LAPTOP_DESKTOP: { icon: '💻', label: 'Laptop / Desktop', color: '#3b82f6' },
  SERVER:         { icon: '🖥️', label: 'Server',           color: '#10b981' },
  IOT:            { icon: '🔌', label: 'IoT Device',       color: '#ec4899' },
  UNKNOWN:        { icon: '❓', label: 'Unknown',           color: '#6b7280' },
};

const DEFAULT_CONFIG: DeviceTypeConfig = { icon: '❓', label: deviceType, color: '#6b7280' };

export function deviceTypeIcon(deviceType: DeviceType): string {
  return (DEVICE_TYPE_CONFIG[deviceType] ?? DEFAULT_CONFIG).icon;
}
export function deviceTypeLabel(deviceType: DeviceType): string {
  return (DEVICE_TYPE_CONFIG[deviceType] ?? { label: deviceType }).label;
}
export function deviceTypeColor(deviceType: DeviceType): string {
  return (DEVICE_TYPE_CONFIG[deviceType] ?? DEFAULT_CONFIG).color;
}

This keeps the existing public API unchanged — all call sites continue to work without modification.

Benefit

Adding a new device type now requires changing exactly one place (one row in DEVICE_TYPE_CONFIG) instead of three switch statements. TypeScript's exhaustiveness checking on a Record<DeviceType, ...> will catch any missed values at compile time.

Files to Change

• frontend/src/utils/deviceType.ts

Acceptance Criteria

• Three switch statements replaced with a single DEVICE_TYPE_CONFIG object
• Public API (deviceTypeIcon, deviceTypeLabel, deviceTypeColor, DEVICE_TYPES) unchanged
• TypeScript compiles without errors
• All 6 device types render correct icon / label / colour in the UI