fix(#6): theme-consistent search highlight + Copied ack on Copy button

- F3: give the <mark> search highlight the full theme-token tier set
  (light / th-dark / th-highcontrast, with a legible text colour) so it reads
  correctly in every theme now that the viewer is theme-aware.
- F6: restore the transient 'Copied' acknowledgement on the Copy button via
  useCopy's copiedSuccessfully (Check icon + 'Copied' label).

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
agent_coder
2026-07-01 21:46:55 +03:00
parent 331319f7f1
commit 8829c8cfd2
2 changed files with 9 additions and 5 deletions
+4 -1
View File
@@ -33,7 +33,10 @@ function highlight(text: string, search: string): ReactNode {
parts.push(text.substring(start, idx));
}
parts.push(
<mark key={idx} className="bg-warning-5 th-dark:bg-warning-9">
<mark
key={idx}
className="bg-warning-5 text-black th-dark:bg-warning-9 th-dark:text-white th-highcontrast:bg-warning-9 th-highcontrast:text-white"
>
{text.substring(idx, idx + term.length)}
</mark>
);
+5 -4
View File
@@ -4,6 +4,7 @@ import { saveAs } from 'file-saver';
import DateTimeRangePicker from '@wojtekmaj/react-datetimerange-picker';
import {
Calendar,
Check,
Clock,
Copy,
Download,
@@ -102,7 +103,7 @@ export function LogViewer({
);
// Copy uses the project's secure-context-safe clipboard wrapper.
const { handleCopy } = useCopy(logsAsString);
const { handleCopy, copiedSuccessfully } = useCopy(logsAsString);
// Keep the newest line in view while tailing, but only if the user has not
// scrolled up to read history (so an active read is never yanked to the bottom).
@@ -218,16 +219,16 @@ export function LogViewer({
data-cy="log-viewer-filter-results"
/>
{/* Copy */}
{/* Copy — shows a transient "Copied" acknowledgement */}
<Button
color="default"
size="small"
icon={Copy}
icon={copiedSuccessfully ? Check : Copy}
onClick={handleCopy}
className="!m-0"
data-cy="log-viewer-copy"
>
Copy
{copiedSuccessfully ? 'Copied' : 'Copy'}
</Button>
{/* Download logs */}