Merge pull request #8708 from internet-development/@APiligrim/chat-request-ui

[APP-1317] update: chat request ui to hide chat requests when there are no messages

src/screens/Messages/ChatList.tsx

@@ -164,12 +164,18 @@ export function MessagesScreenInner({navigation, route}: Props) {
         // filter out convos that are actively being left
         .filter(convo => !leftConvos.includes(convo.id))
 
+      const hasInboxRequests = inboxPreviewConvos?.length > 0
+
       return [
-        {
+        ...(hasInboxRequests
-          type: 'INBOX',
+          ? [
-          count: inboxPreviewConvos.length,
+              {
-          profiles: inboxPreviewConvos.slice(0, 3),
+                type: 'INBOX' as const,
-        },
+                count: inboxPreviewConvos.length,
+                profiles: inboxPreviewConvos.slice(0, 3),
+              },
+            ]
+          : []),
         ...conversations.map(
           convo => ({type: 'CONVERSATION', conversation: convo}) as const,
         ),
@@ -223,16 +229,24 @@ export function MessagesScreenInner({navigation, route}: Props) {
     return listenSoftReset(onSoftReset)
   }, [onSoftReset, isScreenFocused])
 
-  // Will always have 1 item - the inbox button
+  // NOTE(APiligrim)
-  if (conversations.length < 2) {
+  // Show empty state only if there are no conversations at all
+  const actualConversations = conversations.filter(
+    item => item.type === 'CONVERSATION',
+  )
+  const hasInboxRequests = inboxPreviewConvos?.length > 0
+
+  if (actualConversations.length === 0) {
     return (
       <Layout.Screen>
         <Header newChatControl={newChatControl} />
         <Layout.Center>
-          <InboxPreview
+          {hasInboxRequests && (
-            count={inboxPreviewConvos.length}
+            <InboxPreview
-            profiles={inboxPreviewConvos}
+              count={inboxPreviewConvos.length}
-          />
+              profiles={inboxPreviewConvos}
+            />
+          )}
           {isLoading ? (
             <ChatListLoadingPlaceholder />
           ) : (