Merge branch 'development'

purwadhikafullstack · Jul 22, 2023 · 7ba48b9 · 7ba48b9
2 parents ca0e06d + 38a8601
commit 7ba48b9
Show file tree

Hide file tree

Showing 26 changed files with 108 additions and 50 deletions.
diff --git a/projects/client/src/components/Checkout/SwitchLogistic/CostDetail.jsx b/projects/client/src/components/Checkout/SwitchLogistic/CostDetail.jsx
@@ -3,7 +3,7 @@ import { useDispatch, useSelector } from "react-redux";
 import { setLogistic } from "../../../redux/reducers/checkout/checkoutAction.js";
 import { toCurrency } from "../../../helper/currency.js";
 
-const CostDetail = ({ costs, courier }) => {
+const CostDetail = ({ costs, courier, code }) => {
 	const checkout = useSelector((state) => state.checkout);
 	const dispatch = useDispatch();
 
@@ -23,7 +23,11 @@ const CostDetail = ({ costs, courier }) => {
 						{toCurrency(logistic.cost[0].value)}
 					</span>
 				</div>
-				<input type="radio" name="select_logistic" checked={checkout.logistic.service === logistic.service} />
+				<input
+					type="radio"
+					name="select_logistic"
+					checked={checkout.logistic.service === logistic.service && checkout.logistic.code === code}
+				/>
 			</div>
 		);
 	});

diff --git a/projects/client/src/components/Checkout/SwitchLogistic/LogisticOptions.jsx b/projects/client/src/components/Checkout/SwitchLogistic/LogisticOptions.jsx
@@ -5,7 +5,7 @@ const LogisticOptions = ({ services, courier }) => {
 	return (
 		<div className="flex flex-col">
 			<span className="font-bold text-left uppercase bg-green-300 text-green-100 pl-5 py-2">{services.name}</span>
-			<CostDetail costs={services.costs} courier={courier} />
+			<CostDetail costs={services.costs} courier={courier} code={services.code} />
 		</div>
 	);
 };

