From adc504ea99128d058019417895d38d73a5e020d8 Mon Sep 17 00:00:00 2001
From: Saihajpreet Singh <saihajpreet.singh@gmail.com>
Date: Tue, 15 Apr 2025 23:46:30 +0530
Subject: [PATCH 1/2] feat: crypto swap widget

---
 pnpm-lock.yaml                | 177 +++++++++++++++++++++++++++++++++-
 website/components/footer.tsx |  41 ++++++++
 website/components/mayan.tsx  |  74 ++++++++++++++
 website/components/navbar.tsx |  38 ++++++++
 website/package.json          |   1 +
 website/pages/buy.tsx         |  15 +++
 website/pages/index.tsx       |  82 +++-------------
 7 files changed, 359 insertions(+), 69 deletions(-)
 create mode 100644 website/components/footer.tsx
 create mode 100644 website/components/mayan.tsx
 create mode 100644 website/components/navbar.tsx
 create mode 100644 website/pages/buy.tsx

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index d11a6511..68ff57ad 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -383,6 +383,9 @@ importers:
 
   website:
     dependencies:
+      '@radix-ui/react-dialog':
+        specifier: ^1.1.6
+        version: 1.1.6(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)
       '@radix-ui/react-slot':
         specifier: ^1.1.1
         version: 1.1.1(@types/react@19.0.7)(react@19.0.0)
@@ -4615,6 +4618,7 @@ packages:
 
   libsql@0.4.7:
     resolution: {integrity: sha512-T9eIRCs6b0J1SHKYIvD8+KCJMcWZ900iZyxdnSCdqxN12Z1ijzT+jY5nrk72Jw4B0HGzms2NgpryArlJqvc3Lw==}
+    cpu: [x64, arm64, wasm32]
     os: [darwin, linux, win32]
 
   light-my-request@6.5.1:
@@ -7479,6 +7483,12 @@ snapshots:
     optionalDependencies:
       '@types/react': 19.0.10
 
+  '@radix-ui/react-context@1.1.1(@types/react@19.0.7)(react@19.0.0)':
+    dependencies:
+      react: 19.0.0
+    optionalDependencies:
+      '@types/react': 19.0.7
+
   '@radix-ui/react-dialog@1.0.5(@types/react-dom@19.0.4(@types/react@19.0.10))(@types/react@19.0.10)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)':
     dependencies:
       '@babel/runtime': 7.26.9
@@ -7502,6 +7512,28 @@ snapshots:
       '@types/react': 19.0.10
       '@types/react-dom': 19.0.4(@types/react@19.0.10)
 
+  '@radix-ui/react-dialog@1.1.6(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)':
+    dependencies:
+      '@radix-ui/primitive': 1.1.1
+      '@radix-ui/react-compose-refs': 1.1.1(@types/react@19.0.7)(react@19.0.0)
+      '@radix-ui/react-context': 1.1.1(@types/react@19.0.7)(react@19.0.0)
+      '@radix-ui/react-dismissable-layer': 1.1.5(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)
+      '@radix-ui/react-focus-guards': 1.1.1(@types/react@19.0.7)(react@19.0.0)
+      '@radix-ui/react-focus-scope': 1.1.2(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)
+      '@radix-ui/react-id': 1.1.0(@types/react@19.0.7)(react@19.0.0)
+      '@radix-ui/react-portal': 1.1.4(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)
+      '@radix-ui/react-presence': 1.1.2(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)
+      '@radix-ui/react-primitive': 2.0.2(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)
+      '@radix-ui/react-slot': 1.1.2(@types/react@19.0.7)(react@19.0.0)
+      '@radix-ui/react-use-controllable-state': 1.1.0(@types/react@19.0.7)(react@19.0.0)
+      aria-hidden: 1.2.4
+      react: 19.0.0
+      react-dom: 19.0.0(react@19.0.0)
+      react-remove-scroll: 2.6.3(@types/react@19.0.7)(react@19.0.0)
+    optionalDependencies:
+      '@types/react': 19.0.7
+      '@types/react-dom': 19.0.3(@types/react@19.0.7)
+
   '@radix-ui/react-dialog@1.1.6(@types/react-dom@19.0.4(@types/react@19.0.10))(@types/react@19.0.10)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)':
     dependencies:
       '@radix-ui/primitive': 1.1.1
