inspect-ai 0.3.99__py3-none-any.whl → 0.3.101__py3-none-any.whl

inspect_ai/_view/www/src/app/routing/url.ts

@@ -1,4 +1,7 @@
+import { useMemo } from "react";
+import { useParams } from "react-router-dom";
 import { kSampleMessagesTabId, kSampleTranscriptTabId } from "../../constants";
+import { useStore } from "../../state/store";
 import { directoryRelativeUrl } from "../../utils/uri";
 
 export const kLogRouteUrlPattern = "/logs/:logPath/:tabId?/:sampleTabId?";
@@ -46,6 +49,80 @@ export const sampleEventUrl = (
   return `${baseUrl}?event=${eventId}`;
 };
 
+export const useSampleMessageUrl = (
+  messageId: string | null,
+  sampleId?: string | number,
+  sampleEpoch?: string | number,
+) => {
+  const {
+    logPath: urlLogPath,
+    sampleId: urlSampleId,
+    epoch: urlEpoch,
+  } = useParams<{
+    logPath?: string;
+    tabId?: string;
+    sampleId?: string;
+    epoch?: string;
+  }>();
+
+  const log_file = useStore((state) => state.logs.selectedLogFile);
+  const log_dir = useStore((state) => state.logs.logs.log_dir);
+
+  let targetLogPath = urlLogPath;
+  if (!targetLogPath && log_file) {
+    targetLogPath = makeLogPath(log_file, log_dir);
+  }
+
+  const eventUrl = useMemo(() => {
+    return messageId && targetLogPath
+      ? sampleMessageUrl(
+          messageId,
+          targetLogPath,
+          sampleId || urlSampleId,
+          sampleEpoch || urlEpoch,
+        )
+      : undefined;
+  }, [targetLogPath, messageId, sampleId, urlSampleId, sampleEpoch, urlEpoch]);
+  return eventUrl;
+};
+
+export const useSampleEventUrl = (
+  eventId: string,
+  sampleId?: string | number,
+  sampleEpoch?: string | number,
+) => {
+  const {
+    logPath: urlLogPath,
+    sampleId: urlSampleId,
+    epoch: urlEpoch,
+  } = useParams<{
+    logPath?: string;
+    tabId?: string;
+    sampleId?: string;
+    epoch?: string;
+  }>();
+
+  const log_file = useStore((state) => state.logs.selectedLogFile);
+  const log_dir = useStore((state) => state.logs.logs.log_dir);
+
+  let targetLogPath = urlLogPath;
+  if (!targetLogPath && log_file) {
+    targetLogPath = makeLogPath(log_file, log_dir);
+  }
+
+  const eventUrl = useMemo(() => {
+    return targetLogPath
+      ? sampleEventUrl(
+          eventId,
+          targetLogPath,
+          sampleId || urlSampleId,
+          sampleEpoch || urlEpoch,
+        )
+      : undefined;
+  }, [targetLogPath, eventId, sampleId, urlSampleId, sampleEpoch, urlEpoch]);
+  return eventUrl;
+};
+
 export const sampleMessageUrl = (
   messageId: string,
   logPath: string,
@@ -63,8 +140,12 @@ export const sampleMessageUrl = (
 };
 
 export const logUrl = (log_file: string, log_dir?: string, tabId?: string) => {
+  return logUrlRaw(makeLogPath(log_file, log_dir), tabId);
+};
+
+export const makeLogPath = (log_file: string, log_dir?: string) => {
   const pathSegment = directoryRelativeUrl(log_file, log_dir);
-  return logUrlRaw(pathSegment, tabId);
+  return pathSegment;
 };
 
 export const logUrlRaw = (log_segment: string, tabId?: string) => {
@@ -77,9 +158,8 @@ export const logUrlRaw = (log_segment: string, tabId?: string) => {
 
 export const supportsLinking = () => {
   return (
-    location.hostname !== "localhost" &&
-    location.hostname !== "127.0.0.1" &&
-    location.protocol !== "vscode-webview:"
+    //location.hostname !== "localhost" &&
+    location.hostname !== "127.0.0.1" && location.protocol !== "vscode-webview:"
   );
 };
 

inspect_ai/_view/www/src/app/samples/InlineSampleDisplay.module.css

@@ -4,11 +4,6 @@
   flex-direction: column;
 }
 
-.body {
-  margin-top: 1em;
-  margin-bottom: 1em;
-}
-
 .scroller {
   overflow-y: auto;
   width: 100%;

inspect_ai/_view/www/src/app/samples/SampleDialog.module.css

@@ -1,3 +1,3 @@
 .modalBody {
-  padding: 1em 0;
+  padding: 0 0;
 }

inspect_ai/_view/www/src/app/samples/SampleDisplay.module.css

@@ -2,6 +2,13 @@
   padding-bottom: 1em;
 }
 
+.tabControls {
+  position: sticky;
+  z-index: 1001;
+  top: 0;
+  background-color: var(--bs-body-bg);
+}
+
 .fullWidth {
   width: 100%;
 }

inspect_ai/_view/www/src/app/samples/SampleDisplay.tsx

@@ -15,6 +15,7 @@ import {
   RefObject,
   useCallback,
   useMemo,
+  useRef,
 } from "react";
 import { useNavigate, useParams } from "react-router-dom";
 import { EvalSample, Events } from "../../@types/log";
@@ -37,19 +38,14 @@ import { estimateSize } from "../../utils/json";
 import { printHeadingHtml, printHtml } from "../../utils/print";
 import { RecordTree } from "../content/RecordTree";
 import { useSampleDetailNavigation } from "../routing/navigationHooks";
-import {
-  sampleMessageUrl,
-  sampleUrl,
-  supportsLinking,
-  toFullUrl,
-} from "../routing/url";
+import { sampleUrl } from "../routing/url";
 import { ModelTokenTable } from "../usage/ModelTokenTable";
 import { ChatViewVirtualList } from "./chat/ChatViewVirtualList";
 import { messagesFromEvents } from "./chat/messages";
 import styles from "./SampleDisplay.module.css";
 import { SampleSummaryView } from "./SampleSummaryView";
 import { SampleScoresView } from "./scores/SampleScoresView";
-import { TranscriptVirtualList } from "./transcript/TranscriptVirtualList";
+import { TranscriptPanel } from "./transcript/TranscriptPanel";
 
 interface SampleDisplayProps {
   id: string;
@@ -87,7 +83,19 @@ export const SampleDisplay: FC<SampleDisplayProps> = ({ id, scrollRef }) => {
   // Navigation hook for URL updates
   const navigate = useNavigate();
 
-  const sampleSummary = filteredSamples[selectedSampleIndex];
+  // Ref for samples tabs (used to meaure for offset)
+  const tabsRef: RefObject<HTMLUListElement | null> = useRef(null);
+  const tabsHeight = useMemo(() => {
+    if (tabsRef.current) {
+      const height = tabsRef.current.getBoundingClientRect().height;
+      return height;
+    }
+    return -1;
+  }, [tabsRef.current]);
+
+  const sampleSummary = useMemo(() => {
+    return filteredSamples[selectedSampleIndex];
+  }, [filteredSamples, selectedSampleIndex]);
 
   // Consolidate the events and messages into the proper list
   // whether running or not
@@ -115,12 +123,6 @@ export const SampleDisplay: FC<SampleDisplayProps> = ({ id, scrollRef }) => {
     epoch?: string;
   }>();
 
-  const getMessageUrl = (id: string) => {
-    return id && urlLogPath && supportsLinking()
-      ? toFullUrl(sampleMessageUrl(id, urlLogPath, urlSampleId, urlEpoch))
-      : undefined;
-  };
-
   // Tab selection
   const onSelectedTab = useCallback(
     (e: MouseEvent<HTMLElement>) => {
@@ -171,7 +173,9 @@ export const SampleDisplay: FC<SampleDisplayProps> = ({ id, scrollRef }) => {
   }
 
   // Is the sample running?
-  const running = isRunning(sampleSummary, runningSampleData);
+  const running = useMemo(() => {
+    return isRunning(sampleSummary, runningSampleData);
+  }, [sampleSummary, runningSampleData]);
 
   const sampleDetailNavigation = useSampleDetailNavigation();
 
@@ -182,6 +186,8 @@ export const SampleDisplay: FC<SampleDisplayProps> = ({ id, scrollRef }) => {
       ) : undefined}
       <TabSet
         id={tabsetId}
+        tabsRef={tabsRef}
+        className={clsx(styles.tabControls)}
         tabControlsClassName={clsx("text-size-base")}
         tabPanelsClassName={clsx(styles.tabPanel)}
         tools={tools}
@@ -198,11 +204,12 @@ export const SampleDisplay: FC<SampleDisplayProps> = ({ id, scrollRef }) => {
           }
           scrollable={false}
         >
-          <TranscriptVirtualList
+          <TranscriptPanel
             key={`${baseId}-transcript-display-${id}`}
             id={`${baseId}-transcript-display-${id}`}
             events={sampleEvents || []}
             initialEventId={sampleDetailNavigation.event}
+            topOffset={tabsHeight}
             running={running}
             scrollRef={scrollRef}
           />
@@ -221,11 +228,11 @@ export const SampleDisplay: FC<SampleDisplayProps> = ({ id, scrollRef }) => {
             id={`${baseId}-chat-${id}`}
             messages={sampleMessages}
             initialMessageId={sampleDetailNavigation.message}
+            topOffset={tabsHeight}
             indented={true}
             scrollRef={scrollRef}
             toolCallStyle="complete"
             running={running}
-            getMessageUrl={getMessageUrl}
           />
         </TabPanel>
         <TabPanel

inspect_ai/_view/www/src/app/samples/SampleSummaryView.module.css

@@ -10,8 +10,7 @@
   display: grid;
   grid-column-gap: 1em;
   border-bottom: solid var(--bs-border-color) 1px;
-  margin-bottom: 1em;
-  padding: 0em 1em 1em 1em;
+  padding: 1em 1em 1em 1em;
 }
 
 .centerLabel {

inspect_ai/_view/www/src/app/samples/chat/ChatMessage.tsx

@@ -9,6 +9,11 @@ import {
 import { CopyButton } from "../../../components/CopyButton";
 import ExpandablePanel from "../../../components/ExpandablePanel";
 import { ApplicationIcons } from "../../appearance/icons";
+import {
+  supportsLinking,
+  toFullUrl,
+  useSampleMessageUrl,
+} from "../../routing/url";
 import styles from "./ChatMessage.module.css";
 import { MessageContents } from "./MessageContents";
 import { ChatViewToolCallStyle } from "./types";
@@ -19,7 +24,6 @@ interface ChatMessageProps {
   toolMessages: ChatMessageTool[];
   indented?: boolean;
   toolCallStyle: ChatViewToolCallStyle;
-  getMessageUrl?: (id: string) => string | undefined;
 }
 
 export const ChatMessage: FC<ChatMessageProps> = ({
@@ -28,10 +32,8 @@ export const ChatMessage: FC<ChatMessageProps> = ({
   toolMessages,
   indented,
   toolCallStyle,
-  getMessageUrl,
 }) => {
-  const messageUrl =
-    message.id && getMessageUrl ? getMessageUrl(message.id) : undefined;
+  const messageUrl = useSampleMessageUrl(message.id);
 
   const collapse = message.role === "system" || message.role === "user";
   return (
@@ -46,10 +48,10 @@ export const ChatMessage: FC<ChatMessageProps> = ({
     >
       <div className={clsx(styles.messageGrid, "text-style-label")}>
         {message.role}
-        {messageUrl ? (
+        {supportsLinking() && messageUrl ? (
           <CopyButton
             icon={ApplicationIcons.link}
-            value={messageUrl}
+            value={toFullUrl(messageUrl)}
             className={clsx(styles.copyLink)}
           />
         ) : (

inspect_ai/_view/www/src/app/samples/chat/ChatMessageRow.tsx

@@ -13,7 +13,6 @@ interface ChatMessageRowProps {
   toolCallStyle: ChatViewToolCallStyle;
   indented?: boolean;
   padded?: boolean;
-  getMessageUrl?: (id: string) => string | undefined;
   highlightUserMessage?: boolean;
 }
 
@@ -26,7 +25,6 @@ export const ChatMessageRow: FC<ChatMessageRowProps> = ({
   resolvedMessage,
   toolCallStyle,
   indented,
-  getMessageUrl,
   highlightUserMessage,
 }) => {
   if (number) {
@@ -56,7 +54,6 @@ export const ChatMessageRow: FC<ChatMessageRowProps> = ({
             toolMessages={resolvedMessage.toolMessages}
             indented={indented}
             toolCallStyle={toolCallStyle}
-            getMessageUrl={getMessageUrl}
           />
         </div>
 
@@ -82,7 +79,6 @@ export const ChatMessageRow: FC<ChatMessageRowProps> = ({
           toolMessages={resolvedMessage.toolMessages}
           indented={indented}
           toolCallStyle={toolCallStyle}
-          getMessageUrl={getMessageUrl}
         />
         {resolvedMessage.message.role === "user" ? (
           <div style={{ height: "10px" }}></div>

inspect_ai/_view/www/src/app/samples/chat/ChatViewVirtualList.tsx

@@ -16,6 +16,7 @@ interface ChatViewVirtualListProps {
   className?: string | string[];
   messages: Messages;
   initialMessageId?: string | null;
+  topOffset?: number;
   toolCallStyle: ChatViewToolCallStyle;
   indented: boolean;
   numbered?: boolean;
@@ -32,13 +33,13 @@ export const ChatViewVirtualList: FC<ChatViewVirtualListProps> = memo(
     id,
     messages,
     initialMessageId,
+    topOffset,
     className,
     toolCallStyle,
     indented,
     numbered = true,
     scrollRef,
     running,
-    getMessageUrl,
   }) => {
     const collapsedMessages = useMemo(() => {
       return resolveMessages(messages);
@@ -66,7 +67,6 @@ export const ChatViewVirtualList: FC<ChatViewVirtualListProps> = memo(
           resolvedMessage={item}
           indented={indented}
           toolCallStyle={toolCallStyle}
-          getMessageUrl={getMessageUrl}
           highlightUserMessage={true}
         />
       );
@@ -98,6 +98,7 @@ export const ChatViewVirtualList: FC<ChatViewVirtualListProps> = memo(
         data={collapsedMessages}
         renderRow={renderRow}
         initialTopMostItemIndex={initialMessageIndex}
+        offsetTop={topOffset}
         live={running}
         showProgress={running}
         components={{ Item }}

inspect_ai/_view/www/src/app/samples/chat/MessageContent.tsx

@@ -54,6 +54,7 @@ export const MessageContent: FC<MessageContentProps> = ({ contents }) => {
             type: "text",
             text: content,
             refusal: null,
+            internal: null,
           },
           index === contents.length - 1,
         );
@@ -78,6 +79,7 @@ export const MessageContent: FC<MessageContentProps> = ({ contents }) => {
       type: "text",
       text: contents,
       refusal: null,
+      internal: null,
     };
     return messageRenderers["text"].render(
       "text-message-content",

inspect_ai/_view/www/src/app/samples/chat/MessageContents.tsx

@@ -108,6 +108,7 @@ const resolveToolMessage = (toolMessage?: ChatMessageTool): ContentTool[] => {
             type: "text",
             text: content,
             refusal: null,
+            internal: null,
           },
         ],
       },
@@ -123,6 +124,7 @@ const resolveToolMessage = (toolMessage?: ChatMessageTool): ContentTool[] => {
                 type: "text",
                 text: con,
                 refusal: null,
+                internal: null,
               },
             ],
           } as ContentTool;

inspect_ai/_view/www/src/app/samples/chat/messages.ts

@@ -129,6 +129,7 @@ const normalizeContent = (
       type: "text",
       text: content,
       refusal: null,
+      internal: null,
     };
   } else {
     return content;

inspect_ai/_view/www/src/app/samples/chat/tools/ToolCallView.tsx

@@ -175,6 +175,7 @@ const normalizeContent = (
             type: "text",
             text: String(output),
             refusal: null,
+            internal: null,
           },
         ],
       },

inspect_ai/_view/www/src/app/samples/list/SampleList.tsx

@@ -113,11 +113,19 @@ export const SampleList: FC<SampleListProps> = memo((props) => {
           e.preventDefault();
           e.stopPropagation();
           break;
-        case "Enter":
-          sampleNavigation.showSample(selectedSampleIndex);
-          e.preventDefault();
-          e.stopPropagation();
+        case "Enter": {
+          const item = items[selectedSampleIndex];
+          if (item.type === "sample") {
+            sampleNavigation.showSample(
+              item.index,
+              item.data.id,
+              item.data.epoch,
+            );
+            e.preventDefault();
+            e.stopPropagation();
+          }
           break;
+        }
       }
     },
     [
@@ -150,7 +158,11 @@ export const SampleList: FC<SampleListProps> = memo((props) => {
               item.data.epoch,
             )}
             showSample={() => {
-              sampleNavigation.showSample(item.index);
+              sampleNavigation.showSample(
+                item.index,
+                item.data.id,
+                item.data.epoch,
+              );
             }}
           />
         );

inspect_ai/_view/www/src/app/samples/list/SampleRow.tsx

@@ -115,7 +115,7 @@ export const SampleRow: FC<SampleRowProps> = ({
         ) : completed ? (
           scoreRendered
         ) : (
-          <PulsingDots />
+          <PulsingDots subtle={false} />
         )}
       </div>
     </div>

inspect_ai/_view/www/src/app/samples/transcript/ErrorEventView.tsx

@@ -19,10 +19,9 @@ export const ErrorEventView: FC<ErrorEventViewProps> = ({
   className,
 }) => {
   const event = eventNode.event;
-  const id = eventNode.id;
   return (
     <EventPanel
-      id={id}
+      eventNodeId={eventNode.id}
       depth={eventNode.depth}
       title="Error"
       className={className}

inspect_ai/_view/www/src/app/samples/transcript/InfoEventView.tsx

@@ -36,7 +36,7 @@ export const InfoEventView: FC<InfoEventViewProps> = ({
 
   return (
     <EventPanel
-      id={eventNode.id}
+      eventNodeId={eventNode.id}
       depth={eventNode.depth}
       title={"Info" + (event.source ? ": " + event.source : "")}
       className={className}

inspect_ai/_view/www/src/app/samples/transcript/InputEventView.tsx

@@ -19,10 +19,9 @@ export const InputEventView: FC<InputEventViewProps> = ({
   className,
 }) => {
   const event = eventNode.event;
-  const id = eventNode.id;
   return (
     <EventPanel
-      id={id}
+      eventNodeId={eventNode.id}
       depth={eventNode.depth}
       title="Input"
       className={className}

inspect_ai/_view/www/src/app/samples/transcript/ModelEventView.module.css

@@ -32,7 +32,7 @@
 }
 
 .progress {
-  margin-left: 2em;
+  margin-left: 0.5em;
 }
 
 .toolConfig {

inspect_ai/_view/www/src/app/samples/transcript/ModelEventView.tsx

@@ -69,7 +69,7 @@ export const ModelEventView: FC<ModelEventViewProps> = ({
 
   return (
     <EventPanel
-      id={eventNode.id}
+      eventNodeId={eventNode.id}
       depth={eventNode.depth}
       className={className}
       title={formatTitle(panelTitle, totalUsage, callTime)}

inspect_ai/_view/www/src/app/samples/transcript/SampleInitEventView.tsx

@@ -56,7 +56,7 @@ export const SampleInitEventView: FC<SampleInitEventViewProps> = ({
 
   return (
     <EventPanel
-      id={eventNode.id}
+      eventNodeId={eventNode.id}
       depth={eventNode.depth}
       className={className}
       title="Sample"

inspect_ai/_view/www/src/app/samples/transcript/SampleLimitEventView.tsx

@@ -1,3 +1,4 @@
+import clsx from "clsx";
 import { FC } from "react";
 import { SampleLimitEvent, Type10 } from "../../../@types/log";
 import { ApplicationIcons } from "../../appearance/icons";
@@ -55,13 +56,13 @@ export const SampleLimitEventView: FC<SampleLimitEventViewProps> = ({
 
   return (
     <EventPanel
-      id={eventNode.id}
+      eventNodeId={eventNode.id}
       depth={eventNode.depth}
       title={title}
       icon={icon}
       className={className}
     >
-      {eventNode.event.message}
+      <div className={clsx("text-size-smaller")}>{eventNode.event.message}</div>
     </EventPanel>
   );
 };

inspect_ai/_view/www/src/app/samples/transcript/SandboxEventView.tsx

@@ -25,10 +25,9 @@ export const SandboxEventView: FC<SandboxEventViewProps> = ({
   className,
 }) => {
   const event = eventNode.event;
-  const id = eventNode.id;
   return (
     <EventPanel
-      id={id}
+      eventNodeId={eventNode.id}
       depth={eventNode.depth}
       className={className}
       title={`Sandbox: ${event.action}`}
@@ -36,11 +35,11 @@ export const SandboxEventView: FC<SandboxEventViewProps> = ({
       subTitle={formatTiming(event.timestamp, event.working_start)}
     >
       {event.action === "exec" ? (
-        <ExecView id={`${id}-exec`} event={event} />
+        <ExecView id={`${eventNode.id}-exec`} event={event} />
       ) : event.action === "read_file" ? (
-        <ReadFileView id={`${id}-read-file`} event={event} />
+        <ReadFileView id={`${eventNode.id}-read-file`} event={event} />
       ) : (
-        <WriteFileView id={`${id}-write-file`} event={event} />
+        <WriteFileView id={`${eventNode.id}-write-file`} event={event} />
       )}
     </EventPanel>
   );

inspect_ai/_view/www/src/app/samples/transcript/ScoreEventView.tsx

@@ -31,7 +31,7 @@ export const ScoreEventView: FC<ScoreEventViewProps> = ({
 
   return (
     <EventPanel
-      id={eventNode.id}
+      eventNodeId={eventNode.id}
       depth={eventNode.depth}
       title={(event.intermediate ? "Intermediate " : "") + "Score"}
       className={clsx(className, "text-size-small")}

inspect_ai/_view/www/src/app/samples/transcript/SpanEventView.tsx

@@ -21,7 +21,6 @@ export const SpanEventView: FC<SpanEventViewProps> = ({
   className,
 }) => {
   const event = eventNode.event;
-  const id = eventNode.id;
   const descriptor = spanDescriptor(event);
   const title =
     descriptor.name ||
@@ -30,7 +29,7 @@ export const SpanEventView: FC<SpanEventViewProps> = ({
 
   return (
     <EventPanel
-      id={id}
+      eventNodeId={eventNode.id}
       depth={eventNode.depth}
       childIds={children.map((child) => child.id)}
       className={clsx("transcript-span", className)}

inspect_ai/_view/www/src/app/samples/transcript/StepEventView.tsx

@@ -21,8 +21,6 @@ export const StepEventView: FC<StepEventViewProps> = ({
   className,
 }) => {
   const event = eventNode.event;
-  const id = eventNode.id;
-
   const descriptor = stepDescriptor(event);
   const title =
     descriptor.name ||
@@ -31,7 +29,7 @@ export const StepEventView: FC<StepEventViewProps> = ({
 
   return (
     <EventPanel
-      id={id}
+      eventNodeId={eventNode.id}
       depth={eventNode.depth}
       childIds={children.map((child) => child.id)}
       className={clsx("transcript-step", className)}

inspect_ai/_view/www/src/app/samples/transcript/SubtaskEventView.tsx

@@ -23,7 +23,6 @@ export const SubtaskEventView: FC<SubtaskEventViewProps> = ({
   className,
 }) => {
   const event = eventNode.event;
-  const id = eventNode.id;
   const body: ReactNode[] = [];
   if (event.type === "fork") {
     body.push(
@@ -48,7 +47,7 @@ export const SubtaskEventView: FC<SubtaskEventViewProps> = ({
   const type = event.type === "fork" ? "Fork" : "Subtask";
   return (
     <EventPanel
-      id={id}
+      eventNodeId={eventNode.id}
       depth={eventNode.depth}
       className={className}
       title={formatTitle(