diff options
author | 2024-09-11 16:30:37 +0100 | |
---|---|---|
committer | 2024-09-11 16:30:37 +0100 | |
commit | ffe8cf4b756c6eaf637afb38dd7b56416bbd705c (patch) | |
tree | f2621751fb16f808fd14523c9e5cefa7679fc6a9 | |
parent | Add new cart action to set the max price (diff) |
Display cart status on the store page
-rw-r--r-- | thallium-frontend/src/pages/StorePage.tsx | 23 |
1 files changed, 23 insertions, 0 deletions
diff --git a/thallium-frontend/src/pages/StorePage.tsx b/thallium-frontend/src/pages/StorePage.tsx index 3e8df92..ecb0948 100644 --- a/thallium-frontend/src/pages/StorePage.tsx +++ b/thallium-frontend/src/pages/StorePage.tsx @@ -10,6 +10,10 @@ import { Link } from "react-router-dom"; import LoadingBar from "../components/LoadingBar"; import CartStatus from "../components/CartStatus"; +import { getCurrentVoucher, Voucher } from "../api/vouchers"; +import VoucherDisplay from "../components/Voucher"; +import { setMaxPrice } from "../slices/cart"; +import store from "../store"; const StoreGrid = styled.div` @@ -27,6 +31,8 @@ const StorePage = () => { const [permissionDenied, setPermissionDenied] = useState<boolean>(false); const [loading, setLoading] = useState<boolean>(true); + const [currentVoucher, setCurrentVoucher] = useState<Voucher | null>(null); + useEffect(() => { getTemplates(true).then((items) => { setStoreItems(items); @@ -42,12 +48,29 @@ const StorePage = () => { } } }); + + if (voucherToken) { + getCurrentVoucher().then((voucher) => { + setCurrentVoucher(voucher); + store.dispatch(setMaxPrice(parseFloat(voucher.balance))); + }).catch((err: unknown) => { + if (err instanceof APIMissingTokenError) { + setPermissionDenied(true); + } else if (err instanceof APIError) { + if ([401, 403].includes(err.status)) { + setPermissionDenied(true); + } + } + } + ); + } }, [voucherToken]); return ( <> <h1>Giveaway Store</h1> {!(loading || permissionDenied) && <CartStatus />} + {currentVoucher && <VoucherDisplay voucher={currentVoucher} />} {loading && <LoadingBar />} <StoreGrid> {storeItems?.map((item) => ( |