updates to interface

ucbepic · Dec 23, 2024 · 686ddd5 · 686ddd5
1 parent 6b5133b
commit 686ddd5
Show file tree

Hide file tree

Showing 7 changed files with 45 additions and 28 deletions.
diff --git a/website/src/app/api/getInputOutput/route.ts b/website/src/app/api/getInputOutput/route.ts
@@ -43,7 +43,13 @@ export async function POST(request: Request) {
       operation_id,
       name,
       homeDir,
-      sample_size
+      sample_size,
+      false,
+      false,
+      { datasetDescription: null, persona: null },
+      [],
+      "",
+      false
     );
 
     // Check if files exist using FastAPI endpoints

diff --git a/website/src/app/api/getPipelineConfig/route.ts b/website/src/app/api/getPipelineConfig/route.ts
@@ -39,7 +39,12 @@ export async function POST(request: Request) {
       name,
       homeDir,
       sample_size,
-      system_prompt
+      false,
+      false,
+      system_prompt,
+      [],
+      "",
+      false
     );
 
     return NextResponse.json({ pipelineConfig: yamlString });

diff --git a/website/src/app/api/utils.ts b/website/src/app/api/utils.ts
@@ -49,7 +49,8 @@ export function generatePipelineConfig(
     persona: string | null;
   } | null = null,
   apiKeys: APIKey[] = [],
-  docetl_encryption_key: string = ""
+  docetl_encryption_key: string = "",
+  enable_observability: boolean = true
 ) {
   const datasets = {
     input: {
@@ -166,7 +167,7 @@ export function generatePipelineConfig(
 
       return {
         ...newOp,
-        enable_observability: true,
+        ...(enable_observability && { enable_observability }),
         output: {
           schema: op.output.schema.reduce(
             (acc: Record<string, string>, item: SchemaItem) => {

diff --git a/website/src/app/api/writePipelineConfig/route.ts b/website/src/app/api/writePipelineConfig/route.ts
@@ -54,7 +54,8 @@ export async function POST(request: Request) {
       clear_intermediate,
       system_prompt,
       apiKeys,
-      docetl_encryption_key
+      docetl_encryption_key,
+      true
     );
 
     // Use the FastAPI endpoint to write the pipeline config

diff --git a/website/src/components/APIKeysDialog.tsx b/website/src/components/APIKeysDialog.tsx
@@ -190,7 +190,6 @@ export function APIKeysDialog({ open, onOpenChange }: APIKeysDialogProps) {
                     </Label>
                     <Input
                       id={`key-value-${index}`}
-                      type="password"
                       value={key.value}
                       onChange={(e) =>
                         handleInputChange(index, "value", e.target.value)

diff --git a/website/src/components/BookmarksPanel.tsx b/website/src/components/BookmarksPanel.tsx
@@ -123,7 +123,7 @@ const BookmarksPanel: React.FC = () => {
       <div className="text-xs mb-2 bg-muted/50 p-2 rounded-md">
         <span className="text-muted-foreground font-medium">Tip: </span>
         Click <Maximize2 className="h-3 w-3 inline-block mx-0.5 text-primary" />{" "}
-        in any output column to leave feedback
+        in any output column to leave notes on outputs
       </div>
       <div className="text-xs mb-4 bg-yellow-100/50 p-2 rounded-md">
         <span className="text-muted-foreground font-medium">Note: </span>

diff --git a/website/src/components/PipelineGui.tsx b/website/src/components/PipelineGui.tsx
@@ -88,7 +88,7 @@ const OperationMenuItem: React.FC<OperationMenuItemProps> = ({
   onClick,
 }) => {
   return (
-    <HoverCard openDelay={200}>
+    <HoverCard openDelay={0} closeDelay={0}>
       <HoverCardTrigger asChild>
         <div className="relative w-full">
           <DropdownMenuItem
@@ -153,7 +153,6 @@ const PipelineGUI: React.FC = () => {
     setPipelineName,
     sampleSize,
     setSampleSize,
-    numOpRun,
     setNumOpRun,
     currentFile,
     setCurrentFile,
@@ -1025,7 +1024,9 @@ const PipelineGUI: React.FC = () => {
                   </Button>
                 </DropdownMenuTrigger>
                 <DropdownMenuContent>
-                  <DropdownMenuLabel>Add LLM Operation</DropdownMenuLabel>
+                  <DropdownMenuLabel className="font-bold text-sm bg-muted/50 py-2">
+                    Add LLM Operation
+                  </DropdownMenuLabel>
                   <OperationMenuItem
                     name="Map"
                     description="Transforms each input item for complex data processing and insight extraction. 1 to 1 operation (each document gets one result, but the output of the operation can be any type, like a list)."
@@ -1066,37 +1067,41 @@ const PipelineGUI: React.FC = () => {
                     }
                   />
                   <DropdownMenuSeparator />
-                  <DropdownMenuLabel>Add Non-LLM Operation</DropdownMenuLabel>
-                  <DropdownMenuItem
+                  <DropdownMenuLabel className="font-bold text-sm bg-muted/50 py-2">
+                    Add Non-LLM Operation
+                  </DropdownMenuLabel>
+                  <OperationMenuItem
+                    name="Unnest"
+                    description="Flattens nested arrays or objects in your documents, creating new documents for each nested item."
                     onClick={() =>
                       handleAddOperation("non-LLM", "unnest", "Untitled Unnest")
                     }
-                  >
-                    Unnest
-                  </DropdownMenuItem>
-                  <DropdownMenuItem
+                  />
+                  <OperationMenuItem
+                    name="Split"
+                    description="Divides documents into multiple parts based on specified criteria, creating new documents for each part."
                     onClick={() =>
                       handleAddOperation("non-LLM", "split", "Untitled Split")
                     }
-                  >
-                    Split
-                  </DropdownMenuItem>
-                  <DropdownMenuItem
+                  />
+                  <OperationMenuItem
+                    name="Gather"
+                    description="Collects and groups related data from multiple documents into a single document based on a common key."
                     onClick={() =>
                       handleAddOperation("non-LLM", "gather", "Untitled Gather")
                     }
-                  >
-                    Gather
-                  </DropdownMenuItem>
-                  <DropdownMenuItem
+                  />
+                  <OperationMenuItem
+                    name="Sample"
+                    description="Randomly selects a subset of documents from your dataset for testing or analysis."
                     onClick={() =>
                       handleAddOperation("non-LLM", "sample", "Untitled Sample")
                     }
-                  >
-                    Sample
-                  </DropdownMenuItem>
+                  />
                   <DropdownMenuSeparator />
-                  <DropdownMenuLabel>Code Operations</DropdownMenuLabel>
+                  <DropdownMenuLabel className="font-bold text-sm bg-muted/50 py-2">
+                    Code Operations
+                  </DropdownMenuLabel>
                   <OperationMenuItem
                     name="Code Map"
                     description="Like the LLM Map operation, but uses a Python function instead of an LLM. Write custom Python code to transform each document."