Add Total to checkout

01-frontend/src/helper/BasketProvider.tsx

@@ -34,7 +34,6 @@ export const BasketProvider: React.FC<{ children: React.ReactNode }> = ({ childr
     };
 
     const clearBasket = () => {
-        console.log(" BASKET CLEARED BasketProvideur");
         setBasket([]);
     };
 

01-frontend/src/main.tsx

@@ -4,7 +4,7 @@ import { createRoot } from 'react-dom/client';
 import './index.css';
 import App from './App.tsx';
 
-console.log("main.tsx wurde geladen");
+console.log("main.tsx loaded");
 
 const rootElement = document.getElementById('root');
 if (!rootElement) throw new Error("Root element not found");

01-frontend/src/pages/Payment.tsx

@@ -58,6 +58,13 @@ function generateBasket(t: any, basket: any[]) {
     )
 }
 
+function generateTotal(t: any, basket: any[]) {
+    return basket.length === 0 ? "" :
+        <div className='rightBound'>
+            {t('total') + ": " + basket.map((item) => item.quantity * getDiscountedPrice(item.item))
+            .reduce((prev: number, cur: number) => prev + cur, 0).toFixed(2) + ` €`}
+        </div>
+}
 
 export default function Payment() {
 
@@ -99,7 +106,6 @@ export default function Payment() {
         }));
     };
     const handleClearBasket = () => {
-        console.log(" BASKET CLEARED Payment");
         clearBasket();
     };
 
@@ -128,11 +134,7 @@ export default function Payment() {
                         <Button variant="outlined" color="error" onClick={handleClearBasket} disabled={basket.length === 0}>
                             {t('clearCart')}
                         </Button>
-                        {basket.length === 0 ? "" :
-                        <div className='rightBound'>
-                            {t('total') + ": " + basket.map((item) => item.quantity * getDiscountedPrice(item.item))
-                            .reduce((prev: number, cur: number) => prev + cur, 0).toFixed(2) + ` €`}
-                        </div>}
+                        {generateTotal(t,basket)}
                     </Box>
                 );
             case 1:
@@ -243,6 +245,9 @@ export default function Payment() {
                         <Divider sx={{ my: 2 }} />
                         <Typography variant="h6">{t('orderedItems')}:</Typography>
                         {generateBasket(t, basket)}
+                        <Divider sx={{my: 2}} />
+                        {generateTotal(t, basket)}
+                        <br/>
                     </Box>
                 );
             default: