@smartspace/chat-ui 1.13.1-dev.aa44752 → 1.13.1-dev.b59850a

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024 Smartspace.ai
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/index.d.ts

@@ -238,6 +238,14 @@ type MessageThread = {
     totalMessages: number;
     pinned: boolean;
     workSpaceId: string;
+    /**
+     * Monotonic version of when this summary was emitted (epoch ms). Used by
+     * `applyThreadToCache` to reject stale writes — e.g. a SignalR summary
+     * landing after a fresher SSE thread frame because the server's DB write
+     * lagged Redis. Mappers derive this from `lastUpdatedAt`; client-side
+     * writers like `ensureDraftThread` use `Date.now()`.
+     */
+    summaryEmittedAt: number;
 };
 type ThreadsResponse = {
     data: MessageThread[];
@@ -269,7 +277,6 @@ type Workspace = {
     firstPrompt: string;
     outputSchema?: unknown;
     inputs?: unknown;
-    isPromptAndResponseLoggingEnabled: boolean;
     variables: Variables;
     sandBoxThreadId?: string;
     supportsFiles: boolean;
@@ -969,20 +976,6 @@ declare function mapMentionUserDtoToModel(dto: MentionUserDto): MentionUser;
 declare function mapWorkspaceDtoToModel(dto: WorkspaceDto): Workspace;
 declare const mapWorkspacesDtoToModels: (arr: WorkspacesListItemDto[]) => Workspace[];
 
-/**
- * Write a freshly-observed thread (from SignalR or an SSE thread frame)
- * directly into the relevant query caches so subscribers paint without a
- * refetch roundtrip.
- *
- * - Merges into `threadsKeys.detail(workspaceId, thread.id)`.
- * - Splices into every threads-list cache for the workspace, handling both
- *   finite `ThreadsResponse` and infinite `{ pages, pageParams }` shapes.
- *
- * Returns `true` when the thread was found in at least one list cache.
- * Callers that need to surface brand-new threads (e.g. another user just
- * created one) can fall back to invalidating the list queries when this
- * returns `false`.
- */
 declare function applyThreadToCache(qc: QueryClient, thread: MessageThread): boolean;
 /**
  * Invalidate every threads-list cache for a workspace. Use as a fallback when

package/dist/index.js

@@ -1,7 +1,7 @@
 import MuiButton from '@mui/material/Button';
 import IconButton from '@mui/material/IconButton';
 import { Loader2, Check, X, Paperclip, ArrowBigUp, Minimize2, AlertTriangle, FileImage, FileVideo, FileAudio, FileArchive, FileCode, FileSpreadsheet, Presentation, FileText, ChevronUp, ExternalLink, Copy, Download } from 'lucide-react';
-import * as React8 from 'react';
+import * as React9 from 'react';
 import { createContext, forwardRef, useImperativeHandle, useRef, useState, useEffect, useMemo, useCallback, createElement, useContext } from 'react';
 import { createPortal } from 'react-dom';
 import { useQuery, queryOptions, useQueryClient, useMutation, skipToken } from '@tanstack/react-query';
@@ -1687,7 +1687,7 @@ var buttonVariants = cva(
     }
   }
 );
-var Button = React8.forwardRef(
+var Button = React9.forwardRef(
   ({ className, variant, size, asChild = false, ...props }, ref) => {
     const Comp = asChild ? Slot : "button";
     return /* @__PURE__ */ jsx(
@@ -2902,6 +2902,128 @@ var modelIdRendererTester = rankWith(
   }
 );
 var ModelIdRendererControl = withJsonFormsControlProps(ModelIdRenderer);
+var NumberRenderer = ({
+  data,
+  handleChange,
+  path: path2,
+  label,
+  description,
+  errors,
+  schema,
+  uischema,
+  visible,
+  enabled,
+  required
+}) => {
+  const isInteger = schema?.type === "integer";
+  const handleInputChange = useCallback(
+    (event) => {
+      const raw2 = event.target.value;
+      if (raw2 === "") {
+        handleChange(path2, void 0);
+        return;
+      }
+      const parsed = isInteger ? parseInt(raw2, 10) : parseFloat(raw2);
+      if (Number.isNaN(parsed)) {
+        handleChange(path2, void 0);
+        return;
+      }
+      handleChange(path2, parsed);
+    },
+    [handleChange, path2, isInteger]
+  );
+  if (!visible) return null;
+  const readOnly = uischema?.access === "Read";
+  const isDisabled = !enabled || readOnly;
+  const hasError = !!errors && errors.length > 0;
+  const fieldSchema = schema;
+  const min = fieldSchema?.minimum;
+  const max = fieldSchema?.maximum;
+  const step = isInteger ? 1 : fieldSchema?.multipleOf ?? "any";
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: "ss-jsonforms-field ss-jsonforms-number",
+      style: {
+        display: "inline-flex",
+        flexDirection: "row",
+        alignItems: "center",
+        gap: 8,
+        minHeight: "40px"
+      },
+      children: [
+        label && /* @__PURE__ */ jsxs(
+          "label",
+          {
+            htmlFor: `number-${path2}`,
+            style: {
+              color: hasError ? "#ef4444" : "#475569",
+              fontSize: "0.875rem",
+              fontWeight: 500,
+              whiteSpace: "nowrap",
+              lineHeight: "24px"
+            },
+            children: [
+              label,
+              required && /* @__PURE__ */ jsx("span", { style: { color: "#ef4444", marginLeft: "0.25rem" }, children: "*" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            id: `number-${path2}`,
+            type: "number",
+            value: data ?? "",
+            onChange: handleInputChange,
+            disabled: isDisabled,
+            min,
+            max,
+            step,
+            style: {
+              width: "80px",
+              height: "24px",
+              padding: "0 0.5rem",
+              border: hasError ? "2px solid #ef4444" : "1px solid #d1d5db",
+              borderRadius: "6px",
+              fontSize: "0.875rem",
+              lineHeight: "24px",
+              fontFamily: "inherit",
+              backgroundColor: isDisabled ? "#f9fafb" : "#ffffff",
+              color: isDisabled ? "#9ca3af" : "#111827",
+              outline: "none",
+              boxSizing: "border-box"
+            }
+          }
+        ),
+        hasError && /* @__PURE__ */ jsx(
+          "div",
+          {
+            style: {
+              color: "#ef4444",
+              fontSize: "0.75rem"
+            },
+            children: errors
+          }
+        )
+      ]
+    }
+  );
+};
+var numberRendererTester = rankWith(
+  40,
+  (uischema, schema) => {
+    if (uischema.type !== "Control") return false;
+    const propertyPath = uischema.scope.replace(
+      "#/properties/",
+      ""
+    );
+    const fieldSchema = schema?.properties?.[propertyPath];
+    if (!fieldSchema) return false;
+    return fieldSchema.type === "integer" || fieldSchema.type === "number";
+  }
+);
+var NumberRendererControl = withJsonFormsControlProps(NumberRenderer);
 var TextareaRenderer = ({
   data,
   handleChange,
@@ -3071,6 +3193,7 @@ var renderers = [
   { tester: modelIdRendererTester, renderer: ModelIdRendererControl },
   { tester: booleanRendererTester, renderer: BooleanRendererControl },
   { tester: dropdownRendererTester, renderer: DropdownRendererControl },
+  { tester: numberRendererTester, renderer: NumberRendererControl },
   { tester: textareaRendererTester, renderer: TextareaRendererControl },
   ...vanillaRenderers,
   { tester: jsonEditorTester, renderer: JsonEditorRendererControl }
@@ -3124,26 +3247,26 @@ function useChatVariablesFormVm({
   const { mutate: updateVariableMutation } = useUpdateFlowRunVariable();
   const querySettled = !isLoading && (threadVars !== void 0 || isError);
   const shouldUseDefaults = isError || threadVars && Object.keys(threadVars).length === 0;
-  const built = React8.useMemo(() => {
+  const built = React9.useMemo(() => {
     return buildSimpleSchemaAndUi(
       workspace.variables,
       threadVars,
       shouldUseDefaults ?? false
     );
   }, [workspace.variables, threadVars, shouldUseDefaults]);
-  const [data, setData] = React8.useState(null);
-  React8.useEffect(() => {
+  const [data, setData] = React9.useState(null);
+  React9.useEffect(() => {
     if (querySettled) {
       setData(built.initialData);
       setVariables(built.initialData);
     }
   }, [querySettled, built.initialData, setVariables]);
-  const ajv = React8.useMemo(() => createAjv({ useDefaults: false }), []);
-  const prevRef = React8.useRef(null);
-  React8.useEffect(() => {
+  const ajv = React9.useMemo(() => createAjv({ useDefaults: false }), []);
+  const prevRef = React9.useRef(null);
+  React9.useEffect(() => {
     prevRef.current = data;
   }, [data]);
-  const onChange = React8.useCallback(
+  const onChange = React9.useCallback(
     ({ data: next2 }) => {
       if (prevRef.current && !isDraftThreadId(threadId)) {
         const keys2 = Object.keys(workspace.variables || {});
@@ -3164,7 +3287,7 @@ function useChatVariablesFormVm({
     },
     [workspace.variables, setVariables, updateVariableMutation, threadId]
   );
-  const config = React8.useMemo(
+  const config = React9.useMemo(
     () => ({
       restrict: true,
       trim: false,
@@ -3233,7 +3356,20 @@ var threadsKeys = {
 };
 
 // src/domains/threads/cache.ts
+function isStaleSummary(incoming, existing) {
+  if (!existing) return false;
+  if (typeof existing.summaryEmittedAt !== "number") return false;
+  if (typeof incoming.summaryEmittedAt !== "number") return false;
+  if (incoming.summaryEmittedAt >= existing.summaryEmittedAt) return false;
+  return existing.isFlowRunning === false && incoming.isFlowRunning === true;
+}
 function applyThreadToCache(qc, thread) {
+  const existingDetail = qc.getQueryData(
+    threadsKeys.detail(thread.workSpaceId, thread.id)
+  );
+  if (isStaleSummary(thread, existingDetail)) {
+    return false;
+  }
   qc.setQueryData(
     threadsKeys.detail(thread.workSpaceId, thread.id),
     (old) => ({ ...old ?? thread, ...thread })
@@ -3254,6 +3390,7 @@ function applyThreadToCache(qc, thread) {
           if (!page?.data) return page;
           const idx2 = page.data.findIndex((t) => t.id === thread.id);
           if (idx2 === -1) return page;
+          if (isStaleSummary(thread, page.data[idx2])) return page;
           changed = true;
           foundInList = true;
           const nextData2 = page.data.slice();
@@ -3266,6 +3403,7 @@ function applyThreadToCache(qc, thread) {
       if (!list2.data) return old;
       const idx = list2.data.findIndex((t) => t.id === thread.id);
       if (idx === -1) return old;
+      if (isStaleSummary(thread, list2.data[idx])) return old;
       foundInList = true;
       const nextData = list2.data.slice();
       nextData[idx] = { ...nextData[idx], ...thread };
@@ -3335,36 +3473,40 @@ var {
   messageThreadsGetMessageThreadWorkspacesWorkspaceIdMessagethreadsIdResponse: threadResponseSchema
 } = ChatZod;
 function mapThreadDtoToModel(dto) {
+  const lastUpdatedAt = utcDate(dto.lastUpdatedAt);
   return {
     id: dto.id,
     createdAt: utcDate(dto.createdAt),
     createdBy: dto.createdBy ?? "",
     createdByUserId: dto.createdByUserId,
     isFlowRunning: dto.isFlowRunning,
-    lastUpdatedAt: utcDate(dto.lastUpdatedAt),
+    lastUpdatedAt,
     lastUpdatedByUserId: dto.lastUpdatedByUserId,
     name: dto.name ?? "",
     totalMessages: dto.totalMessages,
     pinned: dto.favorited,
-    workSpaceId: dto.workSpaceId
+    workSpaceId: dto.workSpaceId,
+    summaryEmittedAt: lastUpdatedAt.getTime()
   };
 }
 function mapThreadsResponseDtoToModel(dto) {
   return { data: dto.data.map(mapThreadDtoToModel), total: dto.total };
 }
 function mapSignalRThreadSummaryToModel(summary) {
+  const lastUpdatedAt = utcDate(summary.lastUpdatedAt);
   return {
     id: summary.id,
     createdAt: utcDate(summary.createdAt),
     createdBy: summary.createdBy ?? "",
     createdByUserId: summary.createdByUserId,
     isFlowRunning: summary.isFlowRunning,
-    lastUpdatedAt: utcDate(summary.lastUpdatedAt),
+    lastUpdatedAt,
     lastUpdatedByUserId: summary.lastUpdatedByUserId,
     name: summary.name ?? "",
     totalMessages: summary.totalMessages,
     pinned: summary.favorited,
-    workSpaceId: summary.workSpaceId
+    workSpaceId: summary.workSpaceId,
+    summaryEmittedAt: lastUpdatedAt.getTime()
   };
 }
 var threadDetailOptions = ({
@@ -3457,6 +3599,15 @@ var messagesMutationsKeys = {
 };
 
 // src/domains/messages/mutations.ts
+function reconcileWithMessage(old, incoming, onDuplicate = "keep-existing") {
+  const stable = old.filter((m) => !m.optimistic);
+  const idx = stable.findIndex((m) => m.id === incoming.id);
+  if (idx === -1) return [...stable, incoming];
+  if (onDuplicate === "keep-existing") return stable;
+  const copy = stable.slice();
+  copy[idx] = incoming;
+  return copy;
+}
 function useSendMessage() {
   const qc = useQueryClient();
   const { userId, displayName: userName } = useChatIdentity();
@@ -3540,7 +3691,10 @@ function useSendMessage() {
         toast.error("There was an error posting your message");
         throw err;
       }
-      qc.setQueryData(messagesKeys.list(threadId), [realMessage]);
+      qc.setQueryData(
+        messagesKeys.list(threadId),
+        (old = []) => reconcileWithMessage(old, realMessage)
+      );
       qc.setQueryData(
         threadsKeys.detail(workspaceId, threadId),
         (old) => old ? { ...old, isFlowRunning: true } : old
@@ -3596,14 +3750,10 @@ function useAddInputToMessage() {
       });
     },
     onSuccess: (message, { threadId }) => {
-      qc.setQueryData(messagesKeys.list(threadId), (old = []) => {
-        const stable = old.filter((x) => !x.optimistic);
-        const idx = stable.findIndex((x) => x.id === message.id);
-        if (idx === -1) return [...stable, message];
-        const copy = stable.slice();
-        copy[idx] = message;
-        return copy;
-      });
+      qc.setQueryData(
+        messagesKeys.list(threadId),
+        (old = []) => reconcileWithMessage(old, message, "replace")
+      );
     },
     onError: (_e, { threadId }) => {
       qc.setQueryData(
@@ -19050,7 +19200,7 @@ function getAvatarColour(name) {
   const textColor = brightness > 128 ? "#000000" : "#FFFFFF";
   return { backgroundColor, textColor };
 }
-var Avatar = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var Avatar = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   "div",
   {
     ref,
@@ -19062,7 +19212,7 @@ var Avatar = React8.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */
   }
 ));
 Avatar.displayName = "Avatar";
-var AvatarImage = React8.forwardRef(({ className, alt, src, children: children2, ...props }, _ref) => /* @__PURE__ */ jsx(
+var AvatarImage = React9.forwardRef(({ className, alt, src, children: children2, ...props }, _ref) => /* @__PURE__ */ jsx(
   MuiAvatar,
   {
     className: cn("aspect-square h-full w-full", className),
@@ -19073,7 +19223,7 @@ var AvatarImage = React8.forwardRef(({ className, alt, src, children: children2,
   }
 ));
 AvatarImage.displayName = "AvatarImage";
-var AvatarFallback = React8.forwardRef(
+var AvatarFallback = React9.forwardRef(
   ({ className, colored = true, ...props }, ref) => {
     const childText = String(props.children ?? "");
     const colours = colored ? getAvatarColour(childText) : void 0;
@@ -19663,7 +19813,8 @@ var MessageItem = ({
     groupType = v.type;
     const name = v.name.toLowerCase();
     switch (name) {
-      case "variables": {
+      case "variables":
+      case "userinfo": {
         continue;
       }
       case "status": {
@@ -19804,6 +19955,10 @@ function MessageList({
   const messagesEndRef = useRef(null);
   const prevMessageCountRef = useRef(0);
   const hasInitialScrollRef = useRef(false);
+  const everHadMessagesRef = useRef({
+    threadId: "",
+    had: false
+  });
   const isMobile = useIsMobile();
   const { data: activeWorkspace } = useWorkspace(workspaceId);
   const [isAtBottom, setIsAtBottom] = useState(true);
@@ -19875,8 +20030,15 @@ function MessageList({
     ro.observe(content);
     return () => ro.disconnect();
   }, [isAtBottom, scrollToBottom]);
+  const safeMessages = messages ?? [];
+  if (everHadMessagesRef.current.threadId !== threadId) {
+    everHadMessagesRef.current = { threadId, had: safeMessages.length > 0 };
+  } else if (safeMessages.length > 0) {
+    everHadMessagesRef.current.had = true;
+  }
+  const hadMessagesBefore = everHadMessagesRef.current.had;
   const isLoading = isChoosingThread || (threadPending || threadFetching) && !thread || (messagesPending || messagesFetching) && messages === void 0;
-  if (isLoading) {
+  if (isLoading && !hadMessagesBefore) {
     return /* @__PURE__ */ jsx(
       "div",
       {
@@ -19892,7 +20054,7 @@ function MessageList({
       }
     );
   }
-  if (threadError || messagesError) {
+  if ((threadError || messagesError) && !hadMessagesBefore) {
     return /* @__PURE__ */ jsx("div", { className: "flex flex-1 items-center justify-center p-6", children: /* @__PURE__ */ jsxs("div", { className: "w-full max-w-md space-y-3", children: [
       threadError && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 rounded-md border border-destructive/30 bg-destructive/10 px-3 py-2 text-destructive", children: [
         /* @__PURE__ */ jsx(AlertTriangle, { className: "h-4 w-4" }),
@@ -19904,8 +20066,7 @@ function MessageList({
       ] })
     ] }) });
   }
-  const safeMessages = messages ?? [];
-  if (safeMessages.length === 0) {
+  if (safeMessages.length === 0 && !hadMessagesBefore) {
     return /* @__PURE__ */ jsxs("div", { className: "flex overflow-auto flex-shrink-10 flex-col p-8 text-center", children: [
       /* @__PURE__ */ jsx("h3", { className: "text-lg font-medium mb-2", children: activeWorkspace?.name ?? "No messages yet" }),
       activeWorkspace?.firstPrompt && /* @__PURE__ */ jsx("div", { className: "max-w-3xl mx-auto p-4", children: /* @__PURE__ */ jsx(MessageMarkdown, { value: activeWorkspace.firstPrompt }) })
@@ -20157,9 +20318,6 @@ function mapWorkspaceDtoToModel(dto) {
     firstPrompt: dto.firstPrompt ?? "",
     outputSchema: dto.outputSchema ?? void 0,
     inputs: dto.inputs ?? void 0,
-    isPromptAndResponseLoggingEnabled: truthy(
-      dto.isPromptAndResponseLoggingEnabled
-    ),
     variables,
     sandBoxThreadId: dto.sandBoxThreadId ?? void 0,
     supportsFiles: truthy(dto.supportsFiles),