diff --git a/messages/en.json b/messages/en.json index 89ab309..2cc988a 100644 --- a/messages/en.json +++ b/messages/en.json @@ -84,7 +84,8 @@ "unitsAvailable": "Units available", "tableDescription": "A list of your shopping cart items.", "backToStorage": "Back to storage", - "cartEmpty": "Your shopping cart is empty." + "cartEmpty": "Your shopping cart is empty.", + "clearCart": "Empty shopping cart" } } } diff --git a/messages/no.json b/messages/no.json index 80953f0..829331a 100644 --- a/messages/no.json +++ b/messages/no.json @@ -84,7 +84,8 @@ "unitsAvailable": "Stk tilgjengelig", "tableDescription": "En liste over handlekurven din.", "backToStorage": "Tilbake til lageret", - "cartEmpty": "Handlekurven din er tom." + "cartEmpty": "Handlekurven din er tom.", + "clearCart": "Tøm handlekurven" } } } diff --git a/src/app/[locale]/(default)/storage/shopping-cart/page.tsx b/src/app/[locale]/(default)/storage/shopping-cart/page.tsx index f2f08d8..62627cc 100644 --- a/src/app/[locale]/(default)/storage/shopping-cart/page.tsx +++ b/src/app/[locale]/(default)/storage/shopping-cart/page.tsx @@ -1,3 +1,4 @@ +import { ShoppingCartClearButton } from '@/components/storage/ShoppingCartClearButton'; import { ShoppingCartTable } from '@/components/storage/ShoppingCartTable'; import { Button } from '@/components/ui/Button'; import { Link } from '@/lib/navigation'; @@ -26,12 +27,15 @@ export default function StorageShoppingCartPage({ <>

{t('title')}

- - - +
+ + + + +
); } diff --git a/src/components/storage/ShoppingCartClearButton.tsx b/src/components/storage/ShoppingCartClearButton.tsx new file mode 100644 index 0000000..7674993 --- /dev/null +++ b/src/components/storage/ShoppingCartClearButton.tsx @@ -0,0 +1,27 @@ +'use client'; +import { Button } from '@/components/ui/Button'; +import { X } from 'lucide-react'; +import { useLocalStorage } from 'usehooks-ts'; + +function ShoppingCartClearButton({ caption }: { caption: string }) { + const [cart, setCart] = useLocalStorage('shopping-cart', []); + + function clearCart() { + setCart([]); + } + + if (cart.length <= 0) return; + + return ( + + ); +} + +export { ShoppingCartClearButton };