mirror of https://github.com/longtai-cn/hippo4j
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
43 lines
1.4 KiB
43 lines
1.4 KiB
import React, { useContext, useEffect, useState } from 'react';
|
|
import { DefaultTheme, ThemeProvider } from 'styled-components';
|
|
import { ConfigProvider, theme } from 'antd';
|
|
import { darkAlgorithm } from '../../config/theme/dark-algorithm';
|
|
import { defaultAlgorithm } from '../../config/theme/default-algnorithm';
|
|
import { lightDefaultTheme, darkDefaultTheme } from '../../config/theme';
|
|
import { MyContext } from '../../context';
|
|
import zhCN from 'antd/es/locale/zh_CN';
|
|
import { THEME_NAME } from '@/typings';
|
|
|
|
interface ThemeProps {
|
|
children: React.ReactNode;
|
|
}
|
|
|
|
const ThemeComponent = ({ children }: ThemeProps) => {
|
|
const [themes, setThemes] = useState(defaultAlgorithm);
|
|
const [myThemes, setMyThemes] = useState<DefaultTheme>(lightDefaultTheme);
|
|
const { themeName } = useContext<any>(MyContext);
|
|
|
|
const changeMode = (themeName: THEME_NAME) => {
|
|
if (themeName === THEME_NAME.DARK) {
|
|
darkAlgorithm.algorithm = theme.darkAlgorithm;
|
|
setThemes(darkAlgorithm);
|
|
setMyThemes(darkDefaultTheme);
|
|
} else {
|
|
defaultAlgorithm.algorithm = theme.defaultAlgorithm;
|
|
setThemes(defaultAlgorithm);
|
|
setMyThemes(lightDefaultTheme);
|
|
}
|
|
};
|
|
|
|
useEffect(() => {
|
|
changeMode(themeName);
|
|
}, [themeName]);
|
|
|
|
return (
|
|
<ConfigProvider locale={zhCN} theme={themes}>
|
|
<ThemeProvider theme={myThemes}>{children}</ThemeProvider>
|
|
</ConfigProvider>
|
|
);
|
|
};
|
|
export default ThemeComponent;
|