@stack-spot/ai-chat-widget 1.27.1 → 1.28.1-beta.1

package/src/views/MessageInput/index.tsx

@@ -8,6 +8,7 @@ import { quickCommandRegex } from '../../regex'
 import { ChatEntry } from '../../state/ChatEntry'
 import { checkIsTrial } from '../../utils/check-is-trial'
 import { UploadProvider } from '../../utils/upload/context'
+import { usePasteUpload } from '../../utils/upload/use-paste-upload'
 import { AgentSelector } from './AgentSelector'
 import { ButtonAgent } from './ButtonAgent'
 import { ButtonBar } from './ButtonBar'
@@ -17,6 +18,7 @@ import { useMessageInputDictionary } from './dictionary'
 import { QuickCommandSelector } from './QuickCommandSelector'
 import { MAX_INPUT_HEIGHT, MessageInputBox, MIN_INPUT_HEIGHT } from './styled'
 import { UploadBar } from './UploadBar'
+import { UploadDragNDrop, useUploadDragDrop } from './UploadDragNDrop'
 
 /**
  * This renders the MessageInput part of the layout which includes the progress bar, the actual textarea, the badges telling what is
@@ -36,6 +38,13 @@ export const MessageInput = () => {
   const agentLabel = useCurrentChatState('agent')?.label
   const { handleKeyDown, handleKeyUp } = useUserEntryHistoryShortcut()
   const isTrial = checkIsTrial()
+  const { isDragging, handleDrop, handleDragLeave } = useUploadDragDrop()
+
+  usePasteUpload({
+    textAreaRef,
+    onUploadFiles: files => chat.uploadManager.add(files),
+    enabled: !isLoading,
+  })
 
   const checkSendRequirements = useCallback(() => {
     if (chat.uploadManager.status === 'error') {
@@ -112,7 +121,13 @@ export const MessageInput = () => {
             <ButtonAgent />
             <AdaptiveTextArea
               ref={textAreaRef}
-              placeholder={agentLabel && interpolate(t.placeholder, agentLabel)}
+              placeholder={
+                isDragging
+                  ? t.uploadDragging
+                  : agentLabel
+                    ? interpolate(t.placeholder, agentLabel)
+                    : t.typing
+              }
               onChange={e => chat.set('nextMessage', e.target.value)}
               value={value}
               onFocus={() => setFocused(true)}
@@ -130,6 +145,7 @@ export const MessageInput = () => {
         <ContextBar />
         {chat.get('features').upload && <UploadBar />}
         <ButtonBar onSend={onSend} isLoading={isLoading} />
+        <UploadDragNDrop isDragging={isDragging} onDrop={handleDrop} onDragLeave={handleDragLeave} />
       </MessageInputBox>
     </UploadProvider>
   )

package/src/views/Tools.tsx

@@ -1,4 +1,4 @@
-import { agentClient } from '@stack-spot/portal-network'
+import { agentToolsClient } from '@stack-spot/portal-network'
 import { Dictionary, useTranslate } from '@stack-spot/portal-translate'
 import { useEffect, useMemo } from 'react'
 import styled from 'styled-components'
@@ -40,8 +40,9 @@ const ToolsPanel = () => {
     const chat = widget.chatTabs.getAll().find(c => c.id === chatId)
     return chat?.getMessages().find(m => m.id === messageId)?.getValue()
   }, [messageId])
-  const [agent] = agentClient.agent.useStatefulQuery({ agentId: message?.agent?.id ?? '' }, { enabled: !!message?.agent?.id })
-  const tools = useMemo(() => message?.tools?.map(id => toolById(id, agent?.toolkits) ?? { id }), [messageId, agent])
+
+  const [toolKits] = agentToolsClient.tools.useStatefulQuery({}, { enabled: !!message?.agent?.id })
+  const tools = useMemo(() => message?.tools?.map(id => toolById(id, toolKits) ?? { id }), [messageId, toolKits])
 
   return !!tools?.length && (
     <ToolList>

package/src/views/Workspaces/WorkspacesTab.tsx

@@ -60,7 +60,7 @@ export const WorkspaceResources = ({ workspaceId, allKS, agent, stack }: Omit<Ta
   const handleNavigate = (resource: WorkspaceResource) => {
     startTransition(() => {
       if (resource.resourceType === 'agent')
-        navigate({ component: 'agent', props: { visibility: 'WORKSPACE', agent, workspaceId, showSubmitButton }, fullScreen: true })
+        navigate({ component: 'agent', props: { visibility: 'workspace', agent, workspaceId, showSubmitButton }, fullScreen: true })
 
       if (resource.resourceType === 'ks')
         navigate({ component: 'ks', props: { visibility: 'workspace', allKS, workspaceId, showSubmitButton }, fullScreen: true })