feat(web-app): add pwa install and offline shell

[EstebanCanales]

Summary

This PR adds Progressive Web App support to the Neko web app so it can be installed on mobile and desktop and behave more like a native app, while preserving the existing application layout and user flows.

The implementation includes:

• PWA manifest metadata for installability
• service worker registration for offline shell behavior
• install icons and Apple touch icons
• offline fallback route
• connectivity state notices for offline, reconnecting, and restored network states
• mobile-only spacing adjustments for the installed-app experience
• a small haptics typing fix that was required for production builds to pass

Why we used Next.js manifest support instead of next-pwa

We intentionally used the built-in Next.js App Router manifest support plus a manual service worker flow instead of adding next-pwa.

Reasoning:

• Next.js 16 already provides first-class support for manifest generation through App Router metadata routes
• our requirements for this issue were focused on installability, offline shell behavior, icons, and connectivity UX, not on introducing an additional plugin abstraction
• using the native Next.js path keeps the implementation smaller and easier to reason about
• it avoids adding another dependency layer that could interfere with the current app structure or introduce plugin-specific behavior we do not need
• this gives us explicit control over what is cached, how the offline experience behaves, and how the app handles reconnection states

In short:

• manifest.ts is handled natively by Next.js
• service worker behavior is handled explicitly by our app
• no extra wrapper/plugin was necessary for the scope of this work

Included

• apps/web-app/src/app/manifest.ts
• apps/web-app/public/sw.js
• install icons in apps/web-app/public/icons/
• Apple touch icons in apps/web-app/public/
• offline fallback route in apps/web-app/src/app/offline/page.tsx
• PWA/connectivity client components in apps/web-app/src/components/pwa/
• root metadata updates in apps/web-app/src/app/layout.tsx
• provider wiring for service worker registration and persisted query cache in apps/web-app/src/app/providers.tsx

Behavior added

• the app exposes a valid web manifest with:
  • app name
  • short name
  • theme color
  • standalone display mode
  • install icons
• the app registers a service worker in production
• static assets and last-visited pages are cached for offline shell behavior
• the app provides an offline fallback screen
• the UI shows connection-state notices:
  • offline
  • reconnecting
  • connection restored
• installed/mobile app spacing is handled without changing the desktop layout

Validation

• npm run build
• manual browser verification of manifest generation
• manual verification of service worker registration
• manual verification of connectivity notice behavior
• manual comparison against base branch behavior

Lighthouse / performance note

We also checked the baseline branch (dev) directly on /dashboard.

Baseline dev result:

• Performance: 49
• Accessibility: 91
• Best Practices: 96
• SEO: 100

Preview App
https://cap.so/s/ja203jnqvs59pej

[vercel]

@EstebanCanales is attempting to deploy a commit to the Oppia Software Labs Team on Vercel.

A member of the Team first needs to authorize it.