fix: harden retained log streaming

apps/nextjs/src/app/[locale]/manage/tools/logs/client.tsx

@@ -1,15 +1,14 @@
 "use client";
 
-import type { ComponentType } from "react";
 import dynamic from "next/dynamic";
 
 interface ClientSideTerminalComponentProps {
   focusTimestamp?: number;
 }
 
-export const ClientSideTerminalComponent = dynamic(
+export const ClientSideTerminalComponent = dynamic<ClientSideTerminalComponentProps>(
   () => import("./terminal").then(({ TerminalComponent }) => TerminalComponent),
   {
     ssr: false,
   },
-) as ComponentType<ClientSideTerminalComponentProps>;
+);

apps/nextjs/src/app/[locale]/manage/tools/logs/page.tsx

@@ -39,14 +39,9 @@ export default async function LogsManagementPage({ searchParams }: LogsManagemen
     notFound();
   }
 
-  const { focus } = await searchParams;
-  let focusTimestamp: number | undefined;
-  if (focus !== undefined) {
-    const parsedFocusTimestamp = Number(focus);
-    if (Number.isSafeInteger(parsedFocusTimestamp) && parsedFocusTimestamp > 0) {
-      focusTimestamp = parsedFocusTimestamp;
-    }
-  }
+  const parsedFocusTimestamp = Number((await searchParams).focus);
+  const focusTimestamp =
+    Number.isSafeInteger(parsedFocusTimestamp) && parsedFocusTimestamp > 0 ? parsedFocusTimestamp : undefined;
 
   return (
     <LogContextProvider defaultLevel={logsEnv.LEVEL}>

apps/nextjs/src/app/[locale]/manage/tools/logs/terminal.tsx

@@ -17,37 +17,22 @@ import classes from "./terminal.module.css";
 const ALL_LOG_LEVELS = [...logLevels];
 const TERMINAL_SCROLLBACK_LINES = LOG_HISTORY_MAX_ENTRIES * 4;
 
-interface FocusMarker {
-  index: number;
-  text: string;
-}
-
 const getFocusMarker = (
   messages: LoggerMessage[],
   visibleMessages: LoggerMessage[],
   focusTimestamp: number | undefined,
   markerText: string,
   expiredMarkerText: string,
-): FocusMarker | null => {
+) => {
   if (focusTimestamp === undefined) return null;
 
-  let oldestTimestamp = Number.POSITIVE_INFINITY;
-  for (const message of messages) {
-    oldestTimestamp = Math.min(oldestTimestamp, message.timestamp.getTime());
-  }
-  if (oldestTimestamp === Number.POSITIVE_INFINITY || focusTimestamp < oldestTimestamp) {
+  const oldestTimestamp = messages[0]?.timestamp.getTime();
+  if (oldestTimestamp === undefined || focusTimestamp < oldestTimestamp) {
     return { index: 0, text: expiredMarkerText };
   }
 
-  let markerIndex = 0;
-  for (const [index, message] of visibleMessages.entries()) {
-    if (message.timestamp.getTime() <= focusTimestamp) {
-      markerIndex = index + 1;
-    }
-  }
-
   return {
-    index: markerIndex,
+    index: visibleMessages.findLastIndex((message) => message.timestamp.getTime() <= focusTimestamp) + 1,
     text: markerText,
   };
 };
@@ -104,10 +89,7 @@ const renderMessages = ({
     output.push(`\x1b[33m--- ${focusMarker.text} ---\x1b[0m`);
   }
 
-  terminal.reset();
-  if (output.length === 0) return;
-
-  terminal.write(`${output.join("\r\n")}\r\n`, () => {
+  terminal.write(`\x1bc${output.join("\r\n")}${output.length > 0 ? "\r\n" : ""}`, () => {
     if (!focusMarker) {
       terminal.scrollToBottom();
       return;
@@ -134,8 +116,8 @@ export const TerminalComponent = ({ focusTimestamp }: TerminalComponentProps) =>
   const messagesRef = useRef<LoggerMessage[]>([]);
   const initialFontSizeRef = useRef(fontSize);
   const activeLevelsRef = useRef(activeLevels);
-  const markerTextRef = useRef(t("log.context.widgetError"));
-  const expiredMarkerTextRef = useRef(t("log.context.expiredWidgetError"));
+  const markerTextRef = useRef("");
+  const expiredMarkerTextRef = useRef("");
   const focusTimestampRef = useRef(focusTimestamp);
 
   activeLevelsRef.current = activeLevels;