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

feat(columns): add group column

Browse Source
This commit is contained in:
reya
2024-01-01 17:32:57 +07:00
parent 499765c10a
commit a52fb3c437
17 changed files with 430 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
packages/@columns/user/src/home.tsx
View File

@@ -5,20 +5,19 @@ import {
useProfile,
useStorage,
} from "@lume/ark";
import { ArrowLeftIcon, ArrowRightCircleIcon, LoaderIcon } from "@lume/icons";
import { ArrowRightCircleIcon, LoaderIcon } from "@lume/icons";
import { NIP05 } from "@lume/ui";
import { FETCH_LIMIT, displayNpub } from "@lume/utils";
import { NDKEvent, NDKKind } from "@nostr-dev-kit/ndk";
import { useInfiniteQuery } from "@tanstack/react-query";
import { useEffect, useMemo, useState } from "react";
import { Link, useNavigate } from "react-router-dom";
import { Link } from "react-router-dom";
import { toast } from "sonner";
import { WVList } from "virtua";
export function HomeRoute({ id }: { id: string }) {
const ark = useArk();
const storage = useStorage();
const navigate = useNavigate();
const { user } = useProfile(id);
const { data, hasNextPage, isLoading, isFetchingNextPage, fetchNextPage } =
@@ -108,7 +107,7 @@ export function HomeRoute({ id }: { id: string }) {
<img
src={user?.picture || user?.image}
alt={id}
className="h-12 w-12 shrink-0 rounded-lg object-cover"
className="object-cover w-12 h-12 rounded-lg shrink-0"
loading="lazy"
decoding="async"
/>
@@ -117,7 +116,7 @@ export function HomeRoute({ id }: { id: string }) {
<button
type="button"
onClick={() => unfollow(id)}
className="inline-flex h-9 w-28 items-center justify-center rounded-lg bg-neutral-200 text-sm font-medium hover:bg-blue-500 hover:text-white dark:bg-neutral-800"
className="inline-flex items-center justify-center text-sm font-medium rounded-lg h-9 w-28 bg-neutral-200 hover:bg-blue-500 hover:text-white dark:bg-neutral-800"
>
Unfollow
</button>
@@ -125,14 +124,14 @@ export function HomeRoute({ id }: { id: string }) {
<button
type="button"
onClick={() => follow(id)}
className="inline-flex h-9 w-28 items-center justify-center rounded-lg bg-neutral-200 text-sm font-medium hover:bg-blue-500 hover:text-white dark:bg-neutral-800"
className="inline-flex items-center justify-center text-sm font-medium rounded-lg h-9 w-28 bg-neutral-200 hover:bg-blue-500 hover:text-white dark:bg-neutral-800"
>
Follow
</button>
)}
<Link
to={`/chats/${id}`}
className="inline-flex h-9 w-28 items-center justify-center rounded-lg bg-neutral-200 text-sm font-medium hover:bg-blue-500 hover:text-white dark:bg-neutral-800"
className="inline-flex items-center justify-center text-sm font-medium rounded-lg h-9 w-28 bg-neutral-200 hover:bg-blue-500 hover:text-white dark:bg-neutral-800"
>
Message
</Link>
@@ -170,24 +169,24 @@ export function HomeRoute({ id }: { id: string }) {
<div className="flex h-full w-full flex-col justify-between gap-1.5 pb-10">
{isLoading ? (
<div className="flex items-center justify-center">
<LoaderIcon className="h-4 w-4 animate-spin" />
<LoaderIcon className="w-4 h-4 animate-spin" />
</div>
) : (
allEvents.map((item) => renderItem(item))
)}
<div className="flex h-16 items-center justify-center px-3 pb-3">
<div className="flex items-center justify-center h-16 px-3 pb-3">
{hasNextPage ? (
<button
type="button"
onClick={() => fetchNextPage()}
disabled={!hasNextPage || isFetchingNextPage}
className="inline-flex h-10 w-max items-center justify-center gap-2 rounded-full bg-blue-500 px-6 font-medium text-white hover:bg-blue-600 focus:outline-none"
className="inline-flex items-center justify-center h-10 gap-2 px-6 font-medium text-white bg-blue-500 rounded-full w-max hover:bg-blue-600 focus:outline-none"
>
{isFetchingNextPage ? (
<LoaderIcon className="h-4 w-4 animate-spin" />
<LoaderIcon className="w-4 h-4 animate-spin" />
) : (
<>
<ArrowRightCircleIcon className="h-5 w-5" />
<ArrowRightCircleIcon className="w-5 h-5" />
Load more
</>
)}