This repository has no description
1'use client';
2
3import SembleMentionsContainerError from '@/features/semble/containers/sembleMentionsContainer/Error.SembleMentionsContainer';
4import useSearchBlueskyPosts from '../../lib/queries/useSearchBlueskyPosts';
5import { BlueskySearchSortOptions } from '../../lib/types';
6import SembleEmptyTab from '@/features/semble/components/sembleEmptyTab/SembleEmptyTab';
7import { MdOutlineAlternateEmail } from 'react-icons/md';
8import { Grid, Group, Select } from '@mantine/core';
9import InfiniteScroll from '@/components/contentDisplay/infiniteScroll/InfiniteScroll';
10import BlueskyMentionPost from '@/features/platforms/bluesky/components/blueskyMentionPost/BlueskyMentionPost';
11
12interface Props {
13 url: string;
14 sortBy: BlueskySearchSortOptions;
15}
16
17export default function BlueskyMentionsContainer(props: Props) {
18 const {
19 data,
20 error,
21 isPending,
22 fetchNextPage,
23 hasNextPage,
24 isFetchingNextPage,
25 } = useSearchBlueskyPosts({ query: props.url, sortBy: props.sortBy });
26
27 const allPosts = data?.pages.flatMap((page) => page.posts ?? []) ?? [];
28
29 if (error) {
30 return <SembleMentionsContainerError />;
31 }
32
33 if (allPosts.length === 0) {
34 return (
35 <SembleEmptyTab
36 message="No mentions found"
37 icon={MdOutlineAlternateEmail}
38 />
39 );
40 }
41
42 return (
43 <InfiniteScroll
44 dataLength={allPosts.length}
45 hasMore={!!hasNextPage}
46 isInitialLoading={isPending}
47 isLoading={isFetchingNextPage}
48 loadMore={fetchNextPage}
49 >
50 <Grid gap="sm" mx={'auto'} maw={600} w={'100%'}>
51 {allPosts.map((post) => (
52 <Grid.Col key={post.uri} span={12}>
53 <BlueskyMentionPost post={post} />
54 </Grid.Col>
55 ))}
56 </Grid>
57 </InfiniteScroll>
58 );
59}