arch-atlas

Product Details Screen (customer)

product_details/views/product_details_screen.dart

presentation

Overview

Customer-facing product page: image slider, info section, size/color selectors, quantity stepper, description + specs, sticky bottom Add-to-cart bar. Receives a Product via route extra or refetches via loadProduct.

User Flow

  1. Reads Product from state.extra; otherwise loadProduct(id).
  2. ProductSizeSelector + dynamic option selectors call selectOption.
  3. Quantity selector calls setQuantity.
  4. ProductBottomBar Add-to-cart → cartControllerProvider.addToCart with selectedVariant.
  5. Favorite toggle dispatches into ProductDetailsController.toggleFavorite (which mirrors into marketplace).

Cases & Edge Cases

  • selectedVariant=null disables the Add-to-cart button (no SKU resolves the current options).
  • Image slider lazy-loads via Image.network; pre-fetch is not implemented yet.
  • Quantity steppers respect inventory_quantity when present on the variant.

Code References

  • lib/src/features/shared/product_details/views/product_details_screen.dart
  • lib/src/features/shared/product_details/views/widgets/product_image_slider.dart
  • lib/src/features/shared/product_details/views/widgets/product_size_selector.dart
  • lib/src/features/shared/product_details/views/widgets/product_bottom_bar.dart

API Calls

Empty — fill this in later. Open the manifest and add content here.

Notes

The customer-side product detail lives in shared/, not in seller/ — adjacent to its sibling provision_details/ which handles bookings.