import { Outlet, useModel } from '@umijs/max';
import { ConfigProvider, theme } from 'antd';
import { useEffect, useState } from 'react';

export default () => {
    const { initialState, setInitialState } = useModel('@@initialState');
    const [algorithm, setAlgorithm] = useState([theme.compactAlgorithm]);

    useEffect(() => {
        let a = [theme.compactAlgorithm];
        if (initialState?.dark) {
            a.push(theme.darkAlgorithm);
            setInitialState((s) => ({ ...s, settings: { ...s?.settings, navTheme: 'realDark' } }));
        } else {
            setInitialState((s) => ({ ...s, settings: { ...s?.settings, navTheme: 'light' } }));
        }
        setAlgorithm(a);
    }, [initialState?.dark]);

    return (
        <ConfigProvider
            theme={{
                algorithm,
                // token:{
                //   colorPrimary: '#f0f',
                // },
            }}
        >
            <Outlet />
        </ConfigProvider>
    );
};
