fix: OS Detection of theme removed.
All checks were successful
Deploy to Staging / Build Images (push) Successful in 4m34s
Deploy to Staging / Deploy to Staging (push) Successful in 37s
Deploy to Staging / Verify Staging (push) Successful in 6s
Deploy to Staging / Notify Staging Ready (push) Successful in 5s
Deploy to Staging / Notify Staging Failure (push) Has been skipped

This commit is contained in:
Eric Gullickson
2026-01-01 10:30:08 -06:00
parent f79fda79b9
commit ffd8ecd1d0
5 changed files with 10 additions and 50 deletions

View File

@@ -32,7 +32,7 @@ export class UserPreferencesRepository {
data.unitSystem || 'imperial', data.unitSystem || 'imperial',
data.currencyCode || 'USD', data.currencyCode || 'USD',
data.timeZone || 'UTC', data.timeZone || 'UTC',
data.darkMode ?? null data.darkMode ?? false
]; ];
const result = await this.db.query(query, values); const result = await this.db.query(query, values);

View File

@@ -30,11 +30,10 @@ You are a senior software engineer specializsing in NodeJS, Typescript, front en
*** CHANGES TO IMPLEMENT *** *** CHANGES TO IMPLEMENT ***
- Research this code base and ask iterative questions to compile a complete plan. - 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 - We will pair troubleshoot this. Tell me what logs and things to run and I will
- There is a bug in vehicles form - There is current a Dark / Light theme option for this application
- There was logic added for fewer than 17 digits in the VIN number for vehicles older than 1980 - There is logic somewhere in the code that detects the operating systems' theme and uses that. Remove this.
- 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 - Default to the light theme for everyone.
- Displatch explore agents to follow the data flow and find the remaining gate that is stopping the data from being stored. - Retain the functionality for the user to pick dark theme and save that preference.
- There are no front end or API errors

View File

@@ -424,7 +424,7 @@ export const VehicleForm: React.FC<VehicleFormProps> = ({
<div> <div>
<label className="block text-sm font-medium text-gray-700 dark:text-avus mb-1"> <label className="block text-sm font-medium text-gray-700 dark:text-avus mb-1">
VIN or License Plate <span className="text-red-500">*</span> VIN Number <span className="text-red-500">*</span>
</label> </label>
<p className="text-xs text-gray-600 dark:text-titanio mb-2"> <p className="text-xs text-gray-600 dark:text-titanio mb-2">
Enter vehicle VIN (optional) Enter vehicle VIN (optional)

View File

@@ -322,7 +322,7 @@ export const VehicleDetailPage: React.FC = () => {
<form className="space-y-4"> <form className="space-y-4">
<DetailField <DetailField
label="VIN or License Plate" label="VIN Number"
value={vehicle.vin || vehicle.licensePlate} value={vehicle.vin || vehicle.licensePlate}
isRequired isRequired
/> />

View File

@@ -1,6 +1,6 @@
/** /**
* @ai-summary Theme context for managing light/dark mode across the app * @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 * Applies Tailwind dark class to document root
*/ */
@@ -27,28 +27,6 @@ interface ThemeProviderProps {
children: ReactNode; 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 // Read dark mode preference from localStorage
const getStoredDarkMode = (): boolean | undefined => { const getStoredDarkMode = (): boolean | undefined => {
try { try {
@@ -65,13 +43,13 @@ const getStoredDarkMode = (): boolean | undefined => {
return undefined; return undefined;
}; };
// Get initial dark mode: localStorage > system preference // Get initial dark mode: localStorage > default to light
const getInitialDarkMode = (): boolean => { const getInitialDarkMode = (): boolean => {
const stored = getStoredDarkMode(); const stored = getStoredDarkMode();
if (stored !== undefined) { if (stored !== undefined) {
return stored; return stored;
} }
return getSystemPreference(); return false; // Default to light theme
}; };
// Update dark mode in localStorage while preserving other settings // Update dark mode in localStorage while preserving other settings
@@ -97,23 +75,6 @@ export const ThemeProvider = ({ children }: ThemeProviderProps) => {
setIsInitialized(true); 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 // Apply dark class to document root for Tailwind
useEffect(() => { useEffect(() => {
const root = document.documentElement; const root = document.documentElement;