feat: simple analysis page with sociogram

src/App.tsx

@@ -1,31 +1,27 @@
+import Analysis from "./Analysis";
 import { baseUrl } from "./api";
 import "./App.css";
+import Footer from "./Footer";
+import Header from "./Header";
 import Rankings from "./Rankings";
+import { BrowserRouter, Routes, Route } from "react-router-dom";
 
 function App() {
+  //const [data, setData] = useState({ nodes: [], links: [] } as SociogramData);
+  //async function loadData() {
+  //  await fetch(`${baseUrl}analysis/json`, { method: "GET" }).then(resp => resp.json() as unknown as SociogramData).then(json => { setData(json) })
+  //}
+  //useEffect(() => { loadData() }, [])
+  //
   return (
-    <>
-      <div className="logo">
-        <a href={baseUrl}>
-          <img alt="logo" height="66%" src="logo.svg" />
-          <h3 className="centered">cutt</h3>
-        </a>
-        <span className="grey">cool ultimate team tool</span>
-      </div>
-      <Rankings />
-      <footer>
-        <p className="grey">
-          something not working?
-          <br />
-          message <a href="https://t.me/x0124816">me</a>.
-          <br />
-          or fix it here:{" "}
-          <a href="https://git.0124816.xyz/julius/cutt" key="gitea">
-            <img src="gitea.svg" alt="gitea" height="16" />
-          </a>
-        </p>
-      </footer>
-    </>
+    <BrowserRouter>
+      <Header />
+      <Routes>
+        <Route index element={<Rankings />} />
+        <Route path="analysis" element={<Analysis />} />
+      </Routes>
+      <Footer />
+    </BrowserRouter>
   );
 }
 export default App;