@linktr.ee/messaging-react 1.12.3 → 1.12.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@linktr.ee/messaging-react",
-  "version": "1.12.3",
+  "version": "1.12.4",
   "description": "React messaging components built on messaging-core for web applications",
   "type": "module",
   "main": "dist/index.js",

package/src/components/ChannelView.tsx

@@ -25,6 +25,7 @@ import { CloseButton } from './CloseButton'
 import { CustomMessageInput } from './CustomMessageInput'
 import { CustomSystemMessage } from './CustomSystemMessage'
 import { ChannelEmptyState } from './MessagingShell/ChannelEmptyState'
+import { LoadingState } from './MessagingShell/LoadingState'
 
 // Custom user type with email and username
 type CustomUser = {
@@ -559,6 +560,7 @@ export const ChannelView = React.memo<ChannelViewProps>(
           channel={channel}
           MessageSystem={CustomSystemMessage}
           EmptyStateIndicator={CustomChannelEmptyState}
+          LoadingIndicator={LoadingState}
         >
           <ChannelViewInner
             onBack={onBack}

package/src/components/MessagingShell/ChannelEmptyState.tsx

@@ -2,5 +2,6 @@ import React from 'react'
 
 /**
  * Empty state component shown when a channel has no messages
+ * Returns null to show nothing - the LoadingIndicator handles the loading state
  */
 export const ChannelEmptyState: React.FC = () => null

package/src/components/MessagingShell/index.tsx

@@ -453,10 +453,10 @@ export const MessagingShell: React.FC<MessagingShellProps> = ({
           className={classNames(
             'messaging-conversation-view flex-1 flex-col min-w-0 min-h-0',
             {
-              // In direct conversation mode, always show (full width)
-              flex: directConversationMode || isChannelSelected,
+              // In direct conversation mode (or waiting for it), always show (full width)
+              flex: directConversationMode || isChannelSelected || initialParticipantFilter,
               // Normal mode: hide on mobile when no channel selected
-              'hidden lg:flex': !directConversationMode && !isChannelSelected,
+              'hidden lg:flex': !directConversationMode && !isChannelSelected && !initialParticipantFilter,
             }
           )}
         >
@@ -477,6 +477,9 @@ export const MessagingShell: React.FC<MessagingShellProps> = ({
                 onReportParticipantClick={onReportParticipantClick}
               />
             </div>
+          ) : initialParticipantFilter ? (
+            // Show loading while creating/loading direct conversation channel
+            <LoadingState />
           ) : (
             <EmptyState
               hasChannels={hasChannels}