Δημιουργία αντικειμένου με δεδομένα προϊόντος στο Redux

Έχουμε τη συνάρτηση για τη δημιουργία του αντικειμένου με τον πωλητή, ας προχωρήσουμε στο προϊόν. Η δημιουργία αυτού του αντικειμένου θα είναι λίγο πιο πολύπλοκη, αφού περιέχει περισσότερα πεδία με δεδομένα. Ας ξεκινήσουμε.

Ας ανοίξουμε την εφαρμογή προϊόντων μας, και σε αυτή το αρχείο server.js. Παρακάτω, μετά από τη συνάρτηση getRandInt, ας γράψουμε τη συνάρτησή μας createProductData:

const createProductData = () => {}

Τώρα ας ορίσουμε τις απαιτούμενες ιδιότητες. Τις τιμές για τα name, price και amount θα τις δημιουργήσουμε χρησιμοποιώντας την getRandInt, που γράψαμε στο προηγούμενο μάθημα:

const createProductData = () => {
	return {
		name: `Product${getRandInt(0, 100)}`,
		price: getRandInt(100, 2000),
		amount: getRandInt(1, 50),
	}
}

Και για να δημιουργήσουμε την περιγραφή, θα χρησιμοποιήσουμε ένα ακόμη χρήσιμο εργαλείο. Αυτή είναι η βιβλιοθήκη faker, που επιτρέπει τη δημιουργία ψεύτικων ονομάτων, διευθύνσεων, emails, ονομάτων δρόμων, κειμένων κ.λπ. σε διάφορες γλώσσες. Ας εισάγουμε στο τερματικό την ακόλουθη γραμμή και ας εγκαταστήσουμε αυτή τη βιβλιοθήκη για την εφαρμογή μας:

npm install @faker-js/faker --save-dev

Και στη συνέχεια ας την εισάγουμε στο αρχείο μας:

import { faker } from '@faker-js/faker'

Ας χρησιμοποιήσουμε από αυτή τη δημιουργία προτάσεων, που περιέχουν το γνωστό κείμενο-«αναλώριμο» 'Lorem ipsum'. Ας περιέχει η περιγραφή από 3 έως 5 τέτοιες προτάσεις:

const createProductData = () => {
	return {
		name: `Product${getRandInt(0, 100)}`,
		desc: faker.lorem.sentences({ min: 3, max: 5 }),
		price: getRandInt(100, 2000),
		amount: getRandInt(1, 50),
	}
}

Τώρα ας προσθέσουμε στο αντικείμενό μας ένα πεδίο με τις αντιδράσεις, θα του περάσουμε ως τιμή, το αντικείμενο που δημιουργείται επιτόπου με την εντολή create (οι αντιδράσεις προς το παρόν θα είναι 0):

const createProductData = () => {
	return {
		name: `Product${getRandInt(0, 100)}`,
		desc: faker.lorem.sentences({ min: 3, max: 5 }),
		price: getRandInt(100, 2000),
		amount: getRandInt(1, 50),
		reactions: db.reaction.create(),
	}
}

Και ως τελευταία ιδιότητα θα προσθέσουμε το ήδη δημιουργημένο αντικείμενο του πωλητή, το οποίο οπωσδήποτε πρέπει να το περάσουμε ως παράμετρο στη συνάρτηση createProductData. Να πώς φαίνεται ο πλήρης κώδικας της συνάρτησης δημιουργίας αντικειμένου προϊόντος:

const createProductData = (seller) => {
	return {
		name: `Product${getRandInt(0, 100)}`,
		desc: faker.lorem.sentences({ min: 3, max: 5 }),
		price: getRandInt(100, 2000),
		amount: getRandInt(1, 50),
		reactions: db.reaction.create(),
		seller,
	}
}

Ανοίξτε την εφαρμογή σας με τους μαθητές. Αφού μελετήσετε το υλικό αυτού του μαθήματος, γράψτε μια συνάρτηση για τη δημιουργία ενός αντικειμένου με δεδομένα μαθητή.