ADD - Graphics modes and new phone frames

Introduces Graphics Mode settings to toggle between "Performance" (blur-free) and "Ultimate" (full effects) to optimize CEF rendering. Expands device customization with ten new phone frames, standardizes 24-hour time formatting across all apps, and updates the build target to Chrome 103 for better compatibility.

frontend/src/utils/preferences.ts

@@ -2,12 +2,23 @@ import type { LaunchablePhoneAppId } from '@/types/apps'
 import { cloneJsonData } from '@/utils/clone'
 
 export const APPEARANCE_MODE_IDS = ['automatic', 'light', 'dark'] as const
+export const GRAPHICS_MODE_IDS = ['performance', 'ultimate'] as const
 export const PHONE_FRAME_IDS = [
   'black',
   'blue',
   'green',
   'lavender',
+  'red',
   'white',
+  'orange',
+  'yellow',
+  'lime',
+  'teal',
+  'cyan',
+  'purple',
+  'pink',
+  'gold',
+  'rgb',
 ] as const
 export const RINGTONE_IDS = ['skyline', 'horizon', 'pulse'] as const
 export const NOTIFICATION_SOUND_IDS = ['chime', 'signal', 'soft'] as const
@@ -17,6 +28,7 @@ export const PHONE_SCALE_MAX = 150
 export const PHONE_SCALE_STEP = 5
 
 export type AppearanceMode = (typeof APPEARANCE_MODE_IDS)[number]
+export type GraphicsMode = (typeof GRAPHICS_MODE_IDS)[number]
 export type PhoneFrameId = (typeof PHONE_FRAME_IDS)[number]
 export type RingtoneId = (typeof RINGTONE_IDS)[number]
 export type NotificationSoundId = (typeof NOTIFICATION_SOUND_IDS)[number]
@@ -34,6 +46,7 @@ export type PhonePreferencesV1 = {
     cellularEnabled: boolean
     focusMode: boolean
     frame: PhoneFrameId
+    graphicsMode: GraphicsMode
     notificationSound: NotificationSoundId
     notificationDurationSeconds: number
     notificationVolume: number
@@ -91,6 +104,7 @@ export const DEFAULT_PHONE_PREFERENCES: PhonePreferencesV1 = {
     cellularEnabled: true,
     focusMode: false,
     frame: 'black',
+    graphicsMode: 'performance',
     notificationSound: 'chime',
     notificationDurationSeconds: 10,
     notificationVolume: 70,
@@ -188,6 +202,11 @@ export function parsePhonePreferences(raw: string | null): PhonePreferencesV1 {
         ),
         focusMode: readBoolean(settings.focusMode, defaults.focusMode),
         frame: readChoice(settings.frame, PHONE_FRAME_IDS, defaults.frame),
+        graphicsMode: readChoice(
+          settings.graphicsMode,
+          GRAPHICS_MODE_IDS,
+          defaults.graphicsMode,
+        ),
         notificationSound: readChoice(
           settings.notificationSound,
           NOTIFICATION_SOUND_IDS,