Adicionando informações do vendedor no Redux

Nós conversamos sobre o fato de que nossos produtos são essencialmente adicionados ao aplicativo pelos vendedores. Vamos exibir as informações do vendedor ao adicionar um novo produto.

Abra nosso aplicativo de produtos, e nele o arquivo productsSlice.js. Vamos passar para prepare mais um parâmetro, vamos chamá-lo de sellerId e definir ele posteriormente para o payload da ação. Agora nosso trecho de código para prepare ficará assim:

products/productsSlice.jsprepare(name, desc, price, amount, sellerId) {
  return {
    payload: {
      id: nanoid(),
      name,
      desc,
      price,
      amount,
      seller: sellerId,
    },
  }
},

Agora precisamos fazer uma série de alterações no arquivo do formulário para adicionar produto NewProductForm.jsx. Primeiro, vamos adicionar mais um estado local para o id do vendedor:

products/NewProductForm.jsxconst [sellerId, setSellerId] = useState('')

Em seguida, após a declaração da variável dispatch para useDispatch, vamos adicionar o código para obter a slice dos vendedores do estado usando o hook useSelector:

products/NewProductForm.jsxconst sellers = useSelector((state) => state.sellers)

Vamos adicionar mais um manipulador aos manipuladores dos campos de entrada:

products/NewProductForm.jsxconst onSellerChanged = (e) => setSellerId(e.target.value)

Vamos ajustar onSaveProductClick, adicionando à ação productAdded também o sellerId:

products/NewProductForm.jsxdispatch(productAdded(name, desc, price, amount, sellerId))