From c071c79c4356dc287746324a4c0a7d13dd097e8f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Carlos=20S=C3=A1nchez?= Date: Fri, 12 Apr 2024 18:19:24 +0200 Subject: [PATCH 1/4] Add metas for a default Farcaster Frame --- packages/nextjs/app/layout.tsx | 7 +++++++ packages/nextjs/utils/scaffold-eth/getMetadata.ts | 7 +++++++ 2 files changed, 14 insertions(+) diff --git a/packages/nextjs/app/layout.tsx b/packages/nextjs/app/layout.tsx index 8ed8ca41f..02b34291f 100644 --- a/packages/nextjs/app/layout.tsx +++ b/packages/nextjs/app/layout.tsx @@ -44,6 +44,13 @@ export const metadata: Metadata = { icons: { icon: [{ url: "/favicon.png", sizes: "32x32", type: "image/png" }], }, + other: { + "fc:frame": "vNext", + "fc:frame:image": imageUrl, + "fc:frame:button:1": "Open my 🏗️ Scaffold-ETH 2 dApp", + "fc:frame:button:1:action": "link", + "fc:frame:button:1:target": baseUrl, + }, }; const ScaffoldEthApp = ({ children }: { children: React.ReactNode }) => { diff --git a/packages/nextjs/utils/scaffold-eth/getMetadata.ts b/packages/nextjs/utils/scaffold-eth/getMetadata.ts index 918700178..17b9c837a 100644 --- a/packages/nextjs/utils/scaffold-eth/getMetadata.ts +++ b/packages/nextjs/utils/scaffold-eth/getMetadata.ts @@ -30,5 +30,12 @@ export const getMetadata = ({ description: description, images: [imageUrl], }, + other: { + "fc:frame": "vNext", + "fc:frame:image": imageUrl, + "fc:frame:button:1": "Open my 🏗️ Scaffold-ETH 2 dApp", + "fc:frame:button:1:action": "link", + "fc:frame:button:1:target": baseUrl, + }, }; }; From cb47ae904651fa68de1a9aa3e24153368aeee7e8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Carlos=20S=C3=A1nchez?= Date: Tue, 16 Apr 2024 11:55:55 +0200 Subject: [PATCH 2/4] Use metadata on app/layout --- packages/nextjs/app/layout.tsx | 54 ++----------------- .../nextjs/utils/scaffold-eth/getMetadata.ts | 24 ++++++--- 2 files changed, 23 insertions(+), 55 deletions(-) diff --git a/packages/nextjs/app/layout.tsx b/packages/nextjs/app/layout.tsx index 02b34291f..be1234b59 100644 --- a/packages/nextjs/app/layout.tsx +++ b/packages/nextjs/app/layout.tsx @@ -1,57 +1,13 @@ import "@rainbow-me/rainbowkit/styles.css"; -import { Metadata } from "next"; import { ScaffoldEthAppWithProviders } from "~~/components/ScaffoldEthAppWithProviders"; import { ThemeProvider } from "~~/components/ThemeProvider"; import "~~/styles/globals.css"; +import { getMetadata } from "~~/utils/scaffold-eth/getMetadata"; -const baseUrl = process.env.VERCEL_URL - ? `https://${process.env.VERCEL_URL}` - : `http://localhost:${process.env.PORT || 3000}`; -const imageUrl = `${baseUrl}/thumbnail.jpg`; - -const title = "Scaffold-ETH 2 App"; -const titleTemplate = "%s | Scaffold-ETH 2"; -const description = "Built with 🏗 Scaffold-ETH 2"; - -export const metadata: Metadata = { - metadataBase: new URL(baseUrl), - title: { - default: title, - template: titleTemplate, - }, - description, - openGraph: { - title: { - default: title, - template: titleTemplate, - }, - description, - images: [ - { - url: imageUrl, - }, - ], - }, - twitter: { - card: "summary_large_image", - images: [imageUrl], - title: { - default: title, - template: titleTemplate, - }, - description, - }, - icons: { - icon: [{ url: "/favicon.png", sizes: "32x32", type: "image/png" }], - }, - other: { - "fc:frame": "vNext", - "fc:frame:image": imageUrl, - "fc:frame:button:1": "Open my 🏗️ Scaffold-ETH 2 dApp", - "fc:frame:button:1:action": "link", - "fc:frame:button:1:target": baseUrl, - }, -}; +export const metadata = getMetadata({ + title: "Scaffold-ETH 2 App", + description: "Built with 🏗 Scaffold-ETH 2", +}); const ScaffoldEthApp = ({ children }: { children: React.ReactNode }) => { return ( diff --git a/packages/nextjs/utils/scaffold-eth/getMetadata.ts b/packages/nextjs/utils/scaffold-eth/getMetadata.ts index 17b9c837a..f2a8aa175 100644 --- a/packages/nextjs/utils/scaffold-eth/getMetadata.ts +++ b/packages/nextjs/utils/scaffold-eth/getMetadata.ts @@ -1,5 +1,10 @@ import type { Metadata } from "next"; +const baseUrl = process.env.VERCEL_URL + ? `https://${process.env.VERCEL_URL}` + : `http://localhost:${process.env.PORT || 3000}`; +const titleTemplate = "%s | Scaffold-ETH 2"; + export const getMetadata = ({ title, description, @@ -9,15 +14,19 @@ export const getMetadata = ({ description: string; imageRelativePath?: string; }): Metadata => { - const baseUrl = process.env.VERCEL_URL - ? `https://${process.env.VERCEL_URL}` - : `http://localhost:${process.env.PORT || 3000}`; const imageUrl = `${baseUrl}${imageRelativePath}`; + return { - title: title, + title: { + default: title, + template: titleTemplate, + }, description: description, openGraph: { - title: title, + title: { + default: title, + template: titleTemplate, + }, description: description, images: [ { @@ -26,7 +35,10 @@ export const getMetadata = ({ ], }, twitter: { - title: title, + title: { + default: title, + template: titleTemplate, + }, description: description, images: [imageUrl], }, From 79a8819eeff08851b887a34b89d15bb010a02c5b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Carlos=20S=C3=A1nchez?= Date: Tue, 7 May 2024 11:01:08 +0200 Subject: [PATCH 3/4] Remove frame --- packages/nextjs/utils/scaffold-eth/getMetadata.ts | 7 ------- 1 file changed, 7 deletions(-) diff --git a/packages/nextjs/utils/scaffold-eth/getMetadata.ts b/packages/nextjs/utils/scaffold-eth/getMetadata.ts index f2a8aa175..0c501678a 100644 --- a/packages/nextjs/utils/scaffold-eth/getMetadata.ts +++ b/packages/nextjs/utils/scaffold-eth/getMetadata.ts @@ -42,12 +42,5 @@ export const getMetadata = ({ description: description, images: [imageUrl], }, - other: { - "fc:frame": "vNext", - "fc:frame:image": imageUrl, - "fc:frame:button:1": "Open my 🏗️ Scaffold-ETH 2 dApp", - "fc:frame:button:1:action": "link", - "fc:frame:button:1:target": baseUrl, - }, }; }; From c75e10db03035d796b8a614fcf665003346251a1 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Carlos=20S=C3=A1nchez?= Date: Tue, 7 May 2024 11:05:10 +0200 Subject: [PATCH 4/4] Use VERCEL_PROJECT_PRODUCTION_URL --- packages/nextjs/utils/scaffold-eth/getMetadata.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/nextjs/utils/scaffold-eth/getMetadata.ts b/packages/nextjs/utils/scaffold-eth/getMetadata.ts index 0c501678a..23fbca4ce 100644 --- a/packages/nextjs/utils/scaffold-eth/getMetadata.ts +++ b/packages/nextjs/utils/scaffold-eth/getMetadata.ts @@ -1,7 +1,7 @@ import type { Metadata } from "next"; -const baseUrl = process.env.VERCEL_URL - ? `https://${process.env.VERCEL_URL}` +const baseUrl = process.env.VERCEL_PROJECT_PRODUCTION_URL + ? `https://${process.env.VERCEL_PROJECT_PRODUCTION_URL}` : `http://localhost:${process.env.PORT || 3000}`; const titleTemplate = "%s | Scaffold-ETH 2";