feat: add PWA install prompt

app/layout.tsx

@@ -43,6 +43,12 @@ export const metadata: Metadata = {
     'Aframp',
   ],
   generator: 'v0.app',
+  manifest: '/manifest.json',
+  appleWebApp: {
+    capable: true,
+    statusBarStyle: 'default',
+    title: 'Aframp',
+  },
 }
 
 export const viewport: Viewport = {

app/manifest.ts

@@ -0,0 +1,25 @@
+import type { MetadataRoute } from 'next'
+
+export default function manifest(): MetadataRoute.Manifest {
+  return {
+    name: 'Aframp',
+    short_name: 'Aframp',
+    description: 'Africa\'s premier cNGN stablecoin payment platform',
+    start_url: '/',
+    display: 'standalone',
+    background_color: '#000000',
+    theme_color: '#10b981',
+    icons: [
+      {
+        src: '/icon-192x192.png',
+        sizes: '192x192',
+        type: 'image/png',
+      },
+      {
+        src: '/icon-512x512.png',
+        sizes: '512x512',
+        type: 'image/png',
+      },
+    ],
+  }
+}

next.config.mjs

@@ -1,3 +1,12 @@
+import withPWAInit from 'next-pwa'
+
+const withPWA = withPWAInit({
+  dest: 'public',
+  register: true,
+  skipWaiting: true,
+  disable: process.env.NODE_ENV === 'development',
+})
+
 /** @type {import('next').NextConfig} */
 const nextConfig = {
   typescript: {
@@ -10,4 +19,4 @@ const nextConfig = {
   output: 'standalone',
 }
 
-export default nextConfig
+export default withPWA(nextConfig)