apunkt/rowboat
1
0
Fork 0
mirror of https://github.com/rowboatlabs/rowboat.git synced 2026-06-09 19:45:17 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix(theme): add persistence & update icon

Browse source
This commit is contained in:
takshakmudgal 2025-04-28 15:49:30 +05:30
parent 8c2c21a239
commit 13c2a2fe8b
2 changed files with 13 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

3
apps/rowboat/app/projects/layout/components/sidebar.tsx
View file

@ -13,6 +13,7 @@ import {
ChevronLeftIcon,
ChevronRightIcon,
Moon,
Sun,
HelpCircle
} from "lucide-react";
import { getProjectConfig } from "@/app/actions/project_actions";
@ -213,7 +214,7 @@ export default function Sidebar({ projectId, useRag, useAuth, collapsed = false,
text-zinc-600 dark:text-zinc-400
`}
>
<Moon size={COLLAPSED_ICON_SIZE} />
{ theme == "light" ? <Moon size={COLLAPSED_ICON_SIZE} /> : <Sun size={COLLAPSED_ICON_SIZE} /> }
{!collapsed && <span>Appearance</span>}
</button>
</Tooltip>

15
apps/rowboat/app/providers/theme-provider.tsx
View file

@ -15,21 +15,28 @@ type ThemeProviderState = {
}
const ThemeProviderContext = createContext<ThemeProviderState | undefined>(undefined)
const root = window.document.documentElement
export function ThemeProvider({
children,
defaultTheme = 'light',
}: ThemeProviderProps) {
const [theme, setTheme] = useState<Theme>(defaultTheme)
const [theme, setTheme] = useState<Theme>(() => {
const storedTheme = localStorage.getItem("theme")
return storedTheme === 'dark' || storedTheme === 'light' ? storedTheme : defaultTheme
})
useEffect(() => {
const root = window.document.documentElement
root.classList.remove('light', 'dark')
root.classList.add(theme)
}, [theme])
const toggleTheme = () => {
setTheme(theme === 'light' ? 'dark' : 'light')
setTheme((prevTheme) => {
const newTheme = prevTheme === 'light' ? 'dark' : 'light'
localStorage.setItem("theme", newTheme)
return newTheme
})
}
return (
@ -45,4 +52,4 @@ export function useTheme() {
throw new Error('useTheme must be used within a ThemeProvider')
}
return context
}
}