Display products

class HitsListView extends StatelessWidget {
  const HitsListView(
      {Key? key,
      required this.items,
      required this.productWidget,
      this.scrollDirection = Axis.vertical})
      : super(key: key);

  final Stream<List<Product>> items;
  final ProductWidgetBuilder productWidget;
  final Axis scrollDirection;

  @override
  Widget build(BuildContext context) {
    return StreamBuilder<List<Product>>(
      stream: items,
      builder: (context, snapshot) {
        if (snapshot.hasData) {
          final products = snapshot.data ?? [];
          return ListView.separated(
              padding: const EdgeInsets.all(8),
              scrollDirection: scrollDirection,
              itemCount: products.length,
              itemBuilder: (BuildContext context, int index) {
                return productWidget(context, products[index]);
              },
              separatorBuilder: (context, index) => const SizedBox(width: 10));
        } else {
          return const Center(child: CircularProgressIndicator());
        }
      },
    );
  }
}

class PagedHitsListView extends StatelessWidget {
  const PagedHitsListView(
      {Key? key,
      required this.pagingController,
      this.onHitClick,
      this.noItemsFound})
      : super(key: key);

  final PagingController<int, Product> pagingController;
  final Function(String)? onHitClick;
  final WidgetBuilder? noItemsFound;

  @override
  Widget build(BuildContext context) {
    return PagedListView<int, Product>.separated(
      shrinkWrap: true,
      pagingController: pagingController,
      separatorBuilder: (context, index) => const SizedBox(height: 10),
      builderDelegate: PagedChildBuilderDelegate<Product>(
        noItemsFoundIndicatorBuilder: noItemsFound,
        itemBuilder: (context, item, index) => ProductItemView(
            product: item,
            imageAlignment: Alignment.bottomCenter,
            onProductPressed: (objectID) => onHitClick?.call(objectID)),
      ),
    );
  }
}

class ModeSwitcherView extends StatelessWidget {
  const ModeSwitcherView(
      {Key? key, required this.currentDisplay, this.onPressed})
      : super(key: key);

  final HitsDisplay currentDisplay;
  final Function(HitsDisplay)? onPressed;

  @override
  Widget build(BuildContext context) {
    return Row(
      crossAxisAlignment: CrossAxisAlignment.center,
      children: [
        const Text('Display'),
        const SizedBox(width: 10),
        SizedBox(
          height: 20,
          width: 20,
          child: IconButton(
            splashRadius: 10,
            padding: const EdgeInsets.all(0.0),
            onPressed: () => onPressed?.call(HitsDisplay.grid),
            icon: Icon(Icons.grid_view,
                size: 20,
                color: HitsDisplay.grid == currentDisplay ? Colors.blue : null),
          ),
        ),
        const SizedBox(width: 10),
        SizedBox(
          height: 20,
          width: 20,
          child: IconButton(
            splashRadius: 10,
            padding: const EdgeInsets.all(0.0),
            onPressed: () => onPressed?.call(HitsDisplay.list),
            icon: Icon(Icons.view_list,
                size: 20,
                color: HitsDisplay.list == currentDisplay ? Colors.blue : null),
          ),
        ),
      ],
    );
  }
}