From ffd8ecd1d06ed8b936a76e1fa3fce14a67f76d1b Mon Sep 17 00:00:00 2001 From: Eric Gullickson <16152721+ericgullickson@users.noreply.github.com> Date: Thu, 1 Jan 2026 10:30:08 -0600 Subject: [PATCH] fix: OS Detection of theme removed. --- .../data/user-preferences.repository.ts | 2 +- docs/PROMPTS.md | 9 ++-- .../vehicles/components/VehicleForm.tsx | 2 +- .../vehicles/pages/VehicleDetailPage.tsx | 2 +- .../src/shared-minimal/theme/ThemeContext.tsx | 45 ++----------------- 5 files changed, 10 insertions(+), 50 deletions(-) diff --git a/backend/src/core/user-preferences/data/user-preferences.repository.ts b/backend/src/core/user-preferences/data/user-preferences.repository.ts index 1a24eb8..da6fbaf 100644 --- a/backend/src/core/user-preferences/data/user-preferences.repository.ts +++ b/backend/src/core/user-preferences/data/user-preferences.repository.ts @@ -32,7 +32,7 @@ export class UserPreferencesRepository { data.unitSystem || 'imperial', data.currencyCode || 'USD', data.timeZone || 'UTC', - data.darkMode ?? null + data.darkMode ?? false ]; const result = await this.db.query(query, values); diff --git a/docs/PROMPTS.md b/docs/PROMPTS.md index d5c7d0d..9ea16ba 100644 --- a/docs/PROMPTS.md +++ b/docs/PROMPTS.md @@ -30,11 +30,10 @@ You are a senior software engineer specializsing in NodeJS, Typescript, front en *** CHANGES TO IMPLEMENT *** - Research this code base and ask iterative questions to compile a complete plan. - We will pair troubleshoot this. Tell me what logs and things to run and I will -- There is a bug in vehicles form -- There was logic added for fewer than 17 digits in the VIN number for vehicles older than 1980 -- The application was built with many contraints on 17 digit VIN numbers and now the database doesn't store VIN numbers with fewer than 17 -- Displatch explore agents to follow the data flow and find the remaining gate that is stopping the data from being stored. -- There are no front end or API errors +- There is current a Dark / Light theme option for this application +- There is logic somewhere in the code that detects the operating systems' theme and uses that. Remove this. +- Default to the light theme for everyone. +- Retain the functionality for the user to pick dark theme and save that preference. diff --git a/frontend/src/features/vehicles/components/VehicleForm.tsx b/frontend/src/features/vehicles/components/VehicleForm.tsx index 21894a4..88ec36d 100644 --- a/frontend/src/features/vehicles/components/VehicleForm.tsx +++ b/frontend/src/features/vehicles/components/VehicleForm.tsx @@ -424,7 +424,7 @@ export const VehicleForm: React.FC = ({

Enter vehicle VIN (optional) diff --git a/frontend/src/features/vehicles/pages/VehicleDetailPage.tsx b/frontend/src/features/vehicles/pages/VehicleDetailPage.tsx index 8a5e7f9..7c71609 100644 --- a/frontend/src/features/vehicles/pages/VehicleDetailPage.tsx +++ b/frontend/src/features/vehicles/pages/VehicleDetailPage.tsx @@ -322,7 +322,7 @@ export const VehicleDetailPage: React.FC = () => {

diff --git a/frontend/src/shared-minimal/theme/ThemeContext.tsx b/frontend/src/shared-minimal/theme/ThemeContext.tsx index c056ec1..87b4a6a 100644 --- a/frontend/src/shared-minimal/theme/ThemeContext.tsx +++ b/frontend/src/shared-minimal/theme/ThemeContext.tsx @@ -1,6 +1,6 @@ /** * @ai-summary Theme context for managing light/dark mode across the app - * Supports: system preference detection, localStorage persistence, backend sync + * Supports: localStorage persistence, backend sync, defaults to light theme * Applies Tailwind dark class to document root */ @@ -27,28 +27,6 @@ interface ThemeProviderProps { children: ReactNode; } -// Detect system dark mode preference -const getSystemPreference = (): boolean => { - if (typeof window !== 'undefined' && window.matchMedia) { - return window.matchMedia('(prefers-color-scheme: dark)').matches; - } - return false; -}; - -// Check if user has explicitly set a preference in localStorage -const hasStoredPreference = (): boolean => { - try { - const stored = localStorage.getItem(SETTINGS_STORAGE_KEY); - if (stored) { - const settings = JSON.parse(stored); - return settings.darkMode !== undefined && settings.darkMode !== null; - } - } catch { - // Ignore parse errors - } - return false; -}; - // Read dark mode preference from localStorage const getStoredDarkMode = (): boolean | undefined => { try { @@ -65,13 +43,13 @@ const getStoredDarkMode = (): boolean | undefined => { return undefined; }; -// Get initial dark mode: localStorage > system preference +// Get initial dark mode: localStorage > default to light const getInitialDarkMode = (): boolean => { const stored = getStoredDarkMode(); if (stored !== undefined) { return stored; } - return getSystemPreference(); + return false; // Default to light theme }; // Update dark mode in localStorage while preserving other settings @@ -97,23 +75,6 @@ export const ThemeProvider = ({ children }: ThemeProviderProps) => { setIsInitialized(true); }, []); - // Listen for system preference changes (only when no explicit preference set) - useEffect(() => { - if (typeof window === 'undefined' || !window.matchMedia) return; - - const mediaQuery = window.matchMedia('(prefers-color-scheme: dark)'); - - const handleChange = (e: MediaQueryListEvent) => { - // Only react to system changes if user hasn't set explicit preference - if (!hasStoredPreference()) { - setIsDarkMode(e.matches); - } - }; - - mediaQuery.addEventListener('change', handleChange); - return () => mediaQuery.removeEventListener('change', handleChange); - }, []); - // Apply dark class to document root for Tailwind useEffect(() => { const root = document.documentElement;