interface ThemeModeState {
  init(): void;
  storedTheme: string;
  handleToggleThemeMode(): void;
}

export const themeMode = (): ThemeModeState => ({
  storedTheme: "",

  init() {
    const storedTheme = localStorage.getItem("theme-mode") || "dark";

    if (!storedTheme) return;

    document.documentElement.setAttribute("data-color-scheme", storedTheme);

    this.storedTheme = storedTheme;
  },

  handleToggleThemeMode() {
    const targetTheme = this.storedTheme === "dark" ? "light" : "dark";

    document.documentElement.setAttribute("data-color-scheme", targetTheme);

    this.storedTheme = targetTheme;

    localStorage.setItem("theme-mode", targetTheme);
  },
});
