@messenger-box/tailwind-ui-inbox 10.0.3-alpha.71 → 10.0.3-alpha.73

package/src/container/InboxWithAiLoader.tsx

@@ -0,0 +1,76 @@
+import React, { useMemo } from 'react';
+import { useParams, useLocation, useNavigate } from '@remix-run/react';
+import AiLandingInput from './AiLandingInput';
+import InboxContainer from './InboxContainer';
+
+// Spinner kept if needed later
+const TailwindSpinner = React.memo(() => (
+    <div className="flex items-center justify-center min-h-screen">
+        <div className="animate-spin rounded-full h-8 w-8 border-b-2 border-blue-600"></div>
+    </div>
+));
+
+const TailwindOverlaySpinner = React.memo(() => (
+    <div className="fixed inset-0 z-50 flex items-center justify-center bg-black bg-opacity-30">
+        <div className="animate-spin rounded-full h-10 w-10 border-2 border-white border-t-transparent"></div>
+    </div>
+));
+
+interface TailwindAlertProps {
+    children: React.ReactNode;
+}
+
+const TailwindAlert = React.memo(({ children }: TailwindAlertProps) => (
+    <div className="flex items-center justify-center min-h-screen">
+        <div
+            className="bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded relative max-w-md mx-auto"
+            role="alert"
+        >
+            <span className="block sm:inline">{children}</span>
+        </div>
+    </div>
+));
+
+interface InboxWithAiLoaderProps {
+    channelFilters?: Record<string, any>;
+    channelRole?: string;
+    supportServices?: boolean;
+    pathPrefix?: string;
+    orgName?: string;
+    [key: string]: any;
+}
+
+const InboxWithAiLoader = (props: InboxWithAiLoaderProps) => {
+    const { channelRole: channelRoleProp, pathPrefix } = props;
+    const { orgName, channelRole: channelRoleParam } = useParams();
+    const location = useLocation();
+    const urlParams = location?.search ? new URLSearchParams(location.search) : null;
+    // const template = urlParams?.get('template');
+    const inboxProps = useMemo(
+        () => ({
+            ...props,
+            orgName: orgName || '',
+            pathPrefix: pathPrefix || '',
+        }),
+        [props, orgName, pathPrefix],
+    );
+
+    const { id: pathChannelId } = useParams();
+
+    // Extract channelId from query parameters (priority) or path parameters (fallback)
+    const channelId = urlParams?.get('id') || pathChannelId;
+
+    // Render the input landing experience when no channel is selected
+    if (!channelId) {
+        return <AiLandingInput />;
+    }
+
+    // No loading or error handling here; handled inside InboxContainer
+
+    return <InboxContainer {...inboxProps} channelId={channelId} />;
+};
+
+// Display name for debugging
+InboxWithAiLoader.displayName = 'InboxWithAiLoader';
+
+export default React.memo(InboxWithAiLoader);

package/src/container/index.ts

@@ -5,5 +5,25 @@ import ThreadMessages from './ThreadMessages';
 import ServiceInbox from './ServiceInbox';
 import { ThreadsInbox } from './ThreadsInbox';
 import { ThreadMessagesInbox } from './ThreadMessagesInbox';
+////import AiInboxWithLoader from './AiInboxWithLoader';
+//import AiInbox from './AiInbox';
+//import InboxTemplate1 from './InboxTemplate1';
+import InboxWithAiLoader from './InboxWithAiLoader';
+import InboxAiMessagesLoader from './InboxAiMessagesLoader';
+import InboxContainer from './InboxContainer';
 
-export { Inbox, ThreadsInbox, ThreadMessagesInbox, Threads, ThreadMessages, ServiceInbox, InboxWithLoader };
+export {
+    Inbox,
+    ThreadsInbox,
+    ThreadMessagesInbox,
+    Threads,
+    ThreadMessages,
+    ServiceInbox,
+    InboxWithLoader,
+    // AiInboxWithLoader,
+    // AiInbox,
+    // InboxTemplate1,
+    InboxWithAiLoader,
+    InboxAiMessagesLoader,
+    InboxContainer,
+};

package/src/index.ts

@@ -1,6 +1,15 @@
 export { default } from './module';
 export { ChatMessageFill } from './module';
-export { Inbox, Threads, ThreadMessages, ServiceInbox, InboxWithLoader } from './container';
+export {
+    Inbox,
+    Threads,
+    ThreadMessages,
+    ServiceInbox,
+    InboxWithLoader,
+    InboxWithAiLoader,
+    InboxAiMessagesLoader,
+    InboxContainer,
+} from './container';
 export {
     MessageSliceRenderer,
     Messages,
@@ -14,6 +23,8 @@ export {
     ConversationItem,
     UserModalContent,
     ServiceInboxItem,
+    AIAgent,
 } from './components';
+export { InboxWithAi } from './templates';
 export type { CardMessageAttachmentsInterface, AlertMessageAttachmentsInterface } from './interfaces';
 export * from './enums';