Yuva chat conversations

The visitor's conversations as rows with the last message, time and an unread dot, and an empty state.

No conversations yet

Start one and we will answer here.

تعمل المعاينة ببيانات تجريبية. لا تحتاج إلى شبكة ولا إلى قناة.

tsx

import { YuvaChatConversations } from "@/components/yuva-chat-conversations"
import { useYuvaChat } from "@/hooks/use-yuva-chat"

export function Conversations() {
  const chat = useYuvaChat({
    server={process.env.NEXT_PUBLIC_YUVA_SERVER}
    channel={process.env.NEXT_PUBLIC_YUVA_CHANNEL},
  })
  return <YuvaChatConversations chat={chat} />
}

التثبيت

شغّل هذا في مشروع shadcn. تُنسخ الملفات إلى شيفرتك.

Shell

npx shadcn@latest add https://useyuva.com/r/yuva-chat-conversations.json

Shell

pnpm dlx shadcn@latest add https://useyuva.com/r/yuva-chat-conversations.json

Shell

yarn dlx shadcn@latest add https://useyuva.com/r/yuva-chat-conversations.json

Shell

bunx --bun shadcn@latest add https://useyuva.com/r/yuva-chat-conversations.json

الاستخدام

tsx

import { YuvaChatConversations } from "@/components/yuva-chat-conversations"

<YuvaChatConversations chat={chat} onOpen={(id) => setView("thread")} />

Props

`YuvaChatConversationsProps`

Prop	النوع
`chat`	`YuvaChatState`
`labels?`	`Partial<YuvaChatLabels>`
`locale?`	`string`
`onOpen?`	`(id: string \| null) => void`
`className?`	`string`

التسميات

التسميات مدرجة في صفحة Yuva chat.

الاعتماديات

يضيف تثبيت هذا العنصر أيضًا ما يلي.

مكوّنات من shadcn/ui

عناصر Yuva الأخرى

Yuva chat hook

حزم npm

lucide-react ↗

← السابقYuva chat composer التالي →Yuva discussion list