3e91ba2add home pageJeremy Magland 1import { BrowserRouter, Routes, Route, Link } from "react-router-dom";
3import axios from "axios";
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 27 `https://tempory.net/f/memobin/benchcompress/global/results.json?cachebust=${cacheBust}`,
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 }, []);
47 style={{
49 padding: "3rem 2rem 2rem 2rem",
51 >
52 <nav
53 style={{
54 position: "fixed",
55 top: 0,
56 left: 0,
57 right: 0,
60 zIndex: 1000,
61 }}
62 >
64 style={{
65 display: "flex",
66 justifyContent: "space-between",
67 alignItems: "center",
68 minHeight: "32px",
69 }}
70 >
71 <Link
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
113 </span>
114 </span>
115 </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>
138 to="/paper"
139 style={{
140 color: "#0066cc",
141 textDecoration: "none",
142 fontWeight: "500",
143 }}
144 >
145 Paper
146 </Link>
147 </div>
150 <main>
152 <div>Loading benchmark data...</div>
153 ) : error ? (
154 <div>Error: {error}</div>
155 ) : (
156 <Routes>
159 path="/datasets"
162 <Route
163 path="/algorithms"
167 path="/dataset/:datasetName"
171 path="/algorithm/:algorithmName"
178 )}
180 </div>
181 </BrowserRouter>
183}
185export default App;