🌺 Lens and Hey v3: v11 (#lens-v3)

Summary: Migrated to Lens v3, updating types and queries for improved functionality. Highlights: • Replaced `MirrorablePublication` with `AnyPost` and `Post` types across components. • Updated GraphQL queries to use `useTransactionStatusQuery` and `usePostReferencesQuery`. • Changed `Regex.handle` to `Regex.username` for username validation. Read more: https://pierre.co/hey/hey/lens-v3
heyxyz · Dec 1, 2024 · a757296 · a757296
1 parent 75cacfa
commit a757296
Show file tree

Hide file tree

Showing 25 changed files with 207 additions and 174 deletions.
diff --git a/apps/og/src/helpers/getCollectModuleMetadata.ts b/apps/og/src/helpers/getCollectModuleMetadata.ts
@@ -2,8 +2,9 @@ import getPostOGImages from "@helpers/getPostOGImages";
 import { APP_NAME } from "@hey/data/constants";
 import allowedOpenActionModules from "@hey/helpers/allowedOpenActionModules";
 import getAccount from "@hey/helpers/getAccount";
+import type { AnyPost } from "@hey/indexer";
 
-const getCollectModuleMetadata = (post: MirrorablePublication) => {
+const getCollectModuleMetadata = (post: AnyPost) => {
   const { openActionModules } = post;
 
   if (!openActionModules) {
@@ -21,13 +22,13 @@ const getCollectModuleMetadata = (post: MirrorablePublication) => {
     return;
   }
 
-  const { slugWithPrefix } = getAccount(post.by);
+  const { slugWithPrefix } = getAccount(post.author);
 
   return {
     "eth:nft:chain": "polygon",
     "eth:nft:collection": `${post.__typename} by ${slugWithPrefix} • ${APP_NAME}`,
     "eth:nft:contract_address": collectModule.contract.address,
-    "eth:nft:creator_address": post.by.owner,
+    "eth:nft:creator_address": post.author.owner,
     "eth:nft:media_url": getPostOGImages(post.metadata)[0],
     "eth:nft:mint_count": post.stats.countOpenActions,
     "eth:nft:mint_url": `https://hey.xyz/posts/${post.id}`,

diff --git a/apps/web/src/components/Comment/CommentFeed.tsx b/apps/web/src/components/Comment/CommentFeed.tsx
@@ -3,6 +3,13 @@ import QueuedPost from "@components/Post/QueuedPost";
 import SinglePost from "@components/Post/SinglePost";
 import PostsShimmer from "@components/Shared/Shimmer/PostsShimmer";
 import { ChatBubbleLeftIcon } from "@heroicons/react/24/outline";
+import {
+  PageSize,
+  PostReferenceType,
+  type PostReferencesRequest,
+  PostVisibilityFilter,
+  usePostReferencesQuery
+} from "@hey/indexer";
 import { OptmisticPostType } from "@hey/types/enums";
 import { Card, EmptyState, ErrorMessage } from "@hey/ui";
 import type { FC } from "react";
@@ -21,50 +28,41 @@ const CommentFeed: FC<CommentFeedProps> = ({ postId }) => {
   const { fetchAndStoreViews } = useImpressionsStore();
   const { fetchAndStoreTips } = useTipsStore();
 
-  const request: PublicationsRequest = {
-    limit: LimitType.TwentyFive,
-    where: {
-      commentOn: {
-        hiddenComments: showHiddenComments
-          ? HiddenCommentsType.HiddenOnly
-          : HiddenCommentsType.Hide,
-        id: postId,
-        ranking: { filter: CommentRankingFilterType.Relevant }
-      },
-      customFilters: [CustomFiltersType.Gardeners]
-    }
+  const request: PostReferencesRequest = {
+    pageSize: PageSize.Fifty,
+    referencedPost: postId,
+    referenceTypes: [PostReferenceType.CommentOn],
+    visibilityFilter: showHiddenComments
+      ? PostVisibilityFilter.Visible
+      : PostVisibilityFilter.Hidden
   };
 
-  const { data, error, fetchMore, loading } = usePublicationsQuery({
-    onCompleted: async ({ publications }) => {
-      const ids = publications?.items?.map((p) => p.id) || [];
+  const { data, error, fetchMore, loading } = usePostReferencesQuery({
+    onCompleted: async ({ postReferences }) => {
+      const ids = postReferences?.items?.map((p) => p.id) || [];
       await fetchAndStoreViews(ids);
       await fetchAndStoreTips(ids);
     },
     skip: !postId,
     variables: { request }
   });
 
-  const comments = data?.publications?.items ?? [];
-  const pageInfo = data?.publications?.pageInfo;
+  const comments = data?.postReferences?.items ?? [];
+  const pageInfo = data?.postReferences?.pageInfo;
   const hasMore = pageInfo?.next;
 
   const queuedComments = txnQueue.filter(
     (o) => o.type === OptmisticPostType.Comment && o.commentOn === postId
   );
   const queuedCount = queuedComments.length;
-  const hiddenCount = comments.filter(
-    (o) => o?.__typename === "Comment" && o.isHidden
-  ).length;
-  const hiddenRemovedComments = comments?.length - hiddenCount;
-  const totalComments = hiddenRemovedComments + queuedCount;
+  const totalComments = comments?.length + queuedCount;
 
   const onEndReached = async () => {
     if (hasMore) {
       const { data } = await fetchMore({
         variables: { request: { ...request, cursor: pageInfo?.next } }
       });
-      const ids = data?.publications?.items?.map((p) => p.id) || [];
+      const ids = data?.postReferences?.items?.map((p) => p.id) || [];
       await fetchAndStoreViews(ids);
       await fetchAndStoreTips(ids);
     }
@@ -90,7 +88,7 @@ const CommentFeed: FC<CommentFeedProps> = ({ postId }) => {
   return (
     <>
       {queuedComments.map((txn) => (
-        <QueuedPost key={txn.txId} txn={txn} />
+        <QueuedPost key={txn.txHash} txn={txn} />
       ))}
       <Card>
         <Virtuoso

diff --git a/apps/web/src/components/Common/Providers/OptimisticTransactionsProvider.tsx b/apps/web/src/components/Common/Providers/OptimisticTransactionsProvider.tsx
@@ -1,3 +1,4 @@
+import { useTransactionStatusQuery } from "@hey/indexer";
 import { OptmisticPostType } from "@hey/types/enums";
 import type { OptimisticTransaction } from "@hey/types/misc";
 import type { FC } from "react";
@@ -8,34 +9,27 @@ const Transaction: FC<{ transaction: OptimisticTransaction }> = ({
 }) => {
   const { removeTransaction, setIndexedPostHash } = useTransactionStore();
 
-  useLensTransactionStatusQuery({
+  useTransactionStatusQuery({
     fetchPolicy: "no-cache",
     notifyOnNetworkStatusChange: true,
-    onCompleted: ({ lensTransactionStatus }) => {
+    onCompleted: ({ transactionStatus }) => {
       if (
-        lensTransactionStatus?.status === LensTransactionStatusType.Failed ||
-        lensTransactionStatus?.status === LensTransactionStatusType.Complete
+        transactionStatus?.__typename === "FailedTransactionStatus" ||
+        transactionStatus?.__typename === "FinishedTransactionStatus"
       ) {
         // Trigger Account feed refetch
         if (
           transaction.type === OptmisticPostType.Post &&
-          lensTransactionStatus.txHash
+          transactionStatus.__typename === "FinishedTransactionStatus"
         ) {
-          setIndexedPostHash(lensTransactionStatus.txHash);
+          setIndexedPostHash(transactionStatus.hash);
         }
 
-        return removeTransaction(
-          (transaction.txId || transaction.txHash) as string
-        );
+        return removeTransaction(transaction.txHash as string);
       }
     },
     pollInterval: 3000,
-    variables: {
-      request: {
-        ...(transaction.txId && { forTxId: transaction.txId }),
-        ...(transaction.txHash && { forTxHash: transaction.txHash })
-      }
-    }
+    variables: { request: { txHash: transaction.txHash } }
   });
 
   return null;
@@ -47,7 +41,7 @@ const OptimisticTransactionsProvider: FC = () => {
   return (
     <>
       {txnQueue.map((txn) => (
-        <Transaction key={txn.txId || txn.txHash} transaction={txn} />
+        <Transaction key={txn.txHash} transaction={txn} />
       ))}
     </>
   );

diff --git a/apps/web/src/components/Home/ForYou.tsx b/apps/web/src/components/Home/ForYou.tsx
@@ -68,7 +68,7 @@ const ForYou: FC = () => {
     <>
       {txnQueue.map((txn) =>
         txn?.type === OptmisticPostType.Post ? (
-          <QueuedPost key={txn.txId} txn={txn} />
+          <QueuedPost key={txn.txHash} txn={txn} />
         ) : null
       )}
       <Card>

diff --git a/apps/web/src/components/Home/Timeline/index.tsx b/apps/web/src/components/Home/Timeline/index.tsx
@@ -92,7 +92,7 @@ const Timeline: FC = () => {
     <>
       {txnQueue.map((txn) =>
         txn?.type !== OptmisticPostType.Comment ? (
-          <QueuedPost key={txn.txId} txn={txn} />
+          <QueuedPost key={txn.txHash} txn={txn} />
         ) : null
       )}
       <Card>

diff --git a/apps/web/src/components/Post/Actions/Share/Quote.tsx b/apps/web/src/components/Post/Actions/Share/Quote.tsx
@@ -1,6 +1,7 @@
 import { MenuItem } from "@headlessui/react";
 import { ChatBubbleBottomCenterTextIcon } from "@heroicons/react/24/outline";
 import { Errors } from "@hey/data/errors";
+import { type Post, TriStateValue } from "@hey/indexer";
 import cn from "@hey/ui/cn";
 import type { FC } from "react";
 import toast from "react-hot-toast";
@@ -10,17 +11,16 @@ import { useGlobalModalStateStore } from "src/store/non-persisted/useGlobalModal
 import { useAccountStore } from "src/store/persisted/useAccountStore";
 
 interface QuoteProps {
-  post: MirrorablePublication;
+  post: Post;
 }
 
 const Quote: FC<QuoteProps> = ({ post }) => {
   const { currentAccount } = useAccountStore();
   const { setShowAuthModal, setShowNewPostModal } = useGlobalModalStateStore();
   const { setQuotedPost } = usePostStore();
   const { isSuspended } = useAccountStatus();
-  const publicationType = post.__typename;
 
-  if (post.operations.canQuote === TriStateValue.No) {
+  if (post.operations?.canQuote === TriStateValue.No) {
     return null;
   }
 
@@ -49,9 +49,7 @@ const Quote: FC<QuoteProps> = ({ post }) => {
     >
       <div className="flex items-center space-x-2">
         <ChatBubbleBottomCenterTextIcon className="size-4" />
-        <div>
-          {publicationType === "Comment" ? "Quote comment" : "Quote post"}
-        </div>
+        <div>{post.commentOn ? "Quote comment" : "Quote post"}</div>
       </div>
     </MenuItem>
   );

diff --git a/apps/web/src/components/Post/Actions/Share/Repost.tsx b/apps/web/src/components/Post/Actions/Share/Repost.tsx
@@ -8,6 +8,12 @@ import { LensHub } from "@hey/abis";
 import { LENS_HUB } from "@hey/data/constants";
 import { Errors } from "@hey/data/errors";
 import { POST } from "@hey/data/tracking";
+import {
+  type CreateRepostRequest,
+  type Post,
+  TriStateValue,
+  useRepostMutation
+} from "@hey/indexer";
 import { OptmisticPostType } from "@hey/types/enums";
 import type { OptimisticTransaction } from "@hey/types/misc";
 import cn from "@hey/ui/cn";
@@ -21,16 +27,16 @@ import { useWriteContract } from "wagmi";
 
 interface RepostProps {
   isLoading: boolean;
-  post: MirrorablePublication;
+  post: Post;
   setIsLoading: Dispatch<SetStateAction<boolean>>;
 }
 
 const Repost: FC<RepostProps> = ({ isLoading, post, setIsLoading }) => {
   const { currentAccount } = useAccountStore();
   const { isSuspended } = useAccountStatus();
   const { addTransaction } = useTransactionStore();
-  const hasMirrored =
-    post.operations.hasMirrored || hasOptimisticallyMirrored(post.id);
+  const hasReposted =
+    post.operations?.hasReposted || hasOptimisticallyMirrored(post.id);
 
   const [shares, { increment }] = useCounter(
     post.stats.reposts + post.stats.quotes
@@ -39,16 +45,13 @@ const Repost: FC<RepostProps> = ({ isLoading, post, setIsLoading }) => {
   const { cache } = useApolloClient();
 
   const generateOptimisticMirror = ({
-    txHash,
-    txId
+    txHash
   }: {
     txHash?: string;
-    txId?: string;
   }): OptimisticTransaction => {
     return {
-      mirrorOn: post?.id,
+      repostOf: post?.id,
       txHash,
-      txId,
       type: OptmisticPostType.Mirror
     };
   };
@@ -110,30 +113,30 @@ const Repost: FC<RepostProps> = ({ isLoading, post, setIsLoading }) => {
   };
 
   // Onchain mutations
-  const [mirrorOnchain] = useMirrorOnchainMutation({
-    onCompleted: ({ mirrorOnchain }) => {
-      if (mirrorOnchain.__typename === "RelaySuccess") {
-        addTransaction(generateOptimisticMirror({ txId: mirrorOnchain.txId }));
+  const [createRepost] = useRepostMutation({
+    onCompleted: ({ repost }) => {
+      if (repost.__typename === "PostResponse") {
+        addTransaction(generateOptimisticMirror({ txHash: repost.hash }));
       }
-      onCompleted(mirrorOnchain.__typename);
+      onCompleted(repost.__typename);
     },
     onError
   });
 
-  if (post.operations.canMirror === TriStateValue.No) {
+  if (post.operations?.canRepost === TriStateValue.No) {
     return null;
   }
 
-  const createOnChain = async (request: OnchainMirrorRequest) => {
-    const { data } = await mirrorOnchain({ variables: { request } });
-    if (data?.mirrorOnchain.__typename === "LensProfileManagerRelayError") {
+  const repost = async (request: CreateRepostRequest) => {
+    const { data } = await createRepost({ variables: { request } });
+    if (data?.repost.__typename === "TransactionWillFail") {
       return await createOnchainMirrorTypedData({
         variables: { request }
       });
     }
   };
 
-  const handleCreateMirror = async () => {
+  const handleCreateRepost = async () => {
     if (!currentAccount) {
       return toast.error(Errors.SignWallet);
     }
@@ -144,11 +147,9 @@ const Repost: FC<RepostProps> = ({ isLoading, post, setIsLoading }) => {
 
     try {
       setIsLoading(true);
-      const request: OnchainMirrorRequest = {
-        mirrorOn: post?.id
-      };
+      const request: CreateRepostRequest = { post: post?.id };
 
-      return await createOnChain(request);
+      return await repost(request);
     } catch (error) {
       onError(error);
     }
@@ -160,16 +161,16 @@ const Repost: FC<RepostProps> = ({ isLoading, post, setIsLoading }) => {
       className={({ focus }) =>
         cn(
           { "dropdown-active": focus },
-          hasMirrored ? "text-green-500" : "",
+          hasReposted ? "text-green-500" : "",
           "m-2 block cursor-pointer rounded-lg px-4 py-1.5 text-sm"
         )
       }
       disabled={isLoading}
-      onClick={handleCreateMirror}
+      onClick={handleCreateRepost}
     >
       <div className="flex items-center space-x-2">
         <ArrowsRightLeftIcon className="size-4" />
-        <div>{hasMirrored ? "Mirror again" : "Mirror"}</div>
+        <div>{hasReposted ? "Repost again" : "Repost"}</div>
       </div>
     </MenuItem>
   );

diff --git a/apps/web/src/components/Post/Actions/Tip/Action.tsx b/apps/web/src/components/Post/Actions/Tip/Action.tsx
@@ -167,10 +167,10 @@ const Action: FC<ActionProps> = ({ closePopover, post, triggerConfetti }) => {
         address: HEY_TIPPING,
         args: [
           selectedCurrency?.contractAddress,
-          post.by.owner,
+          post.author.owner,
           finalRate,
           currentAccount?.address,
-          post.by.id,
+          post.author.id,
           post.id.split("-")[1]
         ],
         functionName: "tip"
@@ -182,7 +182,7 @@ const Action: FC<ActionProps> = ({ closePopover, post, triggerConfetti }) => {
           amount: cryptoRate - cryptoRate * 0.05,
           fromAddress: address,
           id: post.id,
-          toAddress: post.by.owner,
+          toAddress: post.author.owner,
           tokenAddress: selectedCurrency?.contractAddress,
           txHash: hash
         },