yoginth.com
Hey is a decentralized and permissionless social media app built with Lens Protocol 馃尶
1import { useApolloClient } from "@apollo/client";
2import {
3 type GroupFragment,
4 useCancelGroupMembershipRequestMutation
5} from "@hey/indexer";
6import type { ApolloClientError } from "@hey/types/errors";
7import { useCallback, useState } from "react";
8import { toast } from "sonner";
9import { Button } from "@/components/Shared/UI";
10import errorToast from "@/helpers/errorToast";
11import useTransactionLifecycle from "@/hooks/useTransactionLifecycle";
12
13interface CancelGroupMembershipRequestProps {
14 group: GroupFragment;
15 small: boolean;
16}
17
18const CancelGroupMembershipRequest = ({
19 group,
20 small
21}: CancelGroupMembershipRequestProps) => {
22 const [isSubmitting, setIsSubmitting] = useState(false);
23 const { cache } = useApolloClient();
24 const handleTransactionLifecycle = useTransactionLifecycle();
25
26 const updateCache = () => {
27 if (!group.operations) {
28 return;
29 }
30
31 cache.modify({
32 fields: { hasRequestedMembership: () => false },
33 id: cache.identify(group.operations)
34 });
35 };
36
37 const onCompleted = () => {
38 updateCache();
39 setIsSubmitting(false);
40 toast.success("Request cancelled");
41 };
42
43 const onError = useCallback((error: ApolloClientError) => {
44 setIsSubmitting(false);
45 errorToast(error);
46 }, []);
47
48 const [cancelGroupMembershipRequest] =
49 useCancelGroupMembershipRequestMutation({
50 onCompleted: async ({ cancelGroupMembershipRequest }) => {
51 if (
52 cancelGroupMembershipRequest.__typename ===
53 "CancelGroupMembershipRequestResponse"
54 ) {
55 return onCompleted();
56 }
57
58 return await handleTransactionLifecycle({
59 onCompleted,
60 onError,
61 transactionData: cancelGroupMembershipRequest
62 });
63 },
64 onError
65 });
66
67 const handleCancelGroupMembershipRequest = async () => {
68 setIsSubmitting(true);
69
70 return await cancelGroupMembershipRequest({
71 variables: { request: { group: group.address } }
72 });
73 };
74
75 return (
76 <Button
77 aria-label="Cancel Request"
78 disabled={isSubmitting}
79 loading={isSubmitting}
80 onClick={handleCancelGroupMembershipRequest}
81 outline
82 size={small ? "sm" : "md"}
83 >
84 Cancel Request
85 </Button>
86 );
87};
88
89export default CancelGroupMembershipRequest;