mozrest-sdk-react-dev 0.2.80 → 0.2.83

package/mozrest-sdk.es.js

@@ -28756,7 +28756,7 @@ var now_1 = now$1;
 var isObject$c = isObject_1, now = now_1, toNumber = toNumber_1;
 var FUNC_ERROR_TEXT$3 = "Expected a function";
 var nativeMax$3 = Math.max, nativeMin = Math.min;
-function debounce$1(func, wait, options2) {
+function debounce$2(func, wait, options2) {
   var lastArgs, lastThis, maxWait, result, timerId, lastCallTime, lastInvokeTime = 0, leading = false, maxing = false, trailing = true;
   if (typeof func != "function") {
     throw new TypeError(FUNC_ERROR_TEXT$3);
@@ -28837,7 +28837,7 @@ function debounce$1(func, wait, options2) {
   debounced.flush = flush;
   return debounced;
 }
-var debounce_1 = debounce$1;
+var debounce_1 = debounce$2;
 var RowContext = /* @__PURE__ */ createContext({});
 var RowContext$1 = RowContext;
 var __rest$7 = globalThis && globalThis.__rest || function(s2, e3) {
@@ -53997,6 +53997,9 @@ const Notifications = ({
       cacheId: `user-data`
     }
   );
+  const showAiPrompt = userData2 == null ? void 0 : userData2.roles.some(
+    (role) => role === "ROLE_COMPANY_SUPER_ADMIN" || role === "ROLE_COMPANY_SUPER_ADMIN_BOT"
+  );
   const _reload = () => {
     reload();
   };
@@ -54078,7 +54081,7 @@ const Notifications = ({
       className: styles$1D.item
     }, /* @__PURE__ */ React__default.createElement("div", null, /* @__PURE__ */ React__default.createElement(Icon$2, {
       icon: "mail"
-    })), t2("NOTDEFINED"))), ((_a3 = userData2 == null ? void 0 : userData2.data) == null ? void 0 : _a3.company) && /* @__PURE__ */ React__default.createElement(Card, {
+    })), t2("NOTDEFINED"))), ((_a3 = userData2 == null ? void 0 : userData2.data) == null ? void 0 : _a3.company) && showAiPrompt && /* @__PURE__ */ React__default.createElement(Card, {
       header: {
         title: t2("AIPROMPT"),
         icon: "edit",
@@ -74729,7 +74732,7 @@ var findIndex_1 = findIndex$2;
 var createFind = _createFind, findIndex$1 = findIndex_1;
 var find2 = createFind(findIndex$1);
 var find_1 = find2;
-var debounce = debounce_1, isObject$2 = isObject_1;
+var debounce$1 = debounce_1, isObject$2 = isObject_1;
 var FUNC_ERROR_TEXT = "Expected a function";
 function throttle(func, wait, options2) {
   var leading = true, trailing = true;
@@ -74740,7 +74743,7 @@ function throttle(func, wait, options2) {
     leading = "leading" in options2 ? !!options2.leading : leading;
     trailing = "trailing" in options2 ? !!options2.trailing : trailing;
   }
-  return debounce(func, wait, {
+  return debounce$1(func, wait, {
     "leading": leading,
     "maxWait": wait,
     "trailing": trailing
@@ -77088,7 +77091,7 @@ var styles$1u = {
   spinner,
   spin
 };
-const Spinner = ({ size = 20, color: color2 = "black" }) => {
+const Spinner$1 = ({ size = 20, color: color2 = "black" }) => {
   const spinnerStyle = {
     width: size,
     height: size,
@@ -77121,7 +77124,7 @@ const StatsCard = ({
     if (loadingValue) {
       return /* @__PURE__ */ React__default.createElement("div", {
         style: { marginTop: 20, marginBottom: 30 }
-      }, /* @__PURE__ */ React__default.createElement(Spinner, {
+      }, /* @__PURE__ */ React__default.createElement(Spinner$1, {
         size: 50
       }));
     }
@@ -77151,7 +77154,7 @@ const StatsCard = ({
     })
   }, comparison2 !== 0 ? arrow : /* @__PURE__ */ React__default.createElement("span", {
     style: { height: 20 }
-  }), !loadingComparison ? /* @__PURE__ */ React__default.createElement("span", null, comparison2 === 0 ? "" : `${comparison2} %`) : /* @__PURE__ */ React__default.createElement(Spinner, {
+  }), !loadingComparison ? /* @__PURE__ */ React__default.createElement("span", null, comparison2 === 0 ? "" : `${comparison2} %`) : /* @__PURE__ */ React__default.createElement(Spinner$1, {
     size: 15
   })), children) : /* @__PURE__ */ React__default.createElement(SkeletonStatCard, null));
 };
@@ -77471,7 +77474,7 @@ const Param = ({
   className: styles$1s.param
 }, /* @__PURE__ */ React__default.createElement("span", {
   className: styles$1s.title
-}, title2, tooltip2 && /* @__PURE__ */ React__default.createElement(Tooltip$2, null, tooltip2)), loadingValue ? /* @__PURE__ */ React__default.createElement(Spinner, {
+}, title2, tooltip2 && /* @__PURE__ */ React__default.createElement(Tooltip$2, null, tooltip2)), loadingValue ? /* @__PURE__ */ React__default.createElement(Spinner$1, {
   size: 15
 }) : /* @__PURE__ */ React__default.createElement("span", null, value2));
 const ParamsList = ({ params }) => {
@@ -96412,7 +96415,7 @@ const GetOpeningHours = async ({
   venue_id
 }) => {
   try {
-    const responseData = await instance$1.get(`/resbook/venue/${venue_id}/opening-hours`);
+    const responseData = await instance$1.get(`/resbook/venue/${venue_id}/opening-hours?limit=100`);
     if (!responseData || typeof responseData !== "object") {
       console.error("Error fetching opening hours data: Invalid response data");
       return [];
@@ -97068,7 +97071,8 @@ const GetTableManagement = async ({
     `resbook/venue/${venue_id}/tables`,
     {
       params: {
-        "sortby[orderPriority]": "ASC"
+        "sortby[name]": "ASC",
+        limit: 100
       }
     }
   );
@@ -97267,7 +97271,7 @@ const GetArrivalRules = async ({
   venue_id
 }) => {
   const responseData = await instance$1.get(
-    `/resbook/venue/${venue_id}/arrival-rules`
+    `/resbook/venue/${venue_id}/arrival-rules?limit=100`
   );
   const data2 = responseData.data;
   return formatData$4(data2);
@@ -97547,7 +97551,7 @@ const GetSpecialDates = async ({
   venue_id
 }) => {
   const responseData = await instance$1.get(
-    `/resbook/venue/${venue_id}/special-dates`
+    `/resbook/venue/${venue_id}/special-dates?limit=100`
   );
   const data2 = responseData.data;
   return formatData$3(data2);
@@ -98624,10 +98628,10 @@ const GetCreateBookingSelectsData = async ({
 }) => {
   if (!venue_id)
     return;
-  const responseVenueData = await instance$1.get(`/v1/rms/venues/${venue_id}`);
-  const responseAreas = await instance$1.get(`/v1/rms/venues/${venue_id}/areas`);
-  const responseHours = await instance$1.get(`/resbook/venue/${venue_id}/opening-hours`);
-  const responseTables = await instance$1.get(`/resbook/venue/${venue_id}/tables?sortby[orderPriority]=ASC`);
+  const responseVenueData = await instance$1.get(`/v1/rms/venues/${venue_id}?limit=100`);
+  const responseAreas = await instance$1.get(`/v1/rms/venues/${venue_id}/areas?limit=100`);
+  const responseHours = await instance$1.get(`/resbook/venue/${venue_id}/opening-hours?limit=100`);
+  const responseTables = await instance$1.get(`/resbook/venue/${venue_id}/tables?sortby[orderPriority]=ASC&limit=100`);
   const responseChannels = await instance$1.get(`/resbook/smart-channels`);
   const data2 = {
     partySizes: formatPartySizeData(responseVenueData),
@@ -100193,7 +100197,7 @@ const GetTableAvailability = async ({
     const responseData = await instance$1.get(
       `/resbook/venue/${venue_id}/table-availablity`,
       {
-        params: { ...params, limit: 100 }
+        params: { ...params, "sortby[orderPriority]": "ASC", limit: 100 }
       }
     );
     const data2 = responseData != null ? responseData : [];
@@ -103089,46 +103093,59 @@ const ReservationsAnalytics = ({ userEmail, userFullName }) => {
     totalDays
   }));
 };
-const mainConatiner$2 = "_mainConatiner_lnm3d_48";
-const mainTableContainer = "_mainTableContainer_lnm3d_58";
-const mainSidebarContainer = "_mainSidebarContainer_lnm3d_65";
-const headerContainer = "_headerContainer_lnm3d_74";
-const buttonList = "_buttonList_lnm3d_79";
-const tableTopHeader = "_tableTopHeader_lnm3d_85";
-const tableTopHeaderContent = "_tableTopHeaderContent_lnm3d_93";
-const tableRowContainer = "_tableRowContainer_lnm3d_101";
-const tableRowCard = "_tableRowCard_lnm3d_107";
-const noData = "_noData_lnm3d_112";
-const tableRowHour = "_tableRowHour_lnm3d_119";
-const hours = "_hours_lnm3d_130";
-const tableRowContent = "_tableRowContent_lnm3d_136";
-const rowImage = "_rowImage_lnm3d_145";
-const rowContactContainer = "_rowContactContainer_lnm3d_151";
-const rowContactText = "_rowContactText_lnm3d_158";
-const rowContactPhone = "_rowContactPhone_lnm3d_164";
-const rowSectionContainer = "_rowSectionContainer_lnm3d_171";
-const rowSectionText = "_rowSectionText_lnm3d_177";
-const rowSectionSecText = "_rowSectionSecText_lnm3d_183";
-const rowActionButton = "_rowActionButton_lnm3d_190";
-const bookingInfoContainer = "_bookingInfoContainer_lnm3d_196";
-const bookingInfoCardRow = "_bookingInfoCardRow_lnm3d_200";
-const bookingInfoCardContainer = "_bookingInfoCardContainer_lnm3d_208";
-const bookingInfoCard = "_bookingInfoCard_lnm3d_200";
-const bookingInfoCardContent = "_bookingInfoCardContent_lnm3d_220";
-const bookingInfoCardTitle = "_bookingInfoCardTitle_lnm3d_226";
-const bookingInfoCardText = "_bookingInfoCardText_lnm3d_229";
+const mainConatiner$2 = "_mainConatiner_1px60_48";
+const mainTableContainer = "_mainTableContainer_1px60_58";
+const mainSidebarContainer = "_mainSidebarContainer_1px60_66";
+const sidebarCloseIcon = "_sidebarCloseIcon_1px60_76";
+const headerContainer = "_headerContainer_1px60_128";
+const searchContainer = "_searchContainer_1px60_134";
+const buttonList = "_buttonList_1px60_142";
+const buttonItem = "_buttonItem_1px60_147";
+const tableTopHeader = "_tableTopHeader_1px60_157";
+const tableTopHeaderContent = "_tableTopHeaderContent_1px60_171";
+const tableTopHeaderContentText = "_tableTopHeaderContentText_1px60_178";
+const tableRowContainer = "_tableRowContainer_1px60_187";
+const tableRowCard = "_tableRowCard_1px60_193";
+const noData = "_noData_1px60_198";
+const tableRowHour = "_tableRowHour_1px60_205";
+const tableRowHourText = "_tableRowHourText_1px60_221";
+const hours = "_hours_1px60_229";
+const tableRowContent = "_tableRowContent_1px60_235";
+const rowImage = "_rowImage_1px60_250";
+const rowContactContainer = "_rowContactContainer_1px60_264";
+const rowContactText = "_rowContactText_1px60_276";
+const rowContactPhone = "_rowContactPhone_1px60_282";
+const rowSectionContainer = "_rowSectionContainer_1px60_289";
+const rowSectionText = "_rowSectionText_1px60_295";
+const rowSectionSecText = "_rowSectionSecText_1px60_301";
+const rowActionButton = "_rowActionButton_1px60_308";
+const bookingInfoContainer = "_bookingInfoContainer_1px60_314";
+const bookingInfoCardRow = "_bookingInfoCardRow_1px60_318";
+const bookingInfoCardContainer = "_bookingInfoCardContainer_1px60_326";
+const bookingInfoCard = "_bookingInfoCard_1px60_318";
+const bookingInfoCardContent = "_bookingInfoCardContent_1px60_338";
+const bookingInfoCardTitle = "_bookingInfoCardTitle_1px60_344";
+const bookingInfoCardText = "_bookingInfoCardText_1px60_347";
 var styles$l = {
   mainConatiner: mainConatiner$2,
   mainTableContainer,
   mainSidebarContainer,
+  sidebarCloseIcon,
+  "mainSidebarContainer--open": "_mainSidebarContainer--open_1px60_84",
+  "mainSidebarContainer--close": "_mainSidebarContainer--close_1px60_90",
+  "sidebarCloseIcon--show": "_sidebarCloseIcon--show_1px60_98",
   headerContainer,
+  searchContainer,
   buttonList,
+  buttonItem,
   tableTopHeader,
   tableTopHeaderContent,
+  tableTopHeaderContentText,
   tableRowContainer,
   tableRowCard,
   noData,
   tableRowHour,
+  tableRowHourText,
   hours,
   tableRowContent,
   rowImage,
@@ -103147,6 +103164,47 @@ var styles$l = {
   bookingInfoCardTitle,
   bookingInfoCardText
 };
+const Spinner = () => /* @__PURE__ */ React__default.createElement("svg", {
+  xmlns: "http://www.w3.org/2000/svg",
+  width: "24",
+  height: "24",
+  viewBox: "0 0 24 24"
+}, /* @__PURE__ */ React__default.createElement("rect", {
+  width: "24",
+  height: "24",
+  fill: "none"
+}), /* @__PURE__ */ React__default.createElement("g", {
+  fill: "none",
+  stroke: "currentColor",
+  strokeLinecap: "round",
+  strokeLinejoin: "round",
+  strokeWidth: "2"
+}, /* @__PURE__ */ React__default.createElement("path", {
+  strokeDasharray: "16",
+  strokeDashoffset: "16",
+  d: "M12 3c4.97 0 9 4.03 9 9"
+}, /* @__PURE__ */ React__default.createElement("animate", {
+  fill: "freeze",
+  attributeName: "stroke-dashoffset",
+  dur: "0.3s",
+  values: "16;0"
+}), /* @__PURE__ */ React__default.createElement("animateTransform", {
+  attributeName: "transform",
+  dur: "1.5s",
+  repeatCount: "indefinite",
+  type: "rotate",
+  values: "0 12 12;360 12 12"
+})), /* @__PURE__ */ React__default.createElement("path", {
+  strokeDasharray: "64",
+  strokeDashoffset: "64",
+  strokeOpacity: "0.3",
+  d: "M12 3c4.97 0 9 4.03 9 9c0 4.97 -4.03 9 -9 9c-4.97 0 -9 -4.03 -9 -9c0 -4.97 4.03 -9 9 -9Z"
+}, /* @__PURE__ */ React__default.createElement("animate", {
+  fill: "freeze",
+  attributeName: "stroke-dashoffset",
+  dur: "1.2s",
+  values: "64;0"
+}))));
 const LetterX = () => /* @__PURE__ */ React__default.createElement("svg", {
   xmlns: "http://www.w3.org/2000/svg",
   width: "24",
@@ -104540,6 +104598,7 @@ const clock = () => {
 };
 var icons = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
+  Spinner,
   LetterX,
   TrashX,
   EyeOff,
@@ -106668,6 +106727,7 @@ const Input2 = ({
   borderLess = false,
   rounded = false,
   customStyles: customStyles2,
+  className,
   ...props
 }) => {
   return /* @__PURE__ */ React__default.createElement("div", {
@@ -106700,7 +106760,8 @@ const Input2 = ({
   }), icon2 && /* @__PURE__ */ React__default.createElement("div", {
     className: classNames$2(
       styles$e["inputIcon"],
-      styles$e[`inputIcon--p-${iconPosition}`]
+      styles$e[`inputIcon--p-${iconPosition}`],
+      className ? className : ""
     )
   }, /* @__PURE__ */ React__default.createElement(Icon, {
     icon: icon2,
@@ -106797,8 +106858,26 @@ const SelectedBookingProvider = ({ children }) => {
     value: { selectedBooking, setSelectedBooking }
   }, children);
 };
+const debounce = (func, delay) => {
+  let timeoutId;
+  return (...args) => {
+    clearTimeout(timeoutId);
+    timeoutId = setTimeout(() => func(...args), delay);
+  };
+};
+const ShowSidebarContext = createContext(false);
+const useShowSidebarContext = () => {
+  return useContext(ShowSidebarContext);
+};
+const ShowSidebarProvider = ({ children }) => {
+  const [showSidebar, setShowSidebar] = useState(false);
+  return /* @__PURE__ */ React__default.createElement(ShowSidebarContext.Provider, {
+    value: { showSidebar, setShowSidebar }
+  }, children);
+};
 const index$c = ({ filters: filters2, setFilters }) => {
   const { t: t2 } = useTranslation();
+  const { showSidebar, setShowSidebar } = useShowSidebarContext();
   const { selectedBooking, setSelectedBooking } = useSelectedBookingContext();
   const [datePickerOpen, setDatePickerOpen] = useState(false);
   const datePickerRef = useRef(null);
@@ -106854,14 +106933,25 @@ const index$c = ({ filters: filters2, setFilters }) => {
     setValue2("fromDate", dateString);
     setDatePickerOpen(false);
   };
+  const debouncedCriteriaUpdate = useCallback(
+    debounce((criteriaValue) => {
+      setFilters((prevFilters) => ({
+        ...prevFilters,
+        criteria: criteriaValue
+      }));
+    }, 500),
+    [setFilters]
+  );
   useEffect(() => {
-    setFilters({
-      ...filters2,
-      criteria,
-      commingUp,
-      fromDate
-    });
-  }, [criteria, fromDate, commingUp]);
+    setFilters((prevFilters) => ({
+      ...prevFilters,
+      fromDate,
+      commingUp
+    }));
+  }, [fromDate, commingUp, setFilters]);
+  useEffect(() => {
+    debouncedCriteriaUpdate(criteria);
+  }, [criteria, debouncedCriteriaUpdate]);
   useEffect(() => {
     function handleDocumentClick(event) {
       var _a2, _b;
@@ -106876,6 +106966,8 @@ const index$c = ({ filters: filters2, setFilters }) => {
   }, []);
   return /* @__PURE__ */ React__default.createElement("div", {
     className: styles$l.headerContainer
+  }, /* @__PURE__ */ React__default.createElement("div", {
+    className: styles$l.searchContainer
   }, /* @__PURE__ */ React__default.createElement(TextInputField, {
     control,
     id: "criteria",
@@ -106891,16 +106983,19 @@ const index$c = ({ filters: filters2, setFilters }) => {
     borderLess: true,
     rounded: true,
     customStyles: { backgroundColor: "#2F3349" }
-  }), /* @__PURE__ */ React__default.createElement("div", {
+  })), /* @__PURE__ */ React__default.createElement("div", {
     className: styles$l.buttonList
   }, /* @__PURE__ */ React__default.createElement(Button, {
     mode: "tertiary",
+    className: styles$l.buttonItem,
     onClick: () => selectDate("commingUp")
   }, t2("COMMINGUP")), /* @__PURE__ */ React__default.createElement(Button, {
     mode: "tertiary",
+    className: styles$l.buttonItem,
     onClick: () => selectDate("today")
   }, t2("TODAY")), /* @__PURE__ */ React__default.createElement(Button, {
     mode: "tertiary",
+    className: styles$l.buttonItem,
     onClick: () => selectDate("tomorrow")
   }, t2("TOMORROW")), /* @__PURE__ */ React__default.createElement("div", {
     style: { display: "flex", flexDirection: "column", justifyContent: "center" }
@@ -106911,6 +107006,7 @@ const index$c = ({ filters: filters2, setFilters }) => {
     ref: datePickerRef,
     onChange: onChange3,
     open: datePickerOpen,
+    showToday: false,
     style: {
       marginTop: "30px",
       width: 0,
@@ -106918,10 +107014,34 @@ const index$c = ({ filters: filters2, setFilters }) => {
       opacity: 0,
       position: "absolute",
       pointerEvents: "none"
-    }
+    },
+    renderExtraFooter: () => /* @__PURE__ */ React__default.createElement("div", {
+      className: "ant-custom-footer"
+    }, /* @__PURE__ */ React__default.createElement("button", {
+      className: "ant-button",
+      onClick: () => {
+        selectDate("commingUp");
+        setDatePickerOpen(false);
+      }
+    }, t2("COMMINGUP")), /* @__PURE__ */ React__default.createElement("button", {
+      className: "ant-button",
+      onClick: () => {
+        selectDate("today");
+        setDatePickerOpen(false);
+      }
+    }, t2("TODAY")), /* @__PURE__ */ React__default.createElement("button", {
+      className: "ant-button",
+      onClick: () => {
+        selectDate("tomorrow");
+        setDatePickerOpen(false);
+      }
+    }, t2("TOMORROW")))
   })), /* @__PURE__ */ React__default.createElement(Button, {
     mode: "success",
-    onClick: () => setSelectedBooking(null)
+    onClick: () => {
+      setSelectedBooking(null);
+      setShowSidebar(true);
+    }
   }, t2("ADDRESERVATION"))));
 };
 const injectStyles = () => {
@@ -107005,6 +107125,24 @@ const injectStyles = () => {
         .ant-picker-today-btn:hover {
             background-color: #4C4F64 !important;
         }
+
+        .ant-custom-footer {
+            display: flex;
+            justify-content: space-around;
+            padding: 8px;
+            background: #2F3349;
+        }
+        .ant-custom-footer button {
+            color: white;
+            background: #4C4F64;
+            border: none;
+            padding: 6px 12px;
+            border-radius: 4px;
+            cursor: pointer;
+        }
+        .ant-custom-footer button:hover {
+            background: #3A3D54;
+        }
     `;
   document.head.appendChild(styleElement);
 };
@@ -107051,6 +107189,7 @@ const TableRow = ({ item: item2, filtersData, venueId }) => {
   var _a2, _b, _c, _d;
   const { t: t2 } = useTranslation();
   const { reload: reloadMainTable } = useReloadContext();
+  const { showSidebar, setShowSidebar } = useShowSidebarContext();
   const { selectedBooking, setSelectedBooking } = useSelectedBookingContext();
   const { execute } = useService(UpdateBookingStatusBooking, {
     onSuccess: async () => {
@@ -107117,10 +107256,15 @@ const TableRow = ({ item: item2, filtersData, venueId }) => {
     className: styles$l.tableRowCard
   }, /* @__PURE__ */ React__default.createElement("div", {
     style: { display: "flex", cursor: "pointer" },
-    onClick: () => setSelectedBooking(item2)
+    onClick: () => {
+      setSelectedBooking(item2);
+      setShowSidebar(true);
+    }
   }, /* @__PURE__ */ React__default.createElement("div", {
     className: styles$l.tableRowHour
-  }, /* @__PURE__ */ React__default.createElement("h2", null, /* @__PURE__ */ React__default.createElement(TimeFormat, {
+  }, /* @__PURE__ */ React__default.createElement("h2", {
+    className: styles$l.tableRowHourText
+  }, /* @__PURE__ */ React__default.createElement(TimeFormat, {
     currentTimeZone: filtersData == null ? void 0 : filtersData.timeZone,
     dateTime: item2 == null ? void 0 : item2.date
   }))), /* @__PURE__ */ React__default.createElement("div", {
@@ -107193,7 +107337,11 @@ const TableBody = ({ data: data2, filtersData, venueId }) => {
       key: key2
     }, /* @__PURE__ */ React__default.createElement("div", {
       className: styles$l.tableTopHeaderContent
-    }, /* @__PURE__ */ React__default.createElement("h2", null, key2), /* @__PURE__ */ React__default.createElement("h2", null, group.length, " ", t2("RESERVATIONS"))), /* @__PURE__ */ React__default.createElement("div", {
+    }, /* @__PURE__ */ React__default.createElement("h2", {
+      className: styles$l.tableTopHeaderContentText
+    }, key2), /* @__PURE__ */ React__default.createElement("h2", {
+      className: styles$l.tableTopHeaderContentText
+    }, group.length, " ", t2("RESERVATIONS"))), /* @__PURE__ */ React__default.createElement("div", {
       className: styles$l.tableRowContainer
     }, group.map((item2) => {
       return /* @__PURE__ */ React__default.createElement(TableRow, {
@@ -107536,8 +107684,21 @@ const BookingInfo = ({ item: item2 }) => {
 };
 const Header = () => {
   const { t: t2 } = useTranslation();
+  const { showSidebar, setShowSidebar } = useShowSidebarContext();
   const { selectedBooking } = useSelectedBookingContext();
-  return /* @__PURE__ */ React__default.createElement("div", null, /* @__PURE__ */ React__default.createElement("h3", null, t2(selectedBooking ? "UPDATERESERVATION" : "ADDRESERVATION")), /* @__PURE__ */ React__default.createElement("hr", {
+  return /* @__PURE__ */ React__default.createElement("div", null, /* @__PURE__ */ React__default.createElement("div", {
+    style: { display: "flex", justifyContent: "space-between", alignItems: "center" }
+  }, /* @__PURE__ */ React__default.createElement("h3", null, t2(selectedBooking ? "UPDATERESERVATION" : "ADDRESERVATION")), /* @__PURE__ */ React__default.createElement(Icon, {
+    className: classNames$2(
+      styles$l["sidebarCloseIcon"],
+      showSidebar ? styles$l["sidebarCloseIcon--show"] : ""
+    ),
+    icon: "close",
+    size: "small",
+    onClick: () => {
+      setShowSidebar(!showSidebar);
+    }
+  })), /* @__PURE__ */ React__default.createElement("hr", {
     style: { width: "100%", marginTop: 15 }
   }));
 };
@@ -107567,7 +107728,7 @@ const index$a = ({ filtersData, venueId }) => {
   const bookingSchema = () => create$1().shape({
     source: create$4().test(
       "is-valid-partySize",
-      "Party Size is required",
+      "Source is required",
       (value2) => value2 !== null && typeof value2 === "object" && !!value2.value
     ).required(),
     date: create$2().required(),
@@ -107629,7 +107790,10 @@ const index$a = ({ filtersData, venueId }) => {
     {
       cacheId: "reservation0dashboard0table0availability",
       venue_id: venueId,
-      params: source2 && (source2 == null ? void 0 : source2.value) ? { startSec: moment$1.tz(`${date4} ${time2 == null ? void 0 : time2.value}`, currentTimeZone ? currentTimeZone : "").valueOf() / 1e3, partySize: partySize == null ? void 0 : partySize.value } : {}
+      params: source2 && (source2 == null ? void 0 : source2.value) ? {
+        startSec: moment$1.tz(`${date4} ${time2 == null ? void 0 : time2.value}`, currentTimeZone ? currentTimeZone : "").valueOf() / 1e3,
+        partySize: partySize == null ? void 0 : partySize.value
+      } : {}
     }
   );
   const { execute: executeCreate, data: responBookingCreate, isExecuting: loadingCreate } = useService(AddBooking);
@@ -107885,6 +108049,7 @@ const index$a = ({ filtersData, venueId }) => {
 };
 function MainComponent({ venueId }) {
   const [currentVenue, setCurrentVenue] = useState(null);
+  const { showSidebar, setShowSidebar } = useShowSidebarContext();
   const [filters2, setFilters] = useState({
     fromDate: hooks().format("YYYY-MM-DD")
   });
@@ -107930,6 +108095,20 @@ function MainComponent({ venueId }) {
       reloadSelectsData();
     }
   }, [selectedBooking]);
+  useEffect(() => {
+    function handleOutsideClick(event) {
+      const sidebarElement = document.querySelector(`.${styles$l.mainSidebarContainer}`);
+      if (sidebarElement && !sidebarElement.contains(event.target)) {
+        setShowSidebar(false);
+      }
+    }
+    if (showSidebar) {
+      document.addEventListener("mousedown", handleOutsideClick);
+    }
+    return () => {
+      document.removeEventListener("mousedown", handleOutsideClick);
+    };
+  }, [showSidebar, setShowSidebar]);
   return /* @__PURE__ */ React__default.createElement(ReloadProvider, {
     reload
   }, /* @__PURE__ */ React__default.createElement("div", {
@@ -107945,36 +108124,39 @@ function MainComponent({ venueId }) {
     filtersData,
     venueId
   })), /* @__PURE__ */ React__default.createElement("div", {
-    className: styles$l.mainSidebarContainer
+    className: classNames$2(
+      styles$l.mainSidebarContainer,
+      showSidebar ? styles$l[`mainSidebarContainer--open`] : "styles[`mainSidebarContainer--close`]"
+    )
   }, /* @__PURE__ */ React__default.createElement(index$a, {
     filtersData,
     venueId
   }))));
 }
 function Main$2({ venueId }) {
-  return /* @__PURE__ */ React__default.createElement(SelectedBookingProvider, null, /* @__PURE__ */ React__default.createElement(MainComponent, {
+  return /* @__PURE__ */ React__default.createElement(SelectedBookingProvider, null, /* @__PURE__ */ React__default.createElement(ShowSidebarProvider, null, /* @__PURE__ */ React__default.createElement(MainComponent, {
     venueId
-  }));
+  })));
 }
-const mainConatiner$1 = "_mainConatiner_13dsr_70";
-const header$3 = "_header_13dsr_81";
-const content$1 = "_content_13dsr_87";
-const textSecondary$1 = "_textSecondary_13dsr_96";
-const sectionCard$1 = "_sectionCard_13dsr_100";
-const cardHeader$1 = "_cardHeader_13dsr_105";
-const cardTitle$1 = "_cardTitle_13dsr_108";
-const cardDesc$1 = "_cardDesc_13dsr_112";
-const cardBody$1 = "_cardBody_13dsr_116";
-const cardFooter$1 = "_cardFooter_13dsr_120";
-const cardFooterContent$1 = "_cardFooterContent_13dsr_120";
-const sectionManagement$1 = "_sectionManagement_13dsr_130";
-const sectionFormRow$1 = "_sectionFormRow_13dsr_130";
-const drawerContent$1 = "_drawerContent_13dsr_137";
-const scrollableForm$1 = "_scrollableForm_13dsr_142";
-const fixedActions$1 = "_fixedActions_13dsr_148";
+const mainConatiner$1 = "_mainConatiner_au98t_70";
+const header$3 = "_header_au98t_81";
+const content$1 = "_content_au98t_87";
+const textSecondary$1 = "_textSecondary_au98t_96";
+const sectionCard$1 = "_sectionCard_au98t_100";
+const cardHeader$1 = "_cardHeader_au98t_105";
+const cardTitle$1 = "_cardTitle_au98t_108";
+const cardDesc$1 = "_cardDesc_au98t_112";
+const cardBody$1 = "_cardBody_au98t_116";
+const cardFooter$1 = "_cardFooter_au98t_120";
+const cardFooterContent$1 = "_cardFooterContent_au98t_120";
+const sectionManagement$1 = "_sectionManagement_au98t_130";
+const sectionFormRow$1 = "_sectionFormRow_au98t_130";
+const drawerContent$1 = "_drawerContent_au98t_137";
+const scrollableForm$1 = "_scrollableForm_au98t_142";
+const fixedActions$1 = "_fixedActions_au98t_148";
 var styles$a = {
-  "my-masonry-grid": "_my-masonry-grid_13dsr_48",
-  "my-masonry-grid_column": "_my-masonry-grid_column_13dsr_59",
+  "my-masonry-grid": "_my-masonry-grid_au98t_48",
+  "my-masonry-grid_column": "_my-masonry-grid_column_au98t_59",
   mainConatiner: mainConatiner$1,
   header: header$3,
   content: content$1,
@@ -108026,44 +108208,6 @@ const AreaManagementCard$1 = ({ isOpenDrawer, setIsOpenDrawer, data: data2 }) =>
     }
   }, "more")));
 };
-const GetAreaManagement = async ({
-  venue_id
-}) => {
-  if (!venue_id)
-    return;
-  const responseData = await instance$1.get(
-    `/v1/rms/venues/${venue_id}/areas`
-  );
-  const responseVenueData = await instance$1.get(`/v1/rms/venues/${venue_id}`);
-  const data2 = {
-    areas: formatData$1(responseData.data),
-    ...formatVenueData(responseVenueData)
-  };
-  return data2;
-};
-const GetAreasList = async ({
-  venue_id
-}) => {
-  if (!venue_id)
-    return;
-  const responseData = await instance$1.get(
-    `/v1/rms/venues/${venue_id}/areas`
-  );
-  return formatData$1(responseData.data);
-};
-const formatData$1 = (data2) => {
-  return data2.map((item2) => {
-    var _a2;
-    return {
-      id: item2.id,
-      name: item2.name,
-      description: (_a2 = item2.description) != null ? _a2 : ""
-    };
-  });
-};
-const formatVenueData = (data2) => {
-  return { bookableAreas: data2.bookableAreas };
-};
 const drawer = "_drawer_1h00k_1";
 const drawer__overlay = "_drawer__overlay_1h00k_18";
 const drawer__content = "_drawer__content_1h00k_34";
@@ -108339,8 +108483,10 @@ const AreaEditDrawer = ({ isOpen, setIsOpen, venueId, data: data2, reload }) =>
     type: "button",
     onClick: () => append2({ name: "", description: "" })
   }, t2("NEW_AREA")), isDirty && /* @__PURE__ */ React__default.createElement(Button, {
+    isLoading: loadingDelete || loadingCreate || loadingUpdate,
+    disabled: loadingDelete || loadingCreate || loadingUpdate,
     mode: "success",
-    icon: "check",
+    icon: loadingDelete || loadingCreate || loadingUpdate ? "Spinner" : "check",
     iconPosition: "right",
     type: "button",
     onClick: () => onSubmit()
@@ -108366,21 +108512,20 @@ const fieldChanged$3 = (currentValue, initialData) => {
   }
   return false;
 };
-const index$9 = ({ venueId }) => {
+const index$9 = ({ venueId, reloadAreas, areas }) => {
   const [isOpenDrawer, setIsOpenDrawer] = useState(false);
-  const { data: data2, isLoading, error: error3, reload } = useFetch(GetAreaManagement, { cacheId: "area0management", venue_id: venueId });
   return /* @__PURE__ */ React__default.createElement("div", {
     className: styles$a.sectionManagement
   }, /* @__PURE__ */ React__default.createElement(AreaManagementCard$1, {
     isOpenDrawer,
     setIsOpenDrawer,
-    data: data2
+    data: areas
   }), /* @__PURE__ */ React__default.createElement(AreaEditDrawer, {
-    data: data2,
+    data: areas,
     isOpen: isOpenDrawer,
     setIsOpen: setIsOpenDrawer,
     venueId,
-    reload
+    reload: reloadAreas
   }));
 };
 const AreaManagementCard = ({ isOpenDrawer, setIsOpenDrawer, data: data2 }) => {
@@ -108558,6 +108703,7 @@ const TableEditDrawer = ({ isOpen, setIsOpen, venueId, data: data2, areasList, r
   const [formattedAreaList, setFormattedAreaList] = useState([]);
   const [showConfirmationModal, setShowConfirmationModal] = useState(false);
   const [selectedTable, setSelectedTable] = useState(null);
+  const scrollableRef = useRef(null);
   const { isExecuting: loadingCreate, execute: executeCreator } = useService(CreateResbook, {});
   const { isExecuting: loadingUpdate, execute: executeUpdater } = useService(UpdateResbook, {});
   const { isExecuting: loadingDelete, execute: executeDeleter } = useService(DeleteResbook, {
@@ -108633,9 +108779,21 @@ const TableEditDrawer = ({ isOpen, setIsOpen, venueId, data: data2, areasList, r
       remove(index2);
     }
   };
+  const scrollToBottom = () => {
+    if (scrollableRef.current) {
+      scrollableRef.current.scrollTo({
+        top: scrollableRef.current.scrollHeight,
+        behavior: "smooth"
+      });
+    }
+  };
+  const handleAddNewTable = () => {
+    append2({ name: "", minCapacity: "", maxCapacity: "", area: null });
+    setTimeout(scrollToBottom, 0);
+  };
   useEffect(() => {
-    if (areasList) {
-      setFormattedAreaList(areasList.map((area) => ({ label: area.name, value: area.id })));
+    if (areasList && (areasList == null ? void 0 : areasList.areas)) {
+      setFormattedAreaList(areasList.areas.map((area) => ({ label: area.name, value: area.id })));
     }
   }, [areasList]);
   useEffect(() => {
@@ -108675,7 +108833,8 @@ const TableEditDrawer = ({ isOpen, setIsOpen, venueId, data: data2, areasList, r
   }, /* @__PURE__ */ React__default.createElement("div", {
     className: styles$a.drawerContent
   }, /* @__PURE__ */ React__default.createElement("div", {
-    className: styles$a.scrollableForm
+    className: styles$a.scrollableForm,
+    ref: scrollableRef
   }, fields.map((item2, index2) => /* @__PURE__ */ React__default.createElement("div", {
     key: item2.id,
     className: styles$a.sectionFormRow
@@ -108723,7 +108882,7 @@ const TableEditDrawer = ({ isOpen, setIsOpen, venueId, data: data2, areasList, r
     id: `tables.${index2}.area`,
     name: `tables.${index2}.area`,
     label: "Area",
-    options: areasList ? areasList.map((area) => ({ label: area.name, value: area.id })) : []
+    options: areasList && (areasList == null ? void 0 : areasList.areas) ? areasList.areas.map((area) => ({ label: area.name, value: area.id })) : []
   }))))), /* @__PURE__ */ React__default.createElement("div", {
     className: styles$a.fixedActions
   }, /* @__PURE__ */ React__default.createElement(Button, {
@@ -108731,10 +108890,12 @@ const TableEditDrawer = ({ isOpen, setIsOpen, venueId, data: data2, areasList, r
     icon: "plus",
     iconPosition: "right",
     type: "button",
-    onClick: () => append2({ name: "", description: "" })
+    onClick: handleAddNewTable
   }, t2("NEW_TABLE")), isDirty && /* @__PURE__ */ React__default.createElement(Button, {
+    isLoading: loadingDelete || loadingCreate || loadingUpdate,
+    disabled: loadingDelete || loadingCreate || loadingUpdate,
     mode: "success",
-    icon: "check",
+    icon: loadingDelete || loadingCreate || loadingUpdate ? "Spinner" : "check",
     iconPosition: "right",
     type: "button",
     onClick: () => onSubmit()
@@ -108761,10 +108922,9 @@ const fieldChanged$2 = (currentValue, initialData) => {
   }
   return false;
 };
-const index$8 = ({ venueId }) => {
+const index$8 = ({ venueId, areas }) => {
   const [isOpenDrawer, setIsOpenDrawer] = useState(false);
   const { data: data2, isLoading, error: error3, reload } = useFetch(GetTableManagement, { cacheId: "table0management", venue_id: venueId });
-  const { data: areasList, isLoading: isLoadingAreas, error: errorAreasList, reload: reloadAreasList } = useFetch(GetAreasList, { cacheId: "areas0list", venue_id: venueId });
   return /* @__PURE__ */ React__default.createElement("div", {
     className: styles$a.sectionManagement
   }, /* @__PURE__ */ React__default.createElement(AreaManagementCard, {
@@ -108773,7 +108933,7 @@ const index$8 = ({ venueId }) => {
     data: data2
   }), /* @__PURE__ */ React__default.createElement(TableEditDrawer, {
     data: data2,
-    areasList,
+    areasList: areas,
     isOpen: isOpenDrawer,
     setIsOpen: setIsOpenDrawer,
     venueId,
@@ -108905,8 +109065,8 @@ const ReservationDurationEditDrawer = ({ isOpen, setIsOpen, venueId, data: data2
   return /* @__PURE__ */ React__default.createElement(Drawer, {
     isOpen,
     onClose: () => setIsOpen(false),
-    title: t2("TABLE_MANAGEMENT"),
-    titleDesc: t2("TABLE_MANAGEMENT_DESC")
+    title: t2("RESERVATION_DURATION"),
+    titleDesc: t2("RESERVATION_DURATION_DESC")
   }, /* @__PURE__ */ React__default.createElement("div", {
     className: styles$a.drawerContent
   }, /* @__PURE__ */ React__default.createElement("div", {
@@ -108937,8 +109097,10 @@ const ReservationDurationEditDrawer = ({ isOpen, setIsOpen, venueId, data: data2
   }))))), /* @__PURE__ */ React__default.createElement("div", {
     className: styles$a.fixedActions
   }, isDirty && /* @__PURE__ */ React__default.createElement(Button, {
+    isLoading: loadingUpdate,
+    disabled: loadingUpdate,
     mode: "success",
-    icon: "check",
+    icon: loadingUpdate ? "Spinner" : "check",
     iconPosition: "right",
     type: "button",
     onClick: () => onSubmit()
@@ -109075,6 +109237,7 @@ const SpecialDatesEditDrawer = ({ isOpen, setIsOpen, venueId, data: data2, reloa
   const [initialData, setInitialData] = useState(null);
   const [showConfirmationModal, setShowConfirmationModal] = useState(false);
   const [selectedDate, setSelectedDate] = useState(null);
+  const scrollableRef = useRef(null);
   const { isExecuting: loadingUpdate, execute: executeUpdater } = useService(UpdateResbook, {});
   const { isExecuting: loadingDelete, execute: executeDeleter } = useService(DeleteResbook, {
     onSuccess: () => {
@@ -109156,6 +109319,14 @@ const SpecialDatesEditDrawer = ({ isOpen, setIsOpen, venueId, data: data2, reloa
       remove(index2);
     }
   };
+  const scrollToBottom = () => {
+    if (scrollableRef.current) {
+      scrollableRef.current.scrollTo({
+        top: scrollableRef.current.scrollHeight,
+        behavior: "smooth"
+      });
+    }
+  };
   useEffect(() => {
     if (data2) {
       const formatedData = data2.map((item2) => {
@@ -109182,7 +109353,8 @@ const SpecialDatesEditDrawer = ({ isOpen, setIsOpen, venueId, data: data2, reloa
   }, /* @__PURE__ */ React__default.createElement("div", {
     className: styles$a.drawerContent
   }, /* @__PURE__ */ React__default.createElement("div", {
-    className: styles$a.scrollableForm
+    className: styles$a.scrollableForm,
+    ref: scrollableRef
   }, fields.map((item2, index2) => /* @__PURE__ */ React__default.createElement(React__default.Fragment, {
     key: item2.id
   }, /* @__PURE__ */ React__default.createElement("div", {
@@ -109238,10 +109410,15 @@ const SpecialDatesEditDrawer = ({ isOpen, setIsOpen, venueId, data: data2, reloa
     icon: "plus",
     iconPosition: "right",
     type: "button",
-    onClick: () => append2({ closed: false, startDate: "", endDate: "" })
+    onClick: () => {
+      append2({ closed: false, startDate: "", endDate: "" });
+      setTimeout(scrollToBottom, 0);
+    }
   }, t2("ADD_SPECIAL_DATE")), isDirty && /* @__PURE__ */ React__default.createElement(Button, {
+    isLoading: loadingDelete || loadingUpdate,
+    disabled: loadingDelete || loadingUpdate,
     mode: "success",
-    icon: "check",
+    icon: loadingDelete || loadingUpdate ? "Spinner" : "check",
     iconPosition: "right",
     type: "button",
     onClick: () => onSubmit()
@@ -109476,9 +109653,10 @@ const ShiftsEditDrawer = ({ isOpen, setIsOpen, venueId, data: data2, reload }) =
   })), /* @__PURE__ */ React__default.createElement("div", {
     className: styles$a.fixedActions
   }, isDirty && /* @__PURE__ */ React__default.createElement(Button, {
+    isLoading: loadingUpdate,
+    disabled: loadingUpdate,
     mode: "success",
-    icon: "check",
-    iconPosition: "right",
+    icon: loadingUpdate ? "Spinner" : "check",
     type: "button",
     onClick: () => onSubmit()
   }, t2("SAVE")))));
@@ -109628,8 +109806,10 @@ const ReservationPreferencesEditDrawer = ({ isOpen, setIsOpen, venueId, data: da
   }))), /* @__PURE__ */ React__default.createElement("div", {
     style: { display: "flex", justifyContent: "flex-end", gap: 10, marginTop: 30 }
   }, isDirty && /* @__PURE__ */ React__default.createElement(Button, {
+    isLoading: isExecuting,
+    disabled: isExecuting,
     mode: "success",
-    icon: "check",
+    icon: isExecuting ? "Spinner" : "check",
     iconPosition: "right",
     type: "button",
     onClick: () => onSubmit()
@@ -109652,9 +109832,38 @@ const index$4 = ({ venueId }) => {
     reload
   }));
 };
+const GetAreaManagement = async ({
+  venue_id
+}) => {
+  if (!venue_id)
+    return;
+  const responseData = await instance$1.get(
+    `/v1/rms/venues/${venue_id}/areas?limit=100`
+  );
+  const responseVenueData = await instance$1.get(`/v1/rms/venues/${venue_id}`);
+  const data2 = {
+    areas: formatData$1(responseData.data),
+    ...formatVenueData(responseVenueData)
+  };
+  return data2;
+};
+const formatData$1 = (data2) => {
+  return data2.map((item2) => {
+    var _a2;
+    return {
+      id: item2.id,
+      name: item2.name,
+      description: (_a2 = item2.description) != null ? _a2 : ""
+    };
+  });
+};
+const formatVenueData = (data2) => {
+  return { bookableAreas: data2.bookableAreas };
+};
 function Main$1({ venueId }) {
   const { t: t2 } = useTranslation();
   const [currentVenue, setCurrentVenue] = useState(null);
+  const { data: data2, isLoading, error: error3, reload } = useFetch(GetAreaManagement, { cacheId: "area0management", venue_id: currentVenue });
   useEffect(() => {
     setCurrentVenue(venueId);
   }, [venueId]);
@@ -109665,8 +109874,11 @@ function Main$1({ venueId }) {
   }, /* @__PURE__ */ React__default.createElement("h2", null, t2("RESTAURANTSETUP"))), /* @__PURE__ */ React__default.createElement("div", {
     className: styles$a.content
   }, /* @__PURE__ */ React__default.createElement(index$9, {
+    areas: data2,
+    reloadAreas: reload,
     venueId: currentVenue
   }), /* @__PURE__ */ React__default.createElement(index$8, {
+    areas: data2,
     venueId: currentVenue
   }), /* @__PURE__ */ React__default.createElement(index$7, {
     venueId: currentVenue