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

Merge pull request #94 from takshakmudgal/ui/theme-persistence

Browse source 
fix(theme): add persistence & update icon
This commit is contained in:
Akhilesh Sudhakar 2025-04-29 01:08:44 +05:30 • committed by GitHub
commit 739b7caa46
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 18 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, ChevronLeftIcon,
ChevronRightIcon, ChevronRightIcon,
Moon, Moon,
Sun,
HelpCircle HelpCircle
} from "lucide-react"; } from "lucide-react";
import { getProjectConfig } from "@/app/actions/project_actions"; 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 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>} {!collapsed && <span>Appearance</span>}
</button> </button>
</Tooltip> </Tooltip>

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

@ -23,13 +23,25 @@ export function ThemeProvider({
const [theme, setTheme] = useState<Theme>(defaultTheme) const [theme, setTheme] = useState<Theme>(defaultTheme)
useEffect(() => { useEffect(() => {
const root = window.document.documentElement const root = document.documentElement
const storedTheme = localStorage.getItem("theme")
if (storedTheme === 'dark' || storedTheme === 'light') {
setTheme(storedTheme)
}
root.classList.remove('light', 'dark') root.classList.remove('light', 'dark')
root.classList.add(theme) root.classList.add(theme)
}, [theme]) }, [theme])
const toggleTheme = () => { const toggleTheme = () => {
setTheme(theme === 'light' ? 'dark' : 'light') setTheme((prevTheme) => {
const newTheme = prevTheme === 'light' ? 'dark' : 'light'
if (typeof window !== 'undefined') {
localStorage.setItem("theme", newTheme)
}
return newTheme
})
} }
return ( return (