update UI
3 changed files+44−31
web-ui/src/App.tsxmodified+12−2View file
@@ -38,8 +38,18 @@ function App() {
3838
3939 return (
4040 <BrowserRouter basename="/zia">
41- <div style={{ padding: "2rem" }}>
42- <nav style={{ marginBottom: "2rem" }}>
41+ <div style={{ paddingTop: "5rem", paddingLeft: "2rem", paddingRight: "2rem", paddingBottom: "2rem" }}>
42+ <nav style={{
43+ position: "fixed",
44+ top: 0,
45+ left: 0,
46+ right: 0,
47+ padding: "1rem 2rem",
48+ backgroundColor: "white",
49+ borderBottom: "1px solid #eaeaea",
50+ zIndex: 1000,
51+ boxShadow: "0 2px 4px rgba(0,0,0,0.1)"
52+ }}>
4353 <ul
4454 style={{
4555 listStyle: "none",
web-ui/src/components/benchmark/table/BenchmarkTable.tsxmodified+31−28View file
@@ -146,34 +146,6 @@ export function BenchmarkTable({ results }: BenchmarkTableProps) {
146146 </select>
147147 </div>
148148 </div>
149- <button
150- onClick={() =>
151- exportToCsv(filteredData, selectedDataset || selectedAlgorithm)
152- }
153- style={{
154- padding: "8px 16px",
155- backgroundColor: "#4CAF50",
156- color: "white",
157- border: "none",
158- borderRadius: "4px",
159- cursor: "pointer",
160- display: "flex",
161- alignItems: "center",
162- gap: "8px",
163- }}
164- >
165- <svg
166- width="16"
167- height="16"
168- viewBox="0 0 16 16"
169- fill="none"
170- xmlns="http://www.w3.org/2000/svg"
171- >
172- <path d="M8 12L3 7H6V1H10V7H13L8 12Z" fill="currentColor" />
173- <path d="M2 14V15H14V14H2Z" fill="currentColor" />
174- </svg>
175- Download CSV
176- </button>
177149 </div>
178150
179151 {(selectedDataset || selectedAlgorithm) && chartData.length > 0 && (
@@ -216,6 +188,37 @@ export function BenchmarkTable({ results }: BenchmarkTableProps) {
216188 ))}
217189 </tbody>
218190 </table>
191+
192+ <div style={{ marginTop: "20px", display: "flex", justifyContent: "flex-end" }}>
193+ <button
194+ onClick={() =>
195+ exportToCsv(filteredData, selectedDataset || selectedAlgorithm)
196+ }
197+ style={{
198+ padding: "8px 16px",
199+ backgroundColor: "#4CAF50",
200+ color: "white",
201+ border: "none",
202+ borderRadius: "4px",
203+ cursor: "pointer",
204+ display: "flex",
205+ alignItems: "center",
206+ gap: "8px",
207+ }}
208+ >
209+ <svg
210+ width="16"
211+ height="16"
212+ viewBox="0 0 16 16"
213+ fill="none"
214+ xmlns="http://www.w3.org/2000/svg"
215+ >
216+ <path d="M8 12L3 7H6V1H10V7H13L8 12Z" fill="currentColor" />
217+ <path d="M2 14V15H14V14H2Z" fill="currentColor" />
218+ </svg>
219+ Download CSV
220+ </button>
221+ </div>
219222 </div>
220223 );
221224 }
web-ui/src/components/benchmark/table/columns.tsxmodified+1−1View file
@@ -15,7 +15,7 @@ export const columns = [
1515 }),
1616 columnHelper.accessor("compression_ratio", {
1717 header: "Compression Ratio",
18- cell: (info) => `${formatNumber(info.getValue())}x`,
18+ cell: (info) => `${formatNumber(info.getValue())}`,
1919 sortingFn: (rowA, rowB) => {
2020 const a = rowA.original.compression_ratio;
2121 const b = rowB.original.compression_ratio;