Spaces:
Running
Running
| import React, { createContext, useContext, useState, useEffect } from 'react'; | |
| const ThemeContext = createContext(); | |
| export const ThemeProvider = ({ children }) => { | |
| const [theme, setTheme] = useState(() => { | |
| const saved = localStorage.getItem('theme'); | |
| return saved || 'light'; | |
| }); | |
| useEffect(() => { | |
| const root = document.documentElement; | |
| const isLanding = window.location.pathname === '/'; | |
| if (theme === 'dark' && !isLanding) { | |
| root.classList.add('dark'); | |
| } else { | |
| root.classList.remove('dark'); | |
| } | |
| localStorage.setItem('theme', theme); | |
| }, [theme]); | |
| const toggleTheme = () => { | |
| setTheme(prev => (prev === 'light' ? 'dark' : 'light')); | |
| }; | |
| return ( | |
| <ThemeContext.Provider value={{ theme, setTheme, toggleTheme, isDarkMode: theme === 'dark' }}> | |
| {children} | |
| </ThemeContext.Provider> | |
| ); | |
| }; | |
| export const useTheme = () => { | |
| const context = useContext(ThemeContext); | |
| if (!context) { | |
| throw new Error('useTheme must be used within a ThemeProvider'); | |
| } | |
| return context; | |
| }; | |