feat: add x402 next template (#921)

Author: tobySolutions

apps/web/public/locales/en/common.json

@@ -3203,6 +3203,10 @@
         "description": "Sell services with x402"
       },
       "2": {
+        "title": "x402 Next Template",
+        "description": "Build your fullstack dApp with x402 and Next.js"
+      },
+      "3": {
         "title": "x402 Template",
         "description": "Build your API with x402"
       }
@@ -3256,6 +3260,11 @@
           "title": "Build on Solana",
           "description": "Get started with Solana development, wallets, and deploying your first program",
           "cta": "Build"
+        },
+        "x402NextTemplate": {
+          "title": "x402 Next Template",
+          "description": "Build and deploy your Next.js dApp with an X402 integration",
+          "cta": "Build"
         }
       },
       "problem": {

apps/web/src/app/[locale]/x402/hackathon/page.tsx

@@ -46,6 +46,11 @@ export default async function Page(_props: Props) {
     solanaTitle: t("x402.hackathon.prerequisites.solana.title"),
     solanaDescription: t("x402.hackathon.prerequisites.solana.description"),
     solanaCta: t("x402.hackathon.prerequisites.solana.cta"),
+    x402NextTitle: t("x402.hackathon.prerequisites.x402NextTemplate.title"),
+    x402NextDescription: t(
+      "x402.hackathon.prerequisites.x402NextTemplate.description",
+    ),
+    x402NextCta: t("x402.hackathon.prerequisites.x402NextTemplate.cta"),
 
     problemTitle: t("x402.hackathon.problem.title"),
     problemDescription: t("x402.hackathon.problem.description"),

apps/web/src/app/[locale]/x402/hackathon/x402-hackathon.tsx

@@ -33,6 +33,9 @@ interface X402HackathonPageProps {
     solanaTitle: string;
     solanaDescription: string;
     solanaCta: string;
+    x402NextTitle: string;
+    x402NextDescription: string;
+    x402NextCta: string;
     problemTitle: string;
     problemDescription: string;
     requirementsTitle: string;
@@ -132,6 +135,13 @@ export function X402HackathonPage({ translations }: X402HackathonPageProps) {
                 newTab={false}
                 ctaLabel={translations.solanaCta}
               />
+              <DevelopersDocumentItem
+                title={translations.x402NextTitle}
+                description={translations.x402NextDescription}
+                url="https://templates.solana.com/x402-template"
+                newTab={false}
+                ctaLabel={translations.x402NextCta}
+              />
             </div>
           </div>
         </div>

apps/web/src/data/solutions/x402.ts

@@ -28,6 +28,10 @@ export const TOOLS = [
   },
   {
     key: "2",
+    href: "https://templates.solana.com/x402-template",
+  },
+  {
+    key: "3",
     href: "https://templates.solana.com/x402-solana-protocol",
   },
 ];