37 lines
1.2 KiB
TypeScript
37 lines
1.2 KiB
TypeScript
import { ChatsListItem } from "@app/chat/components/item";
|
|
import { useActiveAccount } from "@stores/accounts";
|
|
import { useChats } from "@stores/chats";
|
|
import { useEffect } from "react";
|
|
|
|
export function ChatsList() {
|
|
const account = useActiveAccount((state: any) => state.account);
|
|
const chats = useChats((state: any) => state.chats);
|
|
const fetchChats = useChats((state: any) => state.fetch);
|
|
|
|
useEffect(() => {
|
|
if (!account) return;
|
|
fetchChats(account.pubkey);
|
|
}, [fetchChats]);
|
|
|
|
return (
|
|
<div className="flex flex-col gap-1">
|
|
{!chats ? (
|
|
<>
|
|
<div className="inline-flex h-8 items-center gap-2 rounded-md px-2.5">
|
|
<div className="relative h-5 w-5 shrink-0 animate-pulse rounded bg-zinc-800" />
|
|
<div className="h-3 w-full animate-pulse bg-zinc-800" />
|
|
</div>
|
|
<div className="inline-flex h-8 items-center gap-2 rounded-md px-2.5">
|
|
<div className="relative h-5 w-5 shrink-0 animate-pulse rounded bg-zinc-800" />
|
|
<div className="h-3 w-full animate-pulse bg-zinc-800" />
|
|
</div>
|
|
</>
|
|
) : (
|
|
chats.map((item: { sender_pubkey: string }) => (
|
|
<ChatsListItem key={item.sender_pubkey} pubkey={item.sender_pubkey} />
|
|
))
|
|
)}
|
|
</div>
|
|
);
|
|
}
|