aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorGravatar Joe Banks <[email protected]>2024-09-11 16:30:02 +0100
committerGravatar Joe Banks <[email protected]>2024-09-11 16:30:02 +0100
commita680b7e8127538393a9eebb19f991d30fdd7a9c0 (patch)
treebfcaac3a26b410330f04dfa3bbaf2fc6913a820d
parentAdd component for store cart state (diff)
Allow cart items to add themselves to the cart
-rw-r--r--thallium-frontend/src/components/StoreItem.tsx12
1 files changed, 11 insertions, 1 deletions
diff --git a/thallium-frontend/src/components/StoreItem.tsx b/thallium-frontend/src/components/StoreItem.tsx
index 0cd4da2..478e35c 100644
--- a/thallium-frontend/src/components/StoreItem.tsx
+++ b/thallium-frontend/src/components/StoreItem.tsx
@@ -4,9 +4,10 @@ import { Template, Variant } from "../api/templates";
import Button from "./forms/Button";
import { addCartItem } from "../slices/cart";
-import store from "../store";
+import store, { RootState } from "../store";
import { toast } from "react-toastify";
+import { useSelector } from "react-redux";
interface StoreItemProps {
template: Template;
@@ -192,6 +193,9 @@ const StoreItem: React.FC<StoreItemProps> = ({ template }: StoreItemProps) => {
const [selectedVariant, setSelectedVariant] = useState<Variant | null>(null);
+ const maxPrice: number | null = useSelector<RootState>((state) => state.cart.maxPrice) as number | null;
+ const cartBalance: number = useSelector<RootState>((state) => state.cart.cart.reduce((acc, item) => acc + (parseFloat(item.estPrice) * item.quantity), 0)) as number;
+
useEffect(() => {
if (selectedColour === null) {
@@ -277,6 +281,12 @@ const StoreItem: React.FC<StoreItemProps> = ({ template }: StoreItemProps) => {
disabled={selectedVariant === null}
onClick={() => {
if (selectedVariant) {
+ if (maxPrice !== null) {
+ if (cartBalance + parseFloat(selectedVariant.price) > maxPrice) {
+ toast.error("You do not have enough balance to purchase this item.");
+ return;
+ }
+ }
store.dispatch(addCartItem({
product_template_id: template.template_id,
variant_id: selectedVariant.variant_id,