feat: add PWA app shell and offline upload queue for mobile

[Abhash-Chakraborty]

Problem

The mobile strategy chooses PWA-first, but the app does not yet have an installable mobile shell or offline upload queue.

Goal

Add the first PWA mobile foundation without pretending the phone runs the full ML stack locally.

Scope

• Add a web app manifest and installable PWA shell.
• Add service worker support compatible with the current Next.js setup.
• Add an IndexedDB-backed draft upload queue for images selected while offline.
• Flush queued uploads when the backend is reachable again.
• Keep heavy ML processing on the user-owned backend.

Acceptance criteria

• App has a valid manifest with icons, name, theme color, and display mode.
• Core shell/navigation can be cached for installable PWA behavior.
• Offline-selected uploads are stored in IndexedDB with removable draft state.
• Queued uploads flush only to the configured Find backend.
• UI clearly shows queued, uploading, failed, and completed draft states.
• Tests or documented manual checks cover offline queue behavior.

Suggested files

• frontend/src/app/
• frontend/src/lib/
• frontend/public/
• frontend/package.json
• docs/plans/not-started/mobile-strategy.md

Related

• Follows closed mobile strategy research issue research: define mobile strategy for Find without shipping huge local ML stack #46.

[Abhash-Chakraborty]

Split out beginner-friendly starter tasks from this larger PWA/mobile issue:

• feat: add basic PWA manifest metadata and icons #265
• docs: add manual PWA install and offline-shell test checklist #266

[SOHALIYAJAY]

Hi @Abhash-Chakraborty,

I'd like to work on this issue.

I plan to implement the PWA foundation while keeping all ML processing on the user-owned backend as described in the mobile strategy. My approach will be to:

• Add a web app manifest with the required metadata (name, icons, theme color, display mode).
• Configure a service worker for installable PWA support and shell caching.
• Implement an IndexedDB-backed offline upload queue for image drafts.
• Add queue management actions (view/remove drafts).
• Automatically retry and flush queued uploads when connectivity is restored and the configured Find backend is reachable.
• Provide clear UI states for queued, uploading, failed, and completed uploads.
• Add tests and/or documented manual verification steps for offline queue behavior.

I'll review the existing Next.js architecture first to ensure the implementation remains compatible with the current frontend setup and does not affect backend ML processing.

Could this issue be assigned to me? Thanks!