aboutsummaryrefslogtreecommitdiffstats
path: root/frontend/src/App.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'frontend/src/App.tsx')
-rw-r--r--frontend/src/App.tsx140
1 files changed, 0 insertions, 140 deletions
diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
deleted file mode 100644
index cc45949..0000000
--- a/frontend/src/App.tsx
+++ /dev/null
@@ -1,140 +0,0 @@
-import React, { useEffect, useState } from 'react';
-import { HashRouter, Routes, Route, Navigate, useLocation } from 'react-router-dom';
-import Login from './components/Login';
-import './App.css';
-import { apiFetch } from './utils';
-
-// Protected Route wrapper
-function RequireAuth({ children }: { children: React.ReactElement }) {
- const [auth, setAuth] = useState<boolean | null>(null);
- const location = useLocation();
-
- useEffect(() => {
- apiFetch('/api/auth')
- .then((res) => {
- if (res.ok) {
- setAuth(true);
- } else {
- setAuth(false);
- }
- })
- .catch(() => setAuth(false));
- }, []);
-
- if (auth === null) {
- return <div>Loading...</div>;
- }
-
- if (!auth) {
- return <Navigate to="/login" state={{ from: location }} replace />;
- }
-
- return children;
-}
-
-import FeedList from './components/FeedList';
-import FeedItems from './components/FeedItems';
-import Settings from './components/Settings';
-
-interface DashboardProps {
- theme: string;
- setTheme: (t: string) => void;
- fontTheme: string;
- setFontTheme: (t: string) => void;
-}
-
-function Dashboard({ theme, setTheme, fontTheme, setFontTheme }: DashboardProps) {
- const [sidebarVisible, setSidebarVisible] = useState(window.innerWidth > 768);
-
- useEffect(() => {
- const handleResize = () => {
- if (window.innerWidth > 768) {
- setSidebarVisible(true);
- } else {
- setSidebarVisible(false);
- }
- };
- window.addEventListener('resize', handleResize);
- return () => window.removeEventListener('resize', handleResize);
- }, []);
-
- return (
- <div
- className={`dashboard ${sidebarVisible ? 'sidebar-visible' : 'sidebar-hidden'} theme-${theme} font-${fontTheme}`}
- >
- <div className="dashboard-content">
- {(!sidebarVisible || window.innerWidth <= 768) && (
- <button
- className="sidebar-toggle fixed-toggle"
- onClick={() => setSidebarVisible(!sidebarVisible)}
- title={sidebarVisible ? "Hide Sidebar" : "Show Sidebar"}
- >
- 🐱
- </button>
- )}
- {sidebarVisible && (
- <div
- className="sidebar-backdrop"
- onClick={() => setSidebarVisible(false)}
- />
- )}
- <aside className={`dashboard-sidebar ${sidebarVisible ? '' : 'hidden'}`}>
- <FeedList
- theme={theme}
- setTheme={setTheme}
- setSidebarVisible={setSidebarVisible}
- isMobile={window.innerWidth <= 768}
- />
- </aside>
- <main className="dashboard-main">
- <Routes>
- <Route path="/feed/:feedId" element={<FeedItems />} />
- <Route path="/tag/:tagName" element={<FeedItems />} />
- <Route path="/settings" element={<Settings fontTheme={fontTheme} setFontTheme={setFontTheme} />} />
- <Route path="/" element={<FeedItems />} />
- </Routes>
- </main>
- </div>
- </div>
- );
-}
-
-function App() {
- const [theme, setTheme] = useState(localStorage.getItem('neko-theme') || 'light');
- const [fontTheme, setFontTheme] = useState(localStorage.getItem('neko-font-theme') || 'default');
-
- const handleSetTheme = (newTheme: string) => {
- setTheme(newTheme);
- localStorage.setItem('neko-theme', newTheme);
- };
-
- const handleSetFontTheme = (newFontTheme: string) => {
- setFontTheme(newFontTheme);
- localStorage.setItem('neko-font-theme', newFontTheme);
- };
-
-
-
- return (
- <HashRouter>
- <Routes>
- <Route path="/login" element={<Login />} />
- <Route
- path="/*"
- element={
- <RequireAuth>
- <Dashboard
- theme={theme}
- setTheme={handleSetTheme}
- fontTheme={fontTheme}
- setFontTheme={handleSetFontTheme}
- />
- </RequireAuth>
- }
- />
- </Routes>
- </HashRouter>
- );
-}
-
-export default App;