{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "message-inbox",
  "type": "registry:block",
  "title": "Message Inbox",
  "description": "A complete chat interface for messaging between users.",
  "registryDependencies": [
    "message-inbox-item",
    "message-chat-list",
    "editor"
  ],
  "files": [
    {
      "path": "src/components/deso/message-inbox.tsx",
      "content": "'use client';\n\nimport React, { useRef, useEffect } from 'react';\nimport { MessageChatList, Message } from './message-chat-list';\nimport { cn } from '@/lib/utils/deso';\nimport { MessageInboxItem } from './message-inbox-item';\nimport { UserSearch } from './user-search';\nimport { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';\nimport { Badge } from '@/components/ui/badge';\nimport { Editor, EditorSubmitData } from './editor';\n\nexport interface ChatUser {\n  publicKey: string;\n  username?: string;\n}\n\nexport interface MessageInboxSidebarItem {\n  publicKey: string;\n  lastMessage: string;\n  lastTimestamp: string | Date;\n  unreadCount?: number;\n}\n\nexport interface MessageInboxProps {\n  users: ChatUser[];\n  currentUserPublicKey: string;\n  messages: Message[];\n  onSendMessage?: (message: string) => void;\n  selectedUserPublicKey: string;\n  onSelectUser?: (publicKey: string) => void;\n  className?: string;\n  primaryItems: MessageInboxSidebarItem[];\n  requestItems?: MessageInboxSidebarItem[];\n  onMarkAsRead?: (publicKey: string) => void;\n  onArchive?: (publicKey: string) => void;\n}\n\nexport function MessageInbox({\n  users,\n  currentUserPublicKey,\n  messages,\n  onSendMessage,\n  selectedUserPublicKey,\n  onSelectUser,\n  className,\n  primaryItems,\n  requestItems = [],\n  onMarkAsRead,\n  onArchive,\n}: MessageInboxProps) {\n  const messagesContainerRef = useRef<HTMLDivElement>(null);\n\n  // Always scroll to bottom when messages change\n  useEffect(() => {\n    const container = messagesContainerRef.current;\n    if (container) {\n      container.scrollTop = container.scrollHeight;\n    }\n  }, [messages]);\n\n  const handleSendMessage = (data: EditorSubmitData) => {\n    if (data.postText.trim()) {\n      onSendMessage?.(data.postText);\n    }\n  };\n\n  return (\n    <div className={cn('flex border border-border rounded-lg overflow-hidden h-[90vh] bg-background', className)}>\n      {/* Sidebar */}\n      <aside className=\"w-80 border-r border-border bg-muted/30 flex flex-col\">\n        <div className=\"p-4 border-b border-border\">\n          <h2 className=\"text-xl font-bold mb-4\">Messages</h2>\n          {onSelectUser && <UserSearch onSelectUser={onSelectUser} />}\n        </div>\n        <Tabs\n          defaultValue=\"primary\"\n          className=\"flex-1 flex flex-col overflow-y-hidden gap-0\"\n        >\n          <TabsList className=\"h-12 p-2 w-full rounded-none border-b border-border bg-accent -mb-[1px]\">\n            <TabsTrigger value=\"primary\" className=\"flex-1 cursor-pointer border border-border\">\n              Primary\n              {primaryItems.length > 0 && (\n                <Badge\n                  variant=\"secondary\"\n                  className=\"ml-2 rounded-full px-1.5\"\n                >\n                  {primaryItems.length}\n                </Badge>\n              )}\n            </TabsTrigger>\n            <TabsTrigger value=\"requests\" className=\"flex-1 cursor-pointer border border-border\">\n              Requests\n              {requestItems.length > 0 && (\n                <Badge\n                  variant=\"secondary\"\n                  className=\"ml-2 rounded-full px-1.5\"\n                >\n                  {requestItems.length}\n                </Badge>\n              )}\n            </TabsTrigger>\n          </TabsList>\n          <TabsContent\n            value=\"primary\"\n            className=\"flex-1 overflow-y-auto mt-0\"\n          >\n            {primaryItems.map((item) => (\n              <MessageInboxItem\n                key={item.publicKey}\n                publicKey={item.publicKey}\n                lastMessage={item.lastMessage}\n                lastTimestamp={item.lastTimestamp}\n                unreadCount={item.unreadCount}\n                selected={item.publicKey === selectedUserPublicKey}\n                onClick={() => onSelectUser?.(item.publicKey)}\n                onMarkAsRead={() => onMarkAsRead?.(item.publicKey)}\n                onArchive={() => onArchive?.(item.publicKey)}\n              />\n            ))}\n          </TabsContent>\n          <TabsContent\n            value=\"requests\"\n            className=\"flex-1 overflow-y-auto mt-0\"\n          >\n            {requestItems.map((item) => (\n              <MessageInboxItem\n                key={item.publicKey}\n                publicKey={item.publicKey}\n                lastMessage={item.lastMessage}\n                lastTimestamp={item.lastTimestamp}\n                unreadCount={item.unreadCount}\n                selected={item.publicKey === selectedUserPublicKey}\n                onClick={() => onSelectUser?.(item.publicKey)}\n                onMarkAsRead={() => onMarkAsRead?.(item.publicKey)}\n                onArchive={() => onArchive?.(item.publicKey)}\n              />\n            ))}\n          </TabsContent>\n        </Tabs>\n      </aside>\n      {/* Main Chat Window */}\n      <main className=\"flex-1 flex flex-col\">\n        <div ref={messagesContainerRef} className=\"flex-1 overflow-y-auto p-4\">\n          <MessageChatList\n            messages={messages}\n            currentUserPublicKey={currentUserPublicKey}\n          />\n        </div>\n        <div className=\"p-4 border-t border-border bg-background\">\n          <Editor\n            currentUser={{ publicKey: currentUserPublicKey }}\n            onSubmit={handleSendMessage}\n            showUserInfo={false}\n            showVisibility={false}\n            submitButtonText=\"Send\"\n            showImageUpload={true}\n            showVideoUpload={false}\n            showAudioUpload={false}\n            showExclusiveContent={false}\n            placeholder=\"Type your message…\"\n            submitOnEnter={true}\n          />\n        </div>\n      </main>\n    </div>\n  );\n} ",
      "type": "registry:component",
      "target": "src/components/deso-ui/message-inbox.tsx"
    }
  ]
}