Hey is a decentralized and permissionless social media app built with Lens Protocol 馃尶
1import { PERMISSIONS, STATIC_IMAGES_URL } from "@hey/data/constants";
2import { useGroupQuery } from "@hey/indexer";
3import { useParams } from "react-router";
4import NewPost from "@/components/Composer/NewPost";
5import Custom404 from "@/components/Shared/404";
6import Custom500 from "@/components/Shared/500";
7import Cover from "@/components/Shared/Cover";
8import PageLayout from "@/components/Shared/PageLayout";
9import { WarningMessage } from "@/components/Shared/UI";
10import { useAccountStore } from "@/store/persisted/useAccountStore";
11import Details from "./Details";
12import GroupFeed from "./GroupFeed";
13import GroupPageShimmer from "./Shimmer";
14
15const ViewGroup = () => {
16 const { address } = useParams<{ address: string }>();
17 const { currentAccount } = useAccountStore();
18
19 const { data, loading, error } = useGroupQuery({
20 skip: !address || Object.values(PERMISSIONS).includes(address as any),
21 variables: { request: { group: address } }
22 });
23
24 if (!address || loading) {
25 return <GroupPageShimmer />;
26 }
27
28 if (!data?.group) {
29 return <Custom404 />;
30 }
31
32 if (error) {
33 return <Custom500 />;
34 }
35
36 const group = data.group;
37 const isMember = group.operations?.isMember;
38 const isBanned = group.operations?.isBanned;
39
40 return (
41 <PageLayout title={group.metadata?.name} zeroTopMargin>
42 <Cover
43 cover={
44 group.metadata?.coverPicture || `${STATIC_IMAGES_URL}/patterns/2.svg`
45 }
46 />
47 <Details group={group} />
48 {isBanned && (
49 <WarningMessage
50 message="Please contact the group owner to unban yourself."
51 title="You are banned from this group"
52 />
53 )}
54 {currentAccount && isMember && !isBanned && (
55 <NewPost feed={group.feed?.address} />
56 )}
57 <GroupFeed feed={group.feed?.address} />
58 </PageLayout>
59 );
60};
61
62export default ViewGroup;