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:

prepare(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:

const [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:

const sellers = useSelector((state) => state.sellers)

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

const onSellerChanged = (e) => setSellerId(e.target.value)

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

dispatch(productAdded(name, desc, price, amount, sellerId))

Öğrenci uygulamanızı açın. Öğrencileri ekleyen öğretmen hakkında bilgi girme imkanı ekleyin. Bunun için, ders materyalini inceleyerek, studentsSlice.js dosyasındaki prepare fonksiyonu için değişiklikler yapın.

NewStudentForm.jsx dosyasında ilgili değişiklikleri yapın.