extern/bruno
1
0
Fork 1
mirror of https://github.com/usebruno/bruno.git synced 2024-11-29 11:23:57 +01:00
Code Issues Packages Projects Releases Wiki Activity

fix: wrap watcher into useEffect

Browse Source
This commit is contained in:
Alexey Kunitsky 2023-11-14 11:00:44 +01:00
parent 8130de23ff
commit 1ee6b5f974
1 changed files with 7 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
packages/bruno-app/src/providers/Theme/index.js
View File

@ -1,7 +1,7 @@
import themes from 'themes/index'; import themes from 'themes/index';
import useLocalStorage from 'hooks/useLocalStorage/index'; import useLocalStorage from 'hooks/useLocalStorage/index';
import { createContext, useContext, useState } from 'react'; import { createContext, useContext, useEffect, useState } from 'react';
import { ThemeProvider as SCThemeProvider } from 'styled-components'; import { ThemeProvider as SCThemeProvider } from 'styled-components';
export const ThemeContext = createContext(); export const ThemeContext = createContext();
@ -10,10 +10,12 @@ export const ThemeProvider = (props) => {
const [displayedTheme, setDisplayedTheme] = useState(isBrowserThemeLight ? 'light' : 'dark'); const [displayedTheme, setDisplayedTheme] = useState(isBrowserThemeLight ? 'light' : 'dark');
const [storedTheme, setStoredTheme] = useLocalStorage('bruno.theme', 'system'); const [storedTheme, setStoredTheme] = useLocalStorage('bruno.theme', 'system');
useEffect(() => {
window.matchMedia('(prefers-color-scheme: light)').addEventListener('change', (e) => { window.matchMedia('(prefers-color-scheme: light)').addEventListener('change', (e) => {
if (storedTheme !== 'system') return; if (storedTheme !== 'system') return;
setDisplayedTheme(e.matches ? 'light' : 'dark'); setDisplayedTheme(e.matches ? 'light' : 'dark');
}); });
}, []);
const theme = storedTheme === 'system' ? themes[displayedTheme] : themes[storedTheme]; const theme = storedTheme === 'system' ? themes[displayedTheme] : themes[storedTheme];
const themeOptions = Object.keys(themes); const themeOptions = Object.keys(themes);