/ concept-collection / benchcompress
Sign in
concept-collection / benchcompress
0602a7e
Branches
mainbenchmark-results
benchcompress / web-ui / src / pages / Datasets.tsx
227 lines · 6.6 KBCodeBlameHistory
0968553routingJeremy Magland 1import { Dataset } from "../types";
6c17da5about pageJeremy Magland 2import { Link } from "react-router-dom";
0602a7eui improvementsJeremy Magland 3import { TagFilter } from "../components/TagFilter";
4import { useTagFilter } from "../hooks/useTagFilter";
0968553routingJeremy Magland 5
6interface DatasetsProps {
7 datasets: Dataset[];
8}
10function Datasets({ datasets }: DatasetsProps) {
0602a7eui improvementsJeremy Magland 11 const {
12 selectedTags,
13 availableTags,
14 filteredItems: filteredDatasets,
15 toggleTag,
16 } = useTagFilter(datasets);
85d3449pagesJeremy Magland 18 return (
19 <div>
0602a7eui improvementsJeremy Magland 20 <div style={{ marginBottom: "2rem" }}>
21 <h1
22 style={{
23 fontSize: "2rem",
24 fontWeight: "bold",
25 color: "#333",
26 marginBottom: "1rem",
27 }}
28 >
29 Benchmark Datasets
30 </h1>
31 <TagFilter
32 availableTags={availableTags}
33 selectedTags={selectedTags}
34 onTagToggle={toggleTag}
35 label="Filter datasets"
36 />
37 </div>
0968553routingJeremy Magland 38 <div style={{ overflowX: "auto" }}>
39 <table style={{ width: "100%", borderCollapse: "collapse" }}>
40 <thead>
41 <tr style={{ backgroundColor: "#f5f5f5" }}>
42 <th
43 style={{
a3cad9bformat codeJeremy Magland 44 padding: "8px 12px",
0968553routingJeremy Magland 45 textAlign: "left",
a3cad9bformat codeJeremy Magland 46 borderBottom: "1px solid #ddd",
47 fontSize: "0.9rem",
48 whiteSpace: "nowrap",
0968553routingJeremy Magland 49 }}
50 >
51 Name
52 </th>
53 <th
54 style={{
a3cad9bformat codeJeremy Magland 55 padding: "8px 12px",
0968553routingJeremy Magland 56 textAlign: "left",
a3cad9bformat codeJeremy Magland 57 borderBottom: "1px solid #ddd",
58 fontSize: "0.9rem",
59 whiteSpace: "nowrap",
0968553routingJeremy Magland 60 }}
61 >
62 Version
63 </th>
64 <th
65 style={{
a3cad9bformat codeJeremy Magland 66 padding: "8px 12px",
0968553routingJeremy Magland 67 textAlign: "left",
a3cad9bformat codeJeremy Magland 68 borderBottom: "1px solid #ddd",
69 fontSize: "0.9rem",
70 whiteSpace: "nowrap",
0968553routingJeremy Magland 71 }}
72 >
73 Description
74 </th>
75 <th
76 style={{
a3cad9bformat codeJeremy Magland 77 padding: "8px 12px",
0968553routingJeremy Magland 78 textAlign: "left",
a3cad9bformat codeJeremy Magland 79 borderBottom: "1px solid #ddd",
80 fontSize: "0.9rem",
81 whiteSpace: "nowrap",
0968553routingJeremy Magland 82 }}
83 >
84 Tags
85 </th>
db4e6b9links to source codeJeremy Magland 86 <th
87 style={{
a3cad9bformat codeJeremy Magland 88 padding: "8px 12px",
db4e6b9links to source codeJeremy Magland 89 textAlign: "left",
a3cad9bformat codeJeremy Magland 90 borderBottom: "1px solid #ddd",
91 fontSize: "0.9rem",
92 whiteSpace: "nowrap",
db4e6b9links to source codeJeremy Magland 93 }}
94 >
95 Source
96 </th>
b0521c0upload datasetsJeremy Magland 97 <th
98 style={{
99 padding: "8px 12px",
100 textAlign: "left",
101 borderBottom: "1px solid #ddd",
102 fontSize: "0.9rem",
103 whiteSpace: "nowrap",
104 }}
105 >
106 Data
107 </th>
0968553routingJeremy Magland 108 </tr>
109 </thead>
110 <tbody>
0602a7eui improvementsJeremy Magland 111 {filteredDatasets.map((dataset, index) => (
0968553routingJeremy Magland 112 <tr
113 key={`${dataset.name}-${dataset.version}`}
114 style={{
115 backgroundColor: index % 2 === 0 ? "white" : "#fafafa",
116 }}
117 >
a3cad9bformat codeJeremy Magland 118 <td
119 style={{
120 padding: "6px 12px",
121 borderBottom: "1px solid #ddd",
122 fontSize: "0.9rem",
123 }}
124 >
6c17da5about pageJeremy Magland 125 <Link
a09013dupload dataset .jsonJeremy Magland 126 to={`/dataset/${encodeURIComponent(dataset.name)}`}
6c17da5about pageJeremy Magland 127 style={{
128 color: "#0066cc",
129 textDecoration: "none",
130 fontWeight: "500",
131 }}
132 >
133 {dataset.name}
134 </Link>
0968553routingJeremy Magland 135 </td>
a3cad9bformat codeJeremy Magland 136 <td
137 style={{
138 padding: "6px 12px",
139 borderBottom: "1px solid #ddd",
140 fontSize: "0.9rem",
141 }}
142 >
0968553routingJeremy Magland 143 {dataset.version}
144 </td>
a3cad9bformat codeJeremy Magland 145 <td
146 style={{
147 padding: "6px 12px",
148 borderBottom: "1px solid #ddd",
149 fontSize: "0.9rem",
150 }}
151 >
0968553routingJeremy Magland 152 {dataset.description}
153 </td>
a3cad9bformat codeJeremy Magland 154 <td
155 style={{
156 padding: "6px 12px",
157 borderBottom: "1px solid #ddd",
158 fontSize: "0.9rem",
159 }}
160 >
0968553routingJeremy Magland 161 {dataset.tags.map((tag) => (
162 <span
163 key={tag}
164 style={{
165 display: "inline-block",
166 backgroundColor: "#e1e1e1",
a3cad9bformat codeJeremy Magland 167 padding: "2px 6px",
168 borderRadius: "3px",
169 margin: "1px",
170 fontSize: "0.8rem",
0968553routingJeremy Magland 171 }}
172 >
173 {tag}
174 </span>
175 ))}
176 </td>
a3cad9bformat codeJeremy Magland 177 <td
178 style={{
179 padding: "6px 12px",
180 borderBottom: "1px solid #ddd",
181 fontSize: "0.9rem",
182 }}
183 >
db4e6b9links to source codeJeremy Magland 184 {dataset.source_file && (
185 <a
186 href={dataset.source_file}
187 target="_blank"
188 rel="noopener noreferrer"
189 style={{
190 color: "#0066cc",
191 textDecoration: "none",
192 }}
193 >
194 View Source
195 </a>
196 )}
197 </td>
b0521c0upload datasetsJeremy Magland 198 <td
199 style={{
200 padding: "6px 12px",
201 borderBottom: "1px solid #ddd",
202 fontSize: "0.9rem",
203 }}
204 >
447f8f1upload .npy fileJeremy Magland 205 {dataset.data_url_npy && (
b0521c0upload datasetsJeremy Magland 206 <a
447f8f1upload .npy fileJeremy Magland 207 href={dataset.data_url_npy}
208 download={`${dataset.name}-${dataset.version}.npy`}
b0521c0upload datasetsJeremy Magland 209 style={{
210 color: "#0066cc",
211 textDecoration: "none",
212 }}
213 >
214 Download
215 </a>
216 )}
217 </td>
0968553routingJeremy Magland 218 </tr>
219 ))}
220 </tbody>
221 </table>
85d3449pagesJeremy Magland 222 </div>
223 </div>
224 );
227export default Datasets;
↑↓ move↵openescclose