arch-atlas

Product List Widget

widgets/marketplace_product_list.dart

presentation

Overview

Switches between grid and list layout based on state.isGridView. Each tile is tappable (pushes /product-details/:id), shows the calculated price, and renders a favorite toggle (controller.toggleFavorite).

User Flow

  1. ListView/GridView builds from state.products.
  2. Near-bottom scroll → controller.loadMore.
  3. Heart icon tap → controller.toggleFavorite(productId).
  4. Tile tap → context.push(AppRoute.productDetails, extra: product).

Cases & Edge Cases

  • Empty state renders an illustration + 'Reset filters' CTA when filters are active.
  • Grid uses crossAxisCount=2 fixed — tablets need a media-query override.
  • Skeleton loading rows are shown for state.isLoading while products.isNotEmpty for smooth append.

Code References

  • lib/src/features/shared/marketplace/views/widgets/marketplace_product_list.dart

API Calls

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

Notes

Tap routes to AppRoute.productDetails passing the Product via state.extra — see app_router.dart for the typed cast.