@messenger-box/tailwind-ui-inbox 10.0.3-alpha.122 → 10.0.3-alpha.123

package/lib/templates/InboxWithAi.tsx

@@ -33,6 +33,7 @@ export interface InboxProps {
     data?: any;
     orgName?: string;
     handleRecreateSandbox?: (messageId: string) => void | Promise<any>;
+    isShowOnlyInbox?: boolean;
 }
 
 // Static utility hooks and components
@@ -198,7 +199,7 @@ const InboxWithAiInternal = (props: InboxProps) => {
             {/* Main Container */}
             <div className="flex flex-col h-screen overflow-hidden">
                 {/* Header with Design/Interact/Code tabs - now inside main container */}
-                {channelId && (
+                {channelId && !props?.isShowOnlyInbox && (
                     <div className="flex-shrink-0 bg-white ">
                         <div className="flex items-center justify-between px-4 py-3">
                             <div className="flex items-center">
@@ -332,7 +333,7 @@ const InboxWithAiInternal = (props: InboxProps) => {
                 <div
                     className="flex-1 grid overflow-hidden"
                     style={{
-                        gridTemplateColumns: isDesktopView ? '35% 65%' : '1fr',
+                        gridTemplateColumns: isDesktopView ? (props?.isShowOnlyInbox ? '1fr' : '35% 65%') : '1fr',
                         height: 'calc(100vh - 80px)', // Subtract header height
                     }}
                 >
@@ -356,6 +357,7 @@ const InboxWithAiInternal = (props: InboxProps) => {
                                 setIsLoading={setIsLoading}
                                 isLoading={isLoading}
                                 sendMessageInput={sendMessageInput}
+                                isShowOnlyInbox={props?.isShowOnlyInbox}
                             />
                         ) : (
                             <EmptyState />
@@ -363,7 +365,7 @@ const InboxWithAiInternal = (props: InboxProps) => {
                     </div>
 
                     {/* Right Sidebar - 65% width on desktop only */}
-                    {channelId && isDesktopView && (
+                    {channelId && isDesktopView && !props?.isShowOnlyInbox && (
                         <div
                             className="overflow-hidden border flex-1 w-full"
                             style={{
@@ -406,6 +408,7 @@ const ContentComponent = React.memo((props: any) => {
         setIsLoading,
         isLoading,
         sendMessageInput,
+        isShowOnlyInbox,
     } = props;
 
     return (
@@ -426,6 +429,7 @@ const ContentComponent = React.memo((props: any) => {
                                 setIsLoading={setIsLoading}
                                 isLoading={isLoading}
                                 sendMessageInput={sendMessageInput}
+                                isShowOnlyInbox={isShowOnlyInbox}
                             />
                         </>
                     )}

package/lib/xstate/index.d.ts

@@ -0,0 +1,3 @@
+export * from './rightSidebar.types';
+export * from './rightSidebar.machine';
+//# sourceMappingURL=index.d.ts.map

package/lib/xstate/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/xstate/index.ts"],"names":[],"mappings":"AAAA,cAAc,sBAAsB,CAAC;AACrC,cAAc,wBAAwB,CAAC"}

package/lib/xstate/rightSidebar.machine.d.ts

@@ -0,0 +1,4 @@
+import type { RightSidebarContext, MachineEvent } from './rightSidebar.types';
+export declare const rightSidebarMachine: import("xstate").StateMachine<RightSidebarContext, MachineEvent, Record<string, import("xstate").AnyActorRef>, import("xstate").ProvidedActor, import("xstate").ParameterizedObject, import("xstate").ParameterizedObject, string, import("xstate").StateValue, string, Partial<RightSidebarContext>, {}, import("xstate").EventObject, import("xstate").MetaObject, any>;
+export type RightSidebarMachine = typeof rightSidebarMachine;
+//# sourceMappingURL=rightSidebar.machine.d.ts.map

package/lib/xstate/rightSidebar.machine.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"rightSidebar.machine.d.ts","sourceRoot":"","sources":["../../src/xstate/rightSidebar.machine.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,mBAAmB,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAE9E,eAAO,MAAM,mBAAmB,2WAqI9B,CAAC;AAEH,MAAM,MAAM,mBAAmB,GAAG,OAAO,mBAAmB,CAAC"}

package/lib/xstate/rightSidebar.machine.js

@@ -0,0 +1,174 @@
+import {createMachine,assign,fromPromise}from'xstate';const rightSidebarMachine = createMachine({
+  id: 'rightSidebar',
+  types: {},
+  context: ({
+    input
+  }) => ({
+    channelId: input?.channelId ?? '',
+    isMinimized: input?.isMinimized ?? false,
+    windowWidth: input?.windowWidth ?? 0,
+    windowHeight: input?.windowHeight ?? 0,
+    isLoading: input?.isLoading ?? false,
+    activeFragment: input?.activeFragment ?? null,
+    currentFiles: input?.currentFiles ?? {},
+    canvasLayers: input?.canvasLayers ?? [],
+    previewStatus: input?.previewStatus ?? null
+  }),
+  initial: 'idle',
+  states: {
+    idle: {
+      on: {
+        UPDATE: {
+          actions: assign(({
+            context,
+            event
+          }) => ({
+            ...context,
+            ...(event.value || {})
+          }))
+        },
+        SET_FRAGMENT: {
+          target: 'probing',
+          actions: assign(({
+            context,
+            event
+          }) => ({
+            ...context,
+            activeFragment: event.fragment,
+            currentFiles: event.fragment?.files || context.currentFiles,
+            canvasLayers: event.fragment?.canvasLayers || context.canvasLayers,
+            previewStatus: event.fragment?.sandboxUrl ? {
+              status: 'checking'
+            } : null
+          }))
+        },
+        PROBE: 'probing',
+        SET_LOADING: {
+          actions: assign(({
+            context,
+            event
+          }) => ({
+            ...context,
+            isLoading: event.isLoading
+          }))
+        },
+        RECREATE_SANDBOX: 'recreating'
+      }
+    },
+    probing: {
+      invoke: {
+        id: 'probeUrl',
+        src: 'probeUrl',
+        input: ({
+          context,
+          event
+        }) => ({
+          url: event.url ?? context.activeFragment?.sandboxUrl,
+          fragmentId: event.fragmentId ?? context.activeFragment?.id
+        }),
+        onDone: {
+          target: 'idle',
+          actions: assign(({
+            context
+          }) => ({
+            ...context,
+            previewStatus: null,
+            isLoading: false
+          }))
+        },
+        onError: {
+          target: 'idle',
+          actions: assign(({
+            context,
+            event
+          }) => ({
+            ...context,
+            previewStatus: {
+              status: 'error',
+              message: event.error instanceof Error ? event.error.message : 'Network error'
+            },
+            isLoading: false
+          }))
+        }
+      }
+    },
+    recreating: {
+      invoke: {
+        id: 'recreateSandbox',
+        src: 'recreateSandbox',
+        input: ({
+          event
+        }) => ({
+          id: event.id
+        }),
+        onDone: {
+          target: 'idle',
+          actions: assign(({
+            context
+          }) => ({
+            ...context,
+            isLoading: false
+          }))
+        },
+        onError: {
+          target: 'idle',
+          actions: assign(({
+            context,
+            event
+          }) => ({
+            ...context,
+            isLoading: false,
+            previewStatus: {
+              status: 'error',
+              message: event.error instanceof Error ? event.error.message : 'Recreate failed'
+            }
+          }))
+        }
+      }
+    }
+  }
+}).provide({
+  actors: {
+    probeUrl: fromPromise(async ({
+      input
+    }) => {
+      const {
+        url
+      } = input;
+      if (!url) return {
+        ok: false
+      };
+      const controller = new AbortController();
+      const timeoutId = setTimeout(() => controller.abort(), 10000);
+      try {
+        const res = await fetch(url, {
+          method: 'GET',
+          mode: 'cors',
+          redirect: 'follow',
+          signal: controller.signal
+        });
+        clearTimeout(timeoutId);
+        if (!res.ok) {
+          throw new Error(`${res.status} ${res.statusText}`);
+        }
+        return {
+          ok: true
+        };
+      } finally {
+        clearTimeout(timeoutId);
+      }
+    }),
+    recreateSandbox: fromPromise(async ({
+      input
+    }) => {
+      // Placeholder actor: implement by injecting via provide in component if needed
+      const {
+        id
+      } = input;
+      console.log('recreateSandbox actor invoked for id:', id);
+      return {
+        success: true
+      };
+    })
+  }
+});export{rightSidebarMachine};//# sourceMappingURL=rightSidebar.machine.js.map

package/lib/xstate/rightSidebar.machine.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"rightSidebar.machine.js","sources":["../../src/xstate/rightSidebar.machine.ts"],"sourcesContent":[null],"names":[],"mappings":"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"}

package/lib/xstate/rightSidebar.types.d.ts

@@ -0,0 +1,52 @@
+import type { ActorRefFrom } from 'xstate';
+export type PreviewStatus = {
+    code?: number;
+    message?: string;
+    status?: 'checking' | 'error';
+} | null;
+export type ActiveFragment = {
+    id?: string;
+    sandboxUrl?: string;
+    sandboxId?: string;
+    title?: string;
+    files?: Record<string, string>;
+    projectId?: string;
+    modelConfig?: unknown;
+    canvasLayers?: unknown[];
+    summary?: unknown;
+    isError?: boolean;
+} | null;
+export type RightSidebarContext = {
+    channelId: string;
+    isMinimized: boolean;
+    windowWidth: number;
+    windowHeight: number;
+    isLoading: boolean;
+    activeFragment: ActiveFragment;
+    currentFiles: Record<string, string>;
+    canvasLayers: unknown[];
+    previewStatus: PreviewStatus;
+};
+export type UpdateEvent = {
+    type: 'UPDATE';
+    value: Partial<RightSidebarContext>;
+};
+export type SetFragmentEvent = {
+    type: 'SET_FRAGMENT';
+    fragment: NonNullable<ActiveFragment>;
+};
+export type ProbeEvent = {
+    type: 'PROBE';
+    url?: string;
+    fragmentId?: string;
+};
+export type RecreateSandboxEvent = {
+    type: 'RECREATE_SANDBOX';
+    id: string;
+};
+export type MachineEvent = UpdateEvent | SetFragmentEvent | ProbeEvent | RecreateSandboxEvent | {
+    type: 'SET_LOADING';
+    isLoading: boolean;
+};
+export type SubmitOrganizationActor = ActorRefFrom<any>;
+//# sourceMappingURL=rightSidebar.types.d.ts.map

package/lib/xstate/rightSidebar.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"rightSidebar.types.d.ts","sourceRoot":"","sources":["../../src/xstate/rightSidebar.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,QAAQ,CAAC;AAE3C,MAAM,MAAM,aAAa,GAAG;IACxB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,UAAU,GAAG,OAAO,CAAC;CACjC,GAAG,IAAI,CAAC;AAET,MAAM,MAAM,cAAc,GAAG;IACzB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,YAAY,CAAC,EAAE,OAAO,EAAE,CAAC;IACzB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;CACrB,GAAG,IAAI,CAAC;AAET,MAAM,MAAM,mBAAmB,GAAG;IAC9B,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,EAAE,OAAO,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;IACpB,YAAY,EAAE,MAAM,CAAC;IACrB,SAAS,EAAE,OAAO,CAAC;IACnB,cAAc,EAAE,cAAc,CAAC;IAC/B,YAAY,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACrC,YAAY,EAAE,OAAO,EAAE,CAAC;IACxB,aAAa,EAAE,aAAa,CAAC;CAChC,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG;IACtB,IAAI,EAAE,QAAQ,CAAC;IACf,KAAK,EAAE,OAAO,CAAC,mBAAmB,CAAC,CAAC;CACvC,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAC3B,IAAI,EAAE,cAAc,CAAC;IACrB,QAAQ,EAAE,WAAW,CAAC,cAAc,CAAC,CAAC;CACzC,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG;IAAE,IAAI,EAAE,OAAO,CAAC;IAAC,GAAG,CAAC,EAAE,MAAM,CAAC;IAAC,UAAU,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAE9E,MAAM,MAAM,oBAAoB,GAAG;IAAE,IAAI,EAAE,kBAAkB,CAAC;IAAC,EAAE,EAAE,MAAM,CAAA;CAAE,CAAC;AAE5E,MAAM,MAAM,YAAY,GAClB,WAAW,GACX,gBAAgB,GAChB,UAAU,GACV,oBAAoB,GACpB;IAAE,IAAI,EAAE,aAAa,CAAC;IAAC,SAAS,EAAE,OAAO,CAAA;CAAE,CAAC;AAElD,MAAM,MAAM,uBAAuB,GAAG,YAAY,CAAC,GAAG,CAAC,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@messenger-box/tailwind-ui-inbox",
-    "version": "10.0.3-alpha.122",
+    "version": "10.0.3-alpha.123",
     "description": "Inbox UI components built with TailwindCSS",
     "license": "ISC",
     "author": "CDMBase LLC",
@@ -21,8 +21,8 @@
         "watch": "npm run build:lib:watch"
     },
     "dependencies": {
-        "@messenger-box/core": "10.0.3-alpha.120",
-        "@messenger-box/platform-client": "10.0.3-alpha.120",
+        "@messenger-box/core": "10.0.3-alpha.123",
+        "@messenger-box/platform-client": "10.0.3-alpha.123",
         "@monaco-editor/react": "^4.7.0",
         "date-fns": "^4.1.0",
         "date-fns-tz": "^3.2.0",
@@ -58,5 +58,5 @@
     "typescript": {
         "definition": "lib/index.d.ts"
     },
-    "gitHead": "d74779e5e6da5b58a324285aba21fc92d6df27c3"
+    "gitHead": "a109255facf3a0dd71e7768bb43483b441483a46"
 }

package/src/components/AIAgent/AIAgent.tsx

@@ -39,6 +39,7 @@ interface AIAgentProps {
     channelName?: string;
     isDesktopView?: boolean;
     isSmallScreen?: boolean;
+    showDateSeparators?: boolean;
     messages?: any[];
     setMessages?: (messages: any[]) => void;
     selectedPost?: any;
@@ -46,6 +47,7 @@ interface AIAgentProps {
     setIsLoading?: (isLoading: boolean) => void;
     isLoading?: boolean;
     sendMessageInput?: ICreateChannelInput;
+    isShowOnlyInbox?: boolean;
     [key: string]: any; // Allow other props to be passed through to Inbox
 }
 
@@ -57,6 +59,7 @@ export const AIAgent: React.FC<AIAgentProps> = ({
     currentUser,
     isDesktopView = false,
     isSmallScreen = false,
+    showDateSeparators = false,
     setMessages,
     setSelectedPost,
     messages,
@@ -64,6 +67,7 @@ export const AIAgent: React.FC<AIAgentProps> = ({
     setIsLoading,
     isLoading,
     sendMessageInput,
+    isShowOnlyInbox = false,
 }) => {
     const [state, send] = useMachine(aiAgentMachine);
     // const apolloClient = useApolloClient();
@@ -134,7 +138,6 @@ export const AIAgent: React.FC<AIAgentProps> = ({
         fetchMore: fetchMoreMessages,
         subscribeToMore,
     } = messagesQuery;
-    console.log('messagesData', JSON.stringify(messagesData, null, 2));
 
     useEffect(() => {
         if (actualChannelId) {
@@ -161,8 +164,12 @@ export const AIAgent: React.FC<AIAgentProps> = ({
                     successThinkingTimeoutRef.current = null;
                 }
             }
+            // if(isShowOnlyInbox){
+            //     setIsLoading(false);
+            // }
         }
-    }, [chatMessageAddedData?.chatMessageAdded]);
+        console.log('isShowOnlyInbox', isShowOnlyInbox, ' isLoading', isLoading);
+    }, [chatMessageAddedData?.chatMessageAdded, isShowOnlyInbox, setIsLoading]);
 
     useEffect(() => {
         if (messagesData?.messages?.data?.length == 1) {
@@ -479,29 +486,34 @@ export const AIAgent: React.FC<AIAgentProps> = ({
         let currentDate = '';
         const res: any[] = [];
 
-        allMessages?.forEach((msg: any) => {
-            const date = new Date(msg.createdAt);
-            let msgDate: string;
-            if (isToday(date)) msgDate = t('tailwind_ui_inbox.today');
-            else if (isYesterday(date)) msgDate = t('tailwind_ui_inbox.yesterday');
-            else msgDate = format(date, 'eee, do MMMM');
-
-            if (msgDate !== currentDate) {
-                res.push({ type: 'date', content: msgDate });
-                currentDate = msgDate;
-            }
-            res.push(msg);
-        });
+        if (showDateSeparators) {
+            allMessages?.forEach((msg: any) => {
+                const date = new Date(msg.createdAt);
+                let msgDate: string;
+                if (isToday(date)) msgDate = t('tailwind_ui_inbox.today');
+                else if (isYesterday(date)) msgDate = t('tailwind_ui_inbox.yesterday');
+                else msgDate = format(date, 'eee, do MMMM');
+
+                if (msgDate !== currentDate) {
+                    res.push({ type: 'date', content: msgDate });
+                    currentDate = msgDate;
+                }
+                res.push(msg);
+            });
 
-        if (allMessages && allMessages.length > 0) {
-            const todayLabel = t('tailwind_ui_inbox.today');
-            if (currentDate !== todayLabel) {
-                res.push({ type: 'date', content: todayLabel });
+            if (allMessages && allMessages.length > 0) {
+                const todayLabel = t('tailwind_ui_inbox.today');
+                if (currentDate !== todayLabel) {
+                    res.push({ type: 'date', content: todayLabel });
+                }
             }
+        } else {
+            // No date separaters, keep messages as-is
+            allMessages?.forEach((msg: any) => res.push(msg));
         }
 
         return res;
-    }, [allMessages, t]);
+    }, [allMessages, t, showDateSeparators]);
 
     // Group messages by date sections for Slack-like rendering
     const messagesByDate = useMemo(() => {
@@ -857,7 +869,7 @@ export const AIAgent: React.FC<AIAgentProps> = ({
 
                         {completeConversationMessages?.map((section, sectionIndex) => (
                             <div key={`section-${sectionIndex}`} className="w-full px-4">
-                                {section.date && (
+                                {showDateSeparators && section.date && (
                                     <div className="flex items-center justify-center my-3">
                                         <div className="flex-grow border-t border-gray-200"></div>
                                         <div className="mx-4 px-3 py-1 bg-white border border-gray-200 rounded-full text-xs font-medium text-gray-600">
@@ -941,6 +953,7 @@ export const AIAgent: React.FC<AIAgentProps> = ({
                                                     onMessageClick={(msg) => setSelectedPost(msg)}
                                                     isDesktopView={isDesktopView}
                                                     isSmallScreen={isSmallScreen}
+                                                    showTimestamp={false}
                                                     sandboxErrors={sandboxErrors}
                                                     currentFiles={currentFiles}
                                                     onFixError={fixError}
@@ -1034,6 +1047,7 @@ export const AIAgent: React.FC<AIAgentProps> = ({
                         placeholder={placeholder}
                         modelConfig={modelConfig}
                         onModelConfigChange={updateModelConfig}
+                        textareaStyles={isShowOnlyInbox ? { height: '80px', minHeight: '80px', maxHeight: '80px' } : {}}
                     />
                 </div>
             )}