Dark mode.

This commit is contained in:
Mike Cao 2020-09-20 01:33:39 -07:00
parent 4bb95cd997
commit aa265d1d42
29 changed files with 221 additions and 60 deletions

View file

@ -1,5 +1,5 @@
import { useDispatch, useSelector } from 'react-redux';
import { updateApp } from 'redux/actions/app';
import { setLocale } from 'redux/actions/app';
import { setItem } from 'lib/web';
import { LOCALE_CONFIG } from 'lib/constants';
@ -7,10 +7,10 @@ export default function useLocale() {
const locale = useSelector(state => state.app.locale);
const dispatch = useDispatch();
function setLocale(value) {
function saveLocale(value) {
setItem(LOCALE_CONFIG, value);
dispatch(updateApp({ locale: value }));
dispatch(setLocale(value));
}
return [locale, setLocale];
return [locale, saveLocale];
}

21
hooks/useTheme.js Normal file
View file

@ -0,0 +1,21 @@
import { useDispatch, useSelector } from 'react-redux';
import { setTheme } from 'redux/actions/app';
import { getItem, setItem } from 'lib/web';
import { THEME_CONFIG } from 'lib/constants';
import { useEffect } from 'react';
export default function useLocale() {
const theme = useSelector(state => state.app.theme || getItem(THEME_CONFIG) || 'light');
const dispatch = useDispatch();
function saveTheme(value) {
setItem(THEME_CONFIG, value);
dispatch(setTheme(value));
}
useEffect(() => {
document.body.setAttribute('data-theme', theme);
}, [theme]);
return [theme, saveTheme];
}