/ concept-collection / benchcompress
Sign in
concept-collection / benchcompress
cd2b036
Branches
mainbenchmark-results
benchcompress / web-ui / src / App.tsx
174 lines · 5.0 KBCodeBlameHistory
bde0876rearrange tabsJeremy Magland 1import { BrowserRouter, Routes, Route, Link, Navigate } 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";
6c17da5about pageJeremy Magland 7import About from "./pages/About";
0092283paper pageJeremy Magland 8import Paper from "./pages/Paper";
0968553routingJeremy Magland 9import { BenchmarkData } from "./types";
a4762faweb-uiJeremy Magland 10
11function App() {
0968553routingJeremy Magland 12 const [benchmarkData, setBenchmarkData] = useState<BenchmarkData | null>(
13 null,
14 );
15 const [isLoading, setIsLoading] = useState(true);
16 const [error, setError] = useState<string | null>(null);
18 useEffect(() => {
19 const fetchData = async () => {
20 try {
21 setIsLoading(true);
22 setError(null);
23 const response = await axios.get(
7884e06rename to benchcompressJeremy Magland 24 "https://raw.githubusercontent.com/magland/benchcompress/benchmark-results/benchmark_results/results.json",
0968553routingJeremy Magland 25 );
26 setBenchmarkData(response.data);
27 } catch (error) {
28 const message =
29 error instanceof Error ? error.message : "Failed to fetch data";
30 setError(message);
31 console.error("Error fetching benchmark data:", error);
32 } finally {
33 setIsLoading(false);
34 }
35 };
37 fetchData();
38 }, []);
a4762faweb-uiJeremy Magland 40 return (
7884e06rename to benchcompressJeremy Magland 41 <BrowserRouter basename="/benchcompress">
4cc92d1incr version of algJeremy Magland 42 <ScrollToTop />
a3cad9bformat codeJeremy Magland 43 <div
44 style={{
104f442improve layoutJeremy Magland 45 paddingTop: "3rem",
46 padding: "3rem 2rem 2rem 2rem",
a3cad9bformat codeJeremy Magland 47 }}
48 >
49 <nav
50 style={{
51 position: "fixed",
52 top: 0,
53 left: 0,
54 right: 0,
104f442improve layoutJeremy Magland 55 padding: "0.35rem min(2rem, 4%)",
a3cad9bformat codeJeremy Magland 56 backgroundColor: "white",
104f442improve layoutJeremy Magland 57 // borderBottom: "1px solid #eaeaea",
a3cad9bformat codeJeremy Magland 58 zIndex: 1000,
104f442improve layoutJeremy Magland 59 // boxShadow: "0 2px 4px rgba(0,0,0,0.1)",
a3cad9bformat codeJeremy Magland 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
71 to="/datasets"
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" }}>
cd2b036timeseriesJeremy Magland 110 Comparing compression algorithms for numeric time series
111 data
104f442improve layoutJeremy Magland 112 </span>
113 </span>
114 </span>
115 </Link>
0092283paper pageJeremy Magland 116 <div style={{ display: "flex", gap: "1.5rem" }}>
117 <Link
118 to="/paper"
119 style={{
120 color: "#0066cc",
121 textDecoration: "none",
122 fontWeight: "500",
123 }}
124 >
125 Paper
126 </Link>
127 <Link
128 to="/about"
129 style={{
130 color: "#0066cc",
131 textDecoration: "none",
132 fontWeight: "500",
133 }}
134 >
135 About
136 </Link>
137 </div>
bde0876rearrange tabsJeremy Magland 138 </div>
85d3449pagesJeremy Magland 139 </nav>
140 <main>
0968553routingJeremy Magland 141 {isLoading ? (
142 <div>Loading benchmark data...</div>
143 ) : error ? (
144 <div>Error: {error}</div>
145 ) : (
146 <Routes>
bde0876rearrange tabsJeremy Magland 147 <Route path="/" element={<Navigate to="/datasets" replace />} />
0968553routingJeremy Magland 148 <Route
149 path="/datasets"
bde0876rearrange tabsJeremy Magland 150 element={<Home benchmarkData={benchmarkData} />}
0968553routingJeremy Magland 151 />
152 <Route
153 path="/algorithms"
bde0876rearrange tabsJeremy Magland 154 element={<Home benchmarkData={benchmarkData} />}
0968553routingJeremy Magland 155 />
a09013dupload dataset .jsonJeremy Magland 156 <Route
157 path="/dataset/:datasetName"
bde0876rearrange tabsJeremy Magland 158 element={<Home benchmarkData={benchmarkData} />}
a09013dupload dataset .jsonJeremy Magland 159 />
0602a7eui improvementsJeremy Magland 160 <Route
161 path="/algorithm/:algorithmName"
bde0876rearrange tabsJeremy Magland 162 element={<Home benchmarkData={benchmarkData} />}
0602a7eui improvementsJeremy Magland 163 />
6c17da5about pageJeremy Magland 164 <Route path="/about" element={<About />} />
0092283paper pageJeremy Magland 165 <Route path="/paper" element={<Paper />} />
0968553routingJeremy Magland 166 </Routes>
167 )}
85d3449pagesJeremy Magland 168 </main>
169 </div>
170 </BrowserRouter>
a4762faweb-uiJeremy Magland 171 );
174export default App;
↑↓ move↵openescclose