basic frontend demo with react and redux

frontend-react/src/utils/createOlxLink.js

@@ -0,0 +1,63 @@
+/*category: {value: "Vozila", label: "Vozila"}
+options: 
+cijena: (2) [6500, 70500]
+godiste: (2) [2004, 2017]
+gorivo_select_benzin: true
+gorivo_select_dizel: true
+kanton: {value: "9", label: "Sarajevo"}
+kilometrazaMax: {value: 20000, label: "20000"}
+kilometrazaMin: {value: 5000, label: "5000"}
+proizvodac: {value: "1900", label: "Audi"}
+stanje: ""
+subcategory: {value: "Automobili", label: "Automobili"}
+
+
+https://www.olx.ba/pretraga?
+kategorija=18&stanje=&v_b=1900
+&od=6500&do=70500
+&kanton=9&
+godiste_min=2004&godiste_max=2017
+&kilometra-a_min=5000&kilometra-a_max=50000
+&gorivo_select_dizel=Dizel&gorivo_select_benzin=Benzin
+
+{
+	"Automobili": 18,
+	"v_b": "proizvodac",
+
+}*/
+function AutomobiliLinkCreator(options) {
+	const [od, do_] = options.cijena;
+	const [godiste_min, godiste_max] = options.godiste;
+	const goriva = [
+		"gorivo_select_benzin",
+		"gorivo_select_dizel",
+		"gorivo_select_plin",
+		"gorivo_select_hibrid",
+		"gorivo_selector_elektro"
+	]
+		.filter(gorivo => options.hasOwnProperty(gorivo))
+		.reduce(
+			(izborGoriva, gorivo) =>
+				izborGoriva +
+				"" +
+				options[gorivo] +
+				"=" +
+				options[gorivo] +
+				"&",
+			""
+		);
+	return `kategorija=18&stanje=${options.stanje}&v_b=${
+		options.proizvodac.value
+	}&od=${od}&do=${do_}&kanton=${
+		options.kanton.value
+	}&godiste_min=${godiste_min}&godiste_max=${godiste_max}&kilometra-a_min=${
+		options.kilometrazaMin.value
+	}&kilometra-a_max=${options.kilometrazaMax.value}&${goriva}`;
+}
+const mappingFunctios = {
+	Automobili: AutomobiliLinkCreator
+};
+
+export const createOlxLink = (category, subcategory, options) => {
+	return mappingFunctios[subcategory.value](options);
+};

frontend-react/src/utils/hoc.js

@@ -0,0 +1 @@
+export const hoc = (option, componentList) => componentList[option] || null;

frontend-react/src/utils/optionchangewrapper.js

@@ -0,0 +1,18 @@
+import { connect } from "react-redux";
+import { OPTION_CHANGE } from "constants/actionTypes";
+
+const mapStateToProps = state => {
+	return {
+		options: state.options
+	};
+};
+
+const mapDispatchToProps = dispatch => ({
+	onOptionChanged: option => dispatch({ type: OPTION_CHANGE, ...option })
+});
+
+export const optionchangewrapper = component =>
+	connect(
+		mapStateToProps,
+		mapDispatchToProps
+	)(component);

frontend-react/src/utils/subcategorywrapper.js

@@ -0,0 +1,19 @@
+import { connect } from "react-redux";
+import { SUBCATEGORY_SELECT } from "constants/actionTypes";
+
+const mapStateToProps = state => {
+	return {
+		subcategory: state.subcategory
+	};
+};
+
+const mapDispatchToProps = dispatch => ({
+	onSubCategoryChanged: option =>
+		dispatch({ type: SUBCATEGORY_SELECT, option })
+});
+
+export const subcategorywrapper = component =>
+	connect(
+		mapStateToProps,
+		mapDispatchToProps
+	)(component);