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.

Pratonton berjalan dengan data contoh. Ia tidak memerlukan rangkaian atau saluran.

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} />
}

Pemasangan

Jalankan ini dalam projek shadcn. Fail disalin ke kod anda sendiri.

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

Penggunaan

tsx

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

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

Props

`YuvaChatConversationsProps`

Prop	Jenis
`chat`	`YuvaChatState`
`labels?`	`Partial<YuvaChatLabels>`
`locale?`	`string`
`onOpen?`	`(id: string \| null) => void`
`className?`	`string`

Label

Label disenaraikan di Yuva chat.

Kebergantungan

Memasang item ini turut menambah yang berikut.

Komponen daripada shadcn/ui

Item Yuva lain

Yuva chat hook

Pakej npm

lucide-react ↗

← SebelumnyaYuva chat composer Seterusnya →Yuva discussion list