@stack-spot/ai-chat-widget 2.1.0-beta.1 → 2.1.1

package/src/views/Chat/styled.ts

@@ -243,27 +243,20 @@ export const ChatList: IStyledComponentBase<
   }
 
   .steps {
-    .steps-list {
+    ul {
       list-style: none;
       margin: 0;
       padding: 0;
       display: flex;
       flex-direction: column;
       gap: 6px;
-    }
-
-    .tools-list {
-      list-style: disc;
-      margin: 0;
-      padding-left: 24px;
-      display: block;
-      ::marker {
-        color: ${theme.color.light.contrastText};
-      }
-    }
 
-    ul {
       li {
+        display: flex;
+        flex-direction: row;
+        gap: 4px;
+        align-items: center;
+
         &[role="button"] {
           cursor: pointer;
         }

package/src/views/Steps/FlowChart/NodeStep.tsx

@@ -37,7 +37,7 @@ export const NodeStep = ({ data: { step, index, nextStatus, onClick } }: Props)
         {!!step.attempts[0].tools?.length && <StackedBadge
           label={t.tools}
           images={step.attempts[0].tools?.slice(0, 3).map(
-            tool => ({ key: tool.id, name: tool.name ?? '', url: tool.image, icon: <Icon icon="Cog" /> }),
+            tool => ({ key: tool.id, name: tool.name, url: tool.image, icon: <Icon icon="Cog" /> }),
           )}
         />}
       </div>}

package/src/views/Steps/FlowChart/layout.ts

@@ -8,7 +8,6 @@ const nodesSizes = {
   step: stepNodeSize,
   planning: planningNodeSize,
   answer: answerNodeSize,
-  tool: stepNodeSize,
 }
 
 export function useLayoutedElements(nodes: NodeWithoutLayout[], edges: Edge[]) {

package/src/views/Steps/FlowChart/types.ts

@@ -9,6 +9,6 @@ export interface NodeData {
 
 export interface NodeWithoutLayout {
   id: string,
-  type: 'step' | 'planning' | 'answer' | 'tool',
+  type: 'step' | 'planning' | 'answer',
   data?: NodeData,
 }

package/src/views/Steps/StepModal.tsx

@@ -127,7 +127,7 @@ export const StepModal = ({ message, stepId, onClose }: Props) => {
 
   const tools = step?.type === 'step' ? step.attempts[attempt]?.tools?.map(tool => (
     <div className="tool" key={tool.id}>
-      <ToolBadge name={tool.name ?? ''} duration={tool.duration} image={tool.image} description={tool.description} />
+      <ToolBadge name={tool.name} duration={tool.duration} image={tool.image} description={tool.description} />
       {tool.input && <>
         <Text appearance="microtext1" color="light.700">{t.input}:</Text>
         <Code language="json" className="tool-input" showLineNumbers={false} showActionBar>{tool.input}</Code>
@@ -191,7 +191,7 @@ export const StepModal = ({ message, stepId, onClose }: Props) => {
               {!!s.attempts[0].tools?.length && <ul className="side-by-side-tools">
                 {s.attempts[0].tools.map((tool) => (
                   <li key={tool.id}>
-                    <ToolBadge name={tool.name ?? ''} image={tool.image} />
+                    <ToolBadge name={tool.name} image={tool.image} />
                   </li>
                 ))}
               </ul>}

package/dist/utils/planning-tool.d.ts

@@ -1,14 +0,0 @@
-declare class PlanningToolDictionaryHelper {
-    static instance: PlanningToolDictionaryHelper | undefined;
-    private toolExecutionIdPlanningStep;
-    private toolExecutionIdToolStep;
-    private constructor();
-    static create(): PlanningToolDictionaryHelper;
-    setMessageIdPlanningStepToolExecutionId(messageId: string, toolExecutionId: string): void;
-    setMessageIdToolStepToolExecutionId(messageId: string, toolExecutionId: string): void;
-    getMessageIdPlanningStepFromToolExecutionId(toolExecutionId: string): string;
-    getMessageIdToolStepFromToolExecutionId(toolExecutionId: string): string;
-}
-export declare const planningToolDictionaryHelper: PlanningToolDictionaryHelper;
-export {};
-//# sourceMappingURL=planning-tool.d.ts.map

package/dist/utils/planning-tool.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"planning-tool.d.ts","sourceRoot":"","sources":["../../src/utils/planning-tool.ts"],"names":[],"mappings":"AAAA,cAAM,4BAA4B;IAChC,MAAM,CAAC,QAAQ,EAAE,4BAA4B,GAAG,SAAS,CAAA;IACzD,OAAO,CAAC,2BAA2B,CAA6B;IAChE,OAAO,CAAC,uBAAuB,CAA6B;IAE5D,OAAO;IAIP,MAAM,CAAC,MAAM;IAIb,uCAAuC,CAAC,SAAS,EAAE,MAAM,EAAE,eAAe,EAAE,MAAM;IAIlF,mCAAmC,CAAC,SAAS,EAAE,MAAM,EAAE,eAAe,EAAE,MAAM;IAI9E,2CAA2C,CAAC,eAAe,EAAE,MAAM;IAInE,uCAAuC,CAAC,eAAe,EAAE,MAAM;CAGhE;AAED,eAAO,MAAM,4BAA4B,8BAAwC,CAAA"}

package/dist/utils/planning-tool.js

@@ -1,25 +0,0 @@
-class PlanningToolDictionaryHelper {
-    static instance;
-    toolExecutionIdPlanningStep = {};
-    toolExecutionIdToolStep = {};
-    constructor() {
-        PlanningToolDictionaryHelper.instance = this;
-    }
-    static create() {
-        return PlanningToolDictionaryHelper.instance ?? new PlanningToolDictionaryHelper();
-    }
-    setMessageIdPlanningStepToolExecutionId(messageId, toolExecutionId) {
-        this.toolExecutionIdPlanningStep[toolExecutionId] = messageId;
-    }
-    setMessageIdToolStepToolExecutionId(messageId, toolExecutionId) {
-        this.toolExecutionIdToolStep[toolExecutionId] = messageId;
-    }
-    getMessageIdPlanningStepFromToolExecutionId(toolExecutionId) {
-        return this.toolExecutionIdPlanningStep[toolExecutionId];
-    }
-    getMessageIdToolStepFromToolExecutionId(toolExecutionId) {
-        return this.toolExecutionIdToolStep[toolExecutionId];
-    }
-}
-export const planningToolDictionaryHelper = PlanningToolDictionaryHelper.create();
-//# sourceMappingURL=planning-tool.js.map

package/dist/utils/planning-tool.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"planning-tool.js","sourceRoot":"","sources":["../../src/utils/planning-tool.ts"],"names":[],"mappings":"AAAA,MAAM,4BAA4B;IAChC,MAAM,CAAC,QAAQ,CAA0C;IACjD,2BAA2B,GAA2B,EAAE,CAAA;IACxD,uBAAuB,GAA2B,EAAE,CAAA;IAE5D;QACE,4BAA4B,CAAC,QAAQ,GAAG,IAAI,CAAA;IAC9C,CAAC;IAED,MAAM,CAAC,MAAM;QACX,OAAO,4BAA4B,CAAC,QAAQ,IAAI,IAAI,4BAA4B,EAAE,CAAA;IACpF,CAAC;IAED,uCAAuC,CAAC,SAAiB,EAAE,eAAuB;QAChF,IAAI,CAAC,2BAA2B,CAAC,eAAe,CAAC,GAAG,SAAS,CAAA;IAC/D,CAAC;IAED,mCAAmC,CAAC,SAAiB,EAAE,eAAuB;QAC5E,IAAI,CAAC,uBAAuB,CAAC,eAAe,CAAC,GAAG,SAAS,CAAA;IAC3D,CAAC;IAED,2CAA2C,CAAC,eAAuB;QACjE,OAAO,IAAI,CAAC,2BAA2B,CAAC,eAAe,CAAC,CAAA;IAC1D,CAAC;IAED,uCAAuC,CAAC,eAAuB;QAC7D,OAAO,IAAI,CAAC,uBAAuB,CAAC,eAAe,CAAC,CAAA;IACtD,CAAC;CACF;AAED,MAAM,CAAC,MAAM,4BAA4B,GAAG,4BAA4B,CAAC,MAAM,EAAE,CAAA"}

package/dist/utils/update-tool-step.d.ts

@@ -1,3 +0,0 @@
-import { ChatEntry } from '../state/ChatEntry.js';
-export declare const updateToolStep: (messages: ChatEntry[], executionId: string, newStatus: "pending" | "running" | "success" | "error" | "awaiting_approval") => void;
-//# sourceMappingURL=update-tool-step.d.ts.map

package/dist/utils/update-tool-step.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"update-tool-step.d.ts","sourceRoot":"","sources":["../../src/utils/update-tool-step.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAiB,MAAM,oBAAoB,CAAA;AAG7D,eAAO,MAAM,cAAc,aAAc,SAAS,EAAE,eAAe,MAAM,aAC5D,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,mBAAmB,SAsB7E,CAAA"}

package/dist/utils/update-tool-step.js

@@ -1,23 +0,0 @@
-import { planningToolDictionaryHelper } from './planning-tool.js';
-export const updateToolStep = (messages, executionId, newStatus) => {
-    // if last message is a user message, no update in tool status is needed
-    if (messages[messages.length - 1].getValue().agentType === 'user')
-        return;
-    const messageId = planningToolDictionaryHelper.getMessageIdPlanningStepFromToolExecutionId(executionId);
-    const message = messages.find((message) => `${message.id}` === messageId);
-    let update = false;
-    const messageValue = message?.getValue();
-    messageValue?.steps?.map((step) => {
-        if (step.type === 'step') {
-            const tool = step.attempts?.[0].tools?.[0];
-            if (tool?.executionId === executionId && step.status !== newStatus) {
-                step.status = newStatus;
-                update = true;
-            }
-        }
-    });
-    if (update) {
-        message?.setValue({ ...messageValue });
-    }
-};
-//# sourceMappingURL=update-tool-step.js.map

package/dist/utils/update-tool-step.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"update-tool-step.js","sourceRoot":"","sources":["../../src/utils/update-tool-step.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,4BAA4B,EAAE,MAAM,iBAAiB,CAAA;AAE9D,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,QAAqB,EAAE,WAAmB,EACvE,SAA4E,EAAE,EAAE;IAEhF,wEAAwE;IACxE,IAAI,QAAQ,CAAC,QAAQ,CAAC,MAAM,GAAC,CAAC,CAAC,CAAC,QAAQ,EAAE,CAAC,SAAS,KAAK,MAAM;QAAE,OAAM;IAEvE,MAAM,SAAS,GAAG,4BAA4B,CAAC,2CAA2C,CAAC,WAAW,CAAC,CAAA;IACvG,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,GAAG,OAAO,CAAC,EAAE,EAAE,KAAK,SAAS,CAAC,CAAA;IACzE,IAAI,MAAM,GAAG,KAAK,CAAA;IAClB,MAAM,YAAY,GAAG,OAAO,EAAE,QAAQ,EAAE,CAAA;IACxC,YAAY,EAAE,KAAK,EAAE,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE;QAChC,IAAI,IAAI,CAAC,IAAI,KAAK,MAAM,EAAE,CAAC;YACzB,MAAM,IAAI,GAAG,IAAI,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,CAAA;YAC1C,IAAI,IAAI,EAAE,WAAW,KAAK,WAAW,IAAI,IAAI,CAAC,MAAM,KAAK,SAAS,EAAE,CAAC;gBACnE,IAAI,CAAC,MAAM,GAAG,SAAS,CAAA;gBACvB,MAAM,GAAG,IAAI,CAAA;YACf,CAAC;QACH,CAAC;IACH,CAAC,CAAC,CAAA;IAEF,IAAI,MAAM,EAAE,CAAC;QACX,OAAO,EAAE,QAAQ,CAAC,EAAE,GAAG,YAA6B,EAAE,CAAC,CAAA;IACzD,CAAC;AACH,CAAC,CAAA"}

package/src/utils/planning-tool.ts

@@ -1,32 +0,0 @@
-class PlanningToolDictionaryHelper {
-  static instance: PlanningToolDictionaryHelper | undefined
-  private toolExecutionIdPlanningStep: Record<string, string> = {}
-  private toolExecutionIdToolStep: Record<string, string> = {}
-
-  private constructor() {
-    PlanningToolDictionaryHelper.instance = this
-  }
-
-  static create() {
-    return PlanningToolDictionaryHelper.instance ?? new PlanningToolDictionaryHelper()
-  }
-
-  setMessageIdPlanningStepToolExecutionId(messageId: string, toolExecutionId: string){
-    this.toolExecutionIdPlanningStep[toolExecutionId] = messageId
-  }
-
-  setMessageIdToolStepToolExecutionId(messageId: string, toolExecutionId: string){
-    this.toolExecutionIdToolStep[toolExecutionId] = messageId
-  }
-
-  getMessageIdPlanningStepFromToolExecutionId(toolExecutionId: string){
-    return this.toolExecutionIdPlanningStep[toolExecutionId]
-  }
-
-  getMessageIdToolStepFromToolExecutionId(toolExecutionId: string){
-    return this.toolExecutionIdToolStep[toolExecutionId]
-  }
-}
-
-export const planningToolDictionaryHelper = PlanningToolDictionaryHelper.create()
-

package/src/utils/update-tool-step.tsx

@@ -1,27 +0,0 @@
-import { ChatEntry, TextChatEntry } from '../state/ChatEntry'
-import { planningToolDictionaryHelper } from './planning-tool'
-
-export const updateToolStep = (messages: ChatEntry[], executionId: string, 
-  newStatus: 'pending' | 'running' | 'success' | 'error' | 'awaiting_approval') => {
-  
-  // if last message is a user message, no update in tool status is needed
-  if (messages[messages.length-1].getValue().agentType === 'user') return
-  
-  const messageId = planningToolDictionaryHelper.getMessageIdPlanningStepFromToolExecutionId(executionId)
-  const message = messages.find((message) => `${message.id}` === messageId)
-  let update = false
-  const messageValue = message?.getValue()
-  messageValue?.steps?.map((step) => {
-    if (step.type === 'step') {
-      const tool = step.attempts?.[0].tools?.[0]
-      if (tool?.executionId === executionId && step.status !== newStatus) {
-        step.status = newStatus
-        update = true
-      }
-    }
-  })
-  
-  if (update) {
-    message?.setValue({ ...messageValue as TextChatEntry })
-  }
-}