docs(headless): @coveo/headless/commerce + react sample

[fbeaudoincoveo]

https://coveord.atlassian.net/browse/KIT-3429

Looks absolutely horrible but it works 😅

demo.mp4

What's covered:

• Search box / standalone search box with query suggestions

• Product listing and search pages with:

  • URL manager
  • breadcrumbs
  • all types of facets
  • pagination (show more by default, with pager commented out)
  • product list with interactive products (for logging ec.productClick)
  • sort
  • query summary

• Recommendations with:

  • pagination (show more by default, with pager commented out)
  • product list with interactive products
  • query summary

• Cart:

  • dedicated page showing current cart state, allowing products to be added or removed, cart to be cleared, or purchase to be made, which all emit the correct ec events
  • number of products in cart shown on cart tab
  • products can be added / removed from cart in any result list (search, product listing, or recommendations)

• PDP:

  • a page that demonstrates how to use the ProductView controller to emit ec.productView events

What's still missing:

1. Facet search
2. Field suggestions
3. Recent queries
4. Instant products
5. Product templates (I don't really think we need this in a react sample, though)
6. Notify triggers, and only this one for now because:

• Query triggers are already managed by the did you mean feature (try submitting the query the query me)
• Redirect trigers are already covered by the standalone search box (try submitting the query redirect me from a standalone search box)

8. Pagination results per page
9. Manual numeric facet ranges
10. Product grouping in product list

I created Jiras for each of these (except product templates)

[github-actions]

Pull Request Report

PR Title

✅ Title follows the conventional commit spec.

Live demo links

• Storybook

• Playwright report

Bundle Size

File	Old (kb)	New (kb)	Change (%)
case-assist	245.1	245.1	0
commerce	341.6	341.6	0
search	414	414	0
insight	392.4	392.4	0
product-listing	307.1	307.1	0
product-recommendation	211.4	211.4	0
recommendation	258.2	258.2	0
ssr	405.4	405.4	0

SSR Progress

Use case	SSR (#)	CSR (#)	Progress (%)
search	39	44	89
recommendation	0	4	0
product-recommendation	0	10	0
product-listing	0	13	0
case-assist	0	6	0
insight	0	27	0
commerce	0	15	0

Detailed logs

search : buildInteractiveResult
search : buildInteractiveInstantResult
search : buildInteractiveRecentResult
search : buildInteractiveCitation
search : buildGeneratedAnswer
recommendation : missing SSR support
product-recommendation : missing SSR support
product-listing : missing SSR support
case-assist : missing SSR support
insight : missing SSR support
commerce : missing SSR support

[Spuffynism]

Incredible work!! ⭐⭐⭐

[jpmarceau]

Thanks Fred, this will be very useful 👌