@@ -7544,6 +7576,19 @@ snapshots:
       '@types/react': 19.0.10
       '@types/react-dom': 19.0.4(@types/react@19.0.10)
 
+  '@radix-ui/react-dismissable-layer@1.1.5(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)':
+    dependencies:
+      '@radix-ui/primitive': 1.1.1
+      '@radix-ui/react-compose-refs': 1.1.1(@types/react@19.0.7)(react@19.0.0)
+      '@radix-ui/react-primitive': 2.0.2(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)
+      '@radix-ui/react-use-callback-ref': 1.1.0(@types/react@19.0.7)(react@19.0.0)
+      '@radix-ui/react-use-escape-keydown': 1.1.0(@types/react@19.0.7)(react@19.0.0)
+      react: 19.0.0
+      react-dom: 19.0.0(react@19.0.0)
+    optionalDependencies:
+      '@types/react': 19.0.7
+      '@types/react-dom': 19.0.3(@types/react@19.0.7)
+
   '@radix-ui/react-dismissable-layer@1.1.5(@types/react-dom@19.0.4(@types/react@19.0.10))(@types/react@19.0.10)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)':
     dependencies:
       '@radix-ui/primitive': 1.1.1
@@ -7585,6 +7630,12 @@ snapshots:
     optionalDependencies:
       '@types/react': 19.0.10
 
+  '@radix-ui/react-focus-guards@1.1.1(@types/react@19.0.7)(react@19.0.0)':
+    dependencies:
+      react: 19.0.0
+    optionalDependencies:
+      '@types/react': 19.0.7
+
   '@radix-ui/react-focus-scope@1.0.4(@types/react-dom@19.0.4(@types/react@19.0.10))(@types/react@19.0.10)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)':
     dependencies:
       '@babel/runtime': 7.26.9
@@ -7597,6 +7648,17 @@ snapshots:
       '@types/react': 19.0.10
       '@types/react-dom': 19.0.4(@types/react@19.0.10)
 
+  '@radix-ui/react-focus-scope@1.1.2(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)':
+    dependencies:
+      '@radix-ui/react-compose-refs': 1.1.1(@types/react@19.0.7)(react@19.0.0)
+      '@radix-ui/react-primitive': 2.0.2(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)
+      '@radix-ui/react-use-callback-ref': 1.1.0(@types/react@19.0.7)(react@19.0.0)
+      react: 19.0.0
+      react-dom: 19.0.0(react@19.0.0)
+    optionalDependencies:
+      '@types/react': 19.0.7
+      '@types/react-dom': 19.0.3(@types/react@19.0.7)
+
   '@radix-ui/react-focus-scope@1.1.2(@types/react-dom@19.0.4(@types/react@19.0.10))(@types/react@19.0.10)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)':
     dependencies:
       '@radix-ui/react-compose-refs': 1.1.1(@types/react@19.0.10)(react@19.0.0)
@@ -7623,6 +7685,13 @@ snapshots:
     optionalDependencies:
       '@types/react': 19.0.10
 
+  '@radix-ui/react-id@1.1.0(@types/react@19.0.7)(react@19.0.0)':
+    dependencies:
+      '@radix-ui/react-use-layout-effect': 1.1.0(@types/react@19.0.7)(react@19.0.0)
+      react: 19.0.0
+    optionalDependencies:
+      '@types/react': 19.0.7
+
   '@radix-ui/react-label@2.1.2(@types/react-dom@19.0.4(@types/react@19.0.10))(@types/react@19.0.10)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)':
     dependencies:
       '@radix-ui/react-primitive': 2.0.2(@types/react-dom@19.0.4(@types/react@19.0.10))(@types/react@19.0.10)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)
@@ -7709,6 +7778,16 @@ snapshots:
       '@types/react': 19.0.10
       '@types/react-dom': 19.0.4(@types/react@19.0.10)
 
+  '@radix-ui/react-portal@1.1.4(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)':
+    dependencies:
+      '@radix-ui/react-primitive': 2.0.2(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)
+      '@radix-ui/react-use-layout-effect': 1.1.0(@types/react@19.0.7)(react@19.0.0)
+      react: 19.0.0
+      react-dom: 19.0.0(react@19.0.0)
+    optionalDependencies:
+      '@types/react': 19.0.7
+      '@types/react-dom': 19.0.3(@types/react@19.0.7)
+
   '@radix-ui/react-portal@1.1.4(@types/react-dom@19.0.4(@types/react@19.0.10))(@types/react@19.0.10)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)':
     dependencies:
       '@radix-ui/react-primitive': 2.0.2(@types/react-dom@19.0.4(@types/react@19.0.10))(@types/react@19.0.10)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)
@@ -7730,6 +7809,16 @@ snapshots:
       '@types/react': 19.0.10
       '@types/react-dom': 19.0.4(@types/react@19.0.10)
 
+  '@radix-ui/react-presence@1.1.2(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)':
+    dependencies:
+      '@radix-ui/react-compose-refs': 1.1.1(@types/react@19.0.7)(react@19.0.0)
+      '@radix-ui/react-use-layout-effect': 1.1.0(@types/react@19.0.7)(react@19.0.0)
+      react: 19.0.0
+      react-dom: 19.0.0(react@19.0.0)
+    optionalDependencies:
+      '@types/react': 19.0.7
+      '@types/react-dom': 19.0.3(@types/react@19.0.7)
+
   '@radix-ui/react-presence@1.1.2(@types/react-dom@19.0.4(@types/react@19.0.10))(@types/react@19.0.10)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)':
     dependencies:
       '@radix-ui/react-compose-refs': 1.1.1(@types/react@19.0.10)(react@19.0.0)
@@ -7750,6 +7839,15 @@ snapshots:
       '@types/react': 19.0.10
       '@types/react-dom': 19.0.4(@types/react@19.0.10)
 
+  '@radix-ui/react-primitive@2.0.2(@types/react-dom@19.0.3(@types/react@19.0.7))(@types/react@19.0.7)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)':
+    dependencies:
+      '@radix-ui/react-slot': 1.1.2(@types/react@19.0.7)(react@19.0.0)
+      react: 19.0.0
+      react-dom: 19.0.0(react@19.0.0)
+    optionalDependencies:
+      '@types/react': 19.0.7
+      '@types/react-dom': 19.0.3(@types/react@19.0.7)
+
   '@radix-ui/react-primitive@2.0.2(@types/react-dom@19.0.4(@types/react@19.0.10))(@types/react@19.0.10)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)':
     dependencies:
       '@radix-ui/react-slot': 1.1.2(@types/react@19.0.10)(react@19.0.0)
@@ -7831,6 +7929,13 @@ snapshots:
     optionalDependencies:
       '@types/react': 19.0.10
 
+  '@radix-ui/react-slot@1.1.2(@types/react@19.0.7)(react@19.0.0)':
+    dependencies:
+      '@radix-ui/react-compose-refs': 1.1.1(@types/react@19.0.7)(react@19.0.0)
+      react: 19.0.0
+    optionalDependencies:
+      '@types/react': 19.0.7
+
   '@radix-ui/react-toggle@1.1.2(@types/react-dom@19.0.4(@types/react@19.0.10))(@types/react@19.0.10)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)':
     dependencies:
       '@radix-ui/primitive': 1.1.1
@@ -7875,6 +7980,12 @@ snapshots:
     optionalDependencies:
       '@types/react': 19.0.10
 
+  '@radix-ui/react-use-callback-ref@1.1.0(@types/react@19.0.7)(react@19.0.0)':
+    dependencies:
+      react: 19.0.0
+    optionalDependencies:
+      '@types/react': 19.0.7
+
   '@radix-ui/react-use-controllable-state@1.0.1(@types/react@19.0.10)(react@19.0.0)':
     dependencies:
       '@babel/runtime': 7.26.9
@@ -7890,6 +8001,13 @@ snapshots:
     optionalDependencies:
       '@types/react': 19.0.10
 
+  '@radix-ui/react-use-controllable-state@1.1.0(@types/react@19.0.7)(react@19.0.0)':
+    dependencies:
+      '@radix-ui/react-use-callback-ref': 1.1.0(@types/react@19.0.7)(react@19.0.0)
+      react: 19.0.0
+    optionalDependencies:
+      '@types/react': 19.0.7
+
   '@radix-ui/react-use-escape-keydown@1.0.3(@types/react@19.0.10)(react@19.0.0)':
     dependencies:
       '@babel/runtime': 7.26.9
@@ -7905,6 +8023,13 @@ snapshots:
     optionalDependencies:
       '@types/react': 19.0.10
 
+  '@radix-ui/react-use-escape-keydown@1.1.0(@types/react@19.0.7)(react@19.0.0)':
+    dependencies:
+      '@radix-ui/react-use-callback-ref': 1.1.0(@types/react@19.0.7)(react@19.0.0)
+      react: 19.0.0
+    optionalDependencies:
+      '@types/react': 19.0.7
+
   '@radix-ui/react-use-layout-effect@1.0.1(@types/react@19.0.10)(react@19.0.0)':
     dependencies:
       '@babel/runtime': 7.26.9
@@ -7918,6 +8043,12 @@ snapshots:
     optionalDependencies:
       '@types/react': 19.0.10
 
+  '@radix-ui/react-use-layout-effect@1.1.0(@types/react@19.0.7)(react@19.0.0)':
+    dependencies:
+      react: 19.0.0
+    optionalDependencies:
+      '@types/react': 19.0.7
+
   '@radix-ui/react-use-rect@1.1.0(@types/react@19.0.10)(react@19.0.0)':
     dependencies:
       '@radix-ui/rect': 1.1.0
@@ -10038,7 +10169,7 @@ snapshots:
       isstream: 0.1.2
       jsonwebtoken: 9.0.2
       mime-types: 2.1.35
-      retry-axios: 2.6.0(axios@1.7.9)
+      retry-axios: 2.6.0(axios@1.7.9(debug@4.4.0))
       tough-cookie: 4.1.4
     transitivePeerDependencies:
       - supports-color
@@ -11545,6 +11676,14 @@ snapshots:
     optionalDependencies:
       '@types/react': 19.0.10
 
+  react-remove-scroll-bar@2.3.8(@types/react@19.0.7)(react@19.0.0):
+    dependencies:
+      react: 19.0.0
+      react-style-singleton: 2.2.3(@types/react@19.0.7)(react@19.0.0)
+      tslib: 2.8.1
+    optionalDependencies:
+      '@types/react': 19.0.7
+
   react-remove-scroll@2.5.5(@types/react@19.0.10)(react@19.0.0):
     dependencies:
       react: 19.0.0
@@ -11567,6 +11706,17 @@ snapshots:
     optionalDependencies:
       '@types/react': 19.0.10
 
+  react-remove-scroll@2.6.3(@types/react@19.0.7)(react@19.0.0):
+    dependencies:
+      react: 19.0.0
+      react-remove-scroll-bar: 2.3.8(@types/react@19.0.7)(react@19.0.0)
+      react-style-singleton: 2.2.3(@types/react@19.0.7)(react@19.0.0)
+      tslib: 2.8.1
+      use-callback-ref: 1.3.3(@types/react@19.0.7)(react@19.0.0)
+      use-sidecar: 1.1.3(@types/react@19.0.7)(react@19.0.0)
+    optionalDependencies:
+      '@types/react': 19.0.7
+
   react-style-singleton@2.2.3(@types/react@19.0.10)(react@19.0.0):
     dependencies:
       get-nonce: 1.0.1
@@ -11575,6 +11725,14 @@ snapshots:
     optionalDependencies:
       '@types/react': 19.0.10
 
+  react-style-singleton@2.2.3(@types/react@19.0.7)(react@19.0.0):
+    dependencies:
+      get-nonce: 1.0.1
+      react: 19.0.0
+      tslib: 2.8.1
+    optionalDependencies:
+      '@types/react': 19.0.7
+
   react@19.0.0: {}
 
   read-cache@1.0.0:
@@ -11687,7 +11845,7 @@ snapshots:
 
   ret@0.5.0: {}
 
-  retry-axios@2.6.0(axios@1.7.9):
+  retry-axios@2.6.0(axios@1.7.9(debug@4.4.0)):
     dependencies:
       axios: 1.7.9(debug@4.4.0)
 
@@ -12387,6 +12545,13 @@ snapshots:
     optionalDependencies:
       '@types/react': 19.0.10
 
+  use-callback-ref@1.3.3(@types/react@19.0.7)(react@19.0.0):
+    dependencies:
+      react: 19.0.0
+      tslib: 2.8.1
+    optionalDependencies:
+      '@types/react': 19.0.7
+
   use-sidecar@1.1.3(@types/react@19.0.10)(react@19.0.0):
     dependencies:
       detect-node-es: 1.1.0
@@ -12395,6 +12560,14 @@ snapshots:
     optionalDependencies:
       '@types/react': 19.0.10
 
+  use-sidecar@1.1.3(@types/react@19.0.7)(react@19.0.0):
+    dependencies:
+      detect-node-es: 1.1.0
+      react: 19.0.0
+      tslib: 2.8.1
+    optionalDependencies:
+      '@types/react': 19.0.7
+
   use-sync-external-store@1.4.0(react@19.0.0):
     dependencies:
       react: 19.0.0
diff --git a/website/components/footer.tsx b/website/components/footer.tsx
new file mode 100644
index 00000000..38f754b8
--- /dev/null
+++ b/website/components/footer.tsx
@@ -0,0 +1,41 @@
+import Link from 'next/link';
+import { Button } from './ui/button';
+import { RiGithubFill, RiTwitterXLine } from '@remixicon/react';
+
+export function Footer() {
+  return (
+    <footer className="border-t py-4" role="contentinfo">
+      <div className="flex justify-between items-center container mx-auto px-4">
+        <p className="text-sm">
+          © {new Date().getFullYear()} To The Moon Labs Inc. All rights
+          reserved.
+        </p>
+
+        <div className="flex items-center gap-3">
+          <Button variant="outline" asChild size="sm">
+            <Link
+              href="https://x.com/dogeai_gov"
+              target="_blank"
+              rel="noopener noreferrer"
+              aria-label="Follow us on X"
+            >
+              <RiTwitterXLine aria-label="X (formerly Twitter) Icon" />
+              <span className="md:block hidden">Follow</span>
+            </Link>
+          </Button>
+          <Button variant="outline" asChild size="sm">
+            <Link
+              target="_blank"
+              href="https://github.com/saihaj/doge-ai"
+              rel="noopener noreferrer"
+              aria-label="Contribute on GitHub"
+            >
+              <RiGithubFill aria-label="Github Icon" />
+              <span className="md:block hidden">Contribute</span>
+            </Link>
+          </Button>
+        </div>
+      </div>
+    </footer>
+  );
+}
diff --git a/website/components/mayan.tsx b/website/components/mayan.tsx
new file mode 100644
index 00000000..8402ef04
--- /dev/null
+++ b/website/components/mayan.tsx
@@ -0,0 +1,74 @@
+'use client';
+import { useState, useEffect } from 'react';
+import Script from 'next/script';
+
+export function Mayan() {
+  const [mayanLoaded, setMayanLoaded] = useState(false);
+
+  useEffect(() => {
+    if (mayanLoaded && typeof window !== 'undefined' && window.MayanSwap) {
+      try {
+        console.log('MayanSwap SDK loaded');
+        const config = {
+          appIdentity: {
+            name: 'DOGEai',
+            icon: '/logo.jpg',
+            uri: 'https://dogeai.info',
+          },
+          setDefaultToken: true,
+          destinationChains: ['solana'],
+          tokens: {
+            to: {
+              solana: ['9UYAYvVS2cZ3BndbsoG1ScJbjfwyEPGxjE79hh5ipump'],
+            },
+          },
+          rpcs: {
+            solana:
+              'https://rpc.hellomoon.io/2105a23c-5fb3-41dd-adfa-8d1ac542795b',
+          },
+          colors: {
+            mainBox: '#0B0C14',
+            background: '#0B0C14',
+          },
+        };
+        window.MayanSwap.init('swap_widget', config);
+      } catch (error) {
+        console.error('Error initializing MayanSwap:', error);
+      }
+    }
+
+    // Cleanup function to reset the widget
+    return () => {
+      try {
+        // Remove the widget's content
+        const widget = document.getElementById('swap_widget');
+        if (widget) {
+          widget.innerHTML = ''; // Clear the widget's DOM
+        }
+        // Optionally, reset MayanSwap state if the SDK provides a method
+        if (window.MayanSwap && typeof window.MayanSwap.reset === 'function') {
+          window.MayanSwap.reset(); // Hypothetical reset method
+        }
+      } catch (error) {
+        console.error('Error during MayanSwap cleanup:', error);
+      }
+    };
+  }, [mayanLoaded]);
+
+  return (
+    <>
+      <Script
+        src="https://cdn.mayan.finance/mayan_widget_v_1_2_3.js"
+        crossOrigin="anonymous"
+        onLoad={() => {
+          setTimeout(() => setMayanLoaded(true), 100);
+        }}
+        onError={() => {
+          console.error('Failed to load MayanSwap script');
+          setMayanLoaded(false);
+        }}
+      />
+      <div id="swap_widget" />
+    </>
+  );
+}
diff --git a/website/components/navbar.tsx b/website/components/navbar.tsx
new file mode 100644
index 00000000..0f514245
--- /dev/null
+++ b/website/components/navbar.tsx
@@ -0,0 +1,38 @@
+import PayPalDonate from '@/components/donate';
+import { Logo } from '@/components/logo';
+import { Button } from '@/components/ui/button';
+import { RiTwitterXLine } from '@remixicon/react';
+import Link from 'next/link';
+
+export function Navbar() {
+  return (
+    <header className="flex items-center justify-between" role="banner">
+      <nav className="flex items-center gap-4" aria-label="Home Navigation">
+        <Link href="/" className="flex items-center gap-4">
+          <Logo className="h-[50px] w-[50px] rounded-full" />
+          <span className="text-3xl font-bold text-transparent bg-clip-text bg-gradient-america">
+            DOGEai
+          </span>
+        </Link>
+      </nav>
+
+      <nav className="flex items-center gap-3" aria-label="Social Links">
+        <p className="text-lg font-medium lg:block hidden">
+          Built by the community, for the community
+        </p>
+        <Button variant="outline" asChild size="sm">
+          <Link
+            href="https://x.com/dogeai_gov"
+            target="_blank"
+            rel="noopener noreferrer"
+            aria-label="Follow us on X"
+          >
+            <RiTwitterXLine aria-label="X (formerly Twitter) Icon" />
+            <span className="md:block hidden">Follow</span>
+          </Link>
+        </Button>
+        <PayPalDonate />
+      </nav>
+    </header>
+  );
+}
diff --git a/website/package.json b/website/package.json
index 674ae4f8..3bf5505c 100644
--- a/website/package.json
+++ b/website/package.json
@@ -10,6 +10,7 @@
     "lint": "next lint"
   },
   "dependencies": {
+    "@radix-ui/react-dialog": "^1.1.6",
     "@radix-ui/react-slot": "^1.1.1",
     "@remixicon/react": "^4.6.0",
     "@uidotdev/usehooks": "^2.4.1",
diff --git a/website/pages/buy.tsx b/website/pages/buy.tsx
new file mode 100644
index 00000000..1dfdc910
--- /dev/null
+++ b/website/pages/buy.tsx
@@ -0,0 +1,15 @@
+import { Footer } from '@/components/footer';
+import { Mayan } from '@/components/mayan';
+import { Navbar } from '@/components/navbar';
+
+export default function Buy() {
+  return (
+    <div className="min-h-screen container mx-auto px-4 py-5" role="main">
+      <Navbar />
+      <main className="flex flex-col items-center justify-center mt-4">
+        <Mayan />
+      </main>
+      <Footer />
+    </div>
+  );
+}
diff --git a/website/pages/index.tsx b/website/pages/index.tsx
index f5e24076..bc11aad1 100644
--- a/website/pages/index.tsx
+++ b/website/pages/index.tsx
@@ -1,12 +1,13 @@
-import Link from 'next/link';
-import { RiGithubFill, RiTwitterXLine } from '@remixicon/react';
-import { Button } from '@/components/ui/button';
-import { Logo } from '@/components/logo';
+import { Button, buttonVariants } from '@/components/ui/button';
 import Image from 'next/image';
 import hero from '../public/images/hero.png';
 import { useCopyToClipboard } from '@uidotdev/usehooks';
 import { useEffect, useState } from 'react';
-import PayPalDonate from '@/components/donate';
+import { Navbar } from '@/components/navbar';
+import { Footer } from '@/components/footer';
+import Link from 'next/link';
+import { cn } from '@/lib/utils';
+import { RiTokenSwapLine } from '@remixicon/react';
 
 function CongressCard({
   number,
@@ -114,34 +115,7 @@ export default function Home() {
   return (
     <>
       <div className="min-h-screen container mx-auto px-4 py-5" role="main">
-        <header className="flex items-center justify-between" role="banner">
-          <nav className="flex items-center gap-4" aria-label="Home Navigation">
-            <Link href="/" className="flex items-center gap-4">
-              <Logo className="h-[50px] w-[50px] rounded-full" />
-              <span className="text-3xl font-bold text-transparent bg-clip-text bg-gradient-america">
-                DOGEai
-              </span>
-            </Link>
-          </nav>
-
-          <nav className="flex items-center gap-3" aria-label="Social Links">
-            <p className="text-lg font-medium lg:block hidden">
-              Built by the community, for the community
-            </p>
-            <Button variant="outline" asChild size="sm">
-              <Link
-                href="https://x.com/dogeai_gov"
-                target="_blank"
-                rel="noopener noreferrer"
-                aria-label="Follow us on X"
-              >
-                <RiTwitterXLine aria-label="X (formerly Twitter) Icon" />
-                <span className="md:block hidden">Follow</span>
-              </Link>
-            </Button>
-            <PayPalDonate />
-          </nav>
-        </header>
+        <Navbar />
 
         <main>
           <section
@@ -276,6 +250,13 @@ export default function Home() {
                   </p>
                 </div>
               </div>
+              <Link
+                href="/buy"
+                className={cn(buttonVariants({ size: 'sm' }), 'mt-2 md:mt-8')}
+              >
+                <RiTokenSwapLine />
+                Buy $DOGEai
+              </Link>
             </div>
           </section>
 
@@ -569,40 +550,7 @@ export default function Home() {
             </div>
           </section>
         </main>
-
-        <footer className="border-t py-4" role="contentinfo">
-          <div className="flex justify-between items-center container mx-auto px-4">
-            <p className="text-sm">
-              © {new Date().getFullYear()} To The Moon Labs Inc. All rights
-              reserved.
-            </p>
-
-            <div className="flex items-center gap-3">
-              <Button variant="outline" asChild size="sm">
-                <Link
-                  href="https://x.com/dogeai_gov"
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  aria-label="Follow us on X"
-                >
-                  <RiTwitterXLine aria-label="X (formerly Twitter) Icon" />
-                  <span className="md:block hidden">Follow</span>
-                </Link>
-              </Button>
-              <Button variant="outline" asChild size="sm">
-                <Link
-                  target="_blank"
-                  href="https://github.com/saihaj/doge-ai"
-                  rel="noopener noreferrer"
-                  aria-label="Contribute on GitHub"
-                >
-                  <RiGithubFill aria-label="Github Icon" />
-                  <span className="md:block hidden">Contribute</span>
-                </Link>
-              </Button>
-            </div>
-          </div>
-        </footer>
+        <Footer />
       </div>
     </>
   );

From 704219d7baaa243c9aa40d747f0472d39fa42a23 Mon Sep 17 00:00:00 2001
From: Saihajpreet Singh <saihajpreet.singh@gmail.com>
Date: Tue, 15 Apr 2025 23:52:46 +0530
Subject: [PATCH 2/2] ts

---
 website/components/mayan.tsx | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/website/components/mayan.tsx b/website/components/mayan.tsx
index 8402ef04..fc9bea98 100644
--- a/website/components/mayan.tsx
+++ b/website/components/mayan.tsx
@@ -6,6 +6,7 @@ export function Mayan() {
   const [mayanLoaded, setMayanLoaded] = useState(false);
 
   useEffect(() => {
+    // @ts-expect-error - ignore for now
     if (mayanLoaded && typeof window !== 'undefined' && window.MayanSwap) {
       try {
         console.log('MayanSwap SDK loaded');
@@ -31,6 +32,7 @@ export function Mayan() {
             background: '#0B0C14',
           },
         };
+        // @ts-expect-error - Initialize the MayanSwap widget
         window.MayanSwap.init('swap_widget', config);
       } catch (error) {
         console.error('Error initializing MayanSwap:', error);
@@ -46,7 +48,9 @@ export function Mayan() {
           widget.innerHTML = ''; // Clear the widget's DOM
         }
         // Optionally, reset MayanSwap state if the SDK provides a method
+        // @ts-expect-error - ignore
         if (window.MayanSwap && typeof window.MayanSwap.reset === 'function') {
+          // @ts-expect-error - ignore
           window.MayanSwap.reset(); // Hypothetical reset method
         }
       } catch (error) {