Hey is a decentralized and permissionless social media app built with Lens Protocol 馃尶
1import { BookmarkIcon } from "@heroicons/react/24/outline";
2import {
3 type MainContentFocus,
4 PageSize,
5 type PostBookmarksRequest,
6 usePostBookmarksQuery
7} from "@hey/indexer";
8import { useCallback } from "react";
9import SinglePost from "@/components/Post/SinglePost";
10import PostFeed from "@/components/Shared/Post/PostFeed";
11
12interface BookmarksFeedProps {
13 focus?: MainContentFocus;
14}
15
16const BookmarksFeed = ({ focus }: BookmarksFeedProps) => {
17 const request: PostBookmarksRequest = {
18 pageSize: PageSize.Fifty,
19 ...(focus && { filter: { metadata: { mainContentFocus: [focus] } } })
20 };
21
22 const { data, error, fetchMore, loading } = usePostBookmarksQuery({
23 variables: { request }
24 });
25
26 const posts = data?.postBookmarks?.items ?? [];
27 const pageInfo = data?.postBookmarks?.pageInfo;
28 const hasMore = pageInfo?.next;
29
30 const handleEndReached = useCallback(async () => {
31 if (hasMore) {
32 await fetchMore({
33 variables: { request: { ...request, cursor: pageInfo?.next } }
34 });
35 }
36 }, [fetchMore, hasMore, pageInfo?.next, request]);
37
38 return (
39 <PostFeed
40 emptyIcon={<BookmarkIcon className="size-8" />}
41 emptyMessage="No bookmarks yet!"
42 error={error}
43 errorTitle="Failed to load bookmark feed"
44 handleEndReached={handleEndReached}
45 hasMore={hasMore}
46 items={posts}
47 loading={loading}
48 renderItem={(post) => <SinglePost key={post.id} post={post} />}
49 />
50 );
51};
52
53export default BookmarksFeed;