Implement Mobile/Desktop platform target

[aspauldingcode]

Port Next.js App to iOS and Desktop using Tauri and Capacitor

Goal:
Package the existing Next.js app for iOS, Android, macOS, Windows, and Linux without rewriting the frontend.

---

Stack

• Frontend: Next.js (existing app)
• Mobile Wrapper: Capacitor
• Desktop Wrapper: Tauri
• Shared Codebase: Single Next.js app served locally in both environments

---

Plan

1. Add Capacitor to Next.js

• Install Capacitor packages
  npm install @capacitor/core @capacitor/cli
• Initialize Capacitor
  npx cap init
• Add iOS and Android platforms
  npx cap add ios
npx cap add android

2. Build Next.js for production

• Run Next.js build and export
  npm run build && npm run export
• Confirm /out/ directory exists
• Update capacitor.config.ts:

  const config = {
    webDir: "out",
    bundledWebRuntime: false,
  };
  export default config;

3. Configure iOS build
   • Sync Capacitor iOS project (npx cap sync ios)
   • Open in Xcode (npx cap open ios)
   • Load assets locally (offline-first)
   • Set bundle ID, app name, and icons
   • Add required permissions to Info.plist

4. Add Tauri for desktop
   • Install Tauri CLI (cargo install create-tauri-app)
   • Create Tauri project (npx create-tauri-app)
   • Point distDir to ../out
   • Test desktop build (tauri dev)
   • Integrate optional APIs (tray menu, notifications, file dialogs)

5. Testing and signing
   • Test on iOS using TestFlight
   • Build desktop apps with Tauri pipeline
   • Verify app loads local assets instead of remote URLs
   • Sign and archive for App Store submission

---

Expected Outcome
• Identical UI and logic across all platforms
• Offline-ready iOS bundle (App Store compliant)
• Lightweight native wrappers without React Native rebuild

---

Notes
• Avoid remote hosting in native builds (Apple restriction)
• Use Capacitor plugins for mobile APIs
• Use Tauri APIs for desktop integration