Adding Seller Information to Redux

We talked about how our products are actually added to the app by sellers. Let's display information about the seller when adding a new product.

Let's open our product app, and in it the file productsSlice.js. Let's pass another parameter to prepare, let's call it sellerId and set it further for the payload action. Now our piece of code for prepare will be like this:

prepare(name, desc, price, amount, sellerId) {
	return {
		payload: {
			id: nanoid(),
			name,
			desc,
			price,
			amount,
			seller: sellerId,
		},
	}
},

Now we need to make some changes to the file with the form for adding a product NewProductForm.jsx. First, let's add another local state for the seller id:

const [sellerId, setSellerId] = useState('')

Then after declaring the dispatch variable for useDispatch, we add code to get the slice of vendors from the state using the useSelector hook:

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

Let's add another one to the handlers for input fields:

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

Let's correct onSaveProductClick by adding productAdded and sellerId for the action:

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

Open your app with students. Add the ability to enter information about the teacher who added students. To do this, after studying the lesson material, make changes to the prepare function in the studentsSlice.js file.

Make the appropriate changes to the NewStudentForm.jsx file