inspect-ai 0.3.81__py3-none-any.whl → 0.3.83__py3-none-any.whl

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

@@ -7,7 +7,6 @@ import { toArray } from "../../utils/type";
 import { ChatView } from "../chat/ChatView";
 import { EventPanel } from "./event/EventPanel";
 import { EventSection } from "./event/EventSection";
-import { TranscriptEventState } from "./types";
 
 import { FC } from "react";
 import styles from "./SampleInitEventView.module.css";
@@ -15,8 +14,6 @@ import styles from "./SampleInitEventView.module.css";
 interface SampleInitEventViewProps {
   id: string;
   event: SampleInitEvent;
-  eventState: TranscriptEventState;
-  setEventState: (state: TranscriptEventState) => void;
   className?: string | string[];
 }
 
@@ -26,8 +23,6 @@ interface SampleInitEventViewProps {
 export const SampleInitEventView: FC<SampleInitEventViewProps> = ({
   id,
   event,
-  eventState,
-  setEventState,
   className,
 }) => {
   const stateObj = event.state as Record<string, unknown>;
@@ -65,14 +60,6 @@ export const SampleInitEventView: FC<SampleInitEventViewProps> = ({
       title="Sample"
       icon={ApplicationIcons.sample}
       subTitle={formatDateTime(new Date(event.timestamp))}
-      selectedNav={eventState.selectedNav || ""}
-      setSelectedNav={(selectedNav) => {
-        setEventState({ ...eventState, selectedNav });
-      }}
-      collapsed={eventState.collapsed}
-      setCollapsed={(collapsed) => {
-        setEventState({ ...eventState, collapsed });
-      }}
     >
       <div data-name="Sample" className={styles.sample}>
         <ChatView messages={stateObj["messages"] as Messages} />

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

@@ -1,14 +1,11 @@
 import { FC } from "react";
 import { ApplicationIcons } from "../../appearance/icons";
-import { SampleLimitEvent, Type8 } from "../../types/log";
+import { SampleLimitEvent, Type9 } from "../../types/log";
 import { EventPanel } from "./event/EventPanel";
-import { TranscriptEventState } from "./types";
 
 interface SampleLimitEventViewProps {
   id: string;
   event: SampleLimitEvent;
-  eventState: TranscriptEventState;
-  setEventState: (state: TranscriptEventState) => void;
   className?: string | string[];
 }
 
@@ -18,11 +15,9 @@ interface SampleLimitEventViewProps {
 export const SampleLimitEventView: FC<SampleLimitEventViewProps> = ({
   id,
   event,
-  eventState,
-  setEventState,
   className,
 }) => {
-  const resolve_title = (type: Type8) => {
+  const resolve_title = (type: Type9) => {
     switch (type) {
       case "custom":
         return "Custom Limit Exceeded";
@@ -39,7 +34,7 @@ export const SampleLimitEventView: FC<SampleLimitEventViewProps> = ({
     }
   };
 
-  const resolve_icon = (type: Type8) => {
+  const resolve_icon = (type: Type9) => {
     switch (type) {
       case "custom":
         return ApplicationIcons.limits.custom;
@@ -60,20 +55,7 @@ export const SampleLimitEventView: FC<SampleLimitEventViewProps> = ({
   const icon = resolve_icon(event.type);
 
   return (
-    <EventPanel
-      id={id}
-      title={title}
-      icon={icon}
-      className={className}
-      selectedNav={eventState.selectedNav || ""}
-      setSelectedNav={(selectedNav) => {
-        setEventState({ ...eventState, selectedNav });
-      }}
-      collapsed={eventState.collapsed}
-      setCollapsed={(collapsed) => {
-        setEventState({ ...eventState, collapsed });
-      }}
-    >
+    <EventPanel id={id} title={title} icon={icon} className={className}>
       {event.message}
     </EventPanel>
   );

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

@@ -5,7 +5,6 @@ import { MetaDataGrid } from "../../metadata/MetaDataGrid";
 import { SandboxEvent } from "../../types/log";
 import { EventPanel } from "./event/EventPanel";
 import { EventSection } from "./event/EventSection";
-import { TranscriptEventState } from "./types";
 
 import clsx from "clsx";
 import { FC } from "react";
@@ -15,8 +14,6 @@ import { formatTiming } from "./event/utils";
 interface SandboxEventViewProps {
   id: string;
   event: SandboxEvent;
-  eventState: TranscriptEventState;
-  setEventState: (state: TranscriptEventState) => void;
   className?: string | string[];
 }
 
@@ -26,8 +23,6 @@ interface SandboxEventViewProps {
 export const SandboxEventView: FC<SandboxEventViewProps> = ({
   id,
   event,
-  eventState,
-  setEventState,
   className,
 }) => {
   return (
@@ -37,31 +32,24 @@ export const SandboxEventView: FC<SandboxEventViewProps> = ({
       title={`Sandbox: ${event.action}`}
       icon={ApplicationIcons.sandbox}
       subTitle={formatTiming(event.timestamp, event.working_start)}
-      selectedNav={eventState.selectedNav || ""}
-      setSelectedNav={(selectedNav) => {
-        setEventState({ ...eventState, selectedNav });
-      }}
-      collapsed={eventState.collapsed}
-      setCollapsed={(collapsed) => {
-        setEventState({ ...eventState, collapsed });
-      }}
     >
       {event.action === "exec" ? (
-        <ExecView event={event} />
+        <ExecView id={`${id}-exec`} event={event} />
       ) : event.action === "read_file" ? (
-        <ReadFileView event={event} />
+        <ReadFileView id={`${id}-read-file`} event={event} />
       ) : (
-        <WriteFileView event={event} />
+        <WriteFileView id={`${id}-write-file`} event={event} />
       )}
     </EventPanel>
   );
 };
 
 interface ExecViewProps {
+  id: string;
   event: SandboxEvent;
 }
 
-const ExecView: FC<ExecViewProps> = ({ event }) => {
+const ExecView: FC<ExecViewProps> = ({ id, event }) => {
   if (event.cmd === null) {
     return undefined;
   }
@@ -92,7 +80,7 @@ const ExecView: FC<ExecViewProps> = ({ event }) => {
       </EventSection>
       <EventSection title={`Result`}>
         {output ? (
-          <ExpandablePanel collapse={false}>
+          <ExpandablePanel id={`${id}-output`} collapse={false}>
             <MarkdownDiv markdown={output} />
           </ExpandablePanel>
         ) : undefined}
@@ -103,38 +91,41 @@ const ExecView: FC<ExecViewProps> = ({ event }) => {
 };
 
 interface ReadFileViewProps {
+  id: string;
   event: SandboxEvent;
 }
 
-const ReadFileView: FC<ReadFileViewProps> = ({ event }) => {
+const ReadFileView: FC<ReadFileViewProps> = ({ id, event }) => {
   if (event.file === null) {
     return undefined;
   }
   const file = event.file;
   const output = event.output;
-  return <FileView file={file} contents={output?.trim()} />;
+  return <FileView id={id} file={file} contents={output?.trim()} />;
 };
 
 interface WriteFileViewProps {
+  id: string;
   event: SandboxEvent;
 }
 
-const WriteFileView: FC<WriteFileViewProps> = ({ event }) => {
+const WriteFileView: FC<WriteFileViewProps> = ({ id, event }) => {
   if (event.file === null) {
     return undefined;
   }
   const file = event.file;
   const input = event.input;
 
-  return <FileView file={file} contents={input?.trim()} />;
+  return <FileView id={id} file={file} contents={input?.trim()} />;
 };
 
 interface FileViewProps {
+  id: string;
   file: string;
   contents?: string;
 }
 
-const FileView: FC<FileViewProps> = ({ file, contents }) => {
+const FileView: FC<FileViewProps> = ({ id, file, contents }) => {
   return (
     <div>
       <EventSection title="File">
@@ -143,7 +134,7 @@ const FileView: FC<FileViewProps> = ({ file, contents }) => {
 
       {contents ? (
         <EventSection title="Contents">
-          <ExpandablePanel collapse={false}>
+          <ExpandablePanel id={`${id}-file`} collapse={false}>
             <pre>{contents}</pre>
           </ExpandablePanel>
         </EventSection>

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

@@ -5,7 +5,6 @@ import { MetaDataGrid } from "../../metadata/MetaDataGrid";
 import { ScoreEvent, Value1 } from "../../types/log";
 import { formatDateTime } from "../../utils/format";
 import { EventPanel } from "./event/EventPanel";
-import { TranscriptEventState } from "./types";
 
 import clsx from "clsx";
 import styles from "./ScoreEventView.module.css";
@@ -13,8 +12,6 @@ import styles from "./ScoreEventView.module.css";
 interface ScoreEventViewProps {
   id: string;
   event: ScoreEvent;
-  eventState: TranscriptEventState;
-  setEventState: (state: TranscriptEventState) => void;
   className?: string | string[];
 }
 
@@ -24,8 +21,6 @@ interface ScoreEventViewProps {
 export const ScoreEventView: FC<ScoreEventViewProps> = ({
   id,
   event,
-  eventState,
-  setEventState,
   className,
 }) => {
   const resolvedTarget = event.target
@@ -41,14 +36,6 @@ export const ScoreEventView: FC<ScoreEventViewProps> = ({
       className={clsx(className, "text-size-small")}
       subTitle={formatDateTime(new Date(event.timestamp))}
       icon={ApplicationIcons.scorer}
-      selectedNav={eventState.selectedNav || ""}
-      setSelectedNav={(selectedNav) => {
-        setEventState({ ...eventState, selectedNav });
-      }}
-      collapsed={eventState.collapsed}
-      setCollapsed={(collapsed) => {
-        setEventState({ ...eventState, collapsed });
-      }}
     >
       <div data-name="Explanation" className={clsx(styles.explanation)}>
         {event.target ? (

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

@@ -1,17 +1,15 @@
 import clsx from "clsx";
-import { FC, RefObject, useCallback, useState } from "react";
+import { FC } from "react";
 import { StepEvent } from "../../types/log";
 import { formatDateTime } from "../../utils/format";
 import { EventPanel } from "./event/EventPanel";
 import { TranscriptComponent } from "./TranscriptView";
-import { EventNode, TranscriptEventState } from "./types";
+import { EventNode } from "./types";
 
 interface StepEventViewProps {
+  id: string;
   event: StepEvent;
-  eventState: TranscriptEventState;
-  setEventState: (state: TranscriptEventState) => void;
   children: EventNode[];
-  scrollRef?: RefObject<HTMLDivElement | null>;
   className?: string | string[];
 }
 
@@ -19,11 +17,9 @@ interface StepEventViewProps {
  * Renders the StepEventView component.
  */
 export const StepEventView: FC<StepEventViewProps> = ({
+  id,
   event,
-  eventState,
-  setEventState,
   children,
-  scrollRef,
   className,
 }) => {
   const descriptor = stepDescriptor(event);
@@ -32,37 +28,19 @@ export const StepEventView: FC<StepEventViewProps> = ({
     `${event.type ? event.type + ": " : "Step: "}${event.name}`;
   const text = summarize(children);
 
-  const [transcriptState, setTranscriptState] = useState({});
-  const onTranscriptState = useCallback(
-    (state: TranscriptEventState) => {
-      setTranscriptState({ ...state });
-    },
-    [setTranscriptState],
-  );
-
   return (
     <EventPanel
-      id={`step-${event.name}`}
+      id={`step-${event.name}-${id}`}
       className={clsx("transcript-step", className)}
       title={title}
       subTitle={formatDateTime(new Date(event.timestamp))}
       icon={descriptor.icon}
       collapse={descriptor.collapse}
       text={text}
-      selectedNav={eventState.selectedNav || ""}
-      setSelectedNav={(selectedNav) => {
-        setEventState({ ...eventState, selectedNav });
-      }}
-      collapsed={eventState.collapsed}
-      setCollapsed={(collapsed) => {
-        setEventState({ ...eventState, collapsed });
-      }}
     >
       <TranscriptComponent
-        id={`step-${event.name}-transcript`}
+        id={`step|${event.name}|${id}`}
         eventNodes={children}
-        transcriptState={transcriptState}
-        setTranscriptState={onTranscriptState}
       />
     </EventPanel>
   );

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

@@ -1,5 +1,5 @@
 import clsx from "clsx";
-import { FC, Fragment } from "react";
+import { FC, ReactNode } from "react";
 import { ApplicationIcons } from "../../appearance/icons";
 import { MetaDataView } from "../../metadata/MetaDataView";
 import { Input2, Input5, Result2, SubtaskEvent } from "../../types/log";
@@ -7,13 +7,10 @@ import { EventPanel } from "./event/EventPanel";
 import { formatTiming, formatTitle } from "./event/utils";
 import styles from "./SubtaskEventView.module.css";
 import { TranscriptView } from "./TranscriptView";
-import { TranscriptEventState } from "./types";
 
 interface SubtaskEventViewProps {
   id: string;
   event: SubtaskEvent;
-  eventState: TranscriptEventState;
-  setEventState: (state: TranscriptEventState) => void;
   depth: number;
   className?: string | string[];
 }
@@ -24,14 +21,12 @@ interface SubtaskEventViewProps {
 export const SubtaskEventView: FC<SubtaskEventViewProps> = ({
   id,
   event,
-  eventState,
-  setEventState,
   depth,
   className,
 }) => {
-  // Render Forks specially
-  const body =
-    event.type === "fork" ? (
+  const body: ReactNode[] = [];
+  if (event.type === "fork") {
+    body.push(
       <div title="Summary" className={clsx(styles.summary)}>
         <div className={clsx("text-style-label")}>Inputs</div>
         <div className={clsx(styles.summaryRendered)}>
@@ -48,24 +43,27 @@ export const SubtaskEventView: FC<SubtaskEventViewProps> = ({
         ) : (
           <None />
         )}
-      </div>
-    ) : (
-      <Fragment>
-        <SubtaskSummary
-          data-name="Summary"
-          input={event.input}
-          result={event.result}
-        />
-        {event.events.length > 0 ? (
-          <TranscriptView
-            id={`${id}-subtask`}
-            data-name="Transcript"
-            events={event.events}
-            depth={depth + 1}
-          />
-        ) : undefined}
-      </Fragment>
+      </div>,
+    );
+  } else {
+    body.push(
+      <SubtaskSummary
+        data-name="Summary"
+        input={event.input}
+        result={event.result}
+      />,
     );
+    if (event.events.length > 0) {
+      body.push(
+        <TranscriptView
+          id={`${id}-subtask`}
+          data-name="Transcript"
+          events={event.events}
+          depth={depth + 1}
+        />,
+      );
+    }
+  }
 
   // Is this a traditional subtask or a fork?
   const type = event.type === "fork" ? "Fork" : "Subtask";
@@ -80,14 +78,6 @@ export const SubtaskEventView: FC<SubtaskEventViewProps> = ({
       )}
       subTitle={formatTiming(event.timestamp, event.working_start)}
       collapse={false}
-      selectedNav={eventState.selectedNav || ""}
-      setSelectedNav={(selectedNav) => {
-        setEventState({ ...eventState, selectedNav });
-      }}
-      collapsed={eventState.collapsed}
-      setCollapsed={(collapsed) => {
-        setEventState({ ...eventState, collapsed });
-      }}
     >
       {body}
     </EventPanel>

inspect_ai/_view/www/src/samples/transcript/ToolEventView.module.css

@@ -8,3 +8,7 @@
   padding: 0;
   margin-bottom: 0;
 }
+
+.progress {
+  margin-left: 0.5em;
+}

inspect_ai/_view/www/src/samples/transcript/ToolEventView.tsx

@@ -5,17 +5,17 @@ import { ToolCallView } from "../chat/tools/ToolCallView";
 import { ApprovalEventView } from "./ApprovalEventView";
 import { EventPanel } from "./event/EventPanel";
 import { TranscriptView } from "./TranscriptView";
-import { TranscriptEventState } from "./types";
 
+import clsx from "clsx";
 import { FC, useMemo } from "react";
+import { PulsingDots } from "../../components/PulsingDots";
+import { ChatView } from "../chat/ChatView";
 import { formatTiming, formatTitle } from "./event/utils";
 import styles from "./ToolEventView.module.css";
 
 interface ToolEventViewProps {
   id: string;
   event: ToolEvent;
-  eventState: TranscriptEventState;
-  setEventState: (state: TranscriptEventState) => void;
   depth: number;
   className?: string | string[];
 }
@@ -26,8 +26,6 @@ interface ToolEventViewProps {
 export const ToolEventView: FC<ToolEventViewProps> = ({
   id,
   event,
-  eventState,
-  setEventState,
   depth,
   className,
 }) => {
@@ -37,10 +35,19 @@ export const ToolEventView: FC<ToolEventViewProps> = ({
     [event.function, event.arguments],
   );
 
-  // Find an approval if there is one
-  const approvalEvent = event.events.find((e) => {
-    return e.event === "approval";
-  });
+  const { approvalEvent, lastModelEvent } = useMemo(() => {
+    // Find an approval if there is one
+    const approvalEvent = event.events.find((e) => {
+      return e.event === "approval";
+    });
+
+    // Find a model message to render, if there is one
+    const lastModelEvent = [...event.events].reverse().find((e) => {
+      return e.event === "model";
+    });
+
+    return { approvalEvent, lastModelEvent };
+  }, [event.events]);
 
   const title = `Tool: ${event.view?.title || event.function}`;
   return (
@@ -50,17 +57,10 @@ export const ToolEventView: FC<ToolEventViewProps> = ({
       className={className}
       subTitle={formatTiming(event.timestamp, event.working_start)}
       icon={ApplicationIcons.solvers.use_tools}
-      selectedNav={eventState.selectedNav || ""}
-      setSelectedNav={(selectedNav) => {
-        setEventState({ ...eventState, selectedNav });
-      }}
-      collapsed={eventState.collapsed}
-      setCollapsed={(collapsed) => {
-        setEventState({ ...eventState, collapsed });
-      }}
     >
       <div data-name="Summary" className={styles.summary}>
         <ToolCallView
+          id={`${id}-tool-call`}
           functionCall={functionCall}
           input={input}
           highlightLanguage={highlightLanguage}
@@ -68,6 +68,16 @@ export const ToolEventView: FC<ToolEventViewProps> = ({
           mode="compact"
           view={event.view ? event.view : undefined}
         />
+
+        {lastModelEvent && lastModelEvent.event === "model" ? (
+          <ChatView
+            id={`${id}-toolcall-chatmessage`}
+            messages={lastModelEvent.output.choices.map((m) => m.message)}
+            numbered={false}
+            toolCallStyle="compact"
+          />
+        ) : undefined}
+
         {approvalEvent ? (
           <ApprovalEventView
             event={approvalEvent}
@@ -76,11 +86,17 @@ export const ToolEventView: FC<ToolEventViewProps> = ({
         ) : (
           ""
         )}
+        {event.pending ? (
+          <div className={clsx(styles.progress)}>
+            <PulsingDots subtle={false} size="medium" />
+          </div>
+        ) : undefined}
       </div>
       {event.events.length > 0 ? (
         <TranscriptView
           id={`${id}-subtask`}
           data-name="Transcript"
+          data-default={event.failed || event.agent ? true : null}
           events={event.events}
           depth={depth + 1}
         />