/ concept-collection / benchcompress
Sign in
concept-collection / benchcompress
benchcompress / web-ui / src / App.tsx
175 lines · 4.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";
a09013dupload dataset .jsonJeremy Magland 6import Dataset from "./pages/Dataset";
85d3449pagesJeremy Magland 7import Algorithms from "./pages/Algorithms";
0602a7eui improvementsJeremy Magland 8import Algorithm from "./pages/Algorithm";
6c17da5about pageJeremy Magland 9import About from "./pages/About";
0968553routingJeremy Magland 10import { BenchmarkData } from "./types";
a4762faweb-uiJeremy Magland 11
12function App() {
0968553routingJeremy Magland 13 const [benchmarkData, setBenchmarkData] = useState<BenchmarkData | null>(
14 null,
15 );
16 const [isLoading, setIsLoading] = useState(true);
17 const [error, setError] = useState<string | null>(null);
19 useEffect(() => {
20 const fetchData = async () => {
21 try {
22 setIsLoading(true);
23 setError(null);
24 const response = await axios.get(
25 "https://raw.githubusercontent.com/magland/zia/benchmark-results/benchmark_results/results.json",
26 );
27 setBenchmarkData(response.data);
28 } catch (error) {
29 const message =
30 error instanceof Error ? error.message : "Failed to fetch data";
31 setError(message);
32 console.error("Error fetching benchmark data:", error);
33 } finally {
34 setIsLoading(false);
35 }
36 };
38 fetchData();
39 }, []);
a4762faweb-uiJeremy Magland 41 return (
0968553routingJeremy Magland 42 <BrowserRouter basename="/zia">
a3cad9bformat codeJeremy Magland 43 <div
44 style={{
45 paddingTop: "5rem",
46 paddingLeft: "2rem",
47 paddingRight: "2rem",
48 paddingBottom: "2rem",
49 }}
50 >
51 <nav
52 style={{
53 position: "fixed",
54 top: 0,
55 left: 0,
56 right: 0,
57 padding: "1rem 2rem",
58 backgroundColor: "white",
59 borderBottom: "1px solid #eaeaea",
60 zIndex: 1000,
61 boxShadow: "0 2px 4px rgba(0,0,0,0.1)",
62 }}
63 >
0968553routingJeremy Magland 64 <ul
65 style={{
66 listStyle: "none",
67 padding: 0,
68 margin: 0,
69 display: "flex",
70 gap: "1.5rem",
71 }}
72 >
85d3449pagesJeremy Magland 73 <li>
74 <Link
0968553routingJeremy Magland 75 to="/home"
85d3449pagesJeremy Magland 76 style={{
77 color: "#0066cc",
78 textDecoration: "none",
0968553routingJeremy Magland 79 fontWeight: "500",
85d3449pagesJeremy Magland 80 }}
81 >
82 Home
83 </Link>
84 </li>
85 <li>
86 <Link
87 to="/datasets"
88 style={{
89 color: "#0066cc",
90 textDecoration: "none",
0968553routingJeremy Magland 91 fontWeight: "500",
85d3449pagesJeremy Magland 92 }}
93 >
94 Datasets
95 </Link>
96 </li>
97 <li>
98 <Link
99 to="/algorithms"
100 style={{
101 color: "#0066cc",
102 textDecoration: "none",
0968553routingJeremy Magland 103 fontWeight: "500",
85d3449pagesJeremy Magland 104 }}
105 >
106 Algorithms
107 </Link>
108 </li>
6c17da5about pageJeremy Magland 109 <li>
110 <Link
111 to="/about"
112 style={{
113 color: "#0066cc",
114 textDecoration: "none",
115 fontWeight: "500",
116 }}
117 >
118 About
119 </Link>
120 </li>
85d3449pagesJeremy Magland 121 </ul>
122 </nav>
123 <main>
0968553routingJeremy Magland 124 {isLoading ? (
125 <div>Loading benchmark data...</div>
126 ) : error ? (
127 <div>Error: {error}</div>
128 ) : (
129 <Routes>
130 <Route
131 path="/home"
132 element={<Home benchmarkData={benchmarkData} />}
133 />
134 <Route
135 path="/"
136 element={<Home benchmarkData={benchmarkData} />}
137 />
138 <Route
139 path="/datasets"
140 element={<Datasets datasets={benchmarkData?.datasets || []} />}
141 />
142 <Route
143 path="/algorithms"
144 element={
145 <Algorithms algorithms={benchmarkData?.algorithms || []} />
146 }
147 />
a09013dupload dataset .jsonJeremy Magland 148 <Route
149 path="/dataset/:datasetName"
3b1d188improve uiJeremy Magland 150 element={
151 <Dataset
152 datasets={benchmarkData?.datasets || []}
153 benchmarkData={benchmarkData}
154 />
155 }
a09013dupload dataset .jsonJeremy Magland 156 />
0602a7eui improvementsJeremy Magland 157 <Route
158 path="/algorithm/:algorithmName"
159 element={
3b1d188improve uiJeremy Magland 160 <Algorithm
161 algorithms={benchmarkData?.algorithms || []}
162 benchmarkData={benchmarkData}
163 />
0602a7eui improvementsJeremy Magland 164 }
165 />
6c17da5about pageJeremy Magland 166 <Route path="/about" element={<About />} />
0968553routingJeremy Magland 167 </Routes>
168 )}
85d3449pagesJeremy Magland 169 </main>
170 </div>
171 </BrowserRouter>
a4762faweb-uiJeremy Magland 172 );
175export default App;
moveopenescclose