import {createSelector} from "@reduxjs/toolkit";
import {initialState} from "./index";

import {isSystemDark} from "../utils";
import {themes} from "../themes";
import { theme as antdTheme} from "antd";
import {antdThemeConfig} from "../themes";
/**
 * 注入一个主题初始变量key
 * @param state
 */
const selectDomain = (state) =>state.theme || initialState;

/**
 * 返回自定义主题Token
 */
export const selectTheme = createSelector(
  [selectDomain],
  theme=> {
    if (theme.selected==='system'){
      return isSystemDark ? themes.dark :themes.light;
    }
    return themes[theme.selected];
  }
)

/**
 * 返回全局主题变量theme
 */
export const selectThemeKey = createSelector(
  [selectDomain],
  theme=>theme.selected
)

/**
 * 返回自定义、Antd主题 合并Token
 */
export const selectMergeTheme = createSelector(
  [selectDomain],
  theme=> {
    const token = antdTheme.useToken();
    const mergerToken= {
      ...token.token,
      ...themes[theme.selected]
    }
    if (theme.selected==='system'){
      return isSystemDark ? themes.dark :themes.light;
    }
    return mergerToken;
  }
)

/**
 * 返回Antd主题配置
 */
export const selectAntdThemeConfig = createSelector(
  [selectDomain],
  theme=> {
    return {
      algorithm: antdThemeConfig[theme.selected]
    }
  }
)
