/ concept-collection / benchcompress
Sign in
concept-collection / benchcompress
benchcompress / web-ui / src / App.tsx
185 lines · 5.4 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);
47f2554cachebustJeremy Magland 25 const cacheBust = Math.random().toString(36).substring(2, 15);
0968553routingJeremy Magland 26 const response = await axios.get(
47f2554cachebustJeremy Magland 27 `https://tempory.net/f/memobin/benchcompress/global/results.json?cachebust=${cacheBust}`,
0968553routingJeremy Magland 28 );
29 setBenchmarkData(response.data);
30 } catch (error) {
31 const message =
32 error instanceof Error ? error.message : "Failed to fetch data";
33 setError(message);
34 console.error("Error fetching benchmark data:", error);
35 } finally {
36 setIsLoading(false);
37 }
38 };
40 fetchData();
41 }, []);
a4762faweb-uiJeremy Magland 43 return (
eba1648submit instructionsJeremy Magland 44 <BrowserRouter basename="/benchcompress/">
4cc92d1incr version of algJeremy Magland 45 <ScrollToTop />
a3cad9bformat codeJeremy Magland 46 <div
47 style={{
104f442improve layoutJeremy Magland 48 paddingTop: "3rem",
49 padding: "3rem 2rem 2rem 2rem",
a3cad9bformat codeJeremy Magland 50 }}
51 >
52 <nav
53 style={{
54 position: "fixed",
55 top: 0,
56 left: 0,
57 right: 0,
104f442improve layoutJeremy Magland 58 padding: "0.35rem min(2rem, 4%)",
a3cad9bformat codeJeremy Magland 59 backgroundColor: "white",
60 zIndex: 1000,
61 }}
62 >
104f442improve layoutJeremy Magland 63 <div
64 style={{
65 display: "flex",
66 justifyContent: "space-between",
67 alignItems: "center",
68 minHeight: "32px",
69 }}
70 >
71 <Link
3e91ba2add home pageJeremy Magland 72 to="/"
104f442improve layoutJeremy Magland 73 style={{
74 display: "flex",
75 alignItems: "center",
76 textDecoration: "none",
77 minWidth: 0,
78 maxWidth: "calc(100% - 80px)",
79 }}
80 >
81 <img
82 src="/benchcompress/logo.svg"
83 alt="Benchcompress Logo"
84 style={{
85 width: "28px",
86 height: "28px",
87 marginRight: "10px",
88 flexShrink: 0,
89 }}
90 />
91 <span
92 style={{
93 minWidth: 0,
94 whiteSpace: "nowrap",
95 overflow: "hidden",
96 textOverflow: "ellipsis",
97 }}
98 >
99 <span
100 style={{
101 fontSize: "1rem",
102 fontWeight: "500",
103 color: "#2c2c2c",
104 }}
105 >
106 Benchcompress
107 </span>
108 <span className="app-header-subtitle">
109 {" · "}
110 <span style={{ fontSize: "1rem", color: "#777" }}>
93dd44areorganize datasets and algs, add seismicJeremy Magland 111 Comparing compression algorithms for scientific data arrays
104f442improve layoutJeremy Magland 112 </span>
113 </span>
114 </span>
115 </Link>
0092283paper pageJeremy Magland 116 <div style={{ display: "flex", gap: "1.5rem" }}>
3e91ba2add home pageJeremy Magland 117 <Link
118 to="/datasets"
119 style={{
120 color: "#0066cc",
121 textDecoration: "none",
122 fontWeight: "500",
123 }}
124 >
125 Datasets
126 </Link>
127 <Link
128 to="/algorithms"
129 style={{
130 color: "#0066cc",
131 textDecoration: "none",
132 fontWeight: "500",
133 }}
134 >
135 Algorithms
136 </Link>
0092283paper pageJeremy Magland 137 <Link
138 to="/paper"
139 style={{
140 color: "#0066cc",
141 textDecoration: "none",
142 fontWeight: "500",
143 }}
144 >
145 Paper
146 </Link>
147 </div>
bde0876rearrange tabsJeremy Magland 148 </div>
85d3449pagesJeremy Magland 149 </nav>
150 <main>
0968553routingJeremy Magland 151 {isLoading ? (
152 <div>Loading benchmark data...</div>
153 ) : error ? (
154 <div>Error: {error}</div>
155 ) : (
156 <Routes>
3e91ba2add home pageJeremy Magland 157 <Route path="/" element={<Home />} />
0968553routingJeremy Magland 158 <Route
159 path="/datasets"
3e91ba2add home pageJeremy Magland 160 element={<BenchmarkView benchmarkData={benchmarkData} />}
0968553routingJeremy Magland 161 />
162 <Route
163 path="/algorithms"
3e91ba2add home pageJeremy Magland 164 element={<BenchmarkView benchmarkData={benchmarkData} />}
0968553routingJeremy Magland 165 />
a09013dupload dataset .jsonJeremy Magland 166 <Route
167 path="/dataset/:datasetName"
3e91ba2add home pageJeremy Magland 168 element={<BenchmarkView benchmarkData={benchmarkData} />}
a09013dupload dataset .jsonJeremy Magland 169 />
0602a7eui improvementsJeremy Magland 170 <Route
171 path="/algorithm/:algorithmName"
3e91ba2add home pageJeremy Magland 172 element={<BenchmarkView benchmarkData={benchmarkData} />}
0602a7eui improvementsJeremy Magland 173 />
0092283paper pageJeremy Magland 174 <Route path="/paper" element={<Paper />} />
3a8e918monitorJeremy Magland 175 <Route path="/monitor" element={<Monitor />} />
eba1648submit instructionsJeremy Magland 176 <Route path="/submit" element={<Submit />} />
0968553routingJeremy Magland 177 </Routes>
178 )}
85d3449pagesJeremy Magland 179 </main>
180 </div>
181 </BrowserRouter>
a4762faweb-uiJeremy Magland 182 );
185export default App;
moveopenescclose