/ concept-collection / benchcompress
Sign in
concept-collection / benchcompress
benchcompress / web-ui / src / App.tsx
184 lines · 5.3 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";
0092283paper pageJeremy Magland 8import Paper from "./pages/Paper";
3a8e918monitorJeremy Magland 9import Monitor from "./pages/Monitor";
eba1648submit instructionsJeremy Magland 10import Submit from "./pages/Submit";
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 (
eba1648submit instructionsJeremy 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>
146 </div>
bde0876rearrange tabsJeremy Magland 147 </div>
85d3449pagesJeremy Magland 148 </nav>
149 <main>
0968553routingJeremy Magland 150 {isLoading ? (
151 <div>Loading benchmark data...</div>
152 ) : error ? (
153 <div>Error: {error}</div>
154 ) : (
155 <Routes>
3e91ba2add home pageJeremy Magland 156 <Route path="/" element={<Home />} />
0968553routingJeremy Magland 157 <Route
158 path="/datasets"
3e91ba2add home pageJeremy Magland 159 element={<BenchmarkView benchmarkData={benchmarkData} />}
0968553routingJeremy Magland 160 />
161 <Route
162 path="/algorithms"
3e91ba2add home pageJeremy Magland 163 element={<BenchmarkView benchmarkData={benchmarkData} />}
0968553routingJeremy Magland 164 />
a09013dupload dataset .jsonJeremy Magland 165 <Route
166 path="/dataset/:datasetName"
3e91ba2add home pageJeremy Magland 167 element={<BenchmarkView benchmarkData={benchmarkData} />}
a09013dupload dataset .jsonJeremy Magland 168 />
0602a7eui improvementsJeremy Magland 169 <Route
170 path="/algorithm/:algorithmName"
3e91ba2add home pageJeremy Magland 171 element={<BenchmarkView benchmarkData={benchmarkData} />}
0602a7eui improvementsJeremy Magland 172 />
0092283paper pageJeremy Magland 173 <Route path="/paper" element={<Paper />} />
3a8e918monitorJeremy Magland 174 <Route path="/monitor" element={<Monitor />} />
eba1648submit instructionsJeremy Magland 175 <Route path="/submit" element={<Submit />} />
0968553routingJeremy Magland 176 </Routes>
177 )}
85d3449pagesJeremy Magland 178 </main>
179 </div>
180 </BrowserRouter>
a4762faweb-uiJeremy Magland 181 );
184export default App;
moveopenescclose