修复matchMedia兼容性

This commit is contained in:
hanhh 2021-08-02 21:44:42 +08:00
parent 2f4fb657e6
commit 2ddf69a79a

View File

@ -6,6 +6,7 @@ import SplitPane from 'react-split-pane';
import Editor from '@monaco-editor/react';
import SaveModal from './saveModal';
import SettingModal from './setting';
import { useTheme } from '@/utils/hooks';
const { Option } = Select;
const LangMap: any = {
@ -35,7 +36,6 @@ const EditModal = ({
handleCancel: () => void;
}) => {
const [value, setValue] = useState('');
const [theme, setTheme] = useState<string>('');
const [language, setLanguage] = useState<string>('javascript');
const [fileName, setFileName] = useState<string>('');
const [saveModalVisible, setSaveModalVisible] = useState<boolean>(false);
@ -43,6 +43,7 @@ const EditModal = ({
useState<boolean>(false);
const [isNewFile, setIsNewFile] = useState<boolean>(false);
const [log, setLog] = useState<string>('');
const { theme } = useTheme();
const cancel = () => {
handleCancel();
@ -80,23 +81,6 @@ const EditModal = ({
setIsNewFile(!currentFile);
}, []);
useEffect(() => {
const media = window.matchMedia('(prefers-color-scheme: dark)');
const storageTheme = localStorage.getItem('qinglong_dark_theme');
const isDark =
(media.matches && storageTheme !== 'light') || storageTheme === 'dark';
setTheme(isDark ? 'vs-dark' : 'vs');
media.addEventListener('change', (e) => {
if (storageTheme === 'auto' || !storageTheme) {
if (e.matches) {
setTheme('vs-dark');
} else {
setTheme('vs');
}
}
});
}, []);
return (
<Drawer
className="edit-modal"