Platform Features & PWA
Underlying architecture, security frameworks, and PWA capabilities.
1. Session & Role Management
The platform implements stateless, secure session management powered by NextAuth.js. Sessions are signed using `JWT` keys and stored in `httpOnly` secure cookies.
| User Role | Authentication Provider | Capabilities |
|---|---|---|
| Guest | Anonymous | Browse PLP/PDP, add to cart (stored locally), search. |
| Customer | Google OAuth / Email (Bcrypt) | DB-synced cart, checkout, profile address book, order history, review submission. |
| Vendor | Credentials Panel | Create/manage own product inventory, track supplier revenue. |
| Admin | Credentials Panel (Cosstech Solutions) | Full system control, financial logs, global settings, logistics staff, CMS, review moderation. |
2. Google OAuth & Account Linking
When users log in using Google OAuth, NextAuth hooks automatically verify their email. If a credentials-based profile exists under that email, the system safely links the Google OAuth ID to the account, preventing duplicate users and preserving customer order history.
3. Progressive Web App (PWA)
The platform contains full PWA integration utilizing `manifest.json` and service worker registrations via `next-pwa` and Workbox:
- Manifest Config: Custom icon sets (192x192, 512x512 PNGs), theme colors (`#1E3A5F`), standalone displays.
- Service Worker Cache-First: Static JS/CSS assets and Cloudinary product photos are cached for fast offline catalog browsing.
- Service Worker Stale-While-Revalidate: Product metadata and searches are fetched over the network but served from cache instantly on connection drops.
- Install Banner: Dynamic custom "Add to Home Screen" notification prompts appear when browse criteria are met.
4. SEO Strategy & Structured Schemas
Every page implements dynamic, unique SEO optimizations using the Next.js `generateMetadata` API, pre-rendering OpenGraph social cards, and sitemaps. The system renders JSON-LD schemas:
- Organization Schema: Renders on the homepage defining brand logo, URL, founders, and customer support.
- Product Schema: Renders on PDPs carrying product name, images, average ratings, reviews, stock availability, price, and currency.
- BreadcrumbList Schema: Renders catalog hierarchies (e.g. Shop > Category > Product) for search snippets.
- FAQPage Schema: Automatically populated from global store FAQs on support pages.