ok

src/components/Modal.js

@@ -23,6 +23,7 @@ import NotificationBlocked from "../pages/NotificationBlocked.js";
 import WelcomePageEditor from "../pages/WelcomePageEditor.js";
 import GuidePage from "../pages/GuidePage";
 import Join from "../pages/Join";
+import Loading from "../pages/Loading";
 import Login from "../pages/Login";
 import ResetPassword from "../pages/ResetPassword";
 import { getImageUrl } from "../helpers/itemHelper.js";
@@ -56,6 +57,7 @@ const Modal = ({ user, shop, isOpen, onClose, modalContent, setModal, handleMove
     // Prevent click event from propagating to the overlay
     event.stopPropagation();
   };
+  if(modalContent == '') handleOverlayClick();
   return (
     <div onClick={handleOverlayClick} className={styles.modalOverlay}>
       <div className={styles.modalContent} onClick={handleContentClick}>
@@ -108,6 +110,7 @@ const Modal = ({ user, shop, isOpen, onClose, modalContent, setModal, handleMove
         
         {modalContent === "join" && <Join setModal={setModal} />}
         {modalContent === "claim-coupon" && <Join setModal={setModal} />}
+        {modalContent === "loading" && <Loading setModal={setModal} />}
       </div>
     </div>
   );

src/components/Modal.module.css

@@ -18,6 +18,7 @@
   overflow: visible; /* Add this line to enable scrolling */
   display: flex;
   align-items: center;
+  justify-content: center;
 }
 
 .closeButton {

src/helpers/cafeHelpers.js

@@ -14,7 +14,7 @@ export async function getCafe(cafeId) {
     });
 
     if (!response.ok) {
-      throw new Error("Failed to fetch cafes");
+      return false
     }
 
     const cafe = await response.json();
@@ -51,7 +51,7 @@ export const saveWelcomePageConfig = async (cafeId, details) => {
     });
 
     if (!response.ok) {
-      throw new Error("Failed to save welcome page configuration");
+      return false
     }
 
     return await response.json();
@@ -98,7 +98,7 @@ export async function getOwnedCafes(userId) {
     );
 
     if (!response.ok) {
-      throw new Error("Failed to fetch cafes");
+      return false
     }
 
     const cafes = await response.json();
@@ -109,6 +109,7 @@ export async function getOwnedCafes(userId) {
 }
 
 export async function createCafe(cafeName) {
+  console.log(cafeName)
   try {
     const response = await fetch(`${API_BASE_URL}/cafe/create-cafe`, {
       method: "POST",
@@ -122,7 +123,7 @@ export async function createCafe(cafeName) {
     });
 
     if (!response.ok) {
-      throw new Error("Failed to create cafe");
+      return false
     }
 
     const cafe = await response.json();
@@ -144,7 +145,7 @@ export async function updateCafe(cafeId, cafeDetails) {
     });
 
     if (!response.ok) {
-      throw new Error("Failed to update cafe");
+      return false
     }
 
     const updatedCafe = await response.json();
@@ -169,7 +170,7 @@ export async function setConfirmationStatus(cafeId, isNeedConfirmation) {
     );
 
     if (!response.ok) {
-      // throw new Error(`Error: ${response.statusText}`);
+      return false
     }
 
     const data = await response.json();
@@ -177,7 +178,7 @@ export async function setConfirmationStatus(cafeId, isNeedConfirmation) {
     return data;
   } catch (error) {
     console.error("Failed to update item type:", error);
-    throw error;
+    return false
   }
 }
 
@@ -228,7 +229,7 @@ export async function saveCafeDetails(cafeId, details) {
     });
 
     if (!response.ok) {
-      throw new Error("Failed to save cafe details");
+      return false
     }
 
     return await response.json();

src/pages/Loading.js

@@ -0,0 +1,23 @@
+// LinktreePage.js
+import React, { useState, useEffect } from 'react';
+import styles from './Join.module.css'; // Import the module.css file
+import { ThreeDots } from "react-loader-spinner";
+
+const LinktreePage = () => {
+
+  return (
+    <div className={styles.linktreePage}>
+            <div style={{
+              width: '150px',
+              height: '150px',
+              display: 'flex',
+              justifyContent: 'center',
+              alignItems: 'center',
+            }}>
+              <ThreeDots color="#FFFFFF" height={40} width={40} />
+            </div>
+    </div>
+  );
+};
+
+export default LinktreePage;

src/pages/Reports.js

@@ -110,6 +110,7 @@ const RoundedRectangle = ({
 
 const App = ({ forCafe = true, cafeId = -1,
   handleClose, otherCafes, coupons, setModal, user }) => {
+    const [modalStatus, setModalStatus] = useState(null); 
   const [selectedCafeId, setSelectedCafeId] = useState(cafeId);
   const [analytics, setAnalytics] = useState({});
   const [loading, setLoading] = useState(true);
@@ -306,7 +307,7 @@ const App = ({ forCafe = true, cafeId = -1,
 
       if (otherCafes.length === 0) {
         updatedFullTexts = [["Buat bisnis", 0]];
-        setSelectedCafeId(0);
+        setSelectedCafeId(-1);
       } else if (otherCafes.length === 1) {
         updatedFullTexts = [
           [otherCafes[0].name || otherCafes[0].username, otherCafes[0].cafeId || otherCafes[0].userId],
@@ -393,6 +394,39 @@ const App = ({ forCafe = true, cafeId = -1,
   //   // We could add logic here if needed for side effects
   // }, [selectedSwitch]);
 
+  const delay = (ms) => new Promise(resolve => setTimeout(resolve, ms));
+
+  const handleClick = async () => {
+    if (user?.roleId === 0) {
+      setModal('loading');
+      const create = await createCoupon(itemName);
+      if (!create) {
+        setModalStatus('failed');
+      }
+      
+      // Add a 2-second delay before proceeding
+      await delay(2000);
+  
+      handleClose();
+      setModalStatus(null); // Reset status
+      window.location.reload(); // Reload the page
+      return;
+    } else {
+      setModal('loading');
+      const create = await createCafe(itemName);
+      if (!create) {
+        setModalStatus('failed');
+      }
+  
+      // Add a 2-second delay before proceeding
+      await delay(2000);
+      handleClose();
+      setModalStatus(null); // Reset status
+      window.location.reload(); // Reload the page
+    }
+  };
+  
+
   return (
     <div style={{
       position: forCafe ? 'fixed' : 'relative',
@@ -484,24 +518,24 @@ const App = ({ forCafe = true, cafeId = -1,
               invert={false}
               loading={loading}
             />
-            <h1>{segments[0]?.itemName}</h1>
             {((analytics?.itemSales &&
-              analytics?.itemSales.length > 0) || (!analytics?.itemSales && segments.length > 0)) && (
+              analytics?.itemSales.length > 0) || (!analytics?.itemSales && segments.length > 0)) ? (
               <RoundedRectangle
                 title={"Item favorit"}
-                  value={analytics?.itemSales[0] != undefined ? analytics?.itemSales[0]?.itemName 
+                value={analytics?.itemSales?.length > 0 && analytics?.itemSales[0] != undefined ? analytics?.itemSales[0]?.itemName
                   : segments[0].itemName}
                 loading={loading}
               />
-              )}
-            {(!analytics?.itemSales ||
-              analytics?.itemSales.length === 0) && (
+            )
+              :
+              (
                 <RoundedRectangle
                   title={"Item favorit"}
                   value={"-"}
                   loading={loading}
                 />
-              )}
+              )
+            }
             {!forCafe && selectedCafeId != -1 && selectedCafeId != 0 && (
               <RoundedRectangle
                 title={"Kunjungi bisnis"}
@@ -670,7 +704,7 @@ const App = ({ forCafe = true, cafeId = -1,
             <RoundedRectangle
               title={user?.roleId === 0 ? "Buat Voucher" : "Buat Bisnis"}
               width="calc(100% - 10px)"
-              onClick={() => (user?.roleId === 0 ? createCoupon(itemName) : createCafe(itemName))}
+              onClick={handleClick}
             />
           </div>
         </div>