import type { MantineThemeOverride } from "@mantine/core";
import { useStore } from "@tanstack/react-store";
import { Store } from "@tanstack/store";

import { defaultTheme } from "#/features/theme/themes/default-theme";

type ThemeState = {
	theme: MantineThemeOverride;
};

const themeStore = new Store<ThemeState>({ theme: defaultTheme });

function changeMantineTheme(newTheme: MantineThemeOverride) {
	themeStore.setState(() => ({ theme: newTheme }));
}

function useMantineThemeStore<T>(selector: (state: ThemeState) => T): T {
	return useStore(themeStore, selector);
}

export { themeStore, changeMantineTheme, useMantineThemeStore };