feat: move found instructions to action history (#142)

normal-computing · Apr 25, 2024 · bd61b9c · bd61b9c
1 parent 00cc6a5
commit bd61b9c
Show file tree

Hide file tree

Showing 3 changed files with 43 additions and 58 deletions.
diff --git a/src/common/CustomKnowledgeBase/MatchedNotes.tsx b/src/common/CustomKnowledgeBase/MatchedNotes.tsx
diff --git a/src/common/TaskHistory.tsx b/src/common/TaskHistory.tsx
@@ -1,4 +1,7 @@
 import {
+  Alert,
+  AlertIcon,
+  AlertDescription,
   VStack,
   HStack,
   Box,
@@ -15,6 +18,44 @@ import {
 import { TaskHistoryEntry } from "../state/currentTask";
 import { useAppState } from "../state/store";
 import CopyButton from "./CopyButton";
+import Notes from "./CustomKnowledgeBase/Notes";
+
+function MatchedNotes() {
+  const knowledge = useAppState((state) => state.currentTask.knowledgeInUse);
+  const notes = knowledge?.notes;
+  if (!notes || notes.length === 0) {
+    return null;
+  }
+
+  return (
+    <AccordionItem>
+      <Heading as="h3" size="sm">
+        <AccordionButton>
+          <Box mr="4" fontWeight="bold">
+            0.
+          </Box>
+          <Box as="span" textAlign="left" flex="1">
+            Found {notes.length} instructions.
+          </Box>
+          <AccordionIcon />
+        </AccordionButton>
+      </Heading>
+      <AccordionPanel backgroundColor="gray.100" p="2">
+        <Accordion allowMultiple w="full" defaultIndex={1}>
+          <Box pl={2}>
+            <Notes notes={notes} />
+          </Box>
+          <Alert status="info" borderRadius="sm" mt="1">
+            <AlertIcon />
+            <AlertDescription fontSize="0.8rem" lineHeight="4">
+              You can customize instructions in the settings menu.
+            </AlertDescription>
+          </Alert>
+        </Accordion>
+      </AccordionPanel>
+    </AccordionItem>
+  );
+}
 
 type TaskHistoryItemProps = {
   index: number;
@@ -127,6 +168,7 @@ export default function TaskHistory() {
         <CopyButton text={JSON.stringify(taskHistory, null, 2)} />
       </HStack>
       <Accordion allowMultiple w="full" pb="4">
+        <MatchedNotes />
         {taskHistory.map((entry, index) => (
           <TaskHistoryItem key={index} index={index} entry={entry} />
         ))}

diff --git a/src/common/TaskUI.tsx b/src/common/TaskUI.tsx
@@ -18,7 +18,6 @@ import TaskHistory from "./TaskHistory";
 import TaskStatus from "./TaskStatus";
 import RecommendedTasks from "./RecommendedTasks";
 import AutosizeTextarea from "./AutosizeTextarea";
-import MatchedNotes from "./CustomKnowledgeBase/MatchedNotes";
 
 function ActionExecutor() {
   const state = useAppState((state) => ({
@@ -127,7 +126,7 @@ const TaskUI = () => {
       {state.voiceMode && (
         <Alert status="info" borderRadius="lg">
           <AlertIcon />
-          <AlertDescription fontSize="sm">
+          <AlertDescription fontSize="sm" lineHeight="5">
             In Voice Mode, you can press Space to start speaking and Space again
             to stop. WebWand will run the task when you stop speaking. To turn
             off Voice Mode, click the Setting icon in the top right corner.
@@ -138,7 +137,6 @@ const TaskUI = () => {
         <RecommendedTasks runTask={runTaskWithNewInstructions} />
       )}
       {debugMode && <ActionExecutor />}
-      <MatchedNotes />
       <TaskStatus />
       <TaskHistory />
     </>