Skip to content

Commit 0a380eb

Browse files
committed
Update behavior of themee
1 parent 4654bb2 commit 0a380eb

File tree

2 files changed

+8
-7
lines changed

2 files changed

+8
-7
lines changed

src/App.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,7 @@ function App() {
4949
}, [leftMenuCollapse])
5050
return (
5151
<>
52-
<Header setCurrentTheme={setCurrentTheme} />
52+
<Header currentTheme={currentTheme} setCurrentTheme={setCurrentTheme} />
5353
<div className="app-wrapper">
5454
<LeftMenu setContent={setContent} leftMenuCollapse={leftMenuCollapse} setLeftMenuCollapse={setLeftMenuCollapse} />
5555
<div className="editor-page-wrapper" ref={rightMenuRef}>

src/components/Header/Header.tsx

+7-6
Original file line numberDiff line numberDiff line change
@@ -5,24 +5,25 @@ import { Theme } from "../../utils/theme.cont";
55
import TooltipComponent from "../Tooltip/Tooltip";
66

77
interface HeaderType {
8+
currentTheme: string
89
setCurrentTheme: React.Dispatch<string>
910
}
10-
const Header:React.FC<HeaderType> = ({setCurrentTheme}) => {
11-
const [ themeState, setThemeState ] = useLocalStorageState('theme');
11+
const Header:React.FC<HeaderType> = ({currentTheme, setCurrentTheme}) => {
12+
const [ _, setThemeState ] = useLocalStorageState('theme');
1213
return(
1314
<header>
1415
<div className="header-wrapper">
1516
<div><BsCodeSquare /> OpenAPI Specification Editor</div>
1617
<div>
17-
{themeState === Theme.LIGHT
18+
{currentTheme === Theme.LIGHT
1819
?
1920
<TooltipComponent message="Dark theme" onClick={() => {setThemeState(Theme.DARK); setCurrentTheme(Theme.DARK);}}>
2021
<LightModeSVG />
21-
</TooltipComponent>
22-
:
22+
</TooltipComponent>
23+
:
2324
<TooltipComponent message="Light theme" onClick={() => {setThemeState(Theme.LIGHT); setCurrentTheme(Theme.LIGHT);}}>
2425
<DarkModeSVG />
25-
</TooltipComponent>
26+
</TooltipComponent>
2627
}
2728
</div>
2829
</div>

0 commit comments

Comments
 (0)