| 14 | } |
| 15 | |
| 16 | export function* initializeThemeSaga() { |
| 17 | // Wait for the fetch userComplete action |
| 18 | yield take(actionTypes.fetchUserComplete); |
| 19 | |
| 20 | const userTheme = yield select(userThemeSelector); |
| 21 | const localStorageTheme = localStorage.getItem('theme'); |
| 22 | const isSysThemeDark = window.matchMedia( |
| 23 | '(prefers-color-scheme: dark)' |
| 24 | ).matches; |
| 25 | |
| 26 | let selectTheme = 'light'; |
| 27 | |
| 28 | if (localStorageTheme !== null) { |
| 29 | selectTheme = localStorageTheme === 'dark' ? 'dark' : 'light'; |
| 30 | } else if (userTheme) { |
| 31 | selectTheme = userTheme === 'night' ? 'dark' : 'light'; |
| 32 | } else if (isSysThemeDark) { |
| 33 | selectTheme = 'dark'; |
| 34 | } |
| 35 | |
| 36 | localStorage.setItem('theme', selectTheme); |
| 37 | yield put(setTheme(selectTheme)); |
| 38 | } |
| 39 | |
| 40 | export function createThemeSaga(types) { |
| 41 | return [ |