/ concept-collection / benchcompress
Sign in
concept-collection / benchcompress
db4e6b9
Branches
mainbenchmark-results
benchcompress / web-ui / src / App.tsx
136 lines · 3.7 KBCodeBlameHistory
85d3449pagesJeremy Magland 1import { BrowserRouter, Routes, Route, Link } from "react-router-dom";
0968553routingJeremy Magland 2import { useEffect, useState } from "react";
3import axios from "axios";
85d3449pagesJeremy Magland 4import Home from "./pages/Home";
5import Datasets from "./pages/Datasets";
6import Algorithms from "./pages/Algorithms";
6c17da5about pageJeremy Magland 7import About from "./pages/About";
0968553routingJeremy Magland 8import { BenchmarkData } from "./types";
a4762faweb-uiJeremy Magland 9
10function App() {
0968553routingJeremy Magland 11 const [benchmarkData, setBenchmarkData] = useState<BenchmarkData | null>(
12 null,
13 );
14 const [isLoading, setIsLoading] = useState(true);
15 const [error, setError] = useState<string | null>(null);
17 useEffect(() => {
18 const fetchData = async () => {
19 try {
20 setIsLoading(true);
21 setError(null);
22 const response = await axios.get(
23 "https://raw.githubusercontent.com/magland/zia/benchmark-results/benchmark_results/results.json",
24 );
25 setBenchmarkData(response.data);
26 } catch (error) {
27 const message =
28 error instanceof Error ? error.message : "Failed to fetch data";
29 setError(message);
30 console.error("Error fetching benchmark data:", error);
31 } finally {
32 setIsLoading(false);
33 }
34 };
36 fetchData();
37 }, []);
a4762faweb-uiJeremy Magland 39 return (
0968553routingJeremy Magland 40 <BrowserRouter basename="/zia">
85d3449pagesJeremy Magland 41 <div style={{ padding: "2rem" }}>
42 <nav style={{ marginBottom: "2rem" }}>
0968553routingJeremy Magland 43 <ul
44 style={{
45 listStyle: "none",
46 padding: 0,
47 margin: 0,
48 display: "flex",
49 gap: "1.5rem",
50 }}
51 >
85d3449pagesJeremy Magland 52 <li>
53 <Link
0968553routingJeremy Magland 54 to="/home"
85d3449pagesJeremy Magland 55 style={{
56 color: "#0066cc",
57 textDecoration: "none",
0968553routingJeremy Magland 58 fontWeight: "500",
85d3449pagesJeremy Magland 59 }}
60 >
61 Home
62 </Link>
63 </li>
64 <li>
65 <Link
66 to="/datasets"
67 style={{
68 color: "#0066cc",
69 textDecoration: "none",
0968553routingJeremy Magland 70 fontWeight: "500",
85d3449pagesJeremy Magland 71 }}
72 >
73 Datasets
74 </Link>
75 </li>
76 <li>
77 <Link
78 to="/algorithms"
79 style={{
80 color: "#0066cc",
81 textDecoration: "none",
0968553routingJeremy Magland 82 fontWeight: "500",
85d3449pagesJeremy Magland 83 }}
84 >
85 Algorithms
86 </Link>
87 </li>
6c17da5about pageJeremy Magland 88 <li>
89 <Link
90 to="/about"
91 style={{
92 color: "#0066cc",
93 textDecoration: "none",
94 fontWeight: "500",
95 }}
96 >
97 About
98 </Link>
99 </li>
85d3449pagesJeremy Magland 100 </ul>
101 </nav>
102 <main>
0968553routingJeremy Magland 103 {isLoading ? (
104 <div>Loading benchmark data...</div>
105 ) : error ? (
106 <div>Error: {error}</div>
107 ) : (
108 <Routes>
109 <Route
110 path="/home"
111 element={<Home benchmarkData={benchmarkData} />}
112 />
113 <Route
114 path="/"
115 element={<Home benchmarkData={benchmarkData} />}
116 />
117 <Route
118 path="/datasets"
119 element={<Datasets datasets={benchmarkData?.datasets || []} />}
120 />
121 <Route
122 path="/algorithms"
123 element={
124 <Algorithms algorithms={benchmarkData?.algorithms || []} />
125 }
126 />
6c17da5about pageJeremy Magland 127 <Route path="/about" element={<About />} />
0968553routingJeremy Magland 128 </Routes>
129 )}
85d3449pagesJeremy Magland 130 </main>
131 </div>
132 </BrowserRouter>
a4762faweb-uiJeremy Magland 133 );
136export default App;
↑↓ move↵openescclose