Migrate to Lens v3

heyxyz · Dec 6, 2024 · 359fea8 · 359fea8
1 parent 9ae4554
commit 359fea8
Show file tree

Hide file tree

Showing 16 changed files with 138 additions and 89 deletions.
diff --git a/apps/web/src/components/Notification/Account.tsx b/apps/web/src/components/Notification/Account.tsx
@@ -23,7 +23,10 @@ export const NotificationAccountAvatar: FC<NotificationProfileProps> = ({
   };
 
   return (
-    <AccountPreview handle={account.username?.value} address={account.address}>
+    <AccountPreview
+      handle={account.username?.localName}
+      address={account.address}
+    >
       <Link
         className="rounded-full outline-offset-2"
         href={getAccount(account).link}
@@ -48,7 +51,10 @@ export const NotificationAccountName: FC<NotificationProfileProps> = ({
   const profileLink = getAccount(account).link;
 
   return (
-    <AccountPreview handle={account.username?.value} address={account.address}>
+    <AccountPreview
+      handle={account.username?.localName}
+      address={account.address}
+    >
       <Link
         className="inline-flex items-center space-x-1 font-bold outline-none hover:underline focus:underline"
         href={profileLink}

diff --git a/apps/web/src/components/Post/PostAccount.tsx b/apps/web/src/components/Post/PostAccount.tsx
@@ -32,7 +32,7 @@ const PostAccount: FC<PostAccountProps> = ({
       href={getAccount(account).link}
     >
       <AccountPreview
-        handle={account.username?.value}
+        handle={account.username?.localName}
         address={account.address}
         showUserPreview
       >

diff --git a/apps/web/src/components/Settings/Handles/UnlinkHandle.tsx b/apps/web/src/components/Settings/Handles/UnlinkHandle.tsx
@@ -30,7 +30,7 @@ const UnlinkHandle: FC = () => {
     try {
       setUnlinking(true);
       const request: UnlinkHandleFromProfileRequest = {
-        handle: currentAccount.username?.value
+        handle: currentAccount.username?.localName
       };
 
       return await createUnlinkHandleFromProfileTypedData({

diff --git a/apps/web/src/components/Settings/Handles/index.tsx b/apps/web/src/components/Settings/Handles/index.tsx
@@ -43,7 +43,7 @@ const HandlesSettings: NextPage = () => {
               is no longer publicly displayed or associated with your profile."
               title={
                 <span>
-                  Unlink <Slug slug={currentAccount.username?.value} /> from
+                  Unlink <Slug slug={currentAccount.username?.localName} /> from
                   your profile
                 </span>
               }

diff --git a/apps/web/src/components/Shared/Account/Follow.tsx b/apps/web/src/components/Shared/Account/Follow.tsx
@@ -5,11 +5,7 @@ import { Errors } from "@hey/data/errors";
 import { ACCOUNT } from "@hey/data/tracking";
 import selfFundedTransactionData from "@hey/helpers/selfFundedTransactionData";
 import sponsoredTransactionData from "@hey/helpers/sponsoredTransactionData";
-import {
-  type Account,
-  type FollowResponse,
-  useFollowMutation
-} from "@hey/indexer";
+import { type Account, useFollowMutation } from "@hey/indexer";
 import { OptmisticPostType } from "@hey/types/enums";
 import type { OptimisticTransaction } from "@hey/types/misc";
 import { Button } from "@hey/ui";
@@ -66,11 +62,7 @@ const Follow: FC<FollowProps> = ({
     });
   };
 
-  const onCompleted = (hash: string, follow?: FollowResponse) => {
-    if (follow?.__typename !== "FollowResponse") {
-      return;
-    }
-
+  const onCompleted = (hash: string) => {
     updateCache();
     addTransaction(generateOptimisticFollow({ txHash: hash }));
     setIsLoading(false);
@@ -89,7 +81,7 @@ const Follow: FC<FollowProps> = ({
   const [follow] = useFollowMutation({
     onCompleted: async ({ follow }) => {
       if (follow.__typename === "FollowResponse") {
-        return onCompleted(follow.hash, follow);
+        return onCompleted(follow.hash);
       }
 
       if (walletClient) {

diff --git a/apps/web/src/components/Shared/Account/Unfollow.tsx b/apps/web/src/components/Shared/Account/Unfollow.tsx
@@ -5,11 +5,7 @@ import { Errors } from "@hey/data/errors";
 import { ACCOUNT } from "@hey/data/tracking";
 import selfFundedTransactionData from "@hey/helpers/selfFundedTransactionData";
 import sponsoredTransactionData from "@hey/helpers/sponsoredTransactionData";
-import {
-  type Account,
-  type UnfollowResponse,
-  useUnfollowMutation
-} from "@hey/indexer";
+import { type Account, useUnfollowMutation } from "@hey/indexer";
 import { OptmisticPostType } from "@hey/types/enums";
 import type { OptimisticTransaction } from "@hey/types/misc";
 import { Button } from "@hey/ui";
@@ -66,11 +62,7 @@ const Unfollow: FC<UnfollowProps> = ({
     });
   };
 
-  const onCompleted = (hash: string, unfollow?: UnfollowResponse) => {
-    if (unfollow?.__typename !== "UnfollowResponse") {
-      return;
-    }
-
+  const onCompleted = (hash: string) => {
     updateCache();
     addTransaction(generateOptimisticUnfollow({ txHash: hash }));
     setIsLoading(false);
@@ -89,7 +81,7 @@ const Unfollow: FC<UnfollowProps> = ({
   const [unfollow] = useUnfollowMutation({
     onCompleted: async ({ unfollow }) => {
       if (unfollow.__typename === "UnfollowResponse") {
-        return onCompleted(unfollow.hash, unfollow);
+        return onCompleted(unfollow.hash);
       }
 
       if (walletClient) {

diff --git a/apps/web/src/components/Shared/AccountPreview.tsx b/apps/web/src/components/Shared/AccountPreview.tsx
@@ -41,9 +41,7 @@ const AccountPreview: FC<AccountPreviewProps> = ({
   showUserPreview = true
 }) => {
   const [loadAccount, { data, loading: networkLoading }] =
-    useFullAccountLazyQuery({
-      fetchPolicy: "cache-and-network"
-    });
+    useFullAccountLazyQuery({ fetchPolicy: "cache-and-network" });
   const [syntheticLoading, setSyntheticLoading] =
     useState<boolean>(networkLoading);
   const account = data?.account as Account;

diff --git a/apps/web/src/components/Shared/Alert/BlockOrUnBlockAccount.tsx b/apps/web/src/components/Shared/Alert/BlockOrUnBlockAccount.tsx
@@ -1,17 +1,24 @@
-import type { ApolloCache } from "@apollo/client";
+import { useApolloClient } from "@apollo/client";
 import errorToast from "@helpers/errorToast";
 import { Leafwatch } from "@helpers/leafwatch";
 import { Errors } from "@hey/data/errors";
 import { ACCOUNT } from "@hey/data/tracking";
 import getAccount from "@hey/helpers/getAccount";
+import selfFundedTransactionData from "@hey/helpers/selfFundedTransactionData";
+import sponsoredTransactionData from "@hey/helpers/sponsoredTransactionData";
 import { useBlockMutation, useUnblockMutation } from "@hey/indexer";
+import { OptmisticPostType } from "@hey/types/enums";
+import type { OptimisticTransaction } from "@hey/types/misc";
 import { Alert } from "@hey/ui";
 import type { FC } from "react";
 import { useState } from "react";
 import { toast } from "react-hot-toast";
 import { useAccountStatus } from "src/store/non-persisted/useAccountStatus";
 import { useGlobalAlertStateStore } from "src/store/non-persisted/useGlobalAlertStateStore";
 import { useAccountStore } from "src/store/persisted/useAccountStore";
+import { useTransactionStore } from "src/store/persisted/useTransactionStore";
+import { sendEip712Transaction, sendTransaction } from "viem/zksync";
+import { useWalletClient } from "wagmi";
 
 const BlockOrUnBlockAccount: FC = () => {
   const { currentAccount } = useAccountStore();
@@ -20,40 +27,45 @@ const BlockOrUnBlockAccount: FC = () => {
     setShowBlockOrUnblockAlert,
     showBlockOrUnblockAlert
   } = useGlobalAlertStateStore();
+  const { addTransaction, isBlockOrUnblockPending } = useTransactionStore();
+
   const [isLoading, setIsLoading] = useState(false);
   const [hasBlocked, setHasBlocked] = useState(
-    blockingorUnblockingProfile?.operations.isBlockedByMe.value
+    blockingorUnblockingProfile?.operations?.isBlockedByMe
   );
   const { isSuspended } = useAccountStatus();
+  const { cache } = useApolloClient();
+  const { data: walletClient } = useWalletClient();
+
+  const generateOptimisticBlockOrUnblock = ({
+    txHash
+  }: {
+    txHash: string;
+  }): OptimisticTransaction => {
+    return {
+      blockOrUnblockOn: blockingorUnblockingProfile?.address,
+      txHash,
+      type: hasBlocked ? OptmisticPostType.Unblock : OptmisticPostType.Block
+    };
+  };
 
-  const updateCache = (cache: ApolloCache<any>) => {
+  const updateCache = () => {
     cache.modify({
-      fields: {
-        isBlockedByMe: (existingValue) => {
-          return { ...existingValue, value: !hasBlocked };
-        }
-      },
-      id: `ProfileOperations:${blockingorUnblockingProfile?.id}`
+      fields: { isBlockedByMe: () => !hasBlocked },
+      id: `ProfileOperations:${blockingorUnblockingProfile?.address}`
     });
-    cache.evict({ id: `Profile:${blockingorUnblockingProfile?.id}` });
+    cache.evict({ id: `Profile:${blockingorUnblockingProfile?.address}` });
   };
 
-  const onCompleted = (
-    __typename?: "LensProfileManagerRelayError" | "RelayError" | "RelaySuccess"
-  ) => {
-    if (
-      __typename === "RelayError" ||
-      __typename === "LensProfileManagerRelayError"
-    ) {
-      return;
-    }
-
+  const onCompleted = (hash: string) => {
+    updateCache();
+    addTransaction(generateOptimisticBlockOrUnblock({ txHash: hash }));
     setIsLoading(false);
     setHasBlocked(!hasBlocked);
     setShowBlockOrUnblockAlert(false, null);
     toast.success(hasBlocked ? "Unblocked" : "Blocked");
     Leafwatch.track(hasBlocked ? ACCOUNT.BLOCK : ACCOUNT.UNBLOCK, {
-      address: blockingorUnblockingProfile?.id
+      address: blockingorUnblockingProfile?.address
     });
   };
 
@@ -62,33 +74,71 @@ const BlockOrUnBlockAccount: FC = () => {
     errorToast(error);
   };
 
-  const [blockProfile] = useBlockMutation({
-    onCompleted: ({ block }) => onCompleted(block.__typename),
-    onError,
-    update: updateCache
-  });
+  const [block] = useBlockMutation({
+    onCompleted: async ({ block }) => {
+      if (block.__typename === "BlockResponse") {
+        return onCompleted(block.hash);
+      }
 
-  const [unBlockProfile] = useUnblockMutation({
-    onCompleted: ({ unblock }) => onCompleted(unblock.__typename),
-    onError,
-    update: updateCache
+      if (walletClient) {
+        if (block.__typename === "SponsoredTransactionRequest") {
+          const hash = await sendEip712Transaction(walletClient, {
+            account: walletClient.account,
+            ...sponsoredTransactionData(block.raw)
+          });
+
+          return onCompleted(hash);
+        }
+
+        if (block.__typename === "SelfFundedTransactionRequest") {
+          const hash = await sendTransaction(walletClient, {
+            account: walletClient.account,
+            ...selfFundedTransactionData(block.raw)
+          });
+
+          return onCompleted(hash);
+        }
+      }
+
+      if (block.__typename === "BlockError") {
+        return toast.error(block.error);
+      }
+    },
+    onError
   });
 
-  const blockViaLensManager = async (request: BlockRequest) => {
-    const { data } = await blockProfile({ variables: { request } });
+  const [unblock] = useUnblockMutation({
+    onCompleted: async ({ unblock }) => {
+      if (unblock.__typename === "UnblockResponse") {
+        return onCompleted(unblock.hash);
+      }
 
-    if (data?.block.__typename === "LensProfileManagerRelayError") {
-      return await createBlockProfilesTypedData({ variables: { request } });
-    }
-  };
+      if (walletClient) {
+        if (unblock.__typename === "SponsoredTransactionRequest") {
+          const hash = await sendEip712Transaction(walletClient, {
+            account: walletClient.account,
+            ...sponsoredTransactionData(unblock.raw)
+          });
 
-  const unBlockViaLensManager = async (request: UnblockRequest) => {
-    const { data } = await unBlockProfile({ variables: { request } });
+          return onCompleted(hash);
+        }
 
-    if (data?.unblock.__typename === "LensProfileManagerRelayError") {
-      return await createUnblockProfilesTypedData({ variables: { request } });
-    }
-  };
+        if (unblock.__typename === "SelfFundedTransactionRequest") {
+          const hash = await sendTransaction(walletClient, {
+            account: walletClient.account,
+            ...selfFundedTransactionData(unblock.raw)
+          });
+
+          return onCompleted(hash);
+        }
+      }
+
+      if (unblock.__typename === "UnblockError") {
+        return toast.error(unblock.error);
+      }
+    },
+    onError
+  });
 
   const blockOrUnblock = async () => {
     if (!currentAccount) {
@@ -101,20 +151,21 @@ const BlockOrUnBlockAccount: FC = () => {
 
     try {
       setIsLoading(true);
-      const request: BlockRequest | UnblockRequest = {
-        profiles: [blockingorUnblockingProfile?.id]
-      };
 
-      // Block
+      // Unblock
       if (hasBlocked) {
-        return await createUnblockProfilesTypedData({
-          variables: { request }
+        return await unblock({
+          variables: {
+            request: { account: blockingorUnblockingProfile?.address }
+          }
         });
       }
 
-      // Unblock
-      return await createBlockProfilesTypedData({
-        variables: { request }
+      // Block
+      return await block({
+        variables: {
+          request: { account: blockingorUnblockingProfile?.address }
+        }
       });
     } catch (error) {
       onError(error);
@@ -128,7 +179,10 @@ const BlockOrUnBlockAccount: FC = () => {
         hasBlocked ? "un-block" : "block"
       } ${getAccount(blockingorUnblockingProfile).slugWithPrefix}?`}
       isDestructive
-      isPerformingAction={isLoading}
+      isPerformingAction={
+        isLoading ||
+        isBlockOrUnblockPending(blockingorUnblockingProfile?.address)
+      }
       onClose={() => setShowBlockOrUnblockAlert(false, null)}
       onConfirm={blockOrUnblock}
       show={showBlockOrUnblockAlert}

diff --git a/apps/web/src/components/Shared/SingleAccount.tsx b/apps/web/src/components/Shared/SingleAccount.tsx
@@ -83,7 +83,7 @@ const SingleAccount: FC<SingleAccountProps> = ({
 
   const AccountInfo: FC = () => (
     <AccountPreview
-      handle={account.username?.value}
+      handle={account.username?.localName}
       address={account.address}
       showUserPreview={showUserPreview}
     >

diff --git a/apps/web/src/components/Staff/Users/Overview/Tool/index.tsx b/apps/web/src/components/Staff/Users/Overview/Tool/index.tsx
@@ -42,7 +42,7 @@ const AccountStaffTool: FC<AccountStaffToolProps> = ({ account }) => {
           <LeafwatchDetails address={account.address} />
           <div className="divider my-5 border-yellow-600 border-dashed" />
           <Rank
-            handle={account.username?.value}
+            handle={account.username?.localName}
             lensClassifierScore={account.score || 0}
             accountAddress={account.address}
           />

diff --git a/apps/web/src/store/persisted/useTransactionStore.ts b/apps/web/src/store/persisted/useTransactionStore.ts
@@ -9,6 +9,7 @@ interface State {
   indexedPostHash: null | string;
   isFollowPending: (profileAddress: string) => boolean;
   isUnfollowPending: (profileAddress: string) => boolean;
+  isBlockOrUnblockPending: (profileAddress: string) => boolean;
   removeTransaction: (hash: string) => void;
   reset: () => void;
   setIndexedPostHash: (hash: string) => void;
@@ -28,6 +29,8 @@ const store = create(
         get().txnQueue.some((txn) => txn.followOn === profileAddress),
       isUnfollowPending: (profileAddress) =>
         get().txnQueue.some((txn) => txn.unfollowOn === profileAddress),
+      isBlockOrUnblockPending: (profileAddress) =>
+        get().txnQueue.some((txn) => txn.blockOrUnblockOn === profileAddress),
       removeTransaction: (hash) =>
         set((state) => ({
           txnQueue: state.txnQueue.filter((txn) => txn.txHash !== hash)