// SPDX-FileCopyrightText: 2025-2026 Kat Suricata <https://KatSuricata.com/>
// SPDX-License-Identifier: (CC-BY-4.0+ OR Apache-2.0+)

import {
	activeScheme,
	applyScheme,
	platformScheme,
	savedScheme,
	type Scheme
} from '#lib/scheme.js';

/**
 * The mode on screen. Components read `scheme.current` and call `setScheme`.
 *
 * `src/app.html` applies the same mode before the first paint, so the value
 * here syncs the controls with the page rather than changing the page.
 */
export const scheme = $state<{ current: Scheme }>({ current: 'dark' });

let listening = false;

/** Syncs the store with the page. Call once from a component, on the client. */
export function startScheme(): void {
	scheme.current = activeScheme();
	if (listening) return;
	listening = true;

	// Follow the platform while the reader has saved no mode.
	const media = window.matchMedia('(prefers-color-scheme: light)');
	media.addEventListener('change', () => {
		if (!savedScheme()) scheme.current = platformScheme();
	});
}

/** Saves a mode, applies it to the root element, and updates the store. */
export function setScheme(next: Scheme): void {
	scheme.current = next;
	applyScheme(next);
}