Hey is a decentralized and permissionless social media app built with Lens Protocol 馃尶
1import { LightBulbIcon } from "@heroicons/react/24/outline";
2import {
3 PageSize,
4 type PostFragment,
5 type PostsForYouRequest,
6 usePostsForYouQuery
7} from "@hey/indexer";
8import { useCallback, useMemo } from "react";
9import SinglePost from "@/components/Post/SinglePost";
10import PostFeed from "@/components/Shared/Post/PostFeed";
11import { useAccountStore } from "@/store/persisted/useAccountStore";
12
13const ForYou = () => {
14 const { currentAccount } = useAccountStore();
15
16 const request: PostsForYouRequest = {
17 account: currentAccount?.address,
18 pageSize: PageSize.Fifty,
19 shuffle: true
20 };
21
22 const { data, error, fetchMore, loading } = usePostsForYouQuery({
23 variables: { request }
24 });
25
26 const posts = data?.mlPostsForYou.items;
27 const pageInfo = data?.mlPostsForYou.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 const filteredPosts = useMemo(
39 () =>
40 posts
41 ?.map((item) => item.post)
42 .filter(
43 (post) =>
44 !post.author.operations?.hasBlockedMe &&
45 !post.author.operations?.isBlockedByMe &&
46 !post.operations?.hasReported
47 ),
48 [posts]
49 );
50
51 return (
52 <PostFeed
53 emptyIcon={<LightBulbIcon className="size-8" />}
54 emptyMessage="No posts yet!"
55 error={error}
56 errorTitle="Failed to load for you"
57 handleEndReached={handleEndReached}
58 hasMore={hasMore}
59 items={filteredPosts as PostFragment[]}
60 loading={loading}
61 renderItem={(post) => <SinglePost key={post.id} post={post} />}
62 />
63 );
64};
65
66export default ForYou;