diff --git a/projects/client/src/components/Checkout/SwitchVoucher/VoucherOptions.jsx b/projects/client/src/components/Checkout/SwitchVoucher/VoucherOptions.jsx
@@ -27,7 +27,6 @@ const Spending = ({ data }) => {
 const VoucherOptions = ({ vouchers, dispatch, globalState }) => {
 	const summary = useSelector((state) => state.checkout.summary);
 	return vouchers.map((data, index) => {
-		console.log(data);
 		const disabled = data?.Voucher?.min_spend > summary.total;
 
 		return (
@@ -49,7 +48,7 @@ const VoucherOptions = ({ vouchers, dispatch, globalState }) => {
 					name="select_voucher"
 					className="border border-green-400 checked:bg-green-400 disabled:opacity-20 disabled:bg-gray-200 "
 					disabled={disabled}
-					checked={globalState?.checkout?.voucher?.id === data.Voucher.id}
+					checked={globalState?.checkout?.voucher?.user_voucher_id === data.id}
 				/>
 			</div>
 		);

diff --git a/projects/client/src/components/Checkout/handlers/checkoutHandler.js b/projects/client/src/components/Checkout/handlers/checkoutHandler.js
@@ -90,7 +90,7 @@ export const postTransaction = (data, dispatch, navigate) => {
 					successAlert(navigate, dispatch);
 				})
 				.catch((error) => {
-					Swal.fire(error.response.data);
+					Swal.fire({ title: "Error!", html: error.response.data, confirmButtonColor: "#0EB177" });
 				});
 		}
 	});

diff --git a/projects/client/src/components/ManageOrder/SearchConfiguration.jsx b/projects/client/src/components/ManageOrder/SearchConfiguration.jsx
@@ -22,6 +22,8 @@ const SearchConfiguration = ({
 	order,
 	setOrder,
 }) => {
+	const [input, setInput] = React.useState("");
+
 	return (
 		<>
 			<div className="flex flex-row w-full justify-between z-50">
@@ -33,7 +35,7 @@ const SearchConfiguration = ({
 				/>
 			</div>
 			<div className="flex flex-row w-full justify-between mb-4 p-4 px-6 rounded-t-xl z-50 sm:mb-10">
-				<NameConfiguration setName={setName} name={name} />
+				<NameConfiguration setName={setName} setInput={setInput} input={input} />
 				<FilterConfiguration
 					filterBy={filterBy}
 					setFilterBy={setFilterBy}
@@ -43,7 +45,16 @@ const SearchConfiguration = ({
 				<SortConfiguration sort={sort} setSort={setSort} order={order} setOrder={setOrder} />
 				<ResetButton
 					onClick={() =>
-						resetSetting(setStartDate, setEndDate, setName, setFilterBy, setFilter, setSort, setOrder)
+						resetSetting(
+							setStartDate,
+							setEndDate,
+							setName,
+							setFilterBy,
+							setFilter,
+							setSort,
+							setOrder,
+							setInput,
+						)
 					}
 				/>
 			</div>

diff --git a/projects/client/src/components/ManageOrder/SearchConfiguration/NameConfiguration.jsx b/projects/client/src/components/ManageOrder/SearchConfiguration/NameConfiguration.jsx
@@ -1,14 +1,12 @@
 import React from "react";
 
-const NameConfiguration = ({ name, setName }) => {
-	const [input, setInput] = React.useState("");
-
+const NameConfiguration = ({ setName, setInput, input }) => {
 	return (
 		<div className="flex flex-col w-[25%]">
 			<div className="flex flex-col items-center justify-around w-full text-green-100 mt-auto lg:flex-row">
 				<div
 					className="flex w-fit text-black mb-1 rounded-lg p-1 px-2 cursor-pointer block lg:hidden"
-					onClick={(event) => setName(input)}
+					onClick={() => setName(input)}
 				>
 					<span className="material-symbols-rounded w-full overflow-hidden whitespace-nowrap">
 						keyboard_return
@@ -20,6 +18,7 @@ const NameConfiguration = ({ name, setName }) => {
 					placeholder="Order ID"
 					onKeyDown={(event) => (event.key === "Enter" ? setName(input) : null)}
 					onChange={(event) => setInput(event.target.value)}
+					value={input}
 				/>
 				<div
 					className="flex max-w-[20%] w-fit bg-green-300  rounded-lg p-1 px-2 cursor-pointer hidden lg:block"

diff --git a/projects/client/src/components/ManageOrder/handlers/manageOrderHandler.js b/projects/client/src/components/ManageOrder/handlers/manageOrderHandler.js
@@ -92,21 +92,31 @@ export const getBorderColor = (status) => {
 	return "border-red";
 };
 
-export const resetSetting = (setStartDate, setEndDate, setName, setFilterBy, setFilter, setSort, setOrder) => {
+export const resetSetting = (
+	setStartDate,
+	setEndDate,
+	setName,
+	setFilterBy,
+	setFilter,
+	setSort,
+	setOrder,
+	setInput,
+) => {
 	setStartDate("");
 	setEndDate("");
 	setName("");
 	setFilterBy("");
 	setFilter("");
 	setSort("");
 	setOrder("");
+	setInput("");
 };
 
 export const generateUrlQuery = (name, startDate, endDate, filterBy, filter, sort, order, page) => {
 	let url = "";
 
 	url += `?page=${page}`;
-	url += `&id=${name}`;
+	url += name ? `&id=${name}` : "";
 	url += startDate ? `&start_after=${startDate}` : "";
 	url += endDate ? `&end_before=${endDate}` : "";
 	url += filter ? `&${filterBy.id}=${filter.id}` : "";

diff --git a/projects/client/src/components/Order/YourOrder.jsx b/projects/client/src/components/Order/YourOrder.jsx
@@ -39,7 +39,7 @@ const SubTotal = ({ subTotal }) => {
 const DeliveryCost = ({ deliveryCost }) => {
 	return (
 		<div className="flex flex-row pt-4 text-gray-200 text-sm">
-			<div className="text-left">Delivery Cost</div>
+			<div className="text-left">Logistic Fee</div>
 			<div className="px-4 text-right ml-auto text-black">{toCurrency(deliveryCost)}</div>
 		</div>
 	);
@@ -49,7 +49,7 @@ const VoucherDiscount = ({ voucher_discount }) => {
 	return (
 		<div className="flex flex-row py-4 text-gray-200 text-sm">
 			<div className="text-left">Voucher Discount</div>
-			<div className="px-4 text-right ml-auto text-red">{toCurrency(voucher_discount)}</div>
+			<div className="px-4 text-right ml-auto text-red">-{toCurrency(voucher_discount)}</div>
 		</div>
 	);
 };

diff --git a/projects/client/src/components/ProductPromo/SearchConfiguration.jsx b/projects/client/src/components/ProductPromo/SearchConfiguration.jsx
@@ -7,14 +7,16 @@ import { resetSetting } from "./handlers/productPromoHandler.js";
 import CreateButton from "./CreateButton";
 
 const SearchConfiguration = ({ setName, filter, setFilter, sort, setSort, order, setOrder, setPage }) => {
+	const [input, setInput] = React.useState("");
+
 	return (
 		<>
 			<CreateButton />
 			<div className="flex flex-row w-full justify-between mb-4 p-4 px-6 rounded-t-xl z-50 sm:mb-10">
-				<NameConfiguration setName={setName} />
+				<NameConfiguration setName={setName} setInput={setInput} input={input} />
 				<FilterConfiguration filter={filter} setFilter={setFilter} />
 				<SortConfiguration sort={sort} setSort={setSort} order={order} setOrder={setOrder} />
-				<Reset onClick={() => resetSetting(setFilter, setSort, setOrder, setPage, setName)} />
+				<Reset onClick={() => resetSetting(setFilter, setSort, setOrder, setPage, setName, setInput)} />
 			</div>
 		</>
 	);

diff --git a/projects/client/src/components/ProductPromo/SearchConfiguration/NameConfiguration.jsx b/projects/client/src/components/ProductPromo/SearchConfiguration/NameConfiguration.jsx
@@ -1,8 +1,6 @@
 import React from "react";
 
-const NameConfiguration = ({ setName }) => {
-	const [input, setInput] = React.useState("");
-
+const NameConfiguration = ({ setName, setInput, input }) => {
 	return (
 		<div className="flex flex-col w-[25%]">
 			<div className="flex flex-col items-center justify-around w-full text-green-100 mt-auto lg:flex-row">
@@ -18,6 +16,7 @@ const NameConfiguration = ({ setName }) => {
 					placeholder="Item Name"
 					onKeyDown={(event) => (event.key === "Enter" ? setName(input) : null)}
 					onChange={(event) => setInput(event.target.value)}
+					value={input}
 				/>
 				<div
 					className="flex max-w-[20%] w-fit bg-green-300  rounded-lg p-1 px-2 cursor-pointer hidden lg:block"

diff --git a/projects/client/src/components/ProductPromo/handlers/productPromoHandler.js b/projects/client/src/components/ProductPromo/handlers/productPromoHandler.js
@@ -58,10 +58,11 @@ export const generateUrlQuery = (name, page, filter, sort, order) => {
 	return url;
 };
 
-export const resetSetting = (setFilter, setSort, setOrder, setPage, setName) => {
+export const resetSetting = (setFilter, setSort, setOrder, setPage, setName, setInput) => {
 	setFilter("");
 	setSort("");
 	setOrder("");
 	setPage(1);
 	setName("");
+	setInput("");
 };
diff --git a/projects/client/src/components/ProductStock/SearchConfiguration.jsx b/projects/client/src/components/ProductStock/SearchConfiguration.jsx
@@ -17,12 +17,16 @@ const SearchConfiguration = ({
 	setOrder,
 	setPage,
 }) => {
+	const [input, setInput] = React.useState("");
+
 	return (
 		<div className="flex flex-row w-full justify-between mb-4 p-4 px-6 rounded-t-xl z-50 sm:mb-10">
-			<NameConfiguration setName={setName} />
+			<NameConfiguration setName={setName} setInput={setInput} input={input} />
 			<FilterConfiguration filterBy={filterBy} setFilterBy={setFilterBy} filter={filter} setFilter={setFilter} />
 			<SortConfiguration sort={sort} setSort={setSort} order={order} setOrder={setOrder} />
-			<Reset onClick={() => resetSetting(setName, setFilterBy, setFilter, setSort, setOrder, setPage)} />
+			<Reset
+				onClick={() => resetSetting(setName, setFilterBy, setFilter, setSort, setOrder, setPage, setInput)}
+			/>
 		</div>
 	);
 };

diff --git a/projects/client/src/components/ProductStock/SearchConfiguration/NameConfiguration.jsx b/projects/client/src/components/ProductStock/SearchConfiguration/NameConfiguration.jsx
@@ -1,8 +1,6 @@
 import React from "react";
 
-const NameConfiguration = ({ setName }) => {
-	const [input, setInput] = React.useState("");
-
+const NameConfiguration = ({ setName, setInput, input }) => {
 	return (
 		<div className="flex flex-col w-[25%]">
 			<div className="flex flex-col items-center justify-around w-full text-green-100 mt-auto lg:flex-row">
@@ -18,6 +16,7 @@ const NameConfiguration = ({ setName }) => {
 					placeholder="Item Name"
 					onKeyDown={(event) => (event.key === "Enter" ? setName(input) : null)}
 					onChange={(event) => setInput(event.target.value)}
+					value={input}
 				/>
 				<div
 					className="flex max-w-[20%] w-fit bg-green-300  rounded-lg p-1 px-2 cursor-pointer hidden lg:block"

diff --git a/projects/client/src/components/ProductStock/handlers/ProductStockHandler.js b/projects/client/src/components/ProductStock/handlers/ProductStockHandler.js
@@ -9,13 +9,14 @@ export const getBranchInventories = (query = "") => {
 export const sortDefault = { id: "name", name: "Product Name" };
 export const orderDefault = { id: "1", name: "A to Z" };
 
-export const resetSetting = (setName, setFilterBy, setFilter, setSort, setOrder, setPage) => {
+export const resetSetting = (setName, setFilterBy, setFilter, setSort, setOrder, setPage, setInput) => {
 	setName("");
 	setFilterBy("");
 	setFilter("");
 	setSort("");
 	setOrder("");
 	setPage(1);
+	setInput("");
 };
 
 export const getSortBy = () => {

diff --git a/projects/client/src/components/ProductStockHistory/SearchConfiguration.jsx b/projects/client/src/components/ProductStockHistory/SearchConfiguration.jsx
@@ -22,6 +22,8 @@ const SearchConfiguration = ({
 	endDate,
 	setEndDate,
 }) => {
+	const [input, setInput] = React.useState("");
+
 	return (
 		<>
 			<div className="flex flex-row w-full justify-between z-50">
@@ -33,7 +35,7 @@ const SearchConfiguration = ({
 				/>
 			</div>
 			<div className="flex flex-row w-full justify-between mb-4 p-4 px-6 rounded-t-xl z-50 sm:mb-10">
-				<NameConfiguration setName={setName} />
+				<NameConfiguration setName={setName} setInput={setInput} input={input} />
 				<FilterConfiguration
 					filterBy={filterBy}
 					setFilterBy={setFilterBy}
@@ -52,6 +54,7 @@ const SearchConfiguration = ({
 							setPage,
 							setStartDate,
 							setEndDate,
+							setInput,
 						)
 					}
 				/>

diff --git a/projects/client/src/components/ProductStockHistory/SearchConfiguration/NameConfiguration.jsx b/projects/client/src/components/ProductStockHistory/SearchConfiguration/NameConfiguration.jsx
@@ -1,8 +1,6 @@
 import React from "react";
 
-const NameConfiguration = ({ setName }) => {
-	const [input, setInput] = React.useState("");
-
+const NameConfiguration = ({ setName, setInput, input }) => {
 	return (
 		<div className="flex flex-col w-[25%]">
 			<div className="flex flex-col items-center justify-around w-full text-green-100 mt-auto lg:flex-row">
@@ -18,6 +16,7 @@ const NameConfiguration = ({ setName }) => {
 					placeholder="Item Name"
 					onKeyDown={(event) => (event.key === "Enter" ? setName(input) : null)}
 					onChange={(event) => setInput(event.target.value)}
+					value={input}
 				/>
 				<div
 					className="flex max-w-[20%] w-fit bg-green-300  rounded-lg p-1 px-2 cursor-pointer hidden lg:block"

diff --git a/projects/client/src/components/ProductStockHistory/handlers/ProductStockHandler.js b/projects/client/src/components/ProductStockHistory/handlers/ProductStockHandler.js
@@ -9,7 +9,17 @@ export const getBranchInventories = (query = "") => {
 export const sortDefault = { id: "name", name: "Product Name" };
 export const orderDefault = { id: "1", name: "A to Z" };
 
-export const resetSetting = (setName, setFilterBy, setFilter, setSort, setOrder, setPage, setStartDate, setEndDate) => {
+export const resetSetting = (
+	setName,
+	setFilterBy,
+	setFilter,
+	setSort,
+	setOrder,
+	setPage,
+	setStartDate,
+	setEndDate,
+	setInput,
+) => {
 	setName("");
 	setFilterBy("");
 	setFilter("");
@@ -18,6 +28,7 @@ export const resetSetting = (setName, setFilterBy, setFilter, setSort, setOrder,
 	setPage(1);
 	setStartDate("");
 	setEndDate("");
+	setInput("");
 };
 
 export const getSortBy = () => {

diff --git a/projects/client/src/pages/Verify/VerifyPage.jsx b/projects/client/src/pages/Verify/VerifyPage.jsx
@@ -22,7 +22,7 @@ const VerificationMessage = ({ isValid }) => {
 				<span className="font-bold text-xl my-2">Failed!</span>
 			</span>
 			<AlertBox>
-				<p className="mx-8 font-medium">Invalid token or is expired!</p>
+				<p className="mx-8 font-medium">Invalid token!</p>
 			</AlertBox>
 		</>
 	);

diff --git a/projects/client/src/redux/reducers/checkout/checkoutReducer.js b/projects/client/src/redux/reducers/checkout/checkoutReducer.js
@@ -37,6 +37,7 @@ const initialState = {
 	},
 	voucher: {
 		id: null,
+		user_voucher_id: null,
 		name: "",
 		description: "",
 		value: null,
@@ -84,7 +85,19 @@ const applyVoucher = (state, action) => {
 
 	const summary = getSummaryAfterVoucher(state.summary, action.payload);
 
-	return { ...state, voucher: { id, name, value, max_discount, description, Promotion: { ...Promotion } }, summary };
+	return {
+		...state,
+		voucher: {
+			id,
+			user_voucher_id: action.payload?.id,
+			name,
+			value,
+			max_discount,
+			description,
+			Promotion: { ...Promotion },
+		},
+		summary,
+	};
 };
 
 const removeVoucher = (state, action) => {