yoginth.com
Hey is a decentralized and permissionless social media app built with Lens Protocol 馃尶
1import { ADDRESS_PLACEHOLDER } from "@hey/data/constants";
2import { ERRORS } from "@hey/data/errors";
3import { useAddAccountManagerMutation } from "@hey/indexer";
4import type { ApolloClientError } from "@hey/types/errors";
5import type { Dispatch, SetStateAction } from "react";
6import { useCallback, useState } from "react";
7import { toast } from "sonner";
8import { isAddress } from "viem";
9import SearchAccounts from "@/components/Shared/Account/SearchAccounts";
10import { Button } from "@/components/Shared/UI";
11import errorToast from "@/helpers/errorToast";
12import useTransactionLifecycle from "@/hooks/useTransactionLifecycle";
13import useWaitForTransactionToComplete from "@/hooks/useWaitForTransactionToComplete";
14import { useAccountStore } from "@/store/persisted/useAccountStore";
15
16interface AddAccountManagerProps {
17 setShowAddManagerModal: Dispatch<SetStateAction<boolean>>;
18}
19
20const AddAccountManager = ({
21 setShowAddManagerModal
22}: AddAccountManagerProps) => {
23 const { currentAccount } = useAccountStore();
24 const [manager, setManager] = useState("");
25 const [isSubmitting, setIsSubmitting] = useState(false);
26 const handleTransactionLifecycle = useTransactionLifecycle();
27 const waitForTransactionToComplete = useWaitForTransactionToComplete();
28
29 const onCompleted = async (hash: string) => {
30 setIsSubmitting(false);
31 setShowAddManagerModal(false);
32 const toastId = toast.loading("Adding manager...");
33 await waitForTransactionToComplete(hash);
34 toast.success("Manager added successfully", { id: toastId });
35 location.reload();
36 };
37
38 const onError = useCallback((error: ApolloClientError) => {
39 setIsSubmitting(false);
40 errorToast(error);
41 }, []);
42
43 const [addAccountManager] = useAddAccountManagerMutation({
44 onCompleted: async ({ addAccountManager }) => {
45 return await handleTransactionLifecycle({
46 onCompleted,
47 onError,
48 transactionData: addAccountManager
49 });
50 },
51 onError
52 });
53
54 const handleAddManager = async () => {
55 if (!currentAccount) {
56 return toast.error(ERRORS.SignWallet);
57 }
58
59 setIsSubmitting(true);
60
61 return await addAccountManager({
62 variables: {
63 request: {
64 address: manager,
65 permissions: {
66 canExecuteTransactions: true,
67 canSetMetadataUri: true,
68 canTransferNative: true,
69 canTransferTokens: true
70 }
71 }
72 }
73 });
74 };
75
76 return (
77 <div className="space-y-4 p-5">
78 <SearchAccounts
79 error={manager.length > 0 && !isAddress(manager)}
80 hideDropdown={isAddress(manager)}
81 onAccountSelected={(account) => setManager(account.owner)}
82 onChange={(event) => setManager(event.target.value)}
83 placeholder={`${ADDRESS_PLACEHOLDER} or wagmi`}
84 value={manager}
85 />
86 <div className="flex">
87 <Button
88 className="ml-auto"
89 disabled={isSubmitting || !isAddress(manager)}
90 loading={isSubmitting}
91 onClick={handleAddManager}
92 type="submit"
93 >
94 Add manager
95 </Button>
96 </div>
97 </div>
98 );
99};
100
101export default AddAccountManager;