How dhetchaiyakrith24/okami24-web works
OKami24 is a multilingual Next.js storefront for browsing vape products and completing orders. The main customer journey runs from catalog and product pages through cart and checkout to order status; the tree also shows discovery tools, editorial/service content, and a separate ProductMaster publication bridge. Evidence is strongest for catalog projection, page composition, locale handling, and selected commerce calls; several runtime links are inferred only from the tree and are marked unverified.
Main entry points: page.tsx Product detail · storefront-preview-read-model.ts Storefront read model · index.ts Legacy catalog · storefront-bridge.ts Publication bridge
Components 25
Storefront and discovery
- Home page
src/app/page.tsx - Catalog pages
src/app/products/page.tsx - Brand pages
src/app/brands/[brand]/page.tsx - Product detail
src/app/products/[slug]/page.tsx - Catalog browser
src/components/catalog/CatalogBrowser.tsx - Search and tools
src/components/tools
Catalog and publication
- Legacy catalog
src/data/products/index.ts - Catalog taxonomy
src/data/brands.ts - ProductMaster projection
src/data/shipnity-seed/active-catalog-to-product-master.ts - Storefront read model
src/data/shipnity-seed/storefront-preview-read-model.ts - Publication bridge
src/data/shipnity-seed/storefront-bridge.ts
Cart and commerce
- Cart
src/app/cart/actions.ts - Checkout
src/app/checkout/actions.ts - Review step view
src/components/commerce/ReviewStepView.tsx - Commerce services
src/lib/commerce - Order status
src/app/orders/[orderNumber]/page.tsx
Editorial and service content
- Guides and information
src/app/guides/[slug]/page.tsx - Editorial data
src/data/guides.ts - Review video card
src/components/product/ProductReviewVideo.tsx
Shared site services
- Site layout
src/app/layout.tsx - Locale provider
src/components/i18n/LocaleProvider.tsx - Language dictionaries
src/i18n/dictionaries/index.ts - SEO and metadata
src/lib/seo.ts - SQLite client
src/lib/db/client.ts
Other components
- Shopper
Connections 28
- Shopper → Home page: opens
- Shopper → Catalog pages: browses
- Shopper → Product detail: selects product
- Home page → Legacy catalog: reads catalog
src/app/page.tsx - Home page → Publication bridge: reads published items
src/app/page.tsx - Catalog pages → Legacy catalog: reads catalog
src/app/products/page.tsx - Catalog pages → Publication bridge: reads published items
src/app/products/page.tsx - Brand pages → Catalog browser: renders
src/app/brands/[brand]/page.tsx - Brand pages → Publication bridge: reads catalog
src/app/brands/[brand]/page.tsx - Product detail → Legacy catalog: reads product
src/app/products/[slug]/page.tsx - Product detail → Catalog browser: renders
src/app/products/[slug]/page.tsx - Catalog browser → Storefront read model: reads preview model
src/components/catalog/CatalogBrowser.tsx - Legacy catalog → Catalog taxonomy: resolves brand and category
src/data/products/index.ts - Publication bridge → Storefront read model: builds catalog views
src/data/shipnity-seed/storefront-bridge.ts - Storefront read model → ProductMaster projection: projects input
src/data/shipnity-seed/storefront-preview-read-model.ts - Storefront read model → Catalog taxonomy: resolves taxonomy
src/data/shipnity-seed/storefront-preview-read-model.ts - Product detail → Cart: adds to cart
- Cart → Checkout: starts checkout
- Review step view → Checkout: submits checkout
src/components/commerce/ReviewStepView.tsx - Review step view → Commerce services: reads cart and address
src/components/commerce/ReviewStepView.tsx - Checkout → Order status: creates order
- Order status → Commerce services: reads order status
- Guides and information → Editorial data: reads guide content
- Guides and information → Review video card: renders video card
- Site layout → Locale provider: provides locale
- Locale provider → Language dictionaries: loads translations
src/components/i18n/LocaleProvider.tsx - Product detail → SEO and metadata: uses metadata
src/app/products/[slug]/page.tsx - Commerce services → SQLite client: uses database
src/lib/commerce/auth.ts