vtex / faststore

Digital commerce toolkit for frontend developers
https://faststore.dev
MIT License
189 stars 60 forks source link

feat: sku matrix packages core #2505

Open ramondorosario-ct opened 3 days ago

ramondorosario-ct commented 3 days ago

Este PR conta com a implementação do SKUMatrix na ProductDetails.

Dentro do @faststore/core na pasta ui, foi criada uma abstração do SKUMatrixSidebar. Toda a lógica de captura dos dados e formatação do mesmo é feita nessa abstração. Para fazer a requisição dos dados, foi criado uma nova query. Para utiliza-la basta chamar o hook useAllVariantProducts (toda a construção dessa nova query está presente no PR #2504 ). Para consumir esse hook, é necessário passar algumas propriedades, das quais podemos destacar o callBack e enabled.

Dentro dessa abstração do SKUMatrixSidebar, deve haver o consumo do contexto do SKUMatrix. O contexto que irá controlar todos os estados, como por exemplo, informar ao contexto a lista das variações do produto. Como essa abstração que ficará responsável por fazer a requisição e informar os dados para o contexto, o callBack que é passado no useAllVariantProducts, será o método de adicionar os itens que serão exibidos na tabela do SKUMatrixSidebar, portanto deve ser atribuído o método setAllVariantProductspresente no contexto do SKUMatrix, dessa forma, os dados que já serão retornados formatados, serão informados ao contexto e posteriormente, o SKUMatrixSidebarvai poder consumir esses dados e exibir em tela.

Falando um pouco sobre o useBuyButton, este hook é responsável por adicionar os itens selecionados no carrinho. Anteriormente, o mesmo não aceitava uma lista de itens, logo, foi necessário modifica-lo para que a nova demanda fosse atendida. Como o hook deve consumir algumas informações para posteriormente informar o buyButtonProps (reposável por preparar os dados a serem inseridos no carrinho), ele precisa observar os dados dos produtos a serem adicionados no carrinho. Esses dados, são retornados do contexto do SKUMatrix, por tanto, sempre que existir qualquer tipo de modificação no estado do contexto (por exemplo, uma alteração na quantidade de um SKU dentro da tabela do SKUMatrixSidebar), irá refletir no hook do useBuyButton, e as propriedades serão geradas corretamente.

Para finalizar, toda a configuração do headless CMS foi desenvolvida nesse PR.

Este PR tem como dependência: #2503 e #2504

Printscreens

Headless CMS

SKU Matrix - Headless CMS

vercel[bot] commented 3 days ago

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
faststore-site ✅ Ready (Inspect) Visit Preview 💬 Add feedback Oct 16, 2024 7:36pm