feat: added new mint and link Frame spec

coinbase · Feb 7, 2024 · 5b971e0 · 5b971e0
1 parent f9f7652
commit 5b971e0
Show file tree

Hide file tree

Showing 4 changed files with 18 additions and 2 deletions.
diff --git a/src/components/FrameMetadata.tsx b/src/components/FrameMetadata.tsx
@@ -22,6 +22,11 @@ type FrameMetadataReact = FrameMetadataType & {
  *       label: 'Redirect to cute dog pictures',
  *       action: 'post_redirect',
  *     },
+ *     {
+ *      label: 'Mint',
+ *      action: 'mint',
+ *      target: 'https://zizzamia.xyz/api/frame/mint',
+ *    },
  *   ]}
  *   image="https://zizzamia.xyz/park-1.png"
  *   input={{
@@ -32,11 +37,11 @@ type FrameMetadataReact = FrameMetadataType & {
  * ```
  *
  * @param {FrameMetadataReact} props - The metadata for the frame.
+ * @param {Array<{ label: string, action?: string }>} props.buttons - The buttons.
  * @param {string} props.image - The image URL.
  * @param {string} props.input - The input text.
  * @param {string} props.post_url - The post URL.
  * @param {number} props.refresh_period - The refresh period.
- * @param {Array<{ label: string, action?: string }>} props.buttons - The buttons.
  * @param {React.ComponentType<any> | undefined} props.wrapper - The wrapper component meta tags are rendered in.
  * @returns {React.ReactElement} The FrameMetadata component.
  */
@@ -61,6 +66,10 @@ export function FrameMetadata({
             {!!button.action && (
               <meta name={`fc:frame:button:${index + 1}:action`} content={button.action} />
             )}
+            {!!button.target && (
+              <meta name={`fc:frame:button:${index + 1}:target`} content={button.target} />
+            )
+            }
           </>
         );
       })}

diff --git a/src/core/getFrameHtmlResponse.ts b/src/core/getFrameHtmlResponse.ts
@@ -32,6 +32,9 @@ function getFrameHtmlResponse({
         if (button.action) {
           buttonHtml += `<meta property="fc:frame:button:${index + 1}:action" content="${button.action}" />`;
         }
+        if (button.target) {
+          buttonHtml += `<meta property="fc:frame:button:${index + 1}:target" content="${button.target}" />`;
+        }
         return buttonHtml;
       })
       .join('');

diff --git a/src/core/getFrameMetadata.ts b/src/core/getFrameMetadata.ts
@@ -29,6 +29,9 @@ export const getFrameMetadata = function ({
       if (button.action) {
         metadata[`fc:frame:button:${index + 1}:action`] = button.action;
       }
+      if (button.target) {
+        metadata[`fc:frame:button:${index + 1}:target`] = button.target;
+      }
     });
   }
   if (post_url) {

diff --git a/src/core/types.ts b/src/core/types.ts
@@ -69,8 +69,9 @@ export function convertToFrame(json: any) {
 }
 
 export type FrameButtonMetadata = {
+  action?: 'link' | 'mint' | 'post' | 'post_redirect';
   label: string;
-  action?: 'post' | 'post_redirect';
+  target?: string;
 };
 
 export type FrameInputMetadata = {