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