/* eslint-disable @lwc/lwc/no-document-query */
import { LightningElement } from "lwc";

export const LOCAL_STORAGE_KEY = "dx-dark-mode-theme";

function setTheme(theme: string) {
    const DWONavSelector = document.querySelector("hgf-c360contextnav");

    document.body.setAttribute("class", theme);
    DWONavSelector?.setAttribute("dark-mode", String(theme === "dark"));
    localStorage.setItem(LOCAL_STORAGE_KEY, theme);
}

function isDarkMode() {
    return document.body.getAttribute("class") === "dark";
}

function onDarkModeToggle() {
    if (isDarkMode()) {
        setTheme("light");
    } else {
        setTheme("dark");
    }
}

declare module globalThis {
    let singletonDarkModeManagerRendered: boolean;
}

export const DARK_MODE_THEMES = ["dark", "light"];
export const DARKMODE_TOGGLE_EVENT_NAME = "UPDATE_DARK_MODE";

export const isDarkModeEnabled = () => {
    return process.env.DARK_MODE;
};

export const dispatchDarkModeToggleEvent = () => {
    window.dispatchEvent(new Event(DARKMODE_TOGGLE_EVENT_NAME));
};

export const getLocalStorageDarkModeSetting = () => {
    return localStorage.getItem(LOCAL_STORAGE_KEY);
};

const isBrowserDarkModeEnabled = () => {
    return (
        window.matchMedia &&
        window.matchMedia("(prefers-color-scheme: dark)").matches
    );
};

export const setLocalStorageDarkModeSetting = (theme: string) => {
    localStorage.setItem(LOCAL_STORAGE_KEY, theme);
};

export default class DarkModeManager extends LightningElement {
    renderedCallback(): void {
        if (
            isDarkModeEnabled() &&
            !globalThis.singletonDarkModeManagerRendered
        ) {
            const theme = getLocalStorageDarkModeSetting();
            if (theme) {
                if (DARK_MODE_THEMES.includes(theme)) {
                    setTheme(theme);
                }
            } else if (isBrowserDarkModeEnabled()) {
                setTheme("dark");
            }
            window.addEventListener(
                DARKMODE_TOGGLE_EVENT_NAME,
                onDarkModeToggle
            );
            globalThis.singletonDarkModeManagerRendered = true;
        }
    }

    disconnectedCallback(): void {
        if (isDarkModeEnabled()) {
            window.removeEventListener(
                DARKMODE_TOGGLE_EVENT_NAME,
                onDarkModeToggle
            );
        }
    }
}