fastfood-qr — gitlawb

repository

loading code, commits, and activity

repositories

loading repo index

#1	import { BrowserRouter, Routes, Route, Link } from 'react-router-dom';
#2	import { useState, useEffect } from 'react';
#3	import { AppProvider } from './context';
#4	import { IconBurger, IconSun, IconMoon } from './icons';
#5	import Landing from './pages/Landing';
#6	import Dashboard from './pages/Dashboard';
#7	import MenuPage from './pages/MenuPage';
#8
#9	function useTheme() {
#10	const [theme, setTheme] = useState<'dark' \| 'light'>(() => {
#11	if (typeof window !== 'undefined') {
#12	return (localStorage.getItem('theme') as 'dark' \| 'light') \|\| 'dark';
#13	}
#14	return 'dark';
#15	});
#16
#17	useEffect(() => {
#18	document.documentElement.setAttribute('data-theme', theme);
#19	localStorage.setItem('theme', theme);
#20	}, [theme]);
#21
#22	return { theme, toggle: () => setTheme(t => t === 'dark' ? 'light' : 'dark') };
#23	}
#24
#25	function NavBar() {
#26	const { theme, toggle } = useTheme();
#27
#28	return (
#29	<nav className="navbar">
#30	<Link to="/" className="navbar-brand">
#31	<span className="navbar-brand-icon">
#32	<IconBurger size={18} />
#33	</span>
#34	FastFood QR
#35	</Link>
#36	<div className="navbar-links">
#37	<Link to="/dashboard" className="navbar-link">Dashboard</Link>
#38	<Link to="/menu/burger-house" className="navbar-link">Demo Menu</Link>
#39	<button className="theme-toggle" onClick={toggle} aria-label="Toggle theme">
#40	{theme === 'dark' ? <IconSun size={18} /> : <IconMoon size={18} />}
#41	</button>
#42	</div>
#43	</nav>
#44	);
#45	}
#46
#47	export default function App() {
#48	return (
#49	<BrowserRouter>
#50	<AppProvider>
#51	<NavBar />
#52	<Routes>
#53	<Route path="/" element={<Landing />} />
#54	<Route path="/dashboard" element={<Dashboard />} />
#55	<Route path="/menu/:slug" element={<MenuPage />} />
#56	</Routes>
#57	</AppProvider>
#58	</BrowserRouter>
#59	);
#60	}
#61

z6Mkfh4Y/fastfood-qr