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