{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "message-chat-list",
  "type": "registry:block",
  "title": "Message Chat List",
  "description": "A list of messages in a conversation.",
  "registryDependencies": [
    "message-chat-item"
  ],
  "files": [
    {
      "path": "src/components/deso/message-chat-list.tsx",
      "content": "'use client';\n\nimport React from 'react';\nimport { MessageChatItem } from './message-chat-item';\nimport { cn } from '@/lib/utils/deso';\nimport { Reaction } from './post-reactions';\n\nexport interface Message {\n  publicKey: string;\n  message: string;\n  style?: 'rounded' | 'square';\n  timestamp: string | Date;\n  reactions?: Reaction[];\n  onReactionClick?: (emoji: string) => void;\n}\n\nexport interface MessageChatListProps {\n  messages: Message[];\n  currentUserPublicKey: string;\n  className?: string;\n  groupingVariant?: 'grouped' | 'none';\n  bubbleVariant?: 'rounded' | 'square';\n}\n\nexport function MessageChatList({\n  messages,\n  currentUserPublicKey,\n  className,\n  groupingVariant = 'grouped',\n  bubbleVariant = 'rounded',\n}: MessageChatListProps) {\n  // Group consecutive messages from the same user\n  let rendered: React.ReactNode[] = [];\n  if (groupingVariant === 'grouped') {\n    let group: Message[] = [];\n    let lastPublicKey: string | null = null;\n    messages.forEach((msg, idx) => {\n      if (msg.publicKey === lastPublicKey) {\n        group.push(msg);\n      } else {\n        if (group.length > 0) {\n          rendered.push(\n            <MessageGroup\n              key={group[0].timestamp + '-' + group[0].publicKey}\n              group={group}\n              currentUserPublicKey={currentUserPublicKey}\n              bubbleVariant={bubbleVariant}\n            />\n          );\n        }\n        group = [msg];\n        lastPublicKey = msg.publicKey;\n      }\n      // Push the last group\n      if (idx === messages.length - 1 && group.length > 0) {\n        rendered.push(\n          <MessageGroup\n            key={group[0].timestamp + '-' + group[0].publicKey}\n            group={group}\n            currentUserPublicKey={currentUserPublicKey}\n            bubbleVariant={bubbleVariant}\n          />\n        );\n      }\n    });\n  } else {\n    rendered = messages.map((msg, idx) => (\n      <MessageChatItem\n        key={msg.timestamp + '-' + idx}\n        publicKey={msg.publicKey}\n        message={msg.message}\n        timestamp={msg.timestamp}\n        isSent={msg.publicKey === currentUserPublicKey}\n        bubbleVariant={bubbleVariant}\n        reactions={msg.reactions}\n        onReactionClick={msg.onReactionClick}\n      />\n    ));\n  }\n\n  return (\n    <div className={cn('flex flex-col gap-4', className)}>\n      {rendered}\n    </div>\n  );\n}\n\ninterface MessageGroupProps {\n  group: Message[];\n  currentUserPublicKey: string;\n  bubbleVariant: 'rounded' | 'square';\n}\n\nfunction MessageGroup({ group, currentUserPublicKey, bubbleVariant }: MessageGroupProps) {\n  const isSent = group[0].publicKey === currentUserPublicKey;\n  return (\n    <div className={cn('flex flex-col gap-1', isSent ? 'items-end' : 'items-start')}>\n      {group.map((msg, idx) => (\n        <MessageChatItem\n          key={msg.timestamp + '-' + idx}\n          publicKey={msg.publicKey}\n          message={msg.message}\n          timestamp={idx === group.length - 1 ? msg.timestamp : undefined}\n          isSent={isSent}\n          showUserInfo={idx === 0}\n          bubbleVariant={bubbleVariant}\n          reactions={msg.reactions}\n          onReactionClick={msg.onReactionClick}\n        />\n      ))}\n    </div>\n  );\n} ",
      "type": "registry:component",
      "target": "src/components/deso-ui/message-chat-list.tsx"
    }
  ]
}