refine the tool calls

Author: bobbai00

frontend/src/app/workspace/component/copilot-chat/copilot-chat.component.html

@@ -67,19 +67,32 @@
   </div>
 
   <!-- Deep Chat Component (use display to hide/show instead of *ngIf to preserve messages) -->
-  <deep-chat
-    #deepChat
-    class="deep-chat-container"
-    [class.collapsed]="!isExpanded"
-    [style.borderRadius]="'0 0 8px 8px'"
-    [style.width]="'100%'"
-    [style.height]="'calc(100% - 60px)'"
-    [style.border]="'none'"
-    [connect]="deepChatConfig.connect"
-    [demo]="deepChatConfig.demo"
-    [introMessage]="deepChatConfig.introMessage"
-    [textInput]="deepChatConfig.textInput">
-  </deep-chat>
+  <div class="chat-content-wrapper">
+    <deep-chat
+      #deepChat
+      class="deep-chat-container"
+      [class.collapsed]="!isExpanded"
+      [style.borderRadius]="'0 0 8px 8px'"
+      [style.width]="'100%'"
+      [style.height]="'100%'"
+      [style.border]="'none'"
+      [connect]="deepChatConfig.connect"
+      [demo]="deepChatConfig.demo"
+      [introMessage]="deepChatConfig.introMessage"
+      [textInput]="deepChatConfig.textInput"
+      [requestBodyLimits]="deepChatConfig.requestBodyLimits">
+    </deep-chat>
+
+    <!-- Loading overlay to keep visible during processing -->
+    <div
+      *ngIf="isProcessing && isExpanded"
+      class="processing-indicator">
+      <nz-spin
+        nzSimple
+        nzSize="small"></nz-spin>
+      <span>Processing...</span>
+    </div>
+  </div>
 
   <!-- Connection Status -->
   <div

frontend/src/app/workspace/component/copilot-chat/copilot-chat.component.scss

@@ -114,6 +114,14 @@
   }
 }
 
+.chat-content-wrapper {
+  flex: 1;
+  overflow: hidden;
+  position: relative;
+  display: flex;
+  flex-direction: column;
+}
+
 .deep-chat-container {
   flex: 1;
   overflow: hidden;
@@ -123,6 +131,40 @@
   }
 }
 
+.processing-indicator {
+  position: absolute;
+  bottom: 80px;
+  right: 20px;
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 8px 16px;
+  background: rgba(24, 144, 255, 0.95);
+  color: white;
+  border-radius: 20px;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
+  font-size: 13px;
+  z-index: 10;
+  animation: fadeIn 0.3s ease;
+
+  nz-spin {
+    ::ng-deep .ant-spin-dot-item {
+      background-color: white;
+    }
+  }
+}
+
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+    transform: translateY(10px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
 .connection-warning {
   display: flex;
   align-items: center;

frontend/src/app/workspace/component/copilot-chat/copilot-chat.component.ts

@@ -1,5 +1,5 @@
 // copilot-chat.component.ts
-import { Component, OnInit, OnDestroy, ViewChild, ElementRef } from "@angular/core";
+import { Component, OnDestroy, ViewChild, ElementRef } from "@angular/core";
 import { UntilDestroy, untilDestroyed } from "@ngneat/until-destroy";
 import { TexeraCopilot, AgentResponse } from "../../service/copilot/texera-copilot";
 import { CopilotCoeditorService } from "../../service/copilot/copilot-coeditor.service";
@@ -10,14 +10,14 @@ import { CopilotCoeditorService } from "../../service/copilot/copilot-coeditor.s
   templateUrl: "copilot-chat.component.html",
   styleUrls: ["copilot-chat.component.scss"],
 })
-export class CopilotChatComponent implements OnInit, OnDestroy {
+export class CopilotChatComponent implements OnDestroy {
   @ViewChild("deepChat", { static: false }) deepChatElement?: ElementRef;
 
   public isChatVisible = false; // Whether chat panel is shown at all
   public isExpanded = true; // Whether chat content is expanded or minimized
   public showToolResults = false; // Whether to show tool call results
   public isConnected = false;
-  public isProcessing = false;
+  public isProcessing = false; // Whether agent is currently processing a request
   private isInitialized = false;
 
   // Deep-chat configuration
@@ -27,31 +27,36 @@ export class CopilotChatComponent implements OnInit, OnDestroy {
         const last = body?.messages?.[body.messages.length - 1];
         const userText: string = typeof last?.text === "string" ? last.text : "";
 
+        // Set processing state to show loading indicator
+        this.isProcessing = true;
+
         // Send message to copilot and process AgentResponse
         this.copilotService
           .sendMessage(userText)
           .pipe(untilDestroyed(this))
           .subscribe({
             next: (response: AgentResponse) => {
-              // Format the response based on type
-              let displayText = "";
-
               if (response.type === "trace") {
                 // Format tool traces
-                displayText = this.formatToolTrace(response);
+                const displayText = this.formatToolTrace(response);
+
                 // Add trace message via addMessage API
                 if (displayText && this.deepChatElement?.nativeElement?.addMessage) {
                   this.deepChatElement.nativeElement.addMessage({ role: "ai", text: displayText });
                 }
+
+                // Keep processing state true - loading indicator stays visible
               } else if (response.type === "response") {
                 // For final response, signal completion with the content
-                // This will let deep-chat handle adding the message
+                // This will let deep-chat handle adding the message and clearing loading
                 if (response.isDone) {
+                  this.isProcessing = false; // Clear processing state
                   signals.onResponse({ text: response.content });
                 }
               }
             },
             error: (e: unknown) => {
+              this.isProcessing = false; // Clear processing state on error
               signals.onResponse({ error: e ?? "Unknown error" });
             },
           });
@@ -60,6 +65,7 @@ export class CopilotChatComponent implements OnInit, OnDestroy {
     demo: false,
     introMessage: { text: "Hi! I'm Texera Copilot. I can help you build and modify workflows." },
     textInput: { placeholder: { text: "Ask me anything about workflows..." } },
+    requestBodyLimits: { maxMessages: -1 }, // Allow unlimited message history
   };
 
   /**
@@ -140,10 +146,6 @@ export class CopilotChatComponent implements OnInit, OnDestroy {
     private copilotCoeditorService: CopilotCoeditorService
   ) {}
 
-  ngOnInit(): void {
-    // Component initialization - copilot connection is triggered by menu button
-  }
-
   ngOnDestroy(): void {
     // Cleanup when component is destroyed
     this.disconnect();

frontend/src/app/workspace/service/copilot/copilot-coeditor.service.ts

@@ -33,7 +33,7 @@ export class CopilotCoeditorService {
   // Virtual copilot coeditor
   private readonly COPILOT_COEDITOR: Coeditor = {
     uid: -1,
-    name: "AI Agent",
+    name: "AI",
     email: "[email protected]",
     role: "ADMIN" as any,
     color: "#9333ea", // Purple color for copilot

frontend/src/app/workspace/service/copilot/texera-copilot.ts

@@ -32,7 +32,9 @@ import {
   createDeleteOperatorTool,
   createDeleteLinkTool,
   createSetOperatorPropertyTool,
-  createGetDynamicSchemaTool,
+  createGetOperatorSchemaTool,
+  createGetOperatorInputSchemaTool,
+  createGetWorkflowCompilationStateTool,
   createExecuteWorkflowTool,
   createGetExecutionStateTool,
   createHasOperatorResultTool,
@@ -48,6 +50,7 @@ import { DynamicSchemaService } from "../dynamic-schema/dynamic-schema.service";
 import { ExecuteWorkflowService } from "../execute-workflow/execute-workflow.service";
 import { WorkflowResultService } from "../workflow-result/workflow-result.service";
 import { CopilotCoeditorService } from "./copilot-coeditor.service";
+import { WorkflowCompilingService } from "../compile-workflow/workflow-compiling.service";
 
 // API endpoints as constants
 export const COPILOT_MCP_URL = "mcp";
@@ -93,7 +96,8 @@ export class TexeraCopilot {
     private dynamicSchemaService: DynamicSchemaService,
     private executeWorkflowService: ExecuteWorkflowService,
     private workflowResultService: WorkflowResultService,
-    private copilotCoeditorService: CopilotCoeditorService
+    private copilotCoeditorService: CopilotCoeditorService,
+    private workflowCompilingService: WorkflowCompilingService
   ) {
     // Don't auto-initialize, wait for user to enable
   }
@@ -197,7 +201,12 @@ export class TexeraCopilot {
         model: this.model,
         messages: this.messages, // full history
         tools,
-        system: "You are Texera Copilot, an AI assistant for building and modifying data workflows.",
+        system:
+          "You are Texera Copilot, an AI assistant for building and modifying data workflows. " +
+          "Your task is helping user explore the data using operators. " +
+          "Common operators would be Limit to limit the size of data; " +
+          "Aggregate to do some aggregation; and some visualization operator. " +
+          "A good generation style is adding an operator, configuring its property and then executing it to make sure each editing is valid. Generate 3-5 operators is enough for every round of generation",
         stopWhen: stepCountIs(50),
 
         // optional: observe every completed step (tool calls + results available)
@@ -271,11 +280,16 @@ export class TexeraCopilot {
       this.workflowActionService,
       this.copilotCoeditorService
     );
-    const getDynamicSchemaTool = createGetDynamicSchemaTool(
-      this.dynamicSchemaService,
+    const getOperatorSchemaTool = createGetOperatorSchemaTool(
       this.workflowActionService,
+      this.operatorMetadataService,
+      this.copilotCoeditorService
+    );
+    const getOperatorInputSchemaTool = createGetOperatorInputSchemaTool(
+      this.workflowCompilingService,
       this.copilotCoeditorService
     );
+    const getWorkflowCompilationStateTool = createGetWorkflowCompilationStateTool(this.workflowCompilingService);
     const executeWorkflowTool = createExecuteWorkflowTool(this.executeWorkflowService);
     const getExecutionStateTool = createGetExecutionStateTool(this.executeWorkflowService);
     const hasOperatorResultTool = createHasOperatorResultTool(
@@ -308,7 +322,9 @@ export class TexeraCopilot {
       deleteOperator: deleteOperatorTool,
       deleteLink: deleteLinkTool,
       setOperatorProperty: setOperatorPropertyTool,
-      getDynamicSchema: getDynamicSchemaTool,
+      getOperatorSchema: getOperatorSchemaTool,
+      getOperatorInputSchema: getOperatorInputSchemaTool,
+      getWorkflowCompilationState: getWorkflowCompilationStateTool,
       executeWorkflow: executeWorkflowTool,
       getExecutionState: getExecutionStateTool,
       hasOperatorResult: hasOperatorResultTool,