carmanagement/apps/homepage/src/lib/theme/client.ts

import {
  isThemePreference,
  resolveTheme,
  themeCookie,
  themeCookieMaxAgeSeconds,
  themeStorageKey,
  type ThemePreference,
} from './config';

export const themePreferenceEvent = 'rentaldrivego:theme-preference';

export function applyTheme(preference: ThemePreference): void {
  const systemDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
  const resolved = resolveTheme(preference, systemDark);
  const root = document.documentElement;
  root.dataset.themePreference = preference;
  root.dataset.theme = resolved;
}

export function persistTheme(preference: ThemePreference): void {
  try {
    window.localStorage.setItem(themeStorageKey, preference);
  } catch {
    // Storage can be unavailable; the first-party cookie remains canonical.
  }

  const secure = window.location.protocol === 'https:' ? '; Secure' : '';
  document.cookie =
    [
      `${themeCookie}=${encodeURIComponent(preference)}`,
      'Path=/',
      `Max-Age=${themeCookieMaxAgeSeconds}`,
      'SameSite=Lax',
    ].join('; ') + secure;
  applyTheme(preference);
  window.dispatchEvent(
    new CustomEvent<ThemePreference>(themePreferenceEvent, { detail: preference }),
  );
}

export function currentThemePreference(): ThemePreference {
  const value = document.documentElement.dataset.themePreference;
  return isThemePreference(value) ? value : 'dark';
}