ClipFusion-org/clipfusion
1
1
Fork 0
mirror of https://github.com/ClipFusion-org/clipfusion.git synced 2025-08-03 16:55:08 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

ui: fixed ThemeProvider component

Browse Source
This commit is contained in:
corgifist 2025-07-20 16:45:47 +03:00
parent acda651d82
commit 7078330605
2 changed files with 5 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/app/theme-provider.tsx
View File

@ -4,9 +4,9 @@ import { ComponentProps, ReactNode } from "react";
const ThemeProvider = (props: ComponentProps<typeof NextThemeProvider>): ReactNode => { const ThemeProvider = (props: ComponentProps<typeof NextThemeProvider>): ReactNode => {
return ( return (
<ThemeProvider {...props} attribute="class" defaultTheme="system" enableSystem disableTransitionOnChange> <NextThemeProvider {...props} attribute="class" defaultTheme="system" enableSystem disableTransitionOnChange>
{props.children} {props.children}
</ThemeProvider> </NextThemeProvider>
) )
}; };

5
src/components/theme-switcher/ThemeSwitcher.tsx
View File

@ -1,3 +1,4 @@
"use client";
import { useTheme } from "next-themes"; import { useTheme } from "next-themes";
import { ReactNode, useCallback, useEffect, useState } from "react"; import { ReactNode, useCallback, useEffect, useState } from "react";
import { Toggle } from "../ui/toggle"; import { Toggle } from "../ui/toggle";
@ -15,11 +16,11 @@ export const ThemeSwitcher = ({
const onThemeChange = useCallback(() => { const onThemeChange = useCallback(() => {
setTheme(theme == "dark" ? "light" : "dark"); setTheme(theme == "dark" ? "light" : "dark");
setDark(!dark); setDark(!dark);
}, [theme, dark, setTheme]); }, [theme, dark]);
useEffect(() => { useEffect(() => {
setDark(theme == "dark"); setDark(theme == "dark");
}); }, []);
return ( return (
<Toggle pressed={dark} onPressedChange={onThemeChange}> <Toggle pressed={dark} onPressedChange={onThemeChange}>