reya/lume
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

wip: ui

Browse Source
This commit is contained in:
Ren Amamiya
2023-10-08 09:31:11 +07:00
parent cb91373d33
commit bce76bd41c
66 changed files with 216 additions and 214 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/app/chats/chat.tsx
View File

@@ -71,23 +71,25 @@ export function ChatScreen() {
return (
<div className="h-full w-full p-3">
<div className="rounded-lg border-t border-white/5 bg-white/10 backdrop-blur-xl">
<div className="rounded-lg bg-zinc-100 backdrop-blur-xl dark:bg-zinc-900">
<div className="flex h-full flex-col justify-between overflow-hidden">
<div className="flex h-16 shrink-0 items-center border-b border-white/10 px-3">
<div className="flex h-16 shrink-0 items-center border-b border-zinc-200 px-3 dark:border-zinc-800">
<User pubkey={pubkey} variant="simple" />
</div>
<div className="h-full w-full flex-1 px-3 py-3">
{status === 'loading' ? (
<div className="flex h-full w-full items-center justify-center">
<div className="flex flex-col items-center gap-1.5">
<LoaderIcon className="h-5 w-5 animate-spin text-white" />
<p className="text-sm font-medium text-white/50">Loading messages</p>
<LoaderIcon className="h-5 w-5 animate-spin text-zinc-900 dark:text-zinc-100" />
<p className="text-sm font-medium text-zinc-500 dark:text-zinc-300">
Loading messages
</p>
</div>
</div>
) : data.length === 0 ? (
<div className="absolute left-1/2 top-1/2 flex w-full -translate-x-1/2 -translate-y-1/2 transform flex-col gap-1 text-center">
<h3 className="mb-2 text-4xl">🙌</h3>
<p className="leading-none text-white/50">
<p className="leading-none text-zinc-500 dark:text-zinc-300">
You two didn&apos;t talk yet, let&apos;s send first message
</p>
</div>
@@ -97,7 +99,7 @@ export function ChatScreen() {
</VList>
)}
</div>
<div className="z-50 shrink-0 rounded-b-lg border-t border-white/5 bg-white/10 p-3 backdrop-blur-xl">
<div className="shrink-0 rounded-b-lg border-t border-zinc-300 bg-zinc-200 p-3 backdrop-blur-xl dark:border-zinc-700 dark:bg-zinc-800">
<ChatForm
receiverPubkey={pubkey}
userPubkey={db.account.pubkey}