/ concept-collection / benchcompress
Sign in
concept-collection / benchcompress
380af32
Branches
mainbenchmark-results
benchcompress / web-ui / src / App.tsx
204 lines · 5.8 KBCodeBlameHistory
3e91ba2add home pageJeremy Magland 1import { BrowserRouter, Routes, Route, Link } from "react-router-dom";
0968553routingJeremy Magland 2import { useEffect, useState } from "react";
3import axios from "axios";
4cc92d1incr version of algJeremy Magland 4import { ScrollToTop } from "./components/ScrollToTop";
104f442improve layoutJeremy Magland 5import "./components/AppHeader.css";
85d3449pagesJeremy Magland 6import Home from "./pages/Home";
3e91ba2add home pageJeremy Magland 7import BenchmarkView from "./pages/BenchmarkView";
6c17da5about pageJeremy Magland 8import About from "./pages/About";
0092283paper pageJeremy Magland 9import Paper from "./pages/Paper";
3a8e918monitorJeremy Magland 10import Monitor from "./pages/Monitor";
0968553routingJeremy Magland 11import { BenchmarkData } from "./types";
a4762faweb-uiJeremy Magland 12
13function App() {
0968553routingJeremy Magland 14 const [benchmarkData, setBenchmarkData] = useState<BenchmarkData | null>(
15 null,
16 );
17 const [isLoading, setIsLoading] = useState(true);
18 const [error, setError] = useState<string | null>(null);
20 useEffect(() => {
21 const fetchData = async () => {
22 try {
23 setIsLoading(true);
24 setError(null);
25 const response = await axios.get(
17f0f3aget results from memobinJeremy Magland 26 "https://tempory.net/f/memobin/benchcompress/global/results.json",
0968553routingJeremy Magland 27 );
28 setBenchmarkData(response.data);
29 } catch (error) {
30 const message =
31 error instanceof Error ? error.message : "Failed to fetch data";
32 setError(message);
33 console.error("Error fetching benchmark data:", error);
34 } finally {
35 setIsLoading(false);
36 }
37 };
39 fetchData();
40 }, []);
a4762faweb-uiJeremy Magland 42 return (
7884e06rename to benchcompressJeremy Magland 43 <BrowserRouter basename="/benchcompress">
4cc92d1incr version of algJeremy Magland 44 <ScrollToTop />
a3cad9bformat codeJeremy Magland 45 <div
46 style={{
104f442improve layoutJeremy Magland 47 paddingTop: "3rem",
48 padding: "3rem 2rem 2rem 2rem",
a3cad9bformat codeJeremy Magland 49 }}
50 >
51 <nav
52 style={{
53 position: "fixed",
54 top: 0,
55 left: 0,
56 right: 0,
104f442improve layoutJeremy Magland 57 padding: "0.35rem min(2rem, 4%)",
a3cad9bformat codeJeremy Magland 58 backgroundColor: "white",
59 zIndex: 1000,
60 }}
61 >
104f442improve layoutJeremy Magland 62 <div
63 style={{
64 display: "flex",
65 justifyContent: "space-between",
66 alignItems: "center",
67 minHeight: "32px",
68 }}
69 >
70 <Link
3e91ba2add home pageJeremy Magland 71 to="/"
104f442improve layoutJeremy Magland 72 style={{
73 display: "flex",
74 alignItems: "center",
75 textDecoration: "none",
76 minWidth: 0,
77 maxWidth: "calc(100% - 80px)",
78 }}
79 >
80 <img
81 src="/benchcompress/logo.svg"
82 alt="Benchcompress Logo"
83 style={{
84 width: "28px",
85 height: "28px",
86 marginRight: "10px",
87 flexShrink: 0,
88 }}
89 />
90 <span
91 style={{
92 minWidth: 0,
93 whiteSpace: "nowrap",
94 overflow: "hidden",
95 textOverflow: "ellipsis",
96 }}
97 >
98 <span
99 style={{
100 fontSize: "1rem",
101 fontWeight: "500",
102 color: "#2c2c2c",
103 }}
104 >
105 Benchcompress
106 </span>
107 <span className="app-header-subtitle">
108 {" · "}
109 <span style={{ fontSize: "1rem", color: "#777" }}>
93dd44areorganize datasets and algs, add seismicJeremy Magland 110 Comparing compression algorithms for scientific data arrays
104f442improve layoutJeremy Magland 111 </span>
112 </span>
113 </span>
114 </Link>
0092283paper pageJeremy Magland 115 <div style={{ display: "flex", gap: "1.5rem" }}>
3e91ba2add home pageJeremy Magland 116 <Link
117 to="/datasets"
118 style={{
119 color: "#0066cc",
120 textDecoration: "none",
121 fontWeight: "500",
122 }}
123 >
124 Datasets
125 </Link>
126 <Link
127 to="/algorithms"
128 style={{
129 color: "#0066cc",
130 textDecoration: "none",
131 fontWeight: "500",
132 }}
133 >
134 Algorithms
135 </Link>
0092283paper pageJeremy Magland 136 <Link
137 to="/paper"
138 style={{
139 color: "#0066cc",
140 textDecoration: "none",
141 fontWeight: "500",
142 }}
143 >
144 Paper
145 </Link>
3a8e918monitorJeremy Magland 146 <Link
147 to="/monitor"
148 style={{
149 color: "#0066cc",
150 textDecoration: "none",
151 fontWeight: "500",
152 }}
153 >
154 Monitor
155 </Link>
0092283paper pageJeremy Magland 156 <Link
157 to="/about"
158 style={{
159 color: "#0066cc",
160 textDecoration: "none",
161 fontWeight: "500",
162 }}
163 >
164 About
165 </Link>
166 </div>
bde0876rearrange tabsJeremy Magland 167 </div>
85d3449pagesJeremy Magland 168 </nav>
169 <main>
0968553routingJeremy Magland 170 {isLoading ? (
171 <div>Loading benchmark data...</div>
172 ) : error ? (
173 <div>Error: {error}</div>
174 ) : (
175 <Routes>
3e91ba2add home pageJeremy Magland 176 <Route path="/" element={<Home />} />
0968553routingJeremy Magland 177 <Route
178 path="/datasets"
3e91ba2add home pageJeremy Magland 179 element={<BenchmarkView benchmarkData={benchmarkData} />}
0968553routingJeremy Magland 180 />
181 <Route
182 path="/algorithms"
3e91ba2add home pageJeremy Magland 183 element={<BenchmarkView benchmarkData={benchmarkData} />}
0968553routingJeremy Magland 184 />
a09013dupload dataset .jsonJeremy Magland 185 <Route
186 path="/dataset/:datasetName"
3e91ba2add home pageJeremy Magland 187 element={<BenchmarkView benchmarkData={benchmarkData} />}
a09013dupload dataset .jsonJeremy Magland 188 />
0602a7eui improvementsJeremy Magland 189 <Route
190 path="/algorithm/:algorithmName"
3e91ba2add home pageJeremy Magland 191 element={<BenchmarkView benchmarkData={benchmarkData} />}
0602a7eui improvementsJeremy Magland 192 />
6c17da5about pageJeremy Magland 193 <Route path="/about" element={<About />} />
0092283paper pageJeremy Magland 194 <Route path="/paper" element={<Paper />} />
3a8e918monitorJeremy Magland 195 <Route path="/monitor" element={<Monitor />} />
0968553routingJeremy Magland 196 </Routes>
197 )}
85d3449pagesJeremy Magland 198 </main>
199 </div>
200 </BrowserRouter>
a4762faweb-uiJeremy Magland 201 );
204export default App;
↑↓ move↵openescclose