feat(columns): add group column

This commit is contained in:
2024-01-01 17:32:57 +07:00
parent 499765c10a
commit a52fb3c437
17 changed files with 430 additions and 53 deletions

View File

@@ -12,7 +12,7 @@ export function HomeRoute({
}: { colKey: string; hashtag: string }) {
const ark = useArk();
const ref = useRef<VListHandle>();
const cacheKey = "hashtag-vlist";
const cacheKey = `${colKey}-vlist`;
const [offset, cache] = useMemo(() => {
const serialized = sessionStorage.getItem(cacheKey);
@@ -84,19 +84,19 @@ export function HomeRoute({
<TextNote key={item.id} event={item} className="mt-3" />
))
)}
<div className="flex h-16 items-center justify-center">
<div className="flex items-center justify-center h-16">
{hasNextPage ? (
<button
type="button"
onClick={() => fetchNextPage()}
disabled={!hasNextPage || isFetchingNextPage}
className="inline-flex h-10 w-40 items-center justify-center gap-2 rounded-full bg-blue-500 font-medium text-white hover:bg-blue-600 focus:outline-none"
className="inline-flex items-center justify-center w-40 h-10 gap-2 font-medium text-white bg-blue-500 rounded-full hover:bg-blue-600 focus:outline-none"
>
{isFetchingNextPage ? (
<LoaderIcon className="h-5 w-5 animate-spin" />
<LoaderIcon className="w-5 h-5 animate-spin" />
) : (
<>
<ArrowRightCircleIcon className="h-5 w-5" />
<ArrowRightCircleIcon className="w-5 h-5" />
Load more
</>
)}

View File

@@ -1,12 +1,12 @@
import { Column } from "@lume/ark";
import { HashtagIcon, TimelineIcon } from "@lume/icons";
import { HashtagIcon } from "@lume/icons";
import { IColumn } from "@lume/types";
import { EventRoute } from "./event";
import { HomeRoute } from "./home";
import { UserRoute } from "./user";
export function Hashtag({ column }: { column: IColumn }) {
const colKey = "hashtag";
const colKey = `hashtag-${column.id}`;
const hashtag = column.content.replace("#", "");
return (