Skip to content

Commit ba0b3ef

Browse files
author
Dylan Huang
committed
debounce
1 parent f90d632 commit ba0b3ef

7 files changed

Lines changed: 96 additions & 50 deletions

File tree

vite-app/dist/assets/index-DDh9s5qV.css renamed to vite-app/dist/assets/index-CpScNe1P.css

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

vite-app/dist/assets/index-DlnciKZd.js renamed to vite-app/dist/assets/index-dHlKwEPE.js

Lines changed: 21 additions & 21 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

vite-app/dist/assets/index-DlnciKZd.js.map renamed to vite-app/dist/assets/index-dHlKwEPE.js.map

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎vite-app/dist/index.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@
55
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
66
<title>EP | Log Viewer</title>
77
<link rel="icon" href="/assets/favicon-BkAAWQga.png" />
8-
<script type="module" crossorigin src="/assets/index-DlnciKZd.js"></script>
9-
<link rel="stylesheet" crossorigin href="/assets/index-DDh9s5qV.css">
8+
<script type="module" crossorigin src="/assets/index-dHlKwEPE.js"></script>
9+
<link rel="stylesheet" crossorigin href="/assets/index-CpScNe1P.css">
1010
</head>
1111
<body>
1212
<div id="root"></div>

‎vite-app/src/components/Dashboard.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -101,7 +101,7 @@ const Dashboard = observer(({ onRefresh }: DashboardProps) => {
101101
{/* Content Area */}
102102
{state.isLoading ? (
103103
<LoadingState />
104-
) : state.totalCount === 0 ? (
104+
) : state.sortedDataset.length === 0 ? (
105105
<EmptyState onRefresh={onRefresh} />
106106
) : (
107107
<div className="bg-white border border-gray-200">

‎vite-app/src/components/EvaluationTable.tsx‎

Lines changed: 34 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -142,28 +142,41 @@ export const EvaluationTable = observer(() => {
142142
</div>
143143

144144
{/* Table Container - Only this area scrolls */}
145-
<div className="overflow-x-auto">
146-
<table className="w-full min-w-max">
147-
{/* Table Header */}
148-
<TableHead>
149-
<tr>
150-
<TableHeader className="w-8">&nbsp;</TableHeader>
151-
<TableHeader>Name</TableHeader>
152-
<TableHeader>Status</TableHeader>
153-
<TableHeader>Rollout ID</TableHeader>
154-
<TableHeader>Model</TableHeader>
155-
<TableHeader>Score</TableHeader>
156-
<TableHeader>Created</TableHeader>
157-
</tr>
158-
</TableHead>
145+
{totalRows === 0 ? (
146+
<div className="px-3 py-6 text-center text-xs text-gray-600">
147+
<div className="mb-2">No rows match your current filters.</div>
148+
<Button
149+
onClick={() => handleFiltersChange([])}
150+
size="sm"
151+
variant="secondary"
152+
>
153+
Clear filters
154+
</Button>
155+
</div>
156+
) : (
157+
<div className="overflow-x-auto">
158+
<table className="w-full min-w-max">
159+
{/* Table Header */}
160+
<TableHead>
161+
<tr>
162+
<TableHeader className="w-8">&nbsp;</TableHeader>
163+
<TableHeader>Name</TableHeader>
164+
<TableHeader>Status</TableHeader>
165+
<TableHeader>Rollout ID</TableHeader>
166+
<TableHeader>Model</TableHeader>
167+
<TableHeader>Score</TableHeader>
168+
<TableHeader>Created</TableHeader>
169+
</tr>
170+
</TableHead>
159171

160-
{/* Table Body */}
161-
<TableBody
162-
currentPage={state.currentPage}
163-
pageSize={state.pageSize}
164-
/>
165-
</table>
166-
</div>
172+
{/* Table Body */}
173+
<TableBody
174+
currentPage={state.currentPage}
175+
pageSize={state.pageSize}
176+
/>
177+
</table>
178+
</div>
179+
)}
167180
</div>
168181
);
169182
});

‎vite-app/src/components/FilterInput.tsx‎

Lines changed: 36 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React from "react";
1+
import React, { useEffect, useRef, useState } from "react";
22
import type { FilterConfig } from "../types/filters";
33
import { commonStyles } from "../styles/common";
44

@@ -34,11 +34,44 @@ const FilterInput = ({ filter, onUpdate }: FilterInputProps) => {
3434
);
3535
}
3636

37+
// Debounced text input to reduce re-renders while typing
38+
const [localValue, setLocalValue] = useState<string>(filter.value || "");
39+
const debounceTimer = useRef<ReturnType<typeof setTimeout> | null>(null);
40+
41+
// Keep local state in sync when external value changes (e.g., clearing filters)
42+
useEffect(() => {
43+
setLocalValue(filter.value || "");
44+
}, [filter.value]);
45+
46+
const commit = (value: string) => {
47+
if (debounceTimer.current) clearTimeout(debounceTimer.current);
48+
onUpdate({ value });
49+
};
50+
51+
const onChange = (e: React.ChangeEvent<HTMLInputElement>) => {
52+
const next = e.target.value;
53+
setLocalValue(next);
54+
if (debounceTimer.current) clearTimeout(debounceTimer.current);
55+
debounceTimer.current = setTimeout(() => {
56+
onUpdate({ value: next });
57+
}, 250);
58+
};
59+
60+
const onKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
61+
if (e.key === "Enter") {
62+
commit(localValue);
63+
}
64+
};
65+
66+
const onBlur = () => commit(localValue);
67+
3768
return (
3869
<input
3970
type="text"
40-
value={filter.value}
41-
onChange={(e) => onUpdate({ value: e.target.value })}
71+
value={localValue}
72+
onChange={onChange}
73+
onKeyDown={onKeyDown}
74+
onBlur={onBlur}
4275
placeholder="Value"
4376
className={`${commonStyles.input.base} ${commonStyles.input.size.sm} ${commonStyles.width.sm}`}
4477
style={{ boxShadow: commonStyles.input.shadow }}

0 commit comments

Comments
 (0)