Merge branch 'armando/grwth-4045-enable-zora-minting-through-warp-iap…

…' into dev
reservoirprotocol · Feb 8, 2024 · 604bec2 · 604bec2
2 parents b400184 + b1c6ff1
commit 604bec2
Show file tree

Hide file tree

Showing 2 changed files with 42 additions and 18 deletions.
diff --git a/components/Head.tsx b/components/Head.tsx
@@ -6,7 +6,7 @@ type Props = {
   ogImage?: string
   title?: string
   description?: string
-  token?: Token
+  metatags?: React.ReactNode
 }
 
 /**
@@ -19,7 +19,7 @@ export const Head: FC<Props> = ({
   ogImage = 'https://explorer.reservoir.tools/og-image.png',
   title = 'Reservoir | Multi-Chain NF`T Explorer',
   description = 'Reservoir Multi-Chain NFT Explorer is an open source NFT explorer built with Reservoir.',
-  token,
+  metatags = null,
 }) => {
   return (
     <NextHead>
@@ -32,22 +32,27 @@ export const Head: FC<Props> = ({
       {/* Meta tags */}
       <meta name="description" content={description} />
 
-      {/* Extra Metatas */}
-      <>
-        <meta property="eth:nft:collection" content="taboo9" />
-        <meta property="eth:nft:status" content="live" />
-        <meta property="eth:nft:mint_count" content="1" />
-        <meta
-          property="eth:nft:creator_address"
-          content="0xf90665f14eefda57144441743816f4740cc89722"
-        />
-        <meta
-          property="eth:nft:contract_address"
-          content="0x2e92b5094c531257a9f427def7c05b412b9056bb"
-        />
-        <meta property="eth:nft:schema" content="ERC1155" />
-        <meta property="og:image" content={token?.token?.image} />
-      </>
+      {/* Twitter */}
+      <meta name="twitter:card" content="summary_large_image" />
+      <meta name="twitter:site" content="@reservoir0x" />
+      <meta name="twitter:title" content={title} />
+      <meta name="twitter:description" content={description} />
+      <meta name="twitter:image" content={ogImage} />
+
+      {/* Open Graph */}
+      <meta property="og:type" content="website" />
+      <meta property="og:determiner" content="the" />
+      <meta property="og:locale" content="en" />
+      <meta property="og:title" content={title} />
+      <meta property="og:description" content={description} />
+      <meta property="og:image" content={ogImage} />
+      <meta property="og:image:type" content="image/png" />
+      <meta property="og:image:width" content="1200" />
+      <meta property="og:image:height" content="630" />
+      <meta property="og:image:alt" content="Reservoir NFT Explorer Banner" />
+
+      {/* Child Meta tags */}
+      {metatags && metatags}
     </NextHead>
   )
 }
diff --git a/pages/[chain]/asset/[assetId].tsx b/pages/[chain]/asset/[assetId].tsx
@@ -237,6 +237,25 @@ const IndexPage: NextPage<Props> = ({ assetId, ssr }) => {
         token={token}
         title={pageTitle}
         description={collection?.description as string}
+        metatags={
+          <>
+            <meta
+              property="og:title"
+              content={`Farcaster: ${token?.token?.name}`}
+            />
+            <meta property="fc:frame" content="vNext" />
+            <meta
+              property="fc:frame:image"
+              content={token?.token?.image || collection?.banner}
+            />
+            <meta property="fc:frame:button:1" content="Mint" />
+            <meta property="fc:frame:button:1:action" content="mint" />
+            <meta
+              property="fc:frame:button:1:target"
+              content={`eip155:7777777:${token?.token?.contract}:${token?.token?.tokenId}`}
+            />
+          </>
+        }
       />
       <Flex
         justify="center"