fix: Add PWA support (Progressive Web App)

next.config.js

@@ -10,6 +10,13 @@ const nextConfig = {
     };
     return config;
   },
+  // Add PWA configuration
+  pwa: {
+    dest: 'public',
+    register: true,
+    skipWaiting: true,
+    disable: process.env.NODE_ENV === 'development'
+  }
 };
 
-module.exports = nextConfig;
+module.exports = nextConfig;

public/manifest.json

@@ -0,0 +1,21 @@
+{
+  "name": "SoroSave",
+  "short_name": "SoroSave",
+  "description": "Decentralized rotating savings protocol",
+  "start_url": "/",
+  "display": "standalone",
+  "background_color": "#ffffff",
+  "theme_color": "#22c55e",
+  "icons": [
+    {
+      "src": "/icons/icon-192x192.png",
+      "sizes": "192x192",
+      "type": "image/png"
+    },
+    {
+      "src": "/icons/icon-512x512.png",
+      "sizes": "512x512",
+      "type": "image/png"
+    }
+  ]
+}

src/app/layout.tsx

@@ -1,13 +1,49 @@
 import type { Metadata } from "next";
 import { Providers } from "./providers";
 import "./globals.css";
+import './pwa'; // Add this line
 
-export const metadata: Metadata = {
+const APP_NAME = "SoroSave";
+const APP_DESCRIPTION = "Decentralized rotating savings protocol";
+
+// Add this metadata
+const APP_MANIFEST = "/manifest.json";
+
+// Update metadata
+const metadata: Metadata = {
   title: "SoroSave — Decentralized Group Savings",
-  description:
-    "A decentralized rotating savings protocol built on Soroban. Create or join savings groups, contribute each cycle, and receive the pot when it's your turn.",
+  description: APP_DESCRIPTION,
+  manifest: APP_MANIFEST,
+  themeColor: "#22c55e",
+  appleWebApp: {
+    capable: true,
+    statusBarStyle: "default",
+    title: APP_NAME
+  },
+  formatDetection: {
+    telephone: false
+  },
+  openGraph: {
+    type: "website",
+    siteName: APP_NAME,
+    title: {
+      default: APP_NAME,
+      template: `%s - ${APP_NAME}`
+    },
+    description: APP_DESCRIPTION
+  },
+  twitter: {
+    card: "summary",
+    title: {
+      default: APP_NAME,
+      template: `%s - ${APP_NAME}`
+    },
+    description: APP_DESCRIPTION
+  }
 };
 
+export { metadata };
+
 export default function RootLayout({
   children,
 }: {
@@ -20,4 +56,4 @@ export default function RootLayout({
       </body>
     </html>
   );
-}
+}