Redux'ta Satıcı Bilgilerini Ekleme

Ürünlerimizin aslında satıcılar tarafından uygulamaya eklendiğinden bahsetmiştik. Hadi yeni bir ürün eklerken satıcı bilgilerini de gösterelim.

Ürün uygulamamızı açalım, içindeki productsSlice.js dosyasını açalım. Hadi prepare fonksiyonuna bir parametre daha geçirelim, adını sellerId koyalım ve sonrasında aksiyonun payload'ı için bunu ayarlayalım. Artık prepare için kod parçamız şöyle olacak:

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

Şimdi ürün ekleme formu olan NewProductForm.jsx dosyasında bir dizi değişiklik yapmamız gerekiyor. Öncelikle satıcı id'si için bir yerel state daha ekleyelim:

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

Sonra, useDispatch için dispatch değişkenini tanımladıktan sonra, useSelector hook'unu kullanarak state'ten satıcılar slice'ını almak için kodu ekleyelim:

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

Girdi alanları için olay işleyicilerine bir tane daha ekleyelim:

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

productAdded aksiyonu için sellerId'yi de ekleyerek onSaveProductClick fonksiyonunu düzeltelim:

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