mozrest-sdk-react-dev 0.2.54 → 0.2.55

package/mozrest-sdk.es.js

@@ -6455,6 +6455,7 @@ const OPTIN = "Opt-in";
 const BOOKINGCHANNEL = "Booking channel";
 const CONFIRMATIONTEXT = "Are you sure you want to do this action?";
 const pleaseCheckFormsErrors = "Please check the form for errors";
+const NO_RESERVATIONS = "No reservations";
 var en = {
   errors,
   SPECIALCLOSINGDATES,
@@ -6796,7 +6797,8 @@ var en = {
   OPTIN,
   BOOKINGCHANNEL,
   CONFIRMATIONTEXT,
-  pleaseCheckFormsErrors
+  pleaseCheckFormsErrors,
+  NO_RESERVATIONS
 };
 instance.use(initReactI18next).init({
   resources: {
@@ -35856,7 +35858,7 @@ var ReactTooltip = staticMethods(_class = windowListener(_class = customEvent(_c
     }
   }, {
     key: "injectStyles",
-    value: function injectStyles() {
+    value: function injectStyles2() {
       var tooltipRef = this.tooltipRef;
       if (!tooltipRef) {
         return;
@@ -91932,7 +91934,7 @@ const SelectedDateDisplay = ({ initialDate, selectedDate, onSelectDate, datesSum
     style: { marginLeft: 10, marginRight: 10 }
   }, "No date selected"));
 };
-const CustomDatePicker = ({
+const CustomDatePicker$1 = ({
   onSelectDate,
   onOpenHoursAvailability,
   bookingSumary,
@@ -92508,6 +92510,8 @@ const GetCreateBookingSelectsData = async ({
   includeAreaInTables = false,
   includeCoversInTables = false
 }) => {
+  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`);
@@ -94950,7 +94954,7 @@ const ReservationDashboard = ({
     className: styles$q.header
   }, /* @__PURE__ */ React__default.createElement("h1", null, "RESERVATION DASHBOARD"), /* @__PURE__ */ React__default.createElement("h1", null, /* @__PURE__ */ React__default.createElement(CurrentTime, null))), /* @__PURE__ */ React__default.createElement("div", {
     className: styles$q.datesSectionContainer
-  }, /* @__PURE__ */ React__default.createElement(CustomDatePicker, {
+  }, /* @__PURE__ */ React__default.createElement(CustomDatePicker$1, {
     onSelectDate: (d2) => handleOnSelectDate(d2),
     onOpenHoursAvailability,
     bookingSumary,
@@ -102407,33 +102411,34 @@ const ReservationsAnalytics = ({ userEmail, userFullName }) => {
     totalDays
   }));
 };
-const mainConatiner = "_mainConatiner_ncjgq_42";
-const mainTableContainer = "_mainTableContainer_ncjgq_52";
-const mainSidebarContainer = "_mainSidebarContainer_ncjgq_59";
-const headerContainer = "_headerContainer_ncjgq_68";
-const buttonList = "_buttonList_ncjgq_73";
-const tableTopHeader = "_tableTopHeader_ncjgq_79";
-const tableTopHeaderContent = "_tableTopHeaderContent_ncjgq_87";
-const tableRowContainer = "_tableRowContainer_ncjgq_95";
-const tableRowCard = "_tableRowCard_ncjgq_101";
-const tableRowHour = "_tableRowHour_ncjgq_105";
-const hours = "_hours_ncjgq_116";
-const tableRowContent = "_tableRowContent_ncjgq_122";
-const rowImage = "_rowImage_ncjgq_129";
-const rowContactContainer = "_rowContactContainer_ncjgq_135";
-const rowContactText = "_rowContactText_ncjgq_141";
-const rowContactPhone = "_rowContactPhone_ncjgq_147";
-const rowSectionContainer = "_rowSectionContainer_ncjgq_154";
-const rowSectionText = "_rowSectionText_ncjgq_160";
-const rowSectionSecText = "_rowSectionSecText_ncjgq_166";
-const rowActionButton = "_rowActionButton_ncjgq_173";
-const bookingInfoContainer = "_bookingInfoContainer_ncjgq_179";
-const bookingInfoCardRow = "_bookingInfoCardRow_ncjgq_183";
-const bookingInfoCardContainer = "_bookingInfoCardContainer_ncjgq_191";
-const bookingInfoCard = "_bookingInfoCard_ncjgq_183";
-const bookingInfoCardContent = "_bookingInfoCardContent_ncjgq_203";
-const bookingInfoCardTitle = "_bookingInfoCardTitle_ncjgq_209";
-const bookingInfoCardText = "_bookingInfoCardText_ncjgq_212";
+const mainConatiner = "_mainConatiner_oexkd_48";
+const mainTableContainer = "_mainTableContainer_oexkd_58";
+const mainSidebarContainer = "_mainSidebarContainer_oexkd_65";
+const headerContainer = "_headerContainer_oexkd_74";
+const buttonList = "_buttonList_oexkd_79";
+const tableTopHeader = "_tableTopHeader_oexkd_85";
+const tableTopHeaderContent = "_tableTopHeaderContent_oexkd_93";
+const tableRowContainer = "_tableRowContainer_oexkd_101";
+const tableRowCard = "_tableRowCard_oexkd_107";
+const noData = "_noData_oexkd_112";
+const tableRowHour = "_tableRowHour_oexkd_119";
+const hours = "_hours_oexkd_130";
+const tableRowContent = "_tableRowContent_oexkd_136";
+const rowImage = "_rowImage_oexkd_143";
+const rowContactContainer = "_rowContactContainer_oexkd_149";
+const rowContactText = "_rowContactText_oexkd_155";
+const rowContactPhone = "_rowContactPhone_oexkd_161";
+const rowSectionContainer = "_rowSectionContainer_oexkd_168";
+const rowSectionText = "_rowSectionText_oexkd_174";
+const rowSectionSecText = "_rowSectionSecText_oexkd_180";
+const rowActionButton = "_rowActionButton_oexkd_187";
+const bookingInfoContainer = "_bookingInfoContainer_oexkd_193";
+const bookingInfoCardRow = "_bookingInfoCardRow_oexkd_197";
+const bookingInfoCardContainer = "_bookingInfoCardContainer_oexkd_205";
+const bookingInfoCard = "_bookingInfoCard_oexkd_197";
+const bookingInfoCardContent = "_bookingInfoCardContent_oexkd_217";
+const bookingInfoCardTitle = "_bookingInfoCardTitle_oexkd_223";
+const bookingInfoCardText = "_bookingInfoCardText_oexkd_226";
 var styles$c = {
   mainConatiner,
   mainTableContainer,
@@ -102444,6 +102449,7 @@ var styles$c = {
   tableTopHeaderContent,
   tableRowContainer,
   tableRowCard,
+  noData,
   tableRowHour,
   hours,
   tableRowContent,
@@ -102475,9 +102481,9 @@ const TrashX = () => /* @__PURE__ */ React.createElement("svg", {
 }), /* @__PURE__ */ React.createElement("path", {
   fill: "none",
   stroke: "currentColor",
-  "stroke-linecap": "round",
-  "stroke-linejoin": "round",
-  "stroke-width": "2",
+  strokeLinecap: "round",
+  strokeLinejoin: "round",
+  strokeWidth: "2",
   d: "M4 7h16M5 7l1 12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2l1-12M9 7V4a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v3m-5 5l4 4m0-4l-4 4"
 }));
 const EyeOff = () => /* @__PURE__ */ React.createElement("svg", {
@@ -102492,9 +102498,9 @@ const EyeOff = () => /* @__PURE__ */ React.createElement("svg", {
 }), /* @__PURE__ */ React.createElement("g", {
   fill: "none",
   stroke: "currentColor",
-  "stroke-linecap": "round",
-  "stroke-linejoin": "round",
-  "stroke-width": "2"
+  strokeLinecap: "round",
+  strokeLinejoin: "round",
+  strokeWidth: "2"
 }, /* @__PURE__ */ React.createElement("path", {
   d: "M10.585 10.587a2 2 0 0 0 2.829 2.828"
 }), /* @__PURE__ */ React.createElement("path", {
@@ -102508,9 +102514,9 @@ const CalendarTime = () => /* @__PURE__ */ React.createElement("svg", {
 }, /* @__PURE__ */ React.createElement("g", {
   fill: "none",
   stroke: "currentColor",
-  "stroke-linecap": "round",
-  "stroke-linejoin": "round",
-  "stroke-width": "2"
+  strokeLinecap: "round",
+  strokeLinejoin: "round",
+  strokeWidth: "2"
 }, /* @__PURE__ */ React.createElement("path", {
   d: "M11.795 21H5a2 2 0 0 1-2-2V7a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v4"
 }), /* @__PURE__ */ React.createElement("path", {
@@ -102526,9 +102532,9 @@ const CheckBox = () => /* @__PURE__ */ React.createElement("svg", {
 }, /* @__PURE__ */ React.createElement("g", {
   fill: "none",
   stroke: "currentColor",
-  "stroke-linecap": "round",
-  "stroke-linejoin": "round",
-  "stroke-width": "2"
+  strokeLinecap: "round",
+  strokeLinejoin: "round",
+  strokeWidth: "2"
 }, /* @__PURE__ */ React.createElement("path", {
   d: "m9 11l3 3l8-8"
 }), /* @__PURE__ */ React.createElement("path", {
@@ -102542,9 +102548,9 @@ const FidgetSpinner = () => /* @__PURE__ */ React.createElement("svg", {
 }, /* @__PURE__ */ React.createElement("path", {
   fill: "none",
   stroke: "currentColor",
-  "stroke-linecap": "round",
-  "stroke-linejoin": "round",
-  "stroke-width": "2",
+  strokeLinecap: "round",
+  strokeLinejoin: "round",
+  strokeWidth: "2",
   d: "M18 16v.01M6 16v.01M12 5v.01M12 12v.01M12 1a4 4 0 0 1 2.001 7.464l.001.072a4 4 0 0 1 1.987 3.758l.22.128a4 4 0 0 1 1.591-.417L18 12a4 4 0 1 1-3.994 3.77l-.28-.16c-.522.25-1.108.39-1.726.39c-.619 0-1.205-.14-1.728-.391l-.279.16L10 16a4 4 0 1 1-2.212-3.579l.222-.129a4 4 0 0 1 1.988-3.756L10 8.465A4 4 0 0 1 8.005 5.2L8 5a4 4 0 0 1 4-4"
 }));
 const Scale = () => /* @__PURE__ */ React.createElement("svg", {
@@ -102555,9 +102561,9 @@ const Scale = () => /* @__PURE__ */ React.createElement("svg", {
 }, /* @__PURE__ */ React.createElement("path", {
   fill: "none",
   stroke: "currentColor",
-  "stroke-linecap": "round",
-  "stroke-linejoin": "round",
-  "stroke-width": "2",
+  strokeLinecap: "round",
+  strokeLinejoin: "round",
+  strokeWidth: "2",
   d: "M7 20h10M6 6l6-1l6 1m-6-3v17m-3-8L6 6l-3 6a3 3 0 0 0 6 0m12 0l-3-6l-3 6a3 3 0 0 0 6 0"
 }));
 const armChair = () => /* @__PURE__ */ React.createElement("svg", {
@@ -102568,9 +102574,9 @@ const armChair = () => /* @__PURE__ */ React.createElement("svg", {
 }, /* @__PURE__ */ React.createElement("g", {
   fill: "none",
   stroke: "currentColor",
-  "stroke-linecap": "round",
-  "stroke-linejoin": "round",
-  "stroke-width": "2"
+  strokeLinecap: "round",
+  strokeLinejoin: "round",
+  strokeWidth: "2"
 }, /* @__PURE__ */ React.createElement("path", {
   d: "M5 11a2 2 0 0 1 2 2v2h10v-2a2 2 0 1 1 4 0v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4a2 2 0 0 1 2-2"
 }), /* @__PURE__ */ React.createElement("path", {
@@ -102584,9 +102590,9 @@ const Login = () => /* @__PURE__ */ React.createElement("svg", {
 }, /* @__PURE__ */ React.createElement("g", {
   fill: "none",
   stroke: "currentColor",
-  "stroke-linecap": "round",
-  "stroke-linejoin": "round",
-  "stroke-width": "2"
+  strokeLinecap: "round",
+  strokeLinejoin: "round",
+  strokeWidth: "2"
 }, /* @__PURE__ */ React.createElement("path", {
   d: "M15 8V6a2 2 0 0 0-2-2H6a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h7a2 2 0 0 0 2-2v-2"
 }), /* @__PURE__ */ React.createElement("path", {
@@ -102600,9 +102606,9 @@ const Logout2 = () => /* @__PURE__ */ React.createElement("svg", {
 }, /* @__PURE__ */ React.createElement("g", {
   fill: "none",
   stroke: "currentColor",
-  "stroke-linecap": "round",
-  "stroke-linejoin": "round",
-  "stroke-width": "2"
+  strokeLinecap: "round",
+  strokeLinejoin: "round",
+  strokeWidth: "2"
 }, /* @__PURE__ */ React.createElement("path", {
   d: "M14 8V6a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h7a2 2 0 0 0 2-2v-2"
 }), /* @__PURE__ */ React.createElement("path", {
@@ -105874,18 +105880,21 @@ const SelectedBookingProvider = ({ children }) => {
 const index$2 = ({ filters: filters2, setFilters }) => {
   const { t: t2 } = useTranslation();
   const { selectedBooking, setSelectedBooking } = useSelectedBookingContext();
+  const [datePickerOpen, setDatePickerOpen] = useState(false);
+  const datePickerRef = useRef(null);
   const defaultValue = {
     criteria: "",
-    date: ""
+    commingUp: false,
+    fromDate: hooks().format("YYYY-MM-DD")
   };
   const searchSchema = () => create$1().shape({
     criteria: create$2(),
-    date: create$2()
+    fromDate: create$2(),
+    commingUp: create$3()
   });
   const {
     control,
-    setValue: setValue2,
-    getValues
+    setValue: setValue2
   } = useForm({
     mode: "onChange",
     resolver: o(searchSchema()),
@@ -105895,17 +105904,56 @@ const index$2 = ({ filters: filters2, setFilters }) => {
     control,
     name: "criteria"
   });
-  const date4 = useWatch({
+  const fromDate = useWatch({
     control,
-    name: "date"
+    name: "fromDate"
+  });
+  const commingUp = useWatch({
+    control,
+    name: "commingUp"
   });
+  const selectDate = (type4) => {
+    switch (type4) {
+      case "today":
+        setValue2("fromDate", hooks().format("YYYY-MM-DD"));
+        setValue2("commingUp", false);
+        break;
+      case "tomorrow":
+        setValue2("fromDate", hooks().add(1, "days").format("YYYY-MM-DD"));
+        setValue2("commingUp", false);
+        break;
+      case "commingUp":
+        setValue2("commingUp", true);
+        break;
+      default:
+        setValue2("commingUp", false);
+        break;
+    }
+  };
+  const onChange3 = (date4, dateString) => {
+    setValue2("fromDate", dateString);
+    setDatePickerOpen(false);
+  };
   useEffect(() => {
     setFilters({
       ...filters2,
       criteria,
-      date: date4
+      commingUp,
+      fromDate
     });
-  }, [criteria, date4]);
+  }, [criteria, fromDate, commingUp]);
+  useEffect(() => {
+    function handleDocumentClick(event) {
+      var _a2, _b;
+      if (datePickerRef.current && typeof ((_a2 = event == null ? void 0 : event.target) == null ? void 0 : _a2.className) === "string" && !((_b = event == null ? void 0 : event.target) == null ? void 0 : _b.className.includes("ant"))) {
+        setDatePickerOpen(false);
+      }
+    }
+    document.addEventListener("mousedown", handleDocumentClick);
+    return () => {
+      document.removeEventListener("mousedown", handleDocumentClick);
+    };
+  }, []);
   return /* @__PURE__ */ React__default.createElement("div", {
     className: styles$c.headerContainer
   }, /* @__PURE__ */ React__default.createElement(TextInputField, {
@@ -105926,18 +105974,101 @@ const index$2 = ({ filters: filters2, setFilters }) => {
   }), /* @__PURE__ */ React__default.createElement("div", {
     className: styles$c.buttonList
   }, /* @__PURE__ */ React__default.createElement(Button, {
-    mode: "tertiary"
+    mode: "tertiary",
+    onClick: () => selectDate("commingUp")
   }, t2("COMMINGUP")), /* @__PURE__ */ React__default.createElement(Button, {
-    mode: "tertiary"
+    mode: "tertiary",
+    onClick: () => selectDate("today")
   }, t2("TODAY")), /* @__PURE__ */ React__default.createElement(Button, {
-    mode: "tertiary"
-  }, t2("TOMORROW")), /* @__PURE__ */ React__default.createElement(Button, {
-    mode: "primary"
-  }, t2("SELECTADAY")), /* @__PURE__ */ React__default.createElement(Button, {
+    mode: "tertiary",
+    onClick: () => selectDate("tomorrow")
+  }, t2("TOMORROW")), /* @__PURE__ */ React__default.createElement("div", {
+    style: { display: "flex", flexDirection: "column", justifyContent: "center" }
+  }, /* @__PURE__ */ React__default.createElement(Button, {
+    mode: "primary",
+    onClick: () => setDatePickerOpen(true)
+  }, t2("SELECTADAY")), /* @__PURE__ */ React__default.createElement(CustomDatePicker, {
+    ref: datePickerRef,
+    onChange: onChange3,
+    open: datePickerOpen,
+    style: {
+      marginTop: "30px",
+      width: 0,
+      height: 0,
+      opacity: 0,
+      position: "absolute",
+      pointerEvents: "none"
+    }
+  })), /* @__PURE__ */ React__default.createElement(Button, {
     mode: "success",
     onClick: () => setSelectedBooking(null)
   }, t2("ADDRESERVATION"))));
 };
+const injectStyles = () => {
+  const styleElement = document.createElement("style");
+  styleElement.innerHTML = `
+        .ant-picker-panel {
+            background-color: #2F3349 !important;
+            border-radius: 6px !important;
+            color: white !important;
+        }
+
+        .ant-picker-content {
+            background-color: #2F3349 !important;
+            color: white !important;
+        }
+
+        .ant-picker-content thead th {
+            background-color: #2F3349 !important;
+            color: white !important;
+            text-transform: uppercase;
+        }
+
+        .ant-picker-cell {
+            color: #D0CEE5 !important;
+            background-color: #2F3349 !important;
+        }
+
+        .ant-picker-cell-in-view.ant-picker-cell-today {
+            border: 1px solid #ACABC1 !important;
+        }
+
+        .ant-picker-cell-in-view.ant-picker-cell-selected {
+            background-color: #4C4F64 !important;
+            color: white !important;
+        }
+
+        .ant-picker-cell-in-view.ant-picker-cell:hover {
+            background-color: #3A3D54 !important;
+            color: white !important;
+        }
+
+        .ant-picker-footer {
+            background-color: #2F3349 !important;
+        }
+
+        .ant-picker-today-btn {
+            color: white !important;
+            background-color: #3A3D54 !important;
+            border-radius: 6px;
+            padding: 4px 8px;
+        }
+
+        .ant-picker-today-btn:hover {
+            background-color: #4C4F64 !important;
+        }
+    `;
+  document.head.appendChild(styleElement);
+};
+const CustomDatePicker = React__default.forwardRef((props, ref) => {
+  useEffect(() => {
+    injectStyles();
+  }, []);
+  return /* @__PURE__ */ React__default.createElement(DatePicker$2, {
+    ...props,
+    ref
+  });
+});
 const TableTopHeader = ({ date: date4, total }) => {
   const { t: t2 } = useTranslation();
   return /* @__PURE__ */ React__default.createElement("div", {
@@ -106082,8 +106213,9 @@ const TableBody = ({ data: data2, filtersData, venueId }) => {
   const { t: t2 } = useTranslation();
   const [formattedData, setFormattedData] = useState({});
   useEffect(() => {
-    if (data2) {
+    if (data2 && filtersData) {
       const groupedByHour = _23.groupBy(data2, (item2) => {
+        console.log(filtersData == null ? void 0 : filtersData.timeZone, "LOL");
         const formattedTime = new Date(item2.date).toLocaleTimeString([], {
           ...(filtersData == null ? void 0 : filtersData.timeZone) ? {
             timeZone: filtersData == null ? void 0 : filtersData.timeZone
@@ -106099,9 +106231,16 @@ const TableBody = ({ data: data2, filtersData, venueId }) => {
         ["asc"]
       ).fromPairs().value();
       setFormattedData(sortedGroupedByHour);
+      console.log(sortedGroupedByHour, "SORTED");
     }
-  }, [data2]);
-  return /* @__PURE__ */ React__default.createElement("div", null, _23.map(formattedData, (group, key2) => {
+  }, [data2, filtersData]);
+  return /* @__PURE__ */ React__default.createElement("div", null, _23.isEmpty(formattedData) ? /* @__PURE__ */ React__default.createElement("div", {
+    className: styles$c.tableRowContainer
+  }, /* @__PURE__ */ React__default.createElement(Card, {
+    className: styles$c.tableRowCard
+  }, /* @__PURE__ */ React__default.createElement("h2", {
+    className: styles$c.noData
+  }, t2("NO_RESERVATIONS")))) : _23.map(formattedData, (group, key2) => {
     return /* @__PURE__ */ React__default.createElement("div", {
       key: key2
     }, /* @__PURE__ */ React__default.createElement("div", {
@@ -106120,7 +106259,7 @@ const TableBody = ({ data: data2, filtersData, venueId }) => {
 };
 const index$1 = ({ data: data2, filters: filters2, filtersData, venueId }) => {
   return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(TableTopHeader, {
-    date: filters2.date,
+    date: filters2.fromDate,
     total: data2 == null ? void 0 : data2.length
   }), /* @__PURE__ */ React__default.createElement("div", {
     style: { overflowY: "auto" }
@@ -106290,7 +106429,7 @@ const TextAreaField = ({ control, name, ...props }) => {
     }))
   });
 };
-var styles$2 = /* @__PURE__ */ (() => ".ant-modal-centered .ant-modal{border:0;border-radius:6px;background-color:#2f3349}.ant-modal-content{background-color:transparent;border-radius:6px}.ant-modal-header,.ant-modal-body{background-color:#2f3349!important;color:#fff}.ant-modal-header{border-bottom:0;border-radius:6px 6px 0 0;padding-bottom:0}.ant-modal-body{border-radius:0 0 6px 6px;padding-top:0}.ant-modal-header h1,.ant-modal-header p,.ant-modal-body h1,.ant-modal-body h2,.ant-modal-body h3,.ant-modal-body h4,.ant-modal-body p{font-family:Public Sans,sans-serif}.ant-modal-header p,.ant-modal-body p{font-size:15px;color:#acabc1}.ant-modal-header p{margin-bottom:0;margin-top:0}.ant-modal-header h1,.ant-modal-body h1{font-weight:600;color:#cfcde4;font-size:18px}.ant-modal-body label{font-size:15px;color:#acabc1}.ant-modal-body h2{color:#fff}.ant-modal-body [class*=regularHourContainer]{color:#d0cee5;box-shadow:none;font-family:var(--font-family)}.ant-modal-body [class*=regularHourContainer] strong{font-weight:300;font-size:15px}.mz-header input,.ant-modal-body input,.ant-modal-body textarea{background-color:#3a3d54;color:#d0cee5;border-width:0 0 1px;border-color:#d0cee5;border-radius:0;padding:10px 5px}.mz-header .css-spersy-control,.ant-modal-body .css-spersy-control{background-color:#3a3d54;border-width:0 0 1px;border-radius:0}.css-spersy-control>div>div:first-child{color:#d0cee5!important;font-family:Public Sans,sans-serif;padding:7px 0}.ant-modal-body #react-select-4-listbox{background-color:#3a3d54;font-family:var(--font-family)}.ant-modal-title,.ant-modal-body span{color:#fff}.ant-modal-close-x line{stroke:#fff}\n")();
+var styles$2 = /* @__PURE__ */ (() => ".resbook-modal .ant-modal-centered .ant-modal{border:0;border-radius:6px;background-color:#2f3349}.resbook-modal .ant-modal-content{background-color:transparent;border-radius:6px}.resbook-modal .ant-modal-header,.resbook-modal .ant-modal-body{background-color:#2f3349!important;color:#fff}.resbook-modal .ant-modal-header{border-bottom:0;border-radius:6px 6px 0 0;padding-bottom:0}.resbook-modal .ant-modal-body{border-radius:0 0 6px 6px;padding-top:0}.resbook-modal .ant-modal-header h1,.resbook-modal .ant-modal-header p,.resbook-modal .ant-modal-body h1,.resbook-modal .ant-modal-body h2,.resbook-modal .ant-modal-body h3,.resbook-modal .ant-modal-body h4,.resbook-modal .ant-modal-body p{font-family:Public Sans,sans-serif}.resbook-modal .ant-modal-header p,.resbook-modal .ant-modal-body p{font-size:15px;color:#acabc1}.resbook-modal .ant-modal-header p{margin-bottom:0;margin-top:0}.resbook-modal .ant-modal-header h1,.resbook-modal .ant-modal-body h1{font-weight:600;color:#cfcde4;font-size:18px}.resbook-modal .ant-modal-body label{font-size:15px;color:#acabc1}.resbook-modal .ant-modal-body h2{color:#fff}.resbook-modal .ant-modal-body [class*=regularHourContainer]{color:#d0cee5;box-shadow:none;font-family:var(--font-family)}.resbook-modal .ant-modal-body [class*=regularHourContainer] strong{font-weight:300;font-size:15px}.resbook-modal .mz-header input,.resbook-modal .ant-modal-body input,.resbook-modal .ant-modal-body textarea{background-color:#3a3d54;color:#d0cee5;border-width:0 0 1px;border-color:#d0cee5;border-radius:0;padding:10px 5px}.resbook-modal .mz-header .css-spersy-control,.resbook-modal .ant-modal-body .css-spersy-control{background-color:#3a3d54;border-width:0 0 1px;border-radius:0}.resbook-modal .css-spersy-control>div>div:first-child{color:#d0cee5!important;font-family:Public Sans,sans-serif;padding:7px 0}.resbook-modal .ant-modal-body #react-select-4-listbox{background-color:#3a3d54;font-family:var(--font-family)}.resbook-modal .ant-modal-title,.resbook-modal .ant-modal-body span{color:#fff}.resbook-modal .ant-modal-close-x line{stroke:#fff}\n")();
 const Modal2 = ({
   open,
   children,
@@ -106299,6 +106438,7 @@ const Modal2 = ({
   width
 }) => {
   return /* @__PURE__ */ React__default.createElement(ModalAntd, {
+    className: "resbook-modal",
     title: /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, typeof title2 === "string" && /* @__PURE__ */ React__default.createElement(Heading, null, title2), typeof title2 !== "string" && !!title2 ? title2 : /* @__PURE__ */ React__default.createElement("div", null)),
     open,
     onCancel: onClose2,
@@ -106318,7 +106458,9 @@ const ConfirmationModal = ({ onAccept, isLoading, title: title2, text: text2 = "
     ...props,
     title: title2,
     width: 500
-  }, /* @__PURE__ */ React__default.createElement("h3", null, t2(text2)), /* @__PURE__ */ React__default.createElement("div", null, /* @__PURE__ */ React__default.createElement("div", {
+  }, /* @__PURE__ */ React__default.createElement("h3", {
+    style: { marginTop: 0, paddingTop: 20 }
+  }, t2(text2)), /* @__PURE__ */ React__default.createElement("div", null, /* @__PURE__ */ React__default.createElement("div", {
     style: { display: "flex", justifyContent: "center", gap: 20, marginTop: 20 }
   }, /* @__PURE__ */ React__default.createElement(Button, {
     size: "small",
@@ -106770,7 +106912,10 @@ const index = ({ filtersData, venueId }) => {
   })));
 };
 function MainComponent({ venueId }) {
-  const [filters2, setFilters] = useState({});
+  const [currentVenue, setCurrentVenue] = useState(null);
+  const [filters2, setFilters] = useState({
+    fromDate: hooks().format("YYYY-MM-DD")
+  });
   const [params, setParams] = useState(
     () => {
       const date4 = new Date();
@@ -106786,23 +106931,34 @@ function MainComponent({ venueId }) {
   );
   const { selectedBooking, setSelectedBooking } = useSelectedBookingContext();
   const { data: data2, isLoading, error: error3, reload } = useFetch(GetBookings, { cacheId: "reservation0dashboard", venue_id: venueId, params });
+  console.log(venueId, "VENUE ID");
   const { data: filtersData, isLoading: filtersLoading, error: filtersError, reload: reloadSelectsData } = useFetch(GetCreateBookingSelectsData, {
     cacheId: "venueCapacity",
-    venue_id: venueId,
+    venue_id: currentVenue,
     includeAreaInTables: true,
     includeCoversInTables: false
   });
   useEffect(() => {
-    console.log(filters2, "FILTERS");
+    setCurrentVenue(venueId);
+  }, [venueId]);
+  useEffect(() => {
+    const paramsToSend = { ...params };
+    if (filters2.criteria) {
+      paramsToSend["filters[criteria]"] = filters2.criteria;
+    } else {
+      delete paramsToSend["filters[criteria]"];
+    }
+    if (filters2.fromDate) {
+      paramsToSend["filters[fromZ]"] = `${filters2.fromDate}${filters2.commingUp ? hooks().format("Tkk:mm:ss") : "T00:00:00"}`;
+      paramsToSend["filters[tillZ]"] = `${filters2.fromDate}T23:59:59.999`;
+    }
+    setParams(paramsToSend);
   }, [filters2]);
   useEffect(() => {
     if (!selectedBooking) {
       reloadSelectsData();
     }
   }, [selectedBooking]);
-  useEffect(() => {
-    console.log(filtersData, "FILTERS DATA");
-  }, [filtersData]);
   return /* @__PURE__ */ React__default.createElement(ReloadProvider, {
     reload
   }, /* @__PURE__ */ React__default.createElement("div", {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mozrest-sdk-react-dev",
-  "version": "0.2.54",
+  "version": "0.2.55",
   "main": "mozrest-sdk.es.js",
   "keywords": ["mozrest"],
   "author": {