From 8829c8cfd2e47275266c4f5e9221f7877da1663b Mon Sep 17 00:00:00 2001
From: agent_coder <agent_coder@users.noreply.gitea.vvzvlad.xyz>
Date: Wed, 1 Jul 2026 21:46:55 +0300
Subject: [PATCH] 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>
---
 app/react/components/LogViewer/LogLine.tsx   | 5 ++++-
 app/react/components/LogViewer/LogViewer.tsx | 9 +++++----
 2 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/app/react/components/LogViewer/LogLine.tsx b/app/react/components/LogViewer/LogLine.tsx
index 88b49ac72..8b0c12096 100644
--- a/app/react/components/LogViewer/LogLine.tsx
+++ b/app/react/components/LogViewer/LogLine.tsx
@@ -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>
     );
diff --git a/app/react/components/LogViewer/LogViewer.tsx b/app/react/components/LogViewer/LogViewer.tsx
index 83d5dec3d..23a120cc3 100644
--- a/app/react/components/LogViewer/LogViewer.tsx
+++ b/app/react/components/LogViewer/LogViewer.tsx
@@ -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 */}