import { defaultTheme, isBrowser, themeAttribute } from './';
import type { StoredTheme, ThemeName } from './index';

/**
 * Custom getThemeName function
 *
 * At runtime, it gets the correct theme from the `document`
 *
 * It replys on `document` `data-attributes` as primary mechanism,
 * ans `sessionStoryage` as a backup mechanism.
 *
 * It works in conjunction with Custom setThemeName from `@lendi/ui`
 *
 * @deprecated Deprecated since 0.2.3. Use SC's Theme instead.
 */
export const getThemeName: () => ThemeName = () => {
  // Check browser for runtime
  if (isBrowser) {
    // Get `theme` from DOM `data-attributes` if it's already available.
    const dataTheme = window?.document.documentElement.getAttribute(themeAttribute) as StoredTheme;
    if (dataTheme) return dataTheme;

    // If not available, fallback to session storage (backwards compatibility with older LUIProvider)
    try {
      const storedTheme = window.sessionStorage.getItem('theme') as StoredTheme;
      if (storedTheme) return JSON.parse(storedTheme).value;
    } catch (error) {
      // TODO: Report Error
    }

    // conditionally generate warning
    const isRuntime = typeof process === 'undefined';
    const showWarning = isRuntime ? true : process?.env?.NODE_ENV !== 'test';
    if (showWarning) {
      console.warn(
        `~~~LUI: No theme detected. Applying default theme "${defaultTheme}"~~~`,
        '\nYou may not have properly installed the LUIProvider - please refer to https://lendi.style/?path=/docs/foundations-luiprovider--interactive.\n'
      );
    }
  }

  return defaultTheme;
};

export default getThemeName;