import { createStore } from './createStore.js';

/**
 * User preferences. Small, synchronous, read on boot.
 *
 * - versionGroup: the selected "game" (PokéAPI version-group key)
 * - pokedex:      the active regional dex within that game (null = first one)
 * - theme:        'system' | 'light' | 'dark'
 * - spriteStyle:  'default' (pixel) | 'official' | 'home'
 * - showShiny:    default the detail view to shiny sprites
 * - locale:       reserved for localized names (PokéAPI supports many)
 */
export const settings = createStore('pdx.settings', {
  versionGroup: 'all', // 'all' = National Dex, newest data, no generation limits
  pokedex: null,
  theme: 'system', // system | light | dark | black | sepia
  accent: 'red', // red | blue | green | amber | violet | rose
  spriteStyle: 'official',
  showShiny: false,
  locale: 'en',
});

const DARKISH = new Set(['dark', 'black']);

export function applyTheme(state = settings.get()) {
  const root = document.documentElement;
  const { theme, accent } = state;

  if (!theme || theme === 'system') root.removeAttribute('data-theme');
  else root.setAttribute('data-theme', theme);

  if (!accent || accent === 'red') root.removeAttribute('data-accent');
  else root.setAttribute('data-accent', accent);

  const meta = document.querySelector('meta[name="theme-color"]');
  if (meta) {
    const dark =
      DARKISH.has(theme) ||
      ((!theme || theme === 'system') &&
        window.matchMedia('(prefers-color-scheme: dark)').matches);
    meta.setAttribute(
      'content',
      dark
        ? '#0b0b0c'
        : getComputedStyle(root).getPropertyValue('--accent').trim() || '#b3161a',
    );
  }
}