pih-appointment-widget 0.0.22 → 0.0.24

package/dist/components/AppointmentPage.js

@@ -29,6 +29,7 @@ const STORAGE_KEY_APP_TOKEN = "pih_appointment_appToken";
 const STORAGE_KEY_DOCTOR_ID = "pih_appointment_doctorId";
 const STORAGE_KEY_USER_NAME = "pih_appointment_userName";
 const STORAGE_KEY_API_BASE_URL = "pih_appointment_apiBaseUrl";
+const STORAGE_KEY_HOSPITAL_ID = "pih_appointment_hospitalId";
 const DEFAULT_PIP_WIDTH = 720;
 const DEFAULT_PIP_HEIGHT = 560;
 
@@ -125,8 +126,15 @@ const AppointmentPage = _ref => {
       return null;
     }
   });
+  const [storedHospitalId, setStoredHospitalId] = (0, _react.useState)(() => {
+    try {
+      return typeof localStorage !== "undefined" ? localStorage.getItem(STORAGE_KEY_HOSPITAL_ID) : null;
+    } catch {
+      return null;
+    }
+  });
   const apiBaseUrl = config.apiBaseUrl || storedApiBaseUrl || _apiConfig.API_BASE_URL;
-  const hospitalId = config.hospitalId || _apiConfig.DEFAULT_PARAMS.hospitalId;
+  const hospitalId = config.hospitalId || storedHospitalId;
 
   // idToken/email: config first, then localStorage. When Flutter (or parent) passes a new token, we use it and re-login.
   const [storedIdToken, setStoredIdToken] = (0, _react.useState)(() => {
@@ -173,8 +181,12 @@ const AppointmentPage = _ref => {
         localStorage.setItem(STORAGE_KEY_API_BASE_URL, config.apiBaseUrl.trim());
         setStoredApiBaseUrl(config.apiBaseUrl.trim());
       }
+      if (config.hospitalId != null && String(config.hospitalId).trim()) {
+        localStorage.setItem(STORAGE_KEY_HOSPITAL_ID, String(config.hospitalId).trim());
+        setStoredHospitalId(String(config.hospitalId).trim());
+      }
     } catch (e) {}
-  }, [config.idToken, config.token, config.email, config.apiBaseUrl]);
+  }, [config.idToken, config.token, config.email, config.apiBaseUrl, config.hospitalId]);
   const [appToken, setAppToken] = (0, _react.useState)(() => {
     try {
       return typeof localStorage !== "undefined" ? localStorage.getItem(STORAGE_KEY_APP_TOKEN) : null;
@@ -443,11 +455,10 @@ const AppointmentPage = _ref => {
       setSelectedAppointment(sortedAppointments[0]);
     }
   };
-  const fetchAppointments = (0, _react.useCallback)(async overrideType => {
+  const fetchAppointments = (0, _react.useCallback)(async () => {
     if (!appToken) return;
     console.log(doctorIdFromLogin, 'fetchAppointments -> doctorIdFromLogin');
     const doctorId = doctorIdFromLogin;
-    const typeToUse = overrideType !== undefined ? overrideType : appointmentTypeFilter;
     setLoading(true);
     setError(null);
     try {
@@ -457,7 +468,7 @@ const AppointmentPage = _ref => {
         doctorId,
         token: appToken
       };
-      const response = await (0, _appointmentService.getAppointmentsByStatus)(activeTab, fromDate, toDate, typeToUse, serviceConfig);
+      const response = await (0, _appointmentService.getAppointmentsByStatus)(activeTab, fromDate, toDate, serviceConfig);
       if (response.status === 401 || response.status === 403) {
         // Token expired — clear stored token and trigger re-login (SSO effect will fire)
         try {
@@ -496,6 +507,7 @@ const AppointmentPage = _ref => {
   // Handle appointment selection - no API call, just show data from list
   const handleAppointmentSelect = appointment => {
     setSelectedAppointment(appointment);
+    setCallError(null);
   };
 
   // Logout: clear storage and redirect to login page
@@ -508,6 +520,7 @@ const AppointmentPage = _ref => {
         localStorage.removeItem(STORAGE_KEY_DOCTOR_ID);
         localStorage.removeItem(STORAGE_KEY_USER_NAME);
         localStorage.removeItem(STORAGE_KEY_API_BASE_URL);
+        localStorage.removeItem(STORAGE_KEY_HOSPITAL_ID);
       }
     } catch (e) {}
     setShowProfileDropdown(false);
@@ -533,21 +546,31 @@ const AppointmentPage = _ref => {
       console.log(selectedAppointment, 'selectedAppointment');
       console.log(callConfig, 'callConfig');
       const response = await (0, _appointmentService.initiateConsultation)(selectedAppointment, callConfig);
+      console.log(response.status, 'response');
       if (response.status === 401 || response.status === 403) {
-        setCallError("Session expired. Please try again.");
-        setCallLoading(false);
+        // Token expired — clear stored token and trigger re-login (same as fetchAppointments)
+        try {
+          if (typeof localStorage !== "undefined") {
+            localStorage.removeItem(STORAGE_KEY_APP_TOKEN);
+            localStorage.removeItem(STORAGE_KEY_DOCTOR_ID);
+            localStorage.removeItem(STORAGE_KEY_USER_NAME);
+          }
+        } catch (e) {}
+        setAppToken(null);
+        setDoctorIdFromLogin(null);
+        setUserName(null);
+        setRefreshLoginTrigger(t => t + 1);
+        setCallError("Session expired. Re-authenticating...");
         return;
       }
       if (response.err || !response.data?.token) {
         setCallError(String(response.err || "Failed to initiate call"));
-        setCallLoading(false);
         return;
       }
       const joinCallUrlBase = config.joinCallUrl || _apiConfig.JOIN_CALL_URL;
       const joinCallUrl = response.data.token ? String(joinCallUrlBase || "").replace(/\/?$/, "/") + response.data.token : "";
       console.log("joinCallUrl", joinCallUrl);
       setCallToken(response.data.token);
-      // setCallUrl(response.data.url || "");
       setCallUrl(joinCallUrl || '');
       setShowPipVideo(true);
       setIsPipMinimized(false);
@@ -564,7 +587,6 @@ const AppointmentPage = _ref => {
     } catch (err) {
       setCallError(err.message || "Failed to initiate call");
     } finally {
-      setCallError(null);
       setCallLoading(false);
     }
   };
@@ -794,9 +816,10 @@ const AppointmentPage = _ref => {
     };
   }, [apiBaseUrl, hospitalId, idToken, email, refreshLoginTrigger]);
 
-  // Reset page to 1 when filters change
+  // Reset page to 1 and clear call error when filters/tab change
   (0, _react.useEffect)(() => {
     setCurrentPage(1);
+    setCallError(null);
   }, [activeTab, selectedDate, fromDate, toDate, searchQuery, appointmentTypeFilter]);
 
   // Fetch appointments when we have appToken (tab/date change triggers refetch via fetchAppointments deps)
@@ -1224,130 +1247,7 @@ const AppointmentPage = _ref => {
         justifyContent: isMobile ? "flex-start" : "flex-end",
         flexWrap: "wrap"
       }
-    }, /*#__PURE__*/_react.default.createElement("div", {
-      style: {
-        position: "relative"
-      },
-      "data-appointment-type-picker": true
     }, /*#__PURE__*/_react.default.createElement("button", {
-      onClick: () => setShowAppointmentTypePicker(!showAppointmentTypePicker),
-      style: {
-        padding: isMobile ? "8px 12px" : "8px 12px",
-        fontFamily,
-        fontWeight: 600,
-        border: "1px solid #E5E5E5",
-        borderRadius: "6px",
-        fontSize: isMobile ? "11px" : "13px",
-        color: "#1a1a1a",
-        background: "#FFFFFF",
-        display: "flex",
-        alignItems: "center",
-        gap: isMobile ? "4px" : "6px",
-        cursor: "pointer",
-        flex: "none",
-        minWidth: isMobile ? "100px" : "auto",
-        justifyContent: "center"
-      }
-    }, /*#__PURE__*/_react.default.createElement("svg", {
-      width: isMobile ? "14" : "16",
-      height: isMobile ? "14" : "16",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round"
-    }, /*#__PURE__*/_react.default.createElement("path", {
-      d: "M4.8 2A2.8 2.8 0 0 0 2 4.8v14.4A2.8 2.8 0 0 0 4.8 22h14.4a2.8 2.8 0 0 0 2.8-2.8V4.8A2.8 2.8 0 0 0 19.2 2H4.8z"
-    }), /*#__PURE__*/_react.default.createElement("path", {
-      d: "M8 12h8M8 16h5"
-    })), /*#__PURE__*/_react.default.createElement("span", {
-      style: {
-        overflow: "hidden",
-        textOverflow: "ellipsis",
-        whiteSpace: "nowrap",
-        color: "#4C4DDC"
-      }
-    }, appointmentTypeFilter === "all" ? "All Appointment" : appointmentTypeFilter === "ONLINE" ? "Online" : "Physical"), /*#__PURE__*/_react.default.createElement("svg", {
-      width: isMobile ? "8" : "10",
-      height: isMobile ? "8" : "10",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      stroke: "currentColor",
-      strokeWidth: "2",
-      strokeLinecap: "round",
-      strokeLinejoin: "round"
-    }, /*#__PURE__*/_react.default.createElement("polyline", {
-      points: "6 9 12 15 18 9"
-    }))), showAppointmentTypePicker && /*#__PURE__*/_react.default.createElement("div", {
-      style: {
-        position: "absolute",
-        top: "100%",
-        right: isMobile ? "auto" : 0,
-        left: isMobile ? 0 : "auto",
-        marginTop: "4px",
-        background: "#FFFFFF",
-        border: "1px solid #E5E5E5",
-        borderRadius: "8px",
-        boxShadow: "0 4px 16px rgba(0,0,0,0.15)",
-        padding: "8px",
-        zIndex: 1000,
-        minWidth: isMobile ? "240px" : "200px",
-        width: isMobile ? "calc(100vw - 24px)" : "auto",
-        maxWidth: isMobile ? "calc(100vw - 24px)" : "240px"
-      }
-    }, [{
-      value: "all",
-      label: "All Appointment"
-    }, {
-      value: "ONLINE",
-      label: "Online"
-    }, {
-      value: "PHYSICAL",
-      label: "Physical"
-    }].map(_ref2 => {
-      let {
-        value,
-        label
-      } = _ref2;
-      return /*#__PURE__*/_react.default.createElement("button", {
-        key: value,
-        onClick: () => {
-          setAppointmentTypeFilter(value);
-          setShowAppointmentTypePicker(false);
-          fetchAppointments(value);
-        },
-        style: {
-          width: "100%",
-          padding: "10px 12px",
-          background: appointmentTypeFilter === value ? "#E8EEF4" : "#FFFFFF",
-          border: "none",
-          borderRadius: "4px",
-          fontSize: "13px",
-          fontFamily,
-          cursor: "pointer",
-          textAlign: "left",
-          fontWeight: appointmentTypeFilter === value ? 600 : 400,
-          color: appointmentTypeFilter === value ? "#4C4DDC" : "#1a1a1a",
-          marginBottom: "4px",
-          display: "flex",
-          justifyContent: "space-between",
-          alignItems: "center",
-          transition: "all 0.2s ease"
-        },
-        onMouseEnter: e => {
-          if (appointmentTypeFilter !== value) e.target.style.background = "#F5F5F5";
-        },
-        onMouseLeave: e => {
-          if (appointmentTypeFilter !== value) e.target.style.background = "#FFFFFF";
-        }
-      }, /*#__PURE__*/_react.default.createElement("span", null, label), appointmentTypeFilter === value && /*#__PURE__*/_react.default.createElement("span", {
-        style: {
-          color: "#4C4DDC",
-          fontSize: "16px"
-        }
-      }, "\u2713"));
-    }))), /*#__PURE__*/_react.default.createElement("button", {
       onClick: () => {
         // Initialize temp dates and option with current values when opening picker
         if (!showDatePicker) {
@@ -2218,7 +2118,7 @@ const AppointmentPage = _ref => {
         background: "#FFFFFF",
         borderRadius: isPipFullscreen ? "0" : "8px",
         boxShadow: "0 8px 24px rgba(0, 0, 0, 0.3)",
-        zIndex: 10000,
+        zIndex: 100000,
         overflow: "hidden",
         display: "flex",
         flexDirection: "column",

package/dist/pih-appointment-widget.umd.js

@@ -147,11 +147,6 @@
     INITIATE_CALL: "/notification/V1/consultation/online/initiate"
   };
 
-  // Default request parameters (will be fetched from auth API later)
-  const DEFAULT_PARAMS = {
-    hospitalId: "dMtEGhak"
-  };
-
   // Join call URL (will be dynamic from auth API later)
   const JOIN_CALL_URL = "https://wbafedevittisalwe01-had2b3e0a7h6fyey.westeurope-01.azurewebsites.net/call/";
   const WEB_URL = "https://wbaemrdevittisalwe01-fnapdpfme7bvduhh.westeurope-01.azurewebsites.net/";
@@ -164,15 +159,15 @@
    * @param {object} config - Optional configuration { apiBaseUrl, hospitalId, doctorId }
    * @returns {Promise} Appointments data
    */
-  const getAppointmentsByStatus = async function (status, fromDate, toDate, type) {
-    let config = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : {};
+  const getAppointmentsByStatus = async function (status, fromDate, toDate) {
+    let config = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
     // Map status to API format
     let apiStatus = (status || "").toUpperCase();
     if (apiStatus === "INPROGRESS") {
       apiStatus = "IN_PROGRESS";
     }
     const baseURL = config.apiBaseUrl;
-    const hospitalId = config.hospitalId || DEFAULT_PARAMS.hospitalId;
+    const hospitalId = config.hospitalId;
     const doctorId = config.doctorId;
     const token = config.token || '';
     const params = {
@@ -182,9 +177,10 @@
       toDate,
       statuses: apiStatus
     };
-    if (type && String(type).toUpperCase() !== "ALL") {
-      params.appointmentType = String(type).toUpperCase();
-    }
+    // if (type && String(type).toUpperCase() !== "ALL") {
+    //   params.appointmentType = String(type).toUpperCase();
+    // }
+    params.appointmentType = 'ONLINE';
     const url = `${baseURL}${API_PATHS.APPOINTMENTS}`;
 
     // Return raw response (including status) so caller can detect 401 and re-login
@@ -207,7 +203,7 @@
     const body = {
       patientId: String(appointment.patientId || ""),
       primaryPatientId: String(appointment.primaryPatientId || appointment.patientId || ""),
-      hospitalId: config.hospitalId || DEFAULT_PARAMS.hospitalId,
+      hospitalId: config.hospitalId,
       doctorId: String(config.doctorId),
       patientName: appointment.patientName || appointment.name || "",
       doctorName: appointment.doctorName || config.doctorName,
@@ -235,6 +231,7 @@
   const STORAGE_KEY_DOCTOR_ID = "pih_appointment_doctorId";
   const STORAGE_KEY_USER_NAME = "pih_appointment_userName";
   const STORAGE_KEY_API_BASE_URL = "pih_appointment_apiBaseUrl";
+  const STORAGE_KEY_HOSPITAL_ID = "pih_appointment_hospitalId";
   const DEFAULT_PIP_WIDTH = 720;
   const DEFAULT_PIP_HEIGHT = 560;
 
@@ -331,8 +328,15 @@
         return null;
       }
     });
+    const [storedHospitalId, setStoredHospitalId] = React.useState(() => {
+      try {
+        return typeof localStorage !== "undefined" ? localStorage.getItem(STORAGE_KEY_HOSPITAL_ID) : null;
+      } catch {
+        return null;
+      }
+    });
     const apiBaseUrl = config.apiBaseUrl || storedApiBaseUrl || API_BASE_URL;
-    const hospitalId = config.hospitalId || DEFAULT_PARAMS.hospitalId;
+    const hospitalId = config.hospitalId || storedHospitalId;
 
     // idToken/email: config first, then localStorage. When Flutter (or parent) passes a new token, we use it and re-login.
     const [storedIdToken, setStoredIdToken] = React.useState(() => {
@@ -379,8 +383,12 @@
           localStorage.setItem(STORAGE_KEY_API_BASE_URL, config.apiBaseUrl.trim());
           setStoredApiBaseUrl(config.apiBaseUrl.trim());
         }
+        if (config.hospitalId != null && String(config.hospitalId).trim()) {
+          localStorage.setItem(STORAGE_KEY_HOSPITAL_ID, String(config.hospitalId).trim());
+          setStoredHospitalId(String(config.hospitalId).trim());
+        }
       } catch (e) {}
-    }, [config.idToken, config.token, config.email, config.apiBaseUrl]);
+    }, [config.idToken, config.token, config.email, config.apiBaseUrl, config.hospitalId]);
     const [appToken, setAppToken] = React.useState(() => {
       try {
         return typeof localStorage !== "undefined" ? localStorage.getItem(STORAGE_KEY_APP_TOKEN) : null;
@@ -649,11 +657,10 @@
         setSelectedAppointment(sortedAppointments[0]);
       }
     };
-    const fetchAppointments = React.useCallback(async overrideType => {
+    const fetchAppointments = React.useCallback(async () => {
       if (!appToken) return;
       console.log(doctorIdFromLogin, 'fetchAppointments -> doctorIdFromLogin');
       const doctorId = doctorIdFromLogin;
-      const typeToUse = overrideType !== undefined ? overrideType : appointmentTypeFilter;
       setLoading(true);
       setError(null);
       try {
@@ -663,7 +670,7 @@
           doctorId,
           token: appToken
         };
-        const response = await getAppointmentsByStatus(activeTab, fromDate, toDate, typeToUse, serviceConfig);
+        const response = await getAppointmentsByStatus(activeTab, fromDate, toDate, serviceConfig);
         if (response.status === 401 || response.status === 403) {
           // Token expired — clear stored token and trigger re-login (SSO effect will fire)
           try {
@@ -702,6 +709,7 @@
     // Handle appointment selection - no API call, just show data from list
     const handleAppointmentSelect = appointment => {
       setSelectedAppointment(appointment);
+      setCallError(null);
     };
 
     // Handle join call — call initiate API to get LiveKit token+url, then open PiP
@@ -720,21 +728,31 @@
         console.log(selectedAppointment, 'selectedAppointment');
         console.log(callConfig, 'callConfig');
         const response = await initiateConsultation(selectedAppointment, callConfig);
+        console.log(response.status, 'response');
         if (response.status === 401 || response.status === 403) {
-          setCallError("Session expired. Please try again.");
-          setCallLoading(false);
+          // Token expired — clear stored token and trigger re-login (same as fetchAppointments)
+          try {
+            if (typeof localStorage !== "undefined") {
+              localStorage.removeItem(STORAGE_KEY_APP_TOKEN);
+              localStorage.removeItem(STORAGE_KEY_DOCTOR_ID);
+              localStorage.removeItem(STORAGE_KEY_USER_NAME);
+            }
+          } catch (e) {}
+          setAppToken(null);
+          setDoctorIdFromLogin(null);
+          setUserName(null);
+          setRefreshLoginTrigger(t => t + 1);
+          setCallError("Session expired. Re-authenticating...");
           return;
         }
         if (response.err || !response.data?.token) {
           setCallError(String(response.err || "Failed to initiate call"));
-          setCallLoading(false);
           return;
         }
         const joinCallUrlBase = config.joinCallUrl || JOIN_CALL_URL;
         const joinCallUrl = response.data.token ? String(joinCallUrlBase || "").replace(/\/?$/, "/") + response.data.token : "";
         console.log("joinCallUrl", joinCallUrl);
         setCallToken(response.data.token);
-        // setCallUrl(response.data.url || "");
         setCallUrl(joinCallUrl || '');
         setShowPipVideo(true);
         setIsPipMinimized(false);
@@ -751,7 +769,6 @@
       } catch (err) {
         setCallError(err.message || "Failed to initiate call");
       } finally {
-        setCallError(null);
         setCallLoading(false);
       }
     };
@@ -981,9 +998,10 @@
       };
     }, [apiBaseUrl, hospitalId, idToken, email, refreshLoginTrigger]);
 
-    // Reset page to 1 when filters change
+    // Reset page to 1 and clear call error when filters/tab change
     React.useEffect(() => {
       setCurrentPage(1);
+      setCallError(null);
     }, [activeTab, selectedDate, fromDate, toDate, searchQuery, appointmentTypeFilter]);
 
     // Fetch appointments when we have appToken (tab/date change triggers refetch via fetchAppointments deps)
@@ -1265,130 +1283,7 @@
           justifyContent: isMobile ? "flex-start" : "flex-end",
           flexWrap: "wrap"
         }
-      }, /*#__PURE__*/React__default["default"].createElement("div", {
-        style: {
-          position: "relative"
-        },
-        "data-appointment-type-picker": true
       }, /*#__PURE__*/React__default["default"].createElement("button", {
-        onClick: () => setShowAppointmentTypePicker(!showAppointmentTypePicker),
-        style: {
-          padding: isMobile ? "8px 12px" : "8px 12px",
-          fontFamily,
-          fontWeight: 600,
-          border: "1px solid #E5E5E5",
-          borderRadius: "6px",
-          fontSize: isMobile ? "11px" : "13px",
-          color: "#1a1a1a",
-          background: "#FFFFFF",
-          display: "flex",
-          alignItems: "center",
-          gap: isMobile ? "4px" : "6px",
-          cursor: "pointer",
-          flex: "none",
-          minWidth: isMobile ? "100px" : "auto",
-          justifyContent: "center"
-        }
-      }, /*#__PURE__*/React__default["default"].createElement("svg", {
-        width: isMobile ? "14" : "16",
-        height: isMobile ? "14" : "16",
-        viewBox: "0 0 24 24",
-        fill: "none",
-        stroke: "currentColor",
-        strokeWidth: "2",
-        strokeLinecap: "round",
-        strokeLinejoin: "round"
-      }, /*#__PURE__*/React__default["default"].createElement("path", {
-        d: "M4.8 2A2.8 2.8 0 0 0 2 4.8v14.4A2.8 2.8 0 0 0 4.8 22h14.4a2.8 2.8 0 0 0 2.8-2.8V4.8A2.8 2.8 0 0 0 19.2 2H4.8z"
-      }), /*#__PURE__*/React__default["default"].createElement("path", {
-        d: "M8 12h8M8 16h5"
-      })), /*#__PURE__*/React__default["default"].createElement("span", {
-        style: {
-          overflow: "hidden",
-          textOverflow: "ellipsis",
-          whiteSpace: "nowrap",
-          color: "#4C4DDC"
-        }
-      }, appointmentTypeFilter === "all" ? "All Appointment" : appointmentTypeFilter === "ONLINE" ? "Online" : "Physical"), /*#__PURE__*/React__default["default"].createElement("svg", {
-        width: isMobile ? "8" : "10",
-        height: isMobile ? "8" : "10",
-        viewBox: "0 0 24 24",
-        fill: "none",
-        stroke: "currentColor",
-        strokeWidth: "2",
-        strokeLinecap: "round",
-        strokeLinejoin: "round"
-      }, /*#__PURE__*/React__default["default"].createElement("polyline", {
-        points: "6 9 12 15 18 9"
-      }))), showAppointmentTypePicker && /*#__PURE__*/React__default["default"].createElement("div", {
-        style: {
-          position: "absolute",
-          top: "100%",
-          right: isMobile ? "auto" : 0,
-          left: isMobile ? 0 : "auto",
-          marginTop: "4px",
-          background: "#FFFFFF",
-          border: "1px solid #E5E5E5",
-          borderRadius: "8px",
-          boxShadow: "0 4px 16px rgba(0,0,0,0.15)",
-          padding: "8px",
-          zIndex: 1000,
-          minWidth: isMobile ? "240px" : "200px",
-          width: isMobile ? "calc(100vw - 24px)" : "auto",
-          maxWidth: isMobile ? "calc(100vw - 24px)" : "240px"
-        }
-      }, [{
-        value: "all",
-        label: "All Appointment"
-      }, {
-        value: "ONLINE",
-        label: "Online"
-      }, {
-        value: "PHYSICAL",
-        label: "Physical"
-      }].map(_ref2 => {
-        let {
-          value,
-          label
-        } = _ref2;
-        return /*#__PURE__*/React__default["default"].createElement("button", {
-          key: value,
-          onClick: () => {
-            setAppointmentTypeFilter(value);
-            setShowAppointmentTypePicker(false);
-            fetchAppointments(value);
-          },
-          style: {
-            width: "100%",
-            padding: "10px 12px",
-            background: appointmentTypeFilter === value ? "#E8EEF4" : "#FFFFFF",
-            border: "none",
-            borderRadius: "4px",
-            fontSize: "13px",
-            fontFamily,
-            cursor: "pointer",
-            textAlign: "left",
-            fontWeight: appointmentTypeFilter === value ? 600 : 400,
-            color: appointmentTypeFilter === value ? "#4C4DDC" : "#1a1a1a",
-            marginBottom: "4px",
-            display: "flex",
-            justifyContent: "space-between",
-            alignItems: "center",
-            transition: "all 0.2s ease"
-          },
-          onMouseEnter: e => {
-            if (appointmentTypeFilter !== value) e.target.style.background = "#F5F5F5";
-          },
-          onMouseLeave: e => {
-            if (appointmentTypeFilter !== value) e.target.style.background = "#FFFFFF";
-          }
-        }, /*#__PURE__*/React__default["default"].createElement("span", null, label), appointmentTypeFilter === value && /*#__PURE__*/React__default["default"].createElement("span", {
-          style: {
-            color: "#4C4DDC",
-            fontSize: "16px"
-          }
-        }, "\u2713"));
-      }))), /*#__PURE__*/React__default["default"].createElement("button", {
         onClick: () => {
           // Initialize temp dates and option with current values when opening picker
           if (!showDatePicker) {
@@ -2259,7 +2154,7 @@
           background: "#FFFFFF",
           borderRadius: isPipFullscreen ? "0" : "8px",
           boxShadow: "0 8px 24px rgba(0, 0, 0, 0.3)",
-          zIndex: 10000,
+          zIndex: 100000,
           overflow: "hidden",
           display: "flex",
           flexDirection: "column",

package/dist/pih-appointment-widget.umd.min.js

@@ -1 +1 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("react-dom")):"function"==typeof define&&define.amd?define(["exports","react","react-dom"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).MyPackage={},e.React,e.ReactDOM)}(this,(function(e,t,n){"use strict";function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=o(t),i=o(n);const l="/appointment/V1/consultant/all-appointments",r="/notification/V1/consultation/online/initiate",d="dMtEGhak",p="https://wbafedevittisalwe01-had2b3e0a7h6fyey.westeurope-01.azurewebsites.net/call/",s=async function(e,t,n,o){let a=arguments.length>4&&void 0!==arguments[4]?arguments[4]:{},i=(e||"").toUpperCase();"INPROGRESS"===i&&(i="IN_PROGRESS");const r=a.apiBaseUrl,p=a.hospitalId||d,s=a.doctorId,c=a.token||"",u={hospitalId:p,doctorId:s,fromDate:t,toDate:n,statuses:i};o&&"ALL"!==String(o).toUpperCase()&&(u.appointmentType=String(o).toUpperCase());const f=`${r}${l}`,m=await async function(e){let t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},n=arguments.length>3&&void 0!==arguments[3]?arguments[3]:"";const o=new URL(e);return o.search=new URLSearchParams(t).toString(),fetch(o,{method:"GET",headers:{"Content-Type":"application/json",Authorization:`${n}`}}).then((async e=>{const t=await e.json().catch((()=>({})));return e.ok?t:{err:t?.resultInfo?.message||"Something went wrong!",status:e.status}})).catch((e=>(console.error("Fetch error:",e),{err:e?.message||String(e)||"Network error"})))}(f,u,"PIH-Appointment-Widget",c);return m},c=async function(e){let t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};console.log("initiateConsultation -> config",t);const n=`${t.apiBaseUrl.replace(/\/$/,"")}${r}`,o=t.appToken||"";return async function(e){let t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},n=arguments.length>3&&void 0!==arguments[3]?arguments[3]:{},o=arguments.length>4?arguments[4]:void 0;const a=new URL(e);Object.keys(n).forEach((e=>{a.searchParams.append(e,n[e])}));const i={"Content-Type":"application/json"};o&&(i.Authorization=o);const l={method:"POST",headers:i,body:JSON.stringify(t)};return fetch(a.toString(),l).then((async e=>{const t=await e.json().catch((()=>({})));return e.ok?t:{err:t?.resultInfo?.message||"Something went wrong!",status:e.status}})).catch((e=>(console.error("Fetch error:",e),{err:e.message||"Network error"})))}(n,{patientId:String(e.patientId||""),primaryPatientId:String(e.primaryPatientId||e.patientId||""),hospitalId:t.hospitalId||d,doctorId:String(t.doctorId),patientName:e.patientName||e.name||"",doctorName:e.doctorName||t.doctorName,appointmentId:String(e.id||e.appointmentId||e._id||"")},"PIH-Appointment-Widget",{},o)};const u="pih_appointment_idToken",f="pih_appointment_email",m="pih_appointment_appToken",x="pih_appointment_doctorId",g="pih_appointment_userName",h="pih_appointment_apiBaseUrl",y=720,E="pih-appointment-widget",F="data-pih-widget";class b extends t.Component{state={hasError:!1};static getDerivedStateFromError(){return{hasError:!0}}componentDidCatch(e,t){"undefined"!=typeof console&&console.error&&console.error("Appointment widget error:",e,t)}render(){return this.state.hasError?a.default.createElement("div",{className:E,[F]:"teleconsult-appointments",style:{fontFamily:'"Nunito", serif',background:"#F5F5F7",boxSizing:"border-box",minHeight:"100vh",display:"flex",alignItems:"center",justifyContent:"center",padding:"24px",textAlign:"center"}},a.default.createElement("div",{style:{maxWidth:"400px"}},a.default.createElement("div",{style:{fontSize:"48px",marginBottom:"16px"}},"⚠️"),a.default.createElement("h2",{style:{fontSize:"20px",fontWeight:700,color:"#1a1a1a",margin:"0 0 8px 0"}},"Something went wrong"),a.default.createElement("p",{style:{fontSize:"14px",color:"#666",margin:0,lineHeight:1.5}},"Please refresh the page or try again later."))):this.props.children}}const w=e=>{let{config:n={}}=e;const[o,i]=t.useState((()=>{try{return"undefined"!=typeof localStorage?localStorage.getItem(h):null}catch{return null}})),l=n.apiBaseUrl||o||"https://afiyaapiqa.powermindinc.com",r=n.hospitalId||d,[w,S]=t.useState((()=>{try{return"undefined"!=typeof localStorage?localStorage.getItem(u):null}catch{return null}})),[v,k]=t.useState((()=>{try{return"undefined"!=typeof localStorage?localStorage.getItem(f):null}catch{return null}})),C=n.idToken||n.token||w,I=n.email||v;t.useEffect((()=>{try{if("undefined"==typeof localStorage)return;const e=n.idToken||n.token;if(e&&String(e).trim()){localStorage.getItem(u)!==e&&(z(null),M(null),A(null),localStorage.removeItem(m),localStorage.removeItem(x),localStorage.removeItem(g)),localStorage.setItem(u,e),S(e)}n.email&&String(n.email).trim()&&(localStorage.setItem(f,n.email),k(n.email)),n.apiBaseUrl&&String(n.apiBaseUrl).trim()&&(localStorage.setItem(h,n.apiBaseUrl.trim()),i(n.apiBaseUrl.trim()))}catch(e){}}),[n.idToken,n.token,n.email,n.apiBaseUrl]);const[D,z]=t.useState((()=>{try{return"undefined"!=typeof localStorage?localStorage.getItem(m):null}catch{return null}})),[W,M]=t.useState((()=>{try{return"undefined"!=typeof localStorage?localStorage.getItem(x):null}catch{return null}})),[T,A]=t.useState((()=>{try{return"undefined"!=typeof localStorage?localStorage.getItem(g):null}catch{return null}})),[R,N]=t.useState((()=>{try{if("undefined"==typeof localStorage)return!1;const e=localStorage.getItem(m),t=localStorage.getItem(u),n=localStorage.getItem(f);return!e&&!(!t||!n)}catch{return!1}})),[P,j]=t.useState(null),[B,L]=t.useState(!1),[H,U]=t.useState(0);t.useEffect((()=>{D&&R&&N(!1)}),[D,R]),t.useEffect((()=>{D||(C&&I?(L(!1),j((e=>"Sign in required. Redirecting to home..."===e?null:e))):(j("Sign in required. Redirecting to home..."),L(!0)))}),[D,C,I]),t.useEffect((()=>{if(!B)return;const e=n.homeUrl||"https://wbaemrdevittisalwe01-fnapdpfme7bvduhh.westeurope-01.azurewebsites.net/";if(!e||"undefined"==typeof window)return;const t=setTimeout((()=>{window.location.href=e}),2500);return()=>clearTimeout(t)}),[B,n.homeUrl]),t.useEffect((()=>{if(!R)return;const e=setTimeout((()=>{j("Request timed out. Please try again."),N(!1)}),3e4);return()=>clearTimeout(e)}),[R]);const O=n.joinCallUrl||p;D&&String(O||"").replace(/\/?$/,"/");const $=function(e){if(!e||"string"!=typeof e)return{};try{const t=e.split(".");if(3!==t.length)return{};const n=t[1].replace(/-/g,"+").replace(/_/g,"/"),o=n.padEnd(n.length+(4-n.length%4)%4,"=");return JSON.parse(atob(o))}catch{return{}}}(C),_=T||$.name||$.sub||"User",Y=()=>(new Date).toISOString().split("T")[0],[V,q]=t.useState("upcoming"),[X,G]=t.useState([]),[J,K]=t.useState(null),[Q,Z]=t.useState(!1),[ee,te]=t.useState(null),[ne,oe]=t.useState(window.innerWidth<768),[ae,ie]=t.useState("today"),[le,re]=t.useState("today"),[de,pe]=t.useState(!1),[se,ce]=t.useState(!1),[ue,fe]=t.useState("all"),[me,xe]=t.useState("asc"),[ge,he]=t.useState(""),[ye,Ee]=t.useState(!1),[Fe,be]=t.useState(!1),[we,Se]=t.useState(!1),[ve,ke]=t.useState(null),[Ce,Ie]=t.useState(null),[De,ze]=t.useState(!1),[We,Me]=t.useState(null),[Te,Ae]=t.useState((()=>({x:Math.max(20,"undefined"!=typeof window?window.innerWidth-y-20:300),y:80}))),[Re,Ne]=t.useState({width:y,height:560}),[Pe,je]=t.useState(!1),[Be,Le]=t.useState({x:0,y:0}),[He,Ue]=t.useState(!1),[Oe,$e]=t.useState(null),[_e,Ye]=t.useState({x:0,y:0,width:0,height:0});t.useState(!1);const[Ve,qe]=t.useState(1),Xe=X.filter((e=>{if(!ge.trim())return!0;const t=ge.toLowerCase(),n=(e.patientName||"").toLowerCase(),o=String(e.patientId||"").toLowerCase();return n.includes(t)||o.includes(t)})),Ge=20*(Ve-1),Je=Ge+20,Ke=Xe.slice(Ge,Je),Qe=Math.ceil(Xe.length/20),Ze=Xe.length,[et,tt]=t.useState(Y()),[nt,ot]=t.useState(Y()),[at,it]=t.useState(),[lt,rt]=t.useState(),dt=e=>e?.id||e?._id||e?.appointmentId||e?.patientId||JSON.stringify(e),pt=e=>e?.image?e.image:null,st=e=>e?e.charAt(0).toUpperCase():"?",ct=e=>{if(!e)return"#4C4DDC";const t=["#4C4DDC","#1CC3CE","#FF6B6B","#4ECDC4","#45B7D1","#FFA07A","#98D8C8","#F7DC6F"];return t[e.charCodeAt(0)%t.length]},ut=()=>{const e="asc"===me?"desc":"asc";xe(e);const t=[...X].sort(((t,n)=>{const o=new Date(t.appointmentDate||t.date||0),a=new Date(n.appointmentDate||n.date||0);return"asc"===e?o-a:a-o}));G(t),qe(1),t.length>0&&K(t[0])},ft=t.useCallback((async e=>{if(!D)return;console.log(W,"fetchAppointments -> doctorIdFromLogin");const t=W,n=void 0!==e?e:ue;Z(!0),te(null);try{const e={apiBaseUrl:l,hospitalId:r,doctorId:t,token:D},o=await s(V,et,nt,n,e);if(401===o.status||403===o.status){try{"undefined"!=typeof localStorage&&(localStorage.removeItem(m),localStorage.removeItem(x),localStorage.removeItem(g))}catch(e){}return z(null),M(null),A(null),U((e=>e+1)),void te("Session expired. Re-authenticating...")}if(o.err)return void te(String(o.err||"Failed to fetch appointments"));const a=o.data||o.appointments||o||[];G(Array.isArray(a)?a:[]),Array.isArray(a)&&a.length>0?K(a[0]):K(null)}catch(e){console.error("Error fetching appointments:",e),te(e.message||"Failed to fetch appointments")}finally{Z(!1)}}),[V,et,nt,ue,l,r,W,D]),mt=e=>{K(e)},xt=async()=>{if(J&&D){ze(!0),Me(null);try{const e={apiBaseUrl:l,hospitalId:r,doctorId:W,doctorName:T||_,appToken:D};console.log(J,"selectedAppointment"),console.log(e,"callConfig");const t=await c(J,e);if(401===t.status||403===t.status)return Me("Session expired. Please try again."),void ze(!1);if(t.err||!t.data?.token)return Me(String(t.err||"Failed to initiate call")),void ze(!1);const o=n.joinCallUrl||p,a=t.data.token?String(o||"").replace(/\/?$/,"/")+t.data.token:"";console.log("joinCallUrl",a),ke(t.data.token),Ie(a||""),Ee(!0),be(!1),Se(!1),Ne({width:y,height:560}),Ae({x:Math.max(20,window.innerWidth-y-20),y:80})}catch(e){Me(e.message||"Failed to initiate call")}finally{Me(null),ze(!1)}}},gt=()=>{Ee(!1),be(!1),Se(!1),ke(null),Ie(null),Me(null),ft()},ht=()=>{we&&Se(!1),be(!Fe)},yt=()=>{Fe&&be(!1),Se(!we)},Et=e=>{if(0!==e.button)return;if(e.target.closest("button"))return;e.currentTarget.setPointerCapture&&e.currentTarget.setPointerCapture(e.pointerId),je(!0);const t=e.currentTarget.getBoundingClientRect();Le({x:e.clientX-t.left,y:e.clientY-t.top})},Ft=t.useCallback((e=>{if(!we)if(Pe){const t=e.clientX-Be.x,n=e.clientY-Be.y,o=window.innerWidth-Re.width,a=window.innerHeight-Re.height;Ae({x:Math.max(0,Math.min(t,o)),y:Math.max(0,Math.min(n,a))})}else if(He){const t=e.clientX-_e.x,n=e.clientY-_e.y;let o=_e.width,a=_e.height,i=_e.posX,l=_e.posY;const r=300,d=250,p=window.innerWidth-40,s=window.innerHeight-100;if("bottom-right"===Oe)o=Math.min(Math.max(_e.width+t,r),p),a=Math.min(Math.max(_e.height+n,d),s),i+o>window.innerWidth&&(o=window.innerWidth-i),l+a>window.innerHeight&&(a=window.innerHeight-l);else if("bottom-left"===Oe){o=Math.min(Math.max(_e.width-t,r),p),i=Math.max(0,_e.posX+t),0===i&&(o=_e.posX+_e.width),a=Math.min(Math.max(_e.height+n,d),s),l+a>window.innerHeight&&(a=window.innerHeight-l)}else if("top-right"===Oe){o=Math.min(Math.max(_e.width+t,r),p),i+o>window.innerWidth&&(o=window.innerWidth-i);a=Math.min(Math.max(_e.height-n,d),s),l=Math.max(0,_e.posY+n),0===l&&(a=_e.posY+_e.height)}else if("top-left"===Oe){o=Math.min(Math.max(_e.width-t,r),p),i=Math.max(0,_e.posX+t),0===i&&(o=_e.posX+_e.width);a=Math.min(Math.max(_e.height-n,d),s),l=Math.max(0,_e.posY+n),0===l&&(a=_e.posY+_e.height)}Ne({width:o,height:a}),Ae({x:i,y:l})}}),[Pe,He,Be,Oe,_e,Te,Re,we]),bt=()=>{je(!1),Ue(!1),$e(null)},wt=(e,t)=>{t.preventDefault(),t.stopPropagation(),t.currentTarget.setPointerCapture&&t.currentTarget.setPointerCapture(t.pointerId),Ue(!0),$e(e),Ye({x:t.clientX,y:t.clientY,width:Re.width,height:Re.height,posX:Te.x,posY:Te.y})};t.useEffect((()=>{if(!ye||we)return;const e=()=>{if(!(window.innerWidth<768)){const e=Fe?350:Re.width,t=Fe?60:Re.height,n=window.innerWidth-40,o=window.innerHeight-100,a=Math.min(e,n),i=Math.min(t,o);a===Re.width&&i===Re.height||Ne({width:a,height:i});const l=window.innerWidth-a-20,r=window.innerHeight-i-20;Ae((e=>({x:Math.min(e.x,l),y:Math.min(e.y,r)})))}};return window.addEventListener("resize",e),()=>window.removeEventListener("resize",e)}),[ye,Fe,we,Re]),t.useEffect((()=>{if(!(C&&I&&(!D||H>0)))return;let e=!1;return N(!0),j(null),(async(e,t,n,o)=>{const a=`${e.replace(/\/$/,"")}/um/user/V1/sso/login?hospitalId=${encodeURIComponent(t)}`,i={method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({idToken:n,email:o})};return console.log("[getTokenFromSso] request",{url:a,body:{idToken:n?n.slice(0,50)+"...":null,email:o}}),fetch(a,i).then((e=>(console.log("[getTokenFromSso] response status",e.status,e.statusText),e.ok?e.json().then((e=>(console.log("[getTokenFromSso] success",{hasData:!!e,dataKeys:e?Object.keys(e):[],hasAccessToken:!!e?.data?.access_token}),e))):e.json().then((t=>{const n=t?.resultInfo?.message||"SSO login failed";return console.log("[getTokenFromSso] error body",t),{err:n,status:e.status}})).catch((()=>({err:"Something went wrong!",status:e.status})))))).catch((e=>(console.error("[getTokenFromSso] catch",e),{err:e.message||"Network error"})))})(l,r,C,I).then((t=>{if(e)return;const n=function(e){return!e||e.err?null:e.data?.access_token??e.data?.token??e.token??e.accessToken??null}(t);if(400===t.status)return j(t.err||"Invalid request. Redirecting to home..."),N(!1),void L(!0);if(t.err||!n){j(String(t.err||"Failed to get token")),z(null),M(null),A(null);try{"undefined"!=typeof localStorage&&(localStorage.removeItem(m),localStorage.removeItem(x),localStorage.removeItem(g))}catch(e){}}else{const e=function(e){if(!e?.data)return null;const t=e.data.doctor_id??e.data.doctorId??null;return console.log(t,"extractDoctorIdFromLoginResponse -> id"),null!=t?String(t):null}(t);console.log(e,"extractDoctorIdFromLoginResponse -> doctorId");const o=function(e){if(!e?.data)return null;const t=e.data.name??e.data.doctor_name??e.data.userName??null;return null!=t?String(t):null}(t);z(n),M(e),A(o),j(null),L(!1);try{"undefined"!=typeof localStorage&&(localStorage.setItem(m,n),e&&localStorage.setItem(x,e),o&&localStorage.setItem(g,o))}catch(e){}}})).catch((()=>{})).finally((()=>{e||N(!1)})),()=>{e=!0}}),[l,r,C,I,H]),t.useEffect((()=>{qe(1)}),[V,ae,et,nt,ge,ue]),t.useEffect((()=>{!R&&D&&ft()}),[ft,D,R]),t.useEffect((()=>{const e=document.createElement("link");e.href="https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap",e.rel="stylesheet",document.head.appendChild(e);const t=document.createElement("style");t.innerHTML="\n      @keyframes spin {\n        0% { transform: rotate(0deg); }\n        100% { transform: rotate(360deg); }\n      }\n      \n      @media (max-width: 768px) {\n        .appointments-grid {\n          grid-template-columns: 1.5fr 1fr 0.8fr !important;\n        }\n        .appointments-header-grid {\n          grid-template-columns: 1.5fr 1fr 0.8fr !important;\n        }\n        .hide-on-mobile {\n          display: none !important;\n        }\n      }\n      @media (max-width: 480px) {\n        .appointments-header-grid {\n          font-size: 10px !important;\n        }\n        .appointments-grid {\n          font-size: 11px !important;\n        }\n      }\n    ",document.head.appendChild(t);const n=()=>{oe(window.innerWidth<768)};return window.addEventListener("resize",n),()=>{document.head.removeChild(e),document.head.removeChild(t),window.removeEventListener("resize",n)}}),[]),t.useEffect((()=>{const e=e=>{!de||e.target.closest("button")||e.target.closest('input[type="date"]')||pe(!1),se&&!e.target.closest("[data-appointment-type-picker]")&&ce(!1)};return document.addEventListener("click",e),()=>{document.removeEventListener("click",e)}}),[de,se]);let St='"Nunito", serif';const vt=P||!D&&(!C||!I),kt=P||"Sign in required. Redirecting to home...";let Ct;return Ct=R&&C&&I?a.default.createElement("div",{className:E,[F]:"teleconsult-appointments",style:{fontFamily:St,background:"#F5F5F7",boxSizing:"border-box",height:"100%",minHeight:"100vh",display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",padding:"24px"}},a.default.createElement("style",null,"@keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }"),a.default.createElement("div",{style:{width:"40px",height:"40px",border:"3px solid #f3f3f3",borderTop:"3px solid #4C4DDC",borderRadius:"50%",animation:"spin 1s linear infinite",marginBottom:"16px"}}),a.default.createElement("p",{style:{fontSize:"14px",color:"#666",margin:0}},"Checking authorisation...")):a.default.createElement(a.default.Fragment,null,a.default.createElement("div",{className:E,[F]:"teleconsult-appointments",style:{fontFamily:St,background:"#F5F5F7",boxSizing:"border-box",height:"100%",minHeight:"100vh",width:"100%",display:"flex",flexDirection:"column",overflow:"hidden"}},a.default.createElement("div",{style:{background:"#FFFFFF",padding:ne?"10px 12px":"12px 24px",display:"flex",justifyContent:"space-between",alignItems:"center",borderBottom:"1px solid #E5E5E5",flexWrap:"nowrap",gap:ne?"8px":"0"}},a.default.createElement("div",{style:{position:"relative",width:ne?"calc(100% - 90px)":"480px",maxWidth:ne?"none":"480px"}},a.default.createElement("input",{type:"text",placeholder:"Search by patient name or ID",value:ge,onChange:e=>he(e.target.value),style:{width:"100%",padding:ne?"8px 32px 8px 10px":"8px 36px 8px 14px",border:"1px solid #E5E5E5",borderRadius:"6px",fontSize:ne?"12px":"13px",fontFamily:St,background:"#FFFFFF",outline:"none",boxSizing:"border-box"}}),ge&&a.default.createElement("button",{onClick:()=>he(""),style:{position:"absolute",right:"8px",top:"50%",transform:"translateY(-50%)",background:"none",border:"none",cursor:"pointer",padding:"4px",display:"flex",alignItems:"center",justifyContent:"center",color:"#999",fontSize:"16px"},title:"Clear search"},"✕")),!1),a.default.createElement("div",{style:{padding:ne?"12px":"16px 24px",flex:1,minHeight:0,overflow:"hidden",display:"flex",flexDirection:"column"}},a.default.createElement("div",{style:{marginBottom:ne?"10px":"14px"}},a.default.createElement("h1",{style:{fontSize:ne?"18px":"22px",fontWeight:700,color:"#1a1a1a",margin:"0 0 2px 0"}},"Tele Consultation"),a.default.createElement("p",{style:{fontSize:ne?"11px":"12px",color:"#999",margin:0}},"Displaying All Tele Consultation Appointments")),a.default.createElement("div",{style:{display:"flex",justifyContent:"space-between",alignItems:ne?"flex-start":"center",marginBottom:ne?"10px":"14px",flexDirection:ne?"column":"row",gap:ne?"12px":"0"}},a.default.createElement("div",{style:{display:"flex",gap:"6px",flexWrap:"wrap",width:ne?"100%":"auto"}},a.default.createElement("button",{onClick:()=>q("upcoming"),style:{background:"upcoming"===V?"#4C4DDC":"#FFFFFF",padding:ne?"8px 10px":"9px 16px",border:"upcoming"===V?"none":"1px solid #E5E5E5",borderRadius:"6px",fontSize:ne?"10px":"13px",color:"upcoming"===V?"white":"#555555",fontWeight:600,fontFamily:St,cursor:"pointer",flex:ne?"1 1 auto":"none",minWidth:ne?"0":"auto",transition:"all 0.3s ease",whiteSpace:"nowrap"}},"Upcoming Appointments"),a.default.createElement("button",{onClick:()=>q("completed"),style:{background:"completed"===V?"#4C4DDC":"#FFFFFF",padding:ne?"8px 10px":"9px 16px",border:"completed"===V?"none":"1px solid #E5E5E5",borderRadius:"6px",fontSize:ne?"10px":"13px",color:"completed"===V?"white":"#555555",fontWeight:600,fontFamily:St,cursor:"pointer",flex:ne?"1 1 auto":"none",minWidth:ne?"0":"auto",transition:"all 0.3s ease",whiteSpace:"nowrap"}},"Completed Appointments"),a.default.createElement("button",{onClick:()=>q("cancelled"),style:{background:"cancelled"===V?"#4C4DDC":"#FFFFFF",padding:ne?"8px 10px":"9px 16px",border:"cancelled"===V?"none":"1px solid #E5E5E5",borderRadius:"6px",fontSize:ne?"10px":"13px",color:"cancelled"===V?"white":"#555555",fontWeight:600,fontFamily:St,cursor:"pointer",flex:ne?"1 1 auto":"none",minWidth:ne?"0":"auto",transition:"all 0.3s ease",whiteSpace:"nowrap"}},"Cancelled Appointments")),a.default.createElement("div",{style:{display:"flex",gap:"8px",alignItems:"center",width:"auto",position:"relative",justifyContent:ne?"flex-start":"flex-end",flexWrap:"wrap"}},a.default.createElement("div",{style:{position:"relative"},"data-appointment-type-picker":!0},a.default.createElement("button",{onClick:()=>ce(!se),style:{padding:"8px 12px",fontFamily:St,fontWeight:600,border:"1px solid #E5E5E5",borderRadius:"6px",fontSize:ne?"11px":"13px",color:"#1a1a1a",background:"#FFFFFF",display:"flex",alignItems:"center",gap:ne?"4px":"6px",cursor:"pointer",flex:"none",minWidth:ne?"100px":"auto",justifyContent:"center"}},a.default.createElement("svg",{width:ne?"14":"16",height:ne?"14":"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"},a.default.createElement("path",{d:"M4.8 2A2.8 2.8 0 0 0 2 4.8v14.4A2.8 2.8 0 0 0 4.8 22h14.4a2.8 2.8 0 0 0 2.8-2.8V4.8A2.8 2.8 0 0 0 19.2 2H4.8z"}),a.default.createElement("path",{d:"M8 12h8M8 16h5"})),a.default.createElement("span",{style:{overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",color:"#4C4DDC"}},"all"===ue?"All Appointment":"ONLINE"===ue?"Online":"Physical"),a.default.createElement("svg",{width:ne?"8":"10",height:ne?"8":"10",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"},a.default.createElement("polyline",{points:"6 9 12 15 18 9"}))),se&&a.default.createElement("div",{style:{position:"absolute",top:"100%",right:ne?"auto":0,left:ne?0:"auto",marginTop:"4px",background:"#FFFFFF",border:"1px solid #E5E5E5",borderRadius:"8px",boxShadow:"0 4px 16px rgba(0,0,0,0.15)",padding:"8px",zIndex:1e3,minWidth:ne?"240px":"200px",width:ne?"calc(100vw - 24px)":"auto",maxWidth:ne?"calc(100vw - 24px)":"240px"}},[{value:"all",label:"All Appointment"},{value:"ONLINE",label:"Online"},{value:"PHYSICAL",label:"Physical"}].map((e=>{let{value:t,label:n}=e;return a.default.createElement("button",{key:t,onClick:()=>{fe(t),ce(!1),ft(t)},style:{width:"100%",padding:"10px 12px",background:ue===t?"#E8EEF4":"#FFFFFF",border:"none",borderRadius:"4px",fontSize:"13px",fontFamily:St,cursor:"pointer",textAlign:"left",fontWeight:ue===t?600:400,color:ue===t?"#4C4DDC":"#1a1a1a",marginBottom:"4px",display:"flex",justifyContent:"space-between",alignItems:"center",transition:"all 0.2s ease"},onMouseEnter:e=>{ue!==t&&(e.target.style.background="#F5F5F5")},onMouseLeave:e=>{ue!==t&&(e.target.style.background="#FFFFFF")}},a.default.createElement("span",null,n),ue===t&&a.default.createElement("span",{style:{color:"#4C4DDC",fontSize:"16px"}},"✓"))})))),a.default.createElement("button",{onClick:()=>{de||(it(et),rt(nt),re(ae)),pe(!de)},style:{padding:"8px 12px",fontFamily:St,fontWeight:600,border:"1px solid #E5E5E5",borderRadius:"6px",fontSize:ne?"11px":"13px",color:"#1a1a1a",background:"#FFFFFF",display:"flex",alignItems:"center",gap:ne?"4px":"6px",cursor:"pointer",flex:"none",minWidth:ne?"100px":"auto",justifyContent:"center"}},a.default.createElement("svg",{width:ne?"12":"14",height:ne?"12":"14",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"},a.default.createElement("rect",{x:"3",y:"4",width:"18",height:"18",rx:"2",ry:"2"}),a.default.createElement("line",{x1:"16",y1:"2",x2:"16",y2:"6"}),a.default.createElement("line",{x1:"8",y1:"2",x2:"8",y2:"6"}),a.default.createElement("line",{x1:"3",y1:"10",x2:"21",y2:"10"})),a.default.createElement("span",{style:{overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"}},(()=>{switch(ae){case"today":default:return"Today";case"tomorrow":return"Tomorrow";case"currentWeek":return"Current Week";case"thisMonth":return"This Month";case"currentYear":return"Current Year";case"custom":return ne?"Custom":`${et} to ${nt}`}})()),a.default.createElement("svg",{width:ne?"8":"10",height:ne?"8":"10",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"},a.default.createElement("polyline",{points:"6 9 12 15 18 9"}))),de&&a.default.createElement("div",{style:{position:"absolute",top:"100%",right:ne?"auto":0,left:ne?0:"auto",marginTop:"4px",background:"#FFFFFF",border:"1px solid #E5E5E5",borderRadius:"8px",boxShadow:"0 4px 16px rgba(0,0,0,0.15)",padding:"8px",zIndex:1e3,minWidth:ne?"280px":"240px",width:ne?"calc(100vw - 24px)":"auto",maxWidth:ne?"calc(100vw - 24px)":"280px"}},a.default.createElement("div",{style:{marginBottom:"custom"===le?"12px":"0"}},["thisMonth","today","tomorrow","currentWeek","currentYear","custom"].map((e=>a.default.createElement("button",{key:e,onClick:()=>{if(re(e),"custom"!==e){const t=(e=>{const t=new Date;let n,o;switch(e){case"today":default:n=o=Y();break;case"tomorrow":const e=new Date(t);e.setDate(e.getDate()+1),n=o=e.toISOString().split("T")[0];break;case"currentWeek":const a=new Date(t),i=new Date(t),l=t.getDay(),r=0===l?-6:1-l;a.setDate(t.getDate()+r),i.setDate(a.getDate()+6),n=a.toISOString().split("T")[0],o=i.toISOString().split("T")[0];break;case"thisMonth":const d=new Date(t.getFullYear(),t.getMonth(),1),p=new Date(t.getFullYear(),t.getMonth()+1,0);n=d.toISOString().split("T")[0],o=p.toISOString().split("T")[0];break;case"currentYear":n=`${t.getFullYear()}-01-01`,o=`${t.getFullYear()}-12-31`}return{from:n,to:o}})(e);ie(e),tt(t.from),ot(t.to),it(t.from),rt(t.to),pe(!1)}else it(""),rt("")},style:{width:"100%",padding:"10px 12px",background:le===e?"#E8EEF4":"#FFFFFF",border:"none",borderRadius:"4px",fontSize:"13px",fontFamily:St,cursor:"pointer",textAlign:"left",fontWeight:le===e?600:400,color:le===e?"#4C4DDC":"#1a1a1a",marginBottom:"4px",display:"flex",justifyContent:"space-between",alignItems:"center",transition:"all 0.2s ease"},onMouseEnter:t=>{le!==e&&(t.target.style.background="#F5F5F5")},onMouseLeave:t=>{le!==e&&(t.target.style.background="#FFFFFF")}},a.default.createElement("span",null,{thisMonth:"This Month",today:"Today",tomorrow:"Tomorrow",currentWeek:"Current Week",currentYear:"Current Year",custom:"Custom"}[e]),le===e&&a.default.createElement("span",{style:{color:"#4C4DDC",fontSize:"16px"}},"✓"))))),"custom"===le&&a.default.createElement("div",{style:{paddingTop:"8px",borderTop:"1px solid #E5E5E5"}},a.default.createElement("div",{style:{marginBottom:"8px"}},a.default.createElement("input",{type:"date",value:at,onChange:e=>it(e.target.value),placeholder:"Start Date",style:{width:"100%",padding:"10px 8px",border:"1px solid #E5E5E5",borderRadius:"4px",fontSize:"13px",fontFamily:St,boxSizing:"border-box",cursor:"pointer"}})),a.default.createElement("div",{style:{marginBottom:"12px"}},a.default.createElement("input",{type:"date",value:lt,onChange:e=>rt(e.target.value),placeholder:"End Date",style:{width:"100%",padding:"10px 8px",border:"1px solid #E5E5E5",borderRadius:"4px",fontSize:"13px",fontFamily:St,boxSizing:"border-box",cursor:"pointer"}})),a.default.createElement("div",{style:{display:"flex",gap:"8px"}},a.default.createElement("button",{onClick:()=>{re(ae),it(et),rt(nt),pe(!1)},style:{flex:1,padding:"10px 12px",background:"#FFFFFF",color:"#4C4DDC",border:"1px solid #4C4DDC",borderRadius:"4px",fontSize:"13px",fontFamily:St,fontWeight:600,cursor:"pointer"}},"Cancel"),a.default.createElement("button",{onClick:()=>{at&&lt&&(ie("custom"),tt(at),ot(lt),pe(!1))},style:{flex:1,padding:"10px 12px",background:"#4C4DDC",color:"#FFFFFF",border:"none",borderRadius:"4px",fontSize:"13px",fontFamily:St,fontWeight:600,cursor:"pointer"}},"Submit")))))),a.default.createElement("div",{style:{display:"flex",flexDirection:ne?"column":"row",gap:ne?"12px":"14px",flex:1,minHeight:0,overflow:ne?"auto":"hidden"}},a.default.createElement("div",{style:{flex:ne?"none":"1 1 65%",width:ne?"100%":"auto",display:"flex",flexDirection:"column",minHeight:ne?"400px":0}},a.default.createElement("div",{style:{background:"#FFFFFF",borderRadius:"8px",boxShadow:"0 1px 4px rgba(0,0,0,0.08)",overflow:"hidden",display:"flex",flexDirection:"column",flex:ne?"none":1,minHeight:ne?"auto":0}},a.default.createElement("div",{style:{display:"flex",justifyContent:"space-between",alignItems:"center",padding:ne?"12px 14px":"14px 18px",borderBottom:"1px solid #F1F1F1"}},a.default.createElement("div",{style:{display:"flex",alignItems:"center",gap:ne?"6px":"8px"}},a.default.createElement("span",{style:{fontSize:ne?"14px":"15px",fontWeight:700,color:"#1a1a1a"}},"Appointments"),a.default.createElement("span",{style:{background:"#4C4DDC",color:"#fff",fontSize:ne?"10px":"11px",fontWeight:600,padding:ne?"2px 7px":"3px 8px",borderRadius:"12px"}},Ze))),a.default.createElement("div",{className:"appointments-header-grid",style:{display:"grid",gridTemplateColumns:ne?"1.5fr 1fr 0.8fr":"2.5fr 1fr 1.5fr 0.8fr 1.2fr",gap:ne?"8px":"12px",padding:ne?"8px 12px":"10px 18px",background:"#F5F5F5",fontSize:ne?"10px":"12px",fontWeight:600,color:"#666"}},a.default.createElement("div",null,"Patients name"),!ne&&a.default.createElement("div",null,"Patient ID"),a.default.createElement("div",{onClick:ut,style:{display:"flex",alignItems:"center",gap:"3px",cursor:"pointer",userSelect:"none"}},"Date",a.default.createElement("span",{style:{opacity:.7,fontSize:"10px"}},"asc"===me?"▲":"▼")),!ne&&a.default.createElement("div",null,"Slot"),!ne&&a.default.createElement("div",null,"Doctor")),a.default.createElement("div",{style:{overflow:"auto",flex:1}},R?a.default.createElement("div",{style:{display:"flex",justifyContent:"center",alignItems:"center",padding:"40px",color:"#888"}},a.default.createElement("div",{style:{textAlign:"center"}},a.default.createElement("div",{style:{width:"40px",height:"40px",border:"3px solid #f3f3f3",borderTop:"3px solid #4C4DDC",borderRadius:"50%",animation:"spin 1s linear infinite",margin:"0 auto 10px"}}),"Getting token...")):Q?a.default.createElement("div",{style:{display:"flex",justifyContent:"center",alignItems:"center",padding:"40px",color:"#888"}},a.default.createElement("div",{style:{textAlign:"center"}},a.default.createElement("div",{style:{width:"40px",height:"40px",border:"3px solid #f3f3f3",borderTop:"3px solid #4C4DDC",borderRadius:"50%",animation:"spin 1s linear infinite",margin:"0 auto 10px"}}),"Loading appointments...")):ee?a.default.createElement("div",{style:{padding:"40px",textAlign:"center",color:"#FF0000"}},a.default.createElement("div",{style:{fontSize:"16px",marginBottom:"8px"}},"⚠️ Error"),a.default.createElement("div",{style:{fontSize:"13px"}},ee),a.default.createElement("button",{onClick:ft,style:{marginTop:"16px",padding:"8px 16px",background:"#4C4DDC",color:"white",border:"none",borderRadius:"6px",cursor:"pointer",fontFamily:St}},"Retry")):0===Ke.length?a.default.createElement("div",{style:{padding:"40px",textAlign:"center",color:"#888"}},a.default.createElement("div",{style:{fontSize:"16px",marginBottom:"8px"}},"📋"),a.default.createElement("div",{style:{fontSize:"13px"}},ge?`No appointments found for "${ge}"`:"No appointments found"),ge&&a.default.createElement("button",{onClick:()=>he(""),style:{marginTop:"12px",padding:"6px 12px",background:"#4C4DDC",color:"white",border:"none",borderRadius:"4px",cursor:"pointer",fontSize:"12px",fontFamily:St}},"Clear Search")):Ke.map((e=>a.default.createElement("div",{key:dt(e),role:"button",tabIndex:0,onClick:()=>mt(e),onKeyDown:t=>"Enter"===t.key&&mt(e),className:"appointments-grid",style:{display:"grid",gridTemplateColumns:ne?"1.5fr 1fr 0.8fr":"2.5fr 1fr 1.5fr 0.8fr 1.2fr",gap:ne?"8px":"12px",padding:ne?"10px 12px":"12px 18px",background:dt(J)===dt(e)?"#E8EEF4":"#FFFFFF",borderTop:"1px solid #F1F1F1",alignItems:"center",cursor:"pointer",fontSize:ne?"11px":"13px"}},a.default.createElement("div",{style:{display:"flex",alignItems:"center",gap:ne?"8px":"10px"}},pt(e)?a.default.createElement("img",{src:e.image,alt:"",style:{width:ne?"32px":"36px",height:ne?"32px":"36px",borderRadius:"50%",objectFit:"cover"}}):a.default.createElement("div",{style:{width:ne?"32px":"36px",height:ne?"32px":"36px",borderRadius:"50%",background:ct(e.patientName),display:"flex",alignItems:"center",justifyContent:"center",color:"#FFFFFF",fontWeight:600,fontSize:ne?"14px":"16px"}},st(e.patientName)),a.default.createElement("div",null,a.default.createElement("div",{style:{fontWeight:600,color:"#1a1a1a",fontSize:ne?"11px":"13px"}},e.patientName),a.default.createElement("div",{style:{fontSize:ne?"9px":"11px",color:"#888"}},e.email))),!ne&&a.default.createElement("div",{style:{color:"#555",fontSize:"12px"}},e.patientId),a.default.createElement("div",{style:{color:"#555",fontSize:ne?"10px":"12px"}},(()=>{const t=e.appointmentDate||"",n=t.match(/\s(\d{1,2}:\d{2}(?:\s*(?:AM|PM))?)$/i);return n?a.default.createElement(a.default.Fragment,null,a.default.createElement("div",null,t.slice(0,n.index).trim()),a.default.createElement("div",{style:{fontSize:ne?"9px":"11px",color:"#888"}},n[1].trim())):a.default.createElement("div",null,t)})()),!ne&&a.default.createElement("div",{style:{color:"#555",fontSize:"12px"}},e.appointmentTime||"-"),!ne&&a.default.createElement("div",{style:{color:"#555",fontSize:"12px"}},e.doctorName||e.doctor||"-"))))),!Q&&!ee&&Ke.length>0&&a.default.createElement("div",{style:{padding:ne?"12px 14px":"14px 18px",borderTop:"1px solid #F1F1F1",display:"flex",justifyContent:"space-between",alignItems:"center",background:"#FFFFFF",flexWrap:ne?"wrap":"nowrap",gap:ne?"10px":"0"}},a.default.createElement("div",{style:{fontSize:ne?"11px":"12px",color:"#666"}},"Showing page ",Ve," of ",Qe," (",Ze," total)"),a.default.createElement("div",{style:{display:"flex",gap:"6px",alignItems:"center"}},a.default.createElement("button",{onClick:()=>qe((e=>Math.max(1,e-1))),disabled:1===Ve,style:{padding:ne?"6px 10px":"6px 12px",border:"1px solid #E5E5E5",borderRadius:"4px",background:1===Ve?"#F5F5F5":"#FFFFFF",color:1===Ve?"#999":"#1a1a1a",fontSize:ne?"11px":"12px",fontFamily:St,fontWeight:600,cursor:1===Ve?"not-allowed":"pointer",opacity:1===Ve?.5:1}},"Previous"),a.default.createElement("div",{style:{display:"flex",gap:"4px"}},[...Array(Math.min(5,Qe))].map(((e,t)=>{let n;return n=Qe<=5||Ve<=3?t+1:Ve>=Qe-2?Qe-4+t:Ve-2+t,a.default.createElement("button",{key:n,onClick:()=>qe(n),style:{padding:ne?"6px 10px":"6px 12px",border:Ve===n?"none":"1px solid #E5E5E5",borderRadius:"4px",background:Ve===n?"#4C4DDC":"#FFFFFF",color:Ve===n?"#FFFFFF":"#1a1a1a",fontSize:ne?"11px":"12px",fontFamily:St,fontWeight:600,cursor:"pointer",minWidth:ne?"32px":"36px"}},n)}))),a.default.createElement("button",{onClick:()=>qe((e=>Math.min(Qe,e+1))),disabled:Ve===Qe,style:{padding:ne?"6px 10px":"6px 12px",border:"1px solid #E5E5E5",borderRadius:"4px",background:Ve===Qe?"#F5F5F5":"#FFFFFF",color:Ve===Qe?"#999":"#1a1a1a",fontSize:ne?"11px":"12px",fontFamily:St,fontWeight:600,cursor:Ve===Qe?"not-allowed":"pointer",opacity:Ve===Qe?.5:1}},"Next"))))),a.default.createElement("div",{style:{flex:ne?"none":"1 1 35%",width:ne?"100%":"auto",display:J||!ne?"flex":"none",flexDirection:"column",minHeight:ne?"auto":0}},a.default.createElement("div",{style:{border:"1px solid #E5E5E5",borderRadius:"8px",overflow:"hidden",background:"#FFFFFF",boxShadow:"0 1px 4px rgba(0,0,0,0.08)",display:"flex",flexDirection:"column",flex:ne?"none":1,minHeight:ne?"auto":0}},J?a.default.createElement(a.default.Fragment,null,a.default.createElement("div",{style:{display:"flex",justifyContent:"space-between",alignItems:"center",padding:ne?"12px 14px":"16px 18px",background:"#E8EEF4",borderBottom:"1px solid #E5E5E5"}},a.default.createElement("div",null,a.default.createElement("div",{style:{color:"#002668",fontSize:ne?"14px":"16px",fontWeight:"700"}},J.patientName||"N/A"),a.default.createElement("div",{style:{color:"#002668",fontSize:ne?"11px":"13px"}},J.patientId||J.mrn||"N/A")),a.default.createElement("div",null,pt(J)?a.default.createElement("img",{style:{width:ne?"36px":"44px",height:ne?"36px":"44px",borderRadius:"50%",objectFit:"cover"},src:J.image,alt:J.patientName}):a.default.createElement("div",{style:{width:ne?"36px":"44px",height:ne?"36px":"44px",borderRadius:"50%",background:ct(J.patientName),display:"flex",alignItems:"center",justifyContent:"center",color:"#FFFFFF",fontWeight:700,fontSize:ne?"16px":"20px"}},st(J.patientName)))),a.default.createElement("div",{style:{padding:ne?"12px 14px":"14px 18px",gap:ne?"10px":"12px",display:"flex",flexDirection:"column",background:"white",overflow:"auto",flex:1,position:"relative"}},a.default.createElement("div",{style:{display:"flex",justifyContent:"space-between"}},a.default.createElement("div",{style:{textAlign:"left"}},a.default.createElement("div",{style:{fontSize:ne?"10px":"11px",color:"#888",marginBottom:"3px"}},"Speciality"),a.default.createElement("div",{style:{fontWeight:"700",fontSize:ne?"12px":"13px"}},J?.specialisation||J?.speciality||"N/A")),a.default.createElement("div",{style:{textAlign:"right"}},a.default.createElement("div",{style:{fontSize:ne?"10px":"11px",color:"#888",marginBottom:"3px"}},"Appointment Type"),a.default.createElement("div",{style:{fontWeight:"700",fontSize:ne?"12px":"13px"}},J?.type||J?.appointmentType||"Online"))),a.default.createElement("div",{style:{display:"flex",justifyContent:"space-between"}},a.default.createElement("div",{style:{textAlign:"left"}},a.default.createElement("div",{style:{fontSize:ne?"10px":"11px",color:"#888",marginBottom:"3px"}},"Appointment Date"),a.default.createElement("div",{style:{fontWeight:"700",fontSize:ne?"12px":"13px"}},J?.date||J?.appointmentDate||"N/A")),a.default.createElement("div",{style:{textAlign:"right"}},a.default.createElement("div",{style:{fontSize:ne?"10px":"11px",color:"#888",marginBottom:"3px"}},"Appointment Time"),a.default.createElement("div",{style:{fontWeight:"700",fontSize:ne?"12px":"13px"}},J?.time||J?.appointmentTime||"N/A"))),a.default.createElement("div",{style:{display:"flex",justifyContent:"space-between"}},a.default.createElement("div",{style:{textAlign:"left"}},a.default.createElement("div",{style:{fontSize:ne?"10px":"11px",color:"#888",marginBottom:"3px"}},"Doctor"),a.default.createElement("div",{style:{fontWeight:"700",fontSize:ne?"12px":"13px"}},J?.doctor||J?.doctorName||"N/A"))),a.default.createElement("div",{style:{display:"flex",justifyContent:"space-between"}},a.default.createElement("div",{style:{textAlign:"left"}},a.default.createElement("div",{style:{fontSize:ne?"10px":"11px",color:"#888",marginBottom:"3px"}},"Hospital"),a.default.createElement("div",{style:{fontWeight:"700",fontSize:ne?"12px":"13px"}},J?.hospital||J?.hospitalName||"N/A"))),a.default.createElement("div",{style:{display:"flex",justifyContent:"space-between"}},a.default.createElement("div",{style:{textAlign:"left"}},a.default.createElement("div",{style:{fontSize:ne?"10px":"11px",color:"#888",marginBottom:"3px"}},"Reason for Appointment"),a.default.createElement("div",{style:{fontWeight:"600",fontSize:ne?"11px":"12px",lineHeight:"1.4"}},J?.reason||J?.reasonForAppointment||"No reason provided"))),"upcoming"===V&&a.default.createElement("div",{style:{display:"flex",flexDirection:ne?"column":"row",gap:"6px",marginTop:"10px"}},a.default.createElement("button",{type:"button",onClick:xt,disabled:De,style:{flex:1,background:De?"#99e4e8":"#1CC3CE",color:"#FFFFFF",border:"1px solid #1CC3CE",borderRadius:"6px",padding:ne?"10px 8px":"8px 6px",fontFamily:St,fontWeight:600,fontSize:ne?"11px":"12px",cursor:De?"not-allowed":"pointer"}},De?"Connecting...":"Join Call >")),"upcoming"===V&&We&&a.default.createElement("div",{style:{fontSize:"11px",color:"#e53935",marginTop:"6px",textAlign:"center",width:"100%"}},"⚠️ ",We))):a.default.createElement("div",{style:{display:"flex",justifyContent:"center",alignItems:"center",height:"100%",padding:"40px",color:"#888",textAlign:"center"}},a.default.createElement("div",null,a.default.createElement("div",{style:{fontSize:"16px",marginBottom:"8px"}},"📋"),a.default.createElement("div",{style:{fontSize:"13px"}},"Select an appointment to view details"))))))),ye&&a.default.createElement("div",{style:{position:"fixed",left:we?"0":ne?"10px":`${Te.x}px`,top:we?"0":ne?"70px":`${Te.y}px`,right:we?"0":ne?"10px":"auto",bottom:we?"0":"auto",width:we?"100vw":ne?"calc(100vw - 20px)":Fe?"350px":`${Re.width}px`,height:we?"100vh":Fe?"auto":ne?"300px":`${Re.height}px`,background:"#FFFFFF",borderRadius:we?"0":"8px",boxShadow:"0 8px 24px rgba(0, 0, 0, 0.3)",zIndex:1e4,overflow:"hidden",display:"flex",flexDirection:"column",transition:Pe||He?"none":"all 0.3s ease"}},a.default.createElement("div",{onPointerDown:ne||we?void 0:Et,onPointerMove:ne||we?void 0:Ft,onPointerUp:ne||we?void 0:bt,onPointerCancel:ne||we?void 0:bt,style:{background:"linear-gradient(135deg, #4C4DDC 0%, #3A3BBD 100%)",color:"#FFFFFF",padding:ne?"8px 10px":"10px 12px",display:"flex",justifyContent:"space-between",alignItems:"center",cursor:ne||we?"default":"move",userSelect:"none"}},a.default.createElement("div",{style:{display:"flex",alignItems:"center",gap:ne?"6px":"8px",flex:1,minWidth:0}},a.default.createElement("div",{style:{width:ne?"6px":"8px",height:ne?"6px":"8px",borderRadius:"50%",background:"#FF4444",animation:"pulse 2s infinite",flexShrink:0}}),a.default.createElement("span",{style:{fontSize:ne?"11px":"13px",fontWeight:600,fontFamily:St,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"}},"Video Call - ",J?.patientName||"Patient")),a.default.createElement("div",{style:{display:"flex",gap:ne?"4px":"6px",alignItems:"center",flexShrink:0}},!we&&a.default.createElement("button",{onClick:ht,style:{background:"rgba(255, 255, 255, 0.2)",border:"1px solid rgba(255, 255, 255, 0.3)",borderRadius:"6px",color:"#FFFFFF",cursor:"pointer",padding:ne?"5px 8px":"6px 10px",lineHeight:1,display:"flex",alignItems:"center",justifyContent:"center",minWidth:ne?"28px":"32px",height:ne?"28px":"32px",transition:"background 0.2s ease"},onMouseEnter:e=>e.target.style.background="rgba(255, 255, 255, 0.3)",onMouseLeave:e=>e.target.style.background="rgba(255, 255, 255, 0.2)",title:Fe?"Restore":"Minimize"},Fe?a.default.createElement("svg",{width:ne?"14":"16",height:ne?"14":"16",viewBox:"0 0 16 16",fill:"none"},a.default.createElement("rect",{x:"3",y:"3",width:"10",height:"10",stroke:"white",strokeWidth:"1.8",fill:"none"})):a.default.createElement("svg",{width:ne?"14":"16",height:ne?"14":"16",viewBox:"0 0 16 16",fill:"none"},a.default.createElement("line",{x1:"3",y1:"8",x2:"13",y2:"8",stroke:"white",strokeWidth:"1.8",strokeLinecap:"round"}))),a.default.createElement("button",{onClick:yt,style:{background:"rgba(255, 255, 255, 0.2)",border:"1px solid rgba(255, 255, 255, 0.3)",borderRadius:"6px",color:"#FFFFFF",cursor:"pointer",padding:ne?"5px 8px":"6px 10px",lineHeight:1,display:"flex",alignItems:"center",justifyContent:"center",minWidth:ne?"28px":"32px",height:ne?"28px":"32px",transition:"background 0.2s ease"},onMouseEnter:e=>e.target.style.background="rgba(255, 255, 255, 0.3)",onMouseLeave:e=>e.target.style.background="rgba(255, 255, 255, 0.2)",title:we?"Exit Fullscreen":"Fullscreen"},we?a.default.createElement("svg",{width:ne?"14":"16",height:ne?"14":"16",viewBox:"0 0 16 16",fill:"none"},a.default.createElement("path",{d:"M10 3H13V6M6 13H3V10M13 10V13H10M3 6V3H6",stroke:"white",strokeWidth:"1.8",strokeLinecap:"round",strokeLinejoin:"round"})):a.default.createElement("svg",{width:ne?"14":"16",height:ne?"14":"16",viewBox:"0 0 16 16",fill:"none"},a.default.createElement("path",{d:"M3 6V3H6M13 10V13H10M10 3H13V6M6 13H3V10",stroke:"white",strokeWidth:"1.8",strokeLinecap:"round",strokeLinejoin:"round"}))),a.default.createElement("button",{onClick:gt,style:{background:"rgba(255, 255, 255, 0.2)",border:"1px solid rgba(255, 255, 255, 0.3)",borderRadius:"6px",color:"#FFFFFF",cursor:"pointer",padding:ne?"5px 8px":"6px 10px",lineHeight:1,display:"flex",alignItems:"center",justifyContent:"center",minWidth:ne?"28px":"32px",height:ne?"28px":"32px",fontWeight:"bold",fontSize:ne?"18px":"22px",transition:"background 0.2s ease"},onMouseEnter:e=>e.target.style.background="rgba(255, 255, 255, 0.3)",onMouseLeave:e=>e.target.style.background="rgba(255, 255, 255, 0.2)",title:"Close"},"×"))),!Fe&&a.default.createElement("div",{style:{flex:1,background:"#000000",position:"relative"}},a.default.createElement("iframe",{src:(()=>{if(!ve)return"";const e=String(O||"").replace(/\/?$/,"/");return console.log("${base}token=${callToken}",`${e}token=${ve}`),`${e}token=${ve}`})(),style:{width:"100%",height:"100%",border:"none"},allow:"camera; microphone; display-capture; autoplay",allowFullScreen:!0,title:"Video Call"})),!ne&&!we&&!Fe&&a.default.createElement(a.default.Fragment,null,a.default.createElement("div",{onPointerDown:e=>wt("top-left",e),onPointerMove:Ft,onPointerUp:bt,onPointerCancel:bt,style:{position:"absolute",left:0,top:0,width:"16px",height:"16px",cursor:"nwse-resize",background:"transparent",zIndex:10001}}),a.default.createElement("div",{onPointerDown:e=>wt("top-right",e),onPointerMove:Ft,onPointerUp:bt,onPointerCancel:bt,style:{position:"absolute",right:0,top:0,width:"16px",height:"16px",cursor:"nesw-resize",background:"transparent",zIndex:10001}}),a.default.createElement("div",{onPointerDown:e=>wt("bottom-left",e),onPointerMove:Ft,onPointerUp:bt,onPointerCancel:bt,style:{position:"absolute",left:0,bottom:0,width:"16px",height:"16px",cursor:"nesw-resize",background:"transparent",zIndex:10001}}),a.default.createElement("div",{onPointerDown:e=>wt("bottom-right",e),onPointerMove:Ft,onPointerUp:bt,onPointerCancel:bt,style:{position:"absolute",right:0,bottom:0,width:"16px",height:"16px",cursor:"nwse-resize",background:"transparent",zIndex:10001}})),a.default.createElement("style",null,"\n            @keyframes pulse {\n              0%, 100% { opacity: 1; }\n              50% { opacity: 0.5; }\n            }\n          "))),vt&&a.default.createElement("div",{style:{position:"fixed",inset:0,zIndex:1e5,display:"flex",alignItems:"center",justifyContent:"center",padding:"24px",background:"rgba(0,0,0,0.4)",boxSizing:"border-box"}},a.default.createElement("div",{style:{fontFamily:St,maxWidth:"400px",width:"100%",padding:"32px 24px",background:"#FFFFFF",borderRadius:"12px",boxShadow:"0 8px 32px rgba(0,0,0,0.2)",textAlign:"center"}},a.default.createElement("div",{style:{fontSize:"48px",marginBottom:"16px"}},"🔒"),a.default.createElement("h2",{style:{fontSize:"20px",fontWeight:700,color:"#1a1a1a",margin:"0 0 8px 0"}},P?"Not authorised":"Sign in required"),a.default.createElement("p",{style:{fontSize:"14px",color:"#666",margin:0,lineHeight:1.5}},kt),a.default.createElement("p",{style:{fontSize:"13px",color:"#999",marginTop:"16px",marginBottom:0}},"Redirecting to login...")))),a.default.createElement(b,null,Ct)};let S=null;const v={showWidget:(e,t)=>{S||(S=document.createElement("div"),document.body.appendChild(S));const n=()=>a.default.createElement(a.default.Fragment,null,a.default.createElement(w,{config:e}));i.default.render(a.default.createElement(n,null),S)},closePopup:()=>{S&&(i.default.unmountComponentAtNode(S),S=null)}};window.BookingSDK=v,e.AppointmentPage=w,e.PIH_APPOINTMENT_WIDGET_CLASS=E,e.default=v,Object.defineProperty(e,"__esModule",{value:!0})}));
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("react-dom")):"function"==typeof define&&define.amd?define(["exports","react","react-dom"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).MyPackage={},e.React,e.ReactDOM)}(this,(function(e,t,n){"use strict";function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=o(t),i=o(n);const r="/appointment/V1/consultant/all-appointments",l="/notification/V1/consultation/online/initiate",d="https://wbafedevittisalwe01-had2b3e0a7h6fyey.westeurope-01.azurewebsites.net/call/",s=async function(e,t,n){let o=arguments.length>3&&void 0!==arguments[3]?arguments[3]:{},a=(e||"").toUpperCase();"INPROGRESS"===a&&(a="IN_PROGRESS");const i=o.apiBaseUrl,l=o.hospitalId,d=o.doctorId,s=o.token||"",p={hospitalId:l,doctorId:d,fromDate:t,toDate:n,statuses:a,appointmentType:"ONLINE"},c=`${i}${r}`,u=await async function(e){let t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},n=arguments.length>3&&void 0!==arguments[3]?arguments[3]:"";const o=new URL(e);return o.search=new URLSearchParams(t).toString(),fetch(o,{method:"GET",headers:{"Content-Type":"application/json",Authorization:`${n}`}}).then((async e=>{const t=await e.json().catch((()=>({})));return e.ok?t:{err:t?.resultInfo?.message||"Something went wrong!",status:e.status}})).catch((e=>(console.error("Fetch error:",e),{err:e?.message||String(e)||"Network error"})))}(c,p,"PIH-Appointment-Widget",s);return u},p=async function(e){let t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};console.log("initiateConsultation -> config",t);const n=`${t.apiBaseUrl.replace(/\/$/,"")}${l}`,o=t.appToken||"";return async function(e){let t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},n=arguments.length>3&&void 0!==arguments[3]?arguments[3]:{},o=arguments.length>4?arguments[4]:void 0;const a=new URL(e);Object.keys(n).forEach((e=>{a.searchParams.append(e,n[e])}));const i={"Content-Type":"application/json"};o&&(i.Authorization=o);const r={method:"POST",headers:i,body:JSON.stringify(t)};return fetch(a.toString(),r).then((async e=>{const t=await e.json().catch((()=>({})));return e.ok?t:{err:t?.resultInfo?.message||"Something went wrong!",status:e.status}})).catch((e=>(console.error("Fetch error:",e),{err:e.message||"Network error"})))}(n,{patientId:String(e.patientId||""),primaryPatientId:String(e.primaryPatientId||e.patientId||""),hospitalId:t.hospitalId,doctorId:String(t.doctorId),patientName:e.patientName||e.name||"",doctorName:e.doctorName||t.doctorName,appointmentId:String(e.id||e.appointmentId||e._id||"")},"PIH-Appointment-Widget",{},o)};const c="pih_appointment_idToken",u="pih_appointment_email",m="pih_appointment_appToken",f="pih_appointment_doctorId",x="pih_appointment_userName",g="pih_appointment_apiBaseUrl",h="pih_appointment_hospitalId",y=720,E="pih-appointment-widget",F="data-pih-widget";class w extends t.Component{state={hasError:!1};static getDerivedStateFromError(){return{hasError:!0}}componentDidCatch(e,t){"undefined"!=typeof console&&console.error&&console.error("Appointment widget error:",e,t)}render(){return this.state.hasError?a.default.createElement("div",{className:E,[F]:"teleconsult-appointments",style:{fontFamily:'"Nunito", serif',background:"#F5F5F7",boxSizing:"border-box",minHeight:"100vh",display:"flex",alignItems:"center",justifyContent:"center",padding:"24px",textAlign:"center"}},a.default.createElement("div",{style:{maxWidth:"400px"}},a.default.createElement("div",{style:{fontSize:"48px",marginBottom:"16px"}},"⚠️"),a.default.createElement("h2",{style:{fontSize:"20px",fontWeight:700,color:"#1a1a1a",margin:"0 0 8px 0"}},"Something went wrong"),a.default.createElement("p",{style:{fontSize:"14px",color:"#666",margin:0,lineHeight:1.5}},"Please refresh the page or try again later."))):this.props.children}}const b=e=>{let{config:n={}}=e;const[o,i]=t.useState((()=>{try{return"undefined"!=typeof localStorage?localStorage.getItem(g):null}catch{return null}})),[r,l]=t.useState((()=>{try{return"undefined"!=typeof localStorage?localStorage.getItem(h):null}catch{return null}})),b=n.apiBaseUrl||o||"https://afiyaapiqa.powermindinc.com",S=n.hospitalId||r,[v,k]=t.useState((()=>{try{return"undefined"!=typeof localStorage?localStorage.getItem(c):null}catch{return null}})),[C,I]=t.useState((()=>{try{return"undefined"!=typeof localStorage?localStorage.getItem(u):null}catch{return null}})),D=n.idToken||n.token||v,z=n.email||C;t.useEffect((()=>{try{if("undefined"==typeof localStorage)return;const e=n.idToken||n.token;if(e&&String(e).trim()){localStorage.getItem(c)!==e&&(T(null),A(null),N(null),localStorage.removeItem(m),localStorage.removeItem(f),localStorage.removeItem(x)),localStorage.setItem(c,e),k(e)}n.email&&String(n.email).trim()&&(localStorage.setItem(u,n.email),I(n.email)),n.apiBaseUrl&&String(n.apiBaseUrl).trim()&&(localStorage.setItem(g,n.apiBaseUrl.trim()),i(n.apiBaseUrl.trim())),null!=n.hospitalId&&String(n.hospitalId).trim()&&(localStorage.setItem(h,String(n.hospitalId).trim()),l(String(n.hospitalId).trim()))}catch(e){}}),[n.idToken,n.token,n.email,n.apiBaseUrl,n.hospitalId]);const[W,T]=t.useState((()=>{try{return"undefined"!=typeof localStorage?localStorage.getItem(m):null}catch{return null}})),[M,A]=t.useState((()=>{try{return"undefined"!=typeof localStorage?localStorage.getItem(f):null}catch{return null}})),[R,N]=t.useState((()=>{try{return"undefined"!=typeof localStorage?localStorage.getItem(x):null}catch{return null}})),[P,j]=t.useState((()=>{try{if("undefined"==typeof localStorage)return!1;const e=localStorage.getItem(m),t=localStorage.getItem(c),n=localStorage.getItem(u);return!e&&!(!t||!n)}catch{return!1}})),[B,H]=t.useState(null),[L,U]=t.useState(!1),[$,_]=t.useState(0);t.useEffect((()=>{W&&P&&j(!1)}),[W,P]),t.useEffect((()=>{W||(D&&z?(U(!1),H((e=>"Sign in required. Redirecting to home..."===e?null:e))):(H("Sign in required. Redirecting to home..."),U(!0)))}),[W,D,z]),t.useEffect((()=>{if(!L)return;const e=n.homeUrl||"https://wbaemrdevittisalwe01-fnapdpfme7bvduhh.westeurope-01.azurewebsites.net/";if(!e||"undefined"==typeof window)return;const t=setTimeout((()=>{window.location.href=e}),2500);return()=>clearTimeout(t)}),[L,n.homeUrl]),t.useEffect((()=>{if(!P)return;const e=setTimeout((()=>{H("Request timed out. Please try again."),j(!1)}),3e4);return()=>clearTimeout(e)}),[P]);const O=n.joinCallUrl||d;W&&String(O||"").replace(/\/?$/,"/");const Y=function(e){if(!e||"string"!=typeof e)return{};try{const t=e.split(".");if(3!==t.length)return{};const n=t[1].replace(/-/g,"+").replace(/_/g,"/"),o=n.padEnd(n.length+(4-n.length%4)%4,"=");return JSON.parse(atob(o))}catch{return{}}}(D),V=R||Y.name||Y.sub||"User",q=()=>(new Date).toISOString().split("T")[0],[X,G]=t.useState("upcoming"),[J,K]=t.useState([]),[Q,Z]=t.useState(null),[ee,te]=t.useState(!1),[ne,oe]=t.useState(null),[ae,ie]=t.useState(window.innerWidth<768),[re,le]=t.useState("today"),[de,se]=t.useState("today"),[pe,ce]=t.useState(!1),[ue,me]=t.useState(!1),[fe,xe]=t.useState("all"),[ge,he]=t.useState("asc"),[ye,Ee]=t.useState(""),[Fe,we]=t.useState(!1),[be,Se]=t.useState(!1),[ve,ke]=t.useState(!1),[Ce,Ie]=t.useState(null),[De,ze]=t.useState(null),[We,Te]=t.useState(!1),[Me,Ae]=t.useState(null),[Re,Ne]=t.useState((()=>({x:Math.max(20,"undefined"!=typeof window?window.innerWidth-y-20:300),y:80}))),[Pe,je]=t.useState({width:y,height:560}),[Be,He]=t.useState(!1),[Le,Ue]=t.useState({x:0,y:0}),[$e,_e]=t.useState(!1),[Oe,Ye]=t.useState(null),[Ve,qe]=t.useState({x:0,y:0,width:0,height:0});t.useState(!1);const[Xe,Ge]=t.useState(1),Je=J.filter((e=>{if(!ye.trim())return!0;const t=ye.toLowerCase(),n=(e.patientName||"").toLowerCase(),o=String(e.patientId||"").toLowerCase();return n.includes(t)||o.includes(t)})),Ke=20*(Xe-1),Qe=Ke+20,Ze=Je.slice(Ke,Qe),et=Math.ceil(Je.length/20),tt=Je.length,[nt,ot]=t.useState(q()),[at,it]=t.useState(q()),[rt,lt]=t.useState(),[dt,st]=t.useState(),pt=e=>e?.id||e?._id||e?.appointmentId||e?.patientId||JSON.stringify(e),ct=e=>e?.image?e.image:null,ut=e=>e?e.charAt(0).toUpperCase():"?",mt=e=>{if(!e)return"#4C4DDC";const t=["#4C4DDC","#1CC3CE","#FF6B6B","#4ECDC4","#45B7D1","#FFA07A","#98D8C8","#F7DC6F"];return t[e.charCodeAt(0)%t.length]},ft=()=>{const e="asc"===ge?"desc":"asc";he(e);const t=[...J].sort(((t,n)=>{const o=new Date(t.appointmentDate||t.date||0),a=new Date(n.appointmentDate||n.date||0);return"asc"===e?o-a:a-o}));K(t),Ge(1),t.length>0&&Z(t[0])},xt=t.useCallback((async()=>{if(!W)return;console.log(M,"fetchAppointments -> doctorIdFromLogin");const e=M;te(!0),oe(null);try{const t={apiBaseUrl:b,hospitalId:S,doctorId:e,token:W},n=await s(X,nt,at,t);if(401===n.status||403===n.status){try{"undefined"!=typeof localStorage&&(localStorage.removeItem(m),localStorage.removeItem(f),localStorage.removeItem(x))}catch(e){}return T(null),A(null),N(null),_((e=>e+1)),void oe("Session expired. Re-authenticating...")}if(n.err)return void oe(String(n.err||"Failed to fetch appointments"));const o=n.data||n.appointments||n||[];K(Array.isArray(o)?o:[]),Array.isArray(o)&&o.length>0?Z(o[0]):Z(null)}catch(e){console.error("Error fetching appointments:",e),oe(e.message||"Failed to fetch appointments")}finally{te(!1)}}),[X,nt,at,fe,b,S,M,W]),gt=e=>{Z(e),Ae(null)},ht=async()=>{if(Q&&W){Te(!0),Ae(null);try{const e={apiBaseUrl:b,hospitalId:S,doctorId:M,doctorName:R||V,appToken:W};console.log(Q,"selectedAppointment"),console.log(e,"callConfig");const t=await p(Q,e);if(console.log(t.status,"response"),401===t.status||403===t.status){try{"undefined"!=typeof localStorage&&(localStorage.removeItem(m),localStorage.removeItem(f),localStorage.removeItem(x))}catch(e){}return T(null),A(null),N(null),_((e=>e+1)),void Ae("Session expired. Re-authenticating...")}if(t.err||!t.data?.token)return void Ae(String(t.err||"Failed to initiate call"));const o=n.joinCallUrl||d,a=t.data.token?String(o||"").replace(/\/?$/,"/")+t.data.token:"";console.log("joinCallUrl",a),Ie(t.data.token),ze(a||""),we(!0),Se(!1),ke(!1),je({width:y,height:560}),Ne({x:Math.max(20,window.innerWidth-y-20),y:80})}catch(e){Ae(e.message||"Failed to initiate call")}finally{Te(!1)}}},yt=()=>{we(!1),Se(!1),ke(!1),Ie(null),ze(null),Ae(null),xt()},Et=()=>{ve&&ke(!1),Se(!be)},Ft=()=>{be&&Se(!1),ke(!ve)},wt=e=>{if(0!==e.button)return;if(e.target.closest("button"))return;e.currentTarget.setPointerCapture&&e.currentTarget.setPointerCapture(e.pointerId),He(!0);const t=e.currentTarget.getBoundingClientRect();Ue({x:e.clientX-t.left,y:e.clientY-t.top})},bt=t.useCallback((e=>{if(!ve)if(Be){const t=e.clientX-Le.x,n=e.clientY-Le.y,o=window.innerWidth-Pe.width,a=window.innerHeight-Pe.height;Ne({x:Math.max(0,Math.min(t,o)),y:Math.max(0,Math.min(n,a))})}else if($e){const t=e.clientX-Ve.x,n=e.clientY-Ve.y;let o=Ve.width,a=Ve.height,i=Ve.posX,r=Ve.posY;const l=300,d=250,s=window.innerWidth-40,p=window.innerHeight-100;if("bottom-right"===Oe)o=Math.min(Math.max(Ve.width+t,l),s),a=Math.min(Math.max(Ve.height+n,d),p),i+o>window.innerWidth&&(o=window.innerWidth-i),r+a>window.innerHeight&&(a=window.innerHeight-r);else if("bottom-left"===Oe){o=Math.min(Math.max(Ve.width-t,l),s),i=Math.max(0,Ve.posX+t),0===i&&(o=Ve.posX+Ve.width),a=Math.min(Math.max(Ve.height+n,d),p),r+a>window.innerHeight&&(a=window.innerHeight-r)}else if("top-right"===Oe){o=Math.min(Math.max(Ve.width+t,l),s),i+o>window.innerWidth&&(o=window.innerWidth-i);a=Math.min(Math.max(Ve.height-n,d),p),r=Math.max(0,Ve.posY+n),0===r&&(a=Ve.posY+Ve.height)}else if("top-left"===Oe){o=Math.min(Math.max(Ve.width-t,l),s),i=Math.max(0,Ve.posX+t),0===i&&(o=Ve.posX+Ve.width);a=Math.min(Math.max(Ve.height-n,d),p),r=Math.max(0,Ve.posY+n),0===r&&(a=Ve.posY+Ve.height)}je({width:o,height:a}),Ne({x:i,y:r})}}),[Be,$e,Le,Oe,Ve,Re,Pe,ve]),St=()=>{He(!1),_e(!1),Ye(null)},vt=(e,t)=>{t.preventDefault(),t.stopPropagation(),t.currentTarget.setPointerCapture&&t.currentTarget.setPointerCapture(t.pointerId),_e(!0),Ye(e),qe({x:t.clientX,y:t.clientY,width:Pe.width,height:Pe.height,posX:Re.x,posY:Re.y})};t.useEffect((()=>{if(!Fe||ve)return;const e=()=>{if(!(window.innerWidth<768)){const e=be?350:Pe.width,t=be?60:Pe.height,n=window.innerWidth-40,o=window.innerHeight-100,a=Math.min(e,n),i=Math.min(t,o);a===Pe.width&&i===Pe.height||je({width:a,height:i});const r=window.innerWidth-a-20,l=window.innerHeight-i-20;Ne((e=>({x:Math.min(e.x,r),y:Math.min(e.y,l)})))}};return window.addEventListener("resize",e),()=>window.removeEventListener("resize",e)}),[Fe,be,ve,Pe]),t.useEffect((()=>{if(!(D&&z&&(!W||$>0)))return;let e=!1;return j(!0),H(null),(async(e,t,n,o)=>{const a=`${e.replace(/\/$/,"")}/um/user/V1/sso/login?hospitalId=${encodeURIComponent(t)}`,i={method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({idToken:n,email:o})};return console.log("[getTokenFromSso] request",{url:a,body:{idToken:n?n.slice(0,50)+"...":null,email:o}}),fetch(a,i).then((e=>(console.log("[getTokenFromSso] response status",e.status,e.statusText),e.ok?e.json().then((e=>(console.log("[getTokenFromSso] success",{hasData:!!e,dataKeys:e?Object.keys(e):[],hasAccessToken:!!e?.data?.access_token}),e))):e.json().then((t=>{const n=t?.resultInfo?.message||"SSO login failed";return console.log("[getTokenFromSso] error body",t),{err:n,status:e.status}})).catch((()=>({err:"Something went wrong!",status:e.status})))))).catch((e=>(console.error("[getTokenFromSso] catch",e),{err:e.message||"Network error"})))})(b,S,D,z).then((t=>{if(e)return;const n=function(e){return!e||e.err?null:e.data?.access_token??e.data?.token??e.token??e.accessToken??null}(t);if(400===t.status)return H(t.err||"Invalid request. Redirecting to home..."),j(!1),void U(!0);if(t.err||!n){H(String(t.err||"Failed to get token")),T(null),A(null),N(null);try{"undefined"!=typeof localStorage&&(localStorage.removeItem(m),localStorage.removeItem(f),localStorage.removeItem(x))}catch(e){}}else{const e=function(e){if(!e?.data)return null;const t=e.data.doctor_id??e.data.doctorId??null;return console.log(t,"extractDoctorIdFromLoginResponse -> id"),null!=t?String(t):null}(t);console.log(e,"extractDoctorIdFromLoginResponse -> doctorId");const o=function(e){if(!e?.data)return null;const t=e.data.name??e.data.doctor_name??e.data.userName??null;return null!=t?String(t):null}(t);T(n),A(e),N(o),H(null),U(!1);try{"undefined"!=typeof localStorage&&(localStorage.setItem(m,n),e&&localStorage.setItem(f,e),o&&localStorage.setItem(x,o))}catch(e){}}})).catch((()=>{})).finally((()=>{e||j(!1)})),()=>{e=!0}}),[b,S,D,z,$]),t.useEffect((()=>{Ge(1),Ae(null)}),[X,re,nt,at,ye,fe]),t.useEffect((()=>{!P&&W&&xt()}),[xt,W,P]),t.useEffect((()=>{const e=document.createElement("link");e.href="https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap",e.rel="stylesheet",document.head.appendChild(e);const t=document.createElement("style");t.innerHTML="\n      @keyframes spin {\n        0% { transform: rotate(0deg); }\n        100% { transform: rotate(360deg); }\n      }\n      \n      @media (max-width: 768px) {\n        .appointments-grid {\n          grid-template-columns: 1.5fr 1fr 0.8fr !important;\n        }\n        .appointments-header-grid {\n          grid-template-columns: 1.5fr 1fr 0.8fr !important;\n        }\n        .hide-on-mobile {\n          display: none !important;\n        }\n      }\n      @media (max-width: 480px) {\n        .appointments-header-grid {\n          font-size: 10px !important;\n        }\n        .appointments-grid {\n          font-size: 11px !important;\n        }\n      }\n    ",document.head.appendChild(t);const n=()=>{ie(window.innerWidth<768)};return window.addEventListener("resize",n),()=>{document.head.removeChild(e),document.head.removeChild(t),window.removeEventListener("resize",n)}}),[]),t.useEffect((()=>{const e=e=>{!pe||e.target.closest("button")||e.target.closest('input[type="date"]')||ce(!1),ue&&!e.target.closest("[data-appointment-type-picker]")&&me(!1)};return document.addEventListener("click",e),()=>{document.removeEventListener("click",e)}}),[pe,ue]);let kt='"Nunito", serif';const Ct=B||!W&&(!D||!z),It=B||"Sign in required. Redirecting to home...";let Dt;return Dt=P&&D&&z?a.default.createElement("div",{className:E,[F]:"teleconsult-appointments",style:{fontFamily:kt,background:"#F5F5F7",boxSizing:"border-box",height:"100%",minHeight:"100vh",display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",padding:"24px"}},a.default.createElement("style",null,"@keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }"),a.default.createElement("div",{style:{width:"40px",height:"40px",border:"3px solid #f3f3f3",borderTop:"3px solid #4C4DDC",borderRadius:"50%",animation:"spin 1s linear infinite",marginBottom:"16px"}}),a.default.createElement("p",{style:{fontSize:"14px",color:"#666",margin:0}},"Checking authorisation...")):a.default.createElement(a.default.Fragment,null,a.default.createElement("div",{className:E,[F]:"teleconsult-appointments",style:{fontFamily:kt,background:"#F5F5F7",boxSizing:"border-box",height:"100%",minHeight:"100vh",width:"100%",display:"flex",flexDirection:"column",overflow:"hidden"}},a.default.createElement("div",{style:{background:"#FFFFFF",padding:ae?"10px 12px":"12px 24px",display:"flex",justifyContent:"space-between",alignItems:"center",borderBottom:"1px solid #E5E5E5",flexWrap:"nowrap",gap:ae?"8px":"0"}},a.default.createElement("div",{style:{position:"relative",width:ae?"calc(100% - 90px)":"480px",maxWidth:ae?"none":"480px"}},a.default.createElement("input",{type:"text",placeholder:"Search by patient name or ID",value:ye,onChange:e=>Ee(e.target.value),style:{width:"100%",padding:ae?"8px 32px 8px 10px":"8px 36px 8px 14px",border:"1px solid #E5E5E5",borderRadius:"6px",fontSize:ae?"12px":"13px",fontFamily:kt,background:"#FFFFFF",outline:"none",boxSizing:"border-box"}}),ye&&a.default.createElement("button",{onClick:()=>Ee(""),style:{position:"absolute",right:"8px",top:"50%",transform:"translateY(-50%)",background:"none",border:"none",cursor:"pointer",padding:"4px",display:"flex",alignItems:"center",justifyContent:"center",color:"#999",fontSize:"16px"},title:"Clear search"},"✕")),!1),a.default.createElement("div",{style:{padding:ae?"12px":"16px 24px",flex:1,minHeight:0,overflow:"hidden",display:"flex",flexDirection:"column"}},a.default.createElement("div",{style:{marginBottom:ae?"10px":"14px"}},a.default.createElement("h1",{style:{fontSize:ae?"18px":"22px",fontWeight:700,color:"#1a1a1a",margin:"0 0 2px 0"}},"Tele Consultation"),a.default.createElement("p",{style:{fontSize:ae?"11px":"12px",color:"#999",margin:0}},"Displaying All Tele Consultation Appointments")),a.default.createElement("div",{style:{display:"flex",justifyContent:"space-between",alignItems:ae?"flex-start":"center",marginBottom:ae?"10px":"14px",flexDirection:ae?"column":"row",gap:ae?"12px":"0"}},a.default.createElement("div",{style:{display:"flex",gap:"6px",flexWrap:"wrap",width:ae?"100%":"auto"}},a.default.createElement("button",{onClick:()=>G("upcoming"),style:{background:"upcoming"===X?"#4C4DDC":"#FFFFFF",padding:ae?"8px 10px":"9px 16px",border:"upcoming"===X?"none":"1px solid #E5E5E5",borderRadius:"6px",fontSize:ae?"10px":"13px",color:"upcoming"===X?"white":"#555555",fontWeight:600,fontFamily:kt,cursor:"pointer",flex:ae?"1 1 auto":"none",minWidth:ae?"0":"auto",transition:"all 0.3s ease",whiteSpace:"nowrap"}},"Upcoming Appointments"),a.default.createElement("button",{onClick:()=>G("completed"),style:{background:"completed"===X?"#4C4DDC":"#FFFFFF",padding:ae?"8px 10px":"9px 16px",border:"completed"===X?"none":"1px solid #E5E5E5",borderRadius:"6px",fontSize:ae?"10px":"13px",color:"completed"===X?"white":"#555555",fontWeight:600,fontFamily:kt,cursor:"pointer",flex:ae?"1 1 auto":"none",minWidth:ae?"0":"auto",transition:"all 0.3s ease",whiteSpace:"nowrap"}},"Completed Appointments"),a.default.createElement("button",{onClick:()=>G("cancelled"),style:{background:"cancelled"===X?"#4C4DDC":"#FFFFFF",padding:ae?"8px 10px":"9px 16px",border:"cancelled"===X?"none":"1px solid #E5E5E5",borderRadius:"6px",fontSize:ae?"10px":"13px",color:"cancelled"===X?"white":"#555555",fontWeight:600,fontFamily:kt,cursor:"pointer",flex:ae?"1 1 auto":"none",minWidth:ae?"0":"auto",transition:"all 0.3s ease",whiteSpace:"nowrap"}},"Cancelled Appointments")),a.default.createElement("div",{style:{display:"flex",gap:"8px",alignItems:"center",width:"auto",position:"relative",justifyContent:ae?"flex-start":"flex-end",flexWrap:"wrap"}},a.default.createElement("button",{onClick:()=>{pe||(lt(nt),st(at),se(re)),ce(!pe)},style:{padding:"8px 12px",fontFamily:kt,fontWeight:600,border:"1px solid #E5E5E5",borderRadius:"6px",fontSize:ae?"11px":"13px",color:"#1a1a1a",background:"#FFFFFF",display:"flex",alignItems:"center",gap:ae?"4px":"6px",cursor:"pointer",flex:"none",minWidth:ae?"100px":"auto",justifyContent:"center"}},a.default.createElement("svg",{width:ae?"12":"14",height:ae?"12":"14",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"},a.default.createElement("rect",{x:"3",y:"4",width:"18",height:"18",rx:"2",ry:"2"}),a.default.createElement("line",{x1:"16",y1:"2",x2:"16",y2:"6"}),a.default.createElement("line",{x1:"8",y1:"2",x2:"8",y2:"6"}),a.default.createElement("line",{x1:"3",y1:"10",x2:"21",y2:"10"})),a.default.createElement("span",{style:{overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"}},(()=>{switch(re){case"today":default:return"Today";case"tomorrow":return"Tomorrow";case"currentWeek":return"Current Week";case"thisMonth":return"This Month";case"currentYear":return"Current Year";case"custom":return ae?"Custom":`${nt} to ${at}`}})()),a.default.createElement("svg",{width:ae?"8":"10",height:ae?"8":"10",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"},a.default.createElement("polyline",{points:"6 9 12 15 18 9"}))),pe&&a.default.createElement("div",{style:{position:"absolute",top:"100%",right:ae?"auto":0,left:ae?0:"auto",marginTop:"4px",background:"#FFFFFF",border:"1px solid #E5E5E5",borderRadius:"8px",boxShadow:"0 4px 16px rgba(0,0,0,0.15)",padding:"8px",zIndex:1e3,minWidth:ae?"280px":"240px",width:ae?"calc(100vw - 24px)":"auto",maxWidth:ae?"calc(100vw - 24px)":"280px"}},a.default.createElement("div",{style:{marginBottom:"custom"===de?"12px":"0"}},["thisMonth","today","tomorrow","currentWeek","currentYear","custom"].map((e=>a.default.createElement("button",{key:e,onClick:()=>{if(se(e),"custom"!==e){const t=(e=>{const t=new Date;let n,o;switch(e){case"today":default:n=o=q();break;case"tomorrow":const e=new Date(t);e.setDate(e.getDate()+1),n=o=e.toISOString().split("T")[0];break;case"currentWeek":const a=new Date(t),i=new Date(t),r=t.getDay(),l=0===r?-6:1-r;a.setDate(t.getDate()+l),i.setDate(a.getDate()+6),n=a.toISOString().split("T")[0],o=i.toISOString().split("T")[0];break;case"thisMonth":const d=new Date(t.getFullYear(),t.getMonth(),1),s=new Date(t.getFullYear(),t.getMonth()+1,0);n=d.toISOString().split("T")[0],o=s.toISOString().split("T")[0];break;case"currentYear":n=`${t.getFullYear()}-01-01`,o=`${t.getFullYear()}-12-31`}return{from:n,to:o}})(e);le(e),ot(t.from),it(t.to),lt(t.from),st(t.to),ce(!1)}else lt(""),st("")},style:{width:"100%",padding:"10px 12px",background:de===e?"#E8EEF4":"#FFFFFF",border:"none",borderRadius:"4px",fontSize:"13px",fontFamily:kt,cursor:"pointer",textAlign:"left",fontWeight:de===e?600:400,color:de===e?"#4C4DDC":"#1a1a1a",marginBottom:"4px",display:"flex",justifyContent:"space-between",alignItems:"center",transition:"all 0.2s ease"},onMouseEnter:t=>{de!==e&&(t.target.style.background="#F5F5F5")},onMouseLeave:t=>{de!==e&&(t.target.style.background="#FFFFFF")}},a.default.createElement("span",null,{thisMonth:"This Month",today:"Today",tomorrow:"Tomorrow",currentWeek:"Current Week",currentYear:"Current Year",custom:"Custom"}[e]),de===e&&a.default.createElement("span",{style:{color:"#4C4DDC",fontSize:"16px"}},"✓"))))),"custom"===de&&a.default.createElement("div",{style:{paddingTop:"8px",borderTop:"1px solid #E5E5E5"}},a.default.createElement("div",{style:{marginBottom:"8px"}},a.default.createElement("input",{type:"date",value:rt,onChange:e=>lt(e.target.value),placeholder:"Start Date",style:{width:"100%",padding:"10px 8px",border:"1px solid #E5E5E5",borderRadius:"4px",fontSize:"13px",fontFamily:kt,boxSizing:"border-box",cursor:"pointer"}})),a.default.createElement("div",{style:{marginBottom:"12px"}},a.default.createElement("input",{type:"date",value:dt,onChange:e=>st(e.target.value),placeholder:"End Date",style:{width:"100%",padding:"10px 8px",border:"1px solid #E5E5E5",borderRadius:"4px",fontSize:"13px",fontFamily:kt,boxSizing:"border-box",cursor:"pointer"}})),a.default.createElement("div",{style:{display:"flex",gap:"8px"}},a.default.createElement("button",{onClick:()=>{se(re),lt(nt),st(at),ce(!1)},style:{flex:1,padding:"10px 12px",background:"#FFFFFF",color:"#4C4DDC",border:"1px solid #4C4DDC",borderRadius:"4px",fontSize:"13px",fontFamily:kt,fontWeight:600,cursor:"pointer"}},"Cancel"),a.default.createElement("button",{onClick:()=>{rt&&dt&&(le("custom"),ot(rt),it(dt),ce(!1))},style:{flex:1,padding:"10px 12px",background:"#4C4DDC",color:"#FFFFFF",border:"none",borderRadius:"4px",fontSize:"13px",fontFamily:kt,fontWeight:600,cursor:"pointer"}},"Submit")))))),a.default.createElement("div",{style:{display:"flex",flexDirection:ae?"column":"row",gap:ae?"12px":"14px",flex:1,minHeight:0,overflow:ae?"auto":"hidden"}},a.default.createElement("div",{style:{flex:ae?"none":"1 1 65%",width:ae?"100%":"auto",display:"flex",flexDirection:"column",minHeight:ae?"400px":0}},a.default.createElement("div",{style:{background:"#FFFFFF",borderRadius:"8px",boxShadow:"0 1px 4px rgba(0,0,0,0.08)",overflow:"hidden",display:"flex",flexDirection:"column",flex:ae?"none":1,minHeight:ae?"auto":0}},a.default.createElement("div",{style:{display:"flex",justifyContent:"space-between",alignItems:"center",padding:ae?"12px 14px":"14px 18px",borderBottom:"1px solid #F1F1F1"}},a.default.createElement("div",{style:{display:"flex",alignItems:"center",gap:ae?"6px":"8px"}},a.default.createElement("span",{style:{fontSize:ae?"14px":"15px",fontWeight:700,color:"#1a1a1a"}},"Appointments"),a.default.createElement("span",{style:{background:"#4C4DDC",color:"#fff",fontSize:ae?"10px":"11px",fontWeight:600,padding:ae?"2px 7px":"3px 8px",borderRadius:"12px"}},tt))),a.default.createElement("div",{className:"appointments-header-grid",style:{display:"grid",gridTemplateColumns:ae?"1.5fr 1fr 0.8fr":"2.5fr 1fr 1.5fr 0.8fr 1.2fr",gap:ae?"8px":"12px",padding:ae?"8px 12px":"10px 18px",background:"#F5F5F5",fontSize:ae?"10px":"12px",fontWeight:600,color:"#666"}},a.default.createElement("div",null,"Patients name"),!ae&&a.default.createElement("div",null,"Patient ID"),a.default.createElement("div",{onClick:ft,style:{display:"flex",alignItems:"center",gap:"3px",cursor:"pointer",userSelect:"none"}},"Date",a.default.createElement("span",{style:{opacity:.7,fontSize:"10px"}},"asc"===ge?"▲":"▼")),!ae&&a.default.createElement("div",null,"Slot"),!ae&&a.default.createElement("div",null,"Doctor")),a.default.createElement("div",{style:{overflow:"auto",flex:1}},P?a.default.createElement("div",{style:{display:"flex",justifyContent:"center",alignItems:"center",padding:"40px",color:"#888"}},a.default.createElement("div",{style:{textAlign:"center"}},a.default.createElement("div",{style:{width:"40px",height:"40px",border:"3px solid #f3f3f3",borderTop:"3px solid #4C4DDC",borderRadius:"50%",animation:"spin 1s linear infinite",margin:"0 auto 10px"}}),"Getting token...")):ee?a.default.createElement("div",{style:{display:"flex",justifyContent:"center",alignItems:"center",padding:"40px",color:"#888"}},a.default.createElement("div",{style:{textAlign:"center"}},a.default.createElement("div",{style:{width:"40px",height:"40px",border:"3px solid #f3f3f3",borderTop:"3px solid #4C4DDC",borderRadius:"50%",animation:"spin 1s linear infinite",margin:"0 auto 10px"}}),"Loading appointments...")):ne?a.default.createElement("div",{style:{padding:"40px",textAlign:"center",color:"#FF0000"}},a.default.createElement("div",{style:{fontSize:"16px",marginBottom:"8px"}},"⚠️ Error"),a.default.createElement("div",{style:{fontSize:"13px"}},ne),a.default.createElement("button",{onClick:xt,style:{marginTop:"16px",padding:"8px 16px",background:"#4C4DDC",color:"white",border:"none",borderRadius:"6px",cursor:"pointer",fontFamily:kt}},"Retry")):0===Ze.length?a.default.createElement("div",{style:{padding:"40px",textAlign:"center",color:"#888"}},a.default.createElement("div",{style:{fontSize:"16px",marginBottom:"8px"}},"📋"),a.default.createElement("div",{style:{fontSize:"13px"}},ye?`No appointments found for "${ye}"`:"No appointments found"),ye&&a.default.createElement("button",{onClick:()=>Ee(""),style:{marginTop:"12px",padding:"6px 12px",background:"#4C4DDC",color:"white",border:"none",borderRadius:"4px",cursor:"pointer",fontSize:"12px",fontFamily:kt}},"Clear Search")):Ze.map((e=>a.default.createElement("div",{key:pt(e),role:"button",tabIndex:0,onClick:()=>gt(e),onKeyDown:t=>"Enter"===t.key&&gt(e),className:"appointments-grid",style:{display:"grid",gridTemplateColumns:ae?"1.5fr 1fr 0.8fr":"2.5fr 1fr 1.5fr 0.8fr 1.2fr",gap:ae?"8px":"12px",padding:ae?"10px 12px":"12px 18px",background:pt(Q)===pt(e)?"#E8EEF4":"#FFFFFF",borderTop:"1px solid #F1F1F1",alignItems:"center",cursor:"pointer",fontSize:ae?"11px":"13px"}},a.default.createElement("div",{style:{display:"flex",alignItems:"center",gap:ae?"8px":"10px"}},ct(e)?a.default.createElement("img",{src:e.image,alt:"",style:{width:ae?"32px":"36px",height:ae?"32px":"36px",borderRadius:"50%",objectFit:"cover"}}):a.default.createElement("div",{style:{width:ae?"32px":"36px",height:ae?"32px":"36px",borderRadius:"50%",background:mt(e.patientName),display:"flex",alignItems:"center",justifyContent:"center",color:"#FFFFFF",fontWeight:600,fontSize:ae?"14px":"16px"}},ut(e.patientName)),a.default.createElement("div",null,a.default.createElement("div",{style:{fontWeight:600,color:"#1a1a1a",fontSize:ae?"11px":"13px"}},e.patientName),a.default.createElement("div",{style:{fontSize:ae?"9px":"11px",color:"#888"}},e.email))),!ae&&a.default.createElement("div",{style:{color:"#555",fontSize:"12px"}},e.patientId),a.default.createElement("div",{style:{color:"#555",fontSize:ae?"10px":"12px"}},(()=>{const t=e.appointmentDate||"",n=t.match(/\s(\d{1,2}:\d{2}(?:\s*(?:AM|PM))?)$/i);return n?a.default.createElement(a.default.Fragment,null,a.default.createElement("div",null,t.slice(0,n.index).trim()),a.default.createElement("div",{style:{fontSize:ae?"9px":"11px",color:"#888"}},n[1].trim())):a.default.createElement("div",null,t)})()),!ae&&a.default.createElement("div",{style:{color:"#555",fontSize:"12px"}},e.appointmentTime||"-"),!ae&&a.default.createElement("div",{style:{color:"#555",fontSize:"12px"}},e.doctorName||e.doctor||"-"))))),!ee&&!ne&&Ze.length>0&&a.default.createElement("div",{style:{padding:ae?"12px 14px":"14px 18px",borderTop:"1px solid #F1F1F1",display:"flex",justifyContent:"space-between",alignItems:"center",background:"#FFFFFF",flexWrap:ae?"wrap":"nowrap",gap:ae?"10px":"0"}},a.default.createElement("div",{style:{fontSize:ae?"11px":"12px",color:"#666"}},"Showing page ",Xe," of ",et," (",tt," total)"),a.default.createElement("div",{style:{display:"flex",gap:"6px",alignItems:"center"}},a.default.createElement("button",{onClick:()=>Ge((e=>Math.max(1,e-1))),disabled:1===Xe,style:{padding:ae?"6px 10px":"6px 12px",border:"1px solid #E5E5E5",borderRadius:"4px",background:1===Xe?"#F5F5F5":"#FFFFFF",color:1===Xe?"#999":"#1a1a1a",fontSize:ae?"11px":"12px",fontFamily:kt,fontWeight:600,cursor:1===Xe?"not-allowed":"pointer",opacity:1===Xe?.5:1}},"Previous"),a.default.createElement("div",{style:{display:"flex",gap:"4px"}},[...Array(Math.min(5,et))].map(((e,t)=>{let n;return n=et<=5||Xe<=3?t+1:Xe>=et-2?et-4+t:Xe-2+t,a.default.createElement("button",{key:n,onClick:()=>Ge(n),style:{padding:ae?"6px 10px":"6px 12px",border:Xe===n?"none":"1px solid #E5E5E5",borderRadius:"4px",background:Xe===n?"#4C4DDC":"#FFFFFF",color:Xe===n?"#FFFFFF":"#1a1a1a",fontSize:ae?"11px":"12px",fontFamily:kt,fontWeight:600,cursor:"pointer",minWidth:ae?"32px":"36px"}},n)}))),a.default.createElement("button",{onClick:()=>Ge((e=>Math.min(et,e+1))),disabled:Xe===et,style:{padding:ae?"6px 10px":"6px 12px",border:"1px solid #E5E5E5",borderRadius:"4px",background:Xe===et?"#F5F5F5":"#FFFFFF",color:Xe===et?"#999":"#1a1a1a",fontSize:ae?"11px":"12px",fontFamily:kt,fontWeight:600,cursor:Xe===et?"not-allowed":"pointer",opacity:Xe===et?.5:1}},"Next"))))),a.default.createElement("div",{style:{flex:ae?"none":"1 1 35%",width:ae?"100%":"auto",display:Q||!ae?"flex":"none",flexDirection:"column",minHeight:ae?"auto":0}},a.default.createElement("div",{style:{border:"1px solid #E5E5E5",borderRadius:"8px",overflow:"hidden",background:"#FFFFFF",boxShadow:"0 1px 4px rgba(0,0,0,0.08)",display:"flex",flexDirection:"column",flex:ae?"none":1,minHeight:ae?"auto":0}},Q?a.default.createElement(a.default.Fragment,null,a.default.createElement("div",{style:{display:"flex",justifyContent:"space-between",alignItems:"center",padding:ae?"12px 14px":"16px 18px",background:"#E8EEF4",borderBottom:"1px solid #E5E5E5"}},a.default.createElement("div",null,a.default.createElement("div",{style:{color:"#002668",fontSize:ae?"14px":"16px",fontWeight:"700"}},Q.patientName||"N/A"),a.default.createElement("div",{style:{color:"#002668",fontSize:ae?"11px":"13px"}},Q.patientId||Q.mrn||"N/A")),a.default.createElement("div",null,ct(Q)?a.default.createElement("img",{style:{width:ae?"36px":"44px",height:ae?"36px":"44px",borderRadius:"50%",objectFit:"cover"},src:Q.image,alt:Q.patientName}):a.default.createElement("div",{style:{width:ae?"36px":"44px",height:ae?"36px":"44px",borderRadius:"50%",background:mt(Q.patientName),display:"flex",alignItems:"center",justifyContent:"center",color:"#FFFFFF",fontWeight:700,fontSize:ae?"16px":"20px"}},ut(Q.patientName)))),a.default.createElement("div",{style:{padding:ae?"12px 14px":"14px 18px",gap:ae?"10px":"12px",display:"flex",flexDirection:"column",background:"white",overflow:"auto",flex:1,position:"relative"}},a.default.createElement("div",{style:{display:"flex",justifyContent:"space-between"}},a.default.createElement("div",{style:{textAlign:"left"}},a.default.createElement("div",{style:{fontSize:ae?"10px":"11px",color:"#888",marginBottom:"3px"}},"Speciality"),a.default.createElement("div",{style:{fontWeight:"700",fontSize:ae?"12px":"13px"}},Q?.specialisation||Q?.speciality||"N/A")),a.default.createElement("div",{style:{textAlign:"right"}},a.default.createElement("div",{style:{fontSize:ae?"10px":"11px",color:"#888",marginBottom:"3px"}},"Appointment Type"),a.default.createElement("div",{style:{fontWeight:"700",fontSize:ae?"12px":"13px"}},Q?.type||Q?.appointmentType||"Online"))),a.default.createElement("div",{style:{display:"flex",justifyContent:"space-between"}},a.default.createElement("div",{style:{textAlign:"left"}},a.default.createElement("div",{style:{fontSize:ae?"10px":"11px",color:"#888",marginBottom:"3px"}},"Appointment Date"),a.default.createElement("div",{style:{fontWeight:"700",fontSize:ae?"12px":"13px"}},Q?.date||Q?.appointmentDate||"N/A")),a.default.createElement("div",{style:{textAlign:"right"}},a.default.createElement("div",{style:{fontSize:ae?"10px":"11px",color:"#888",marginBottom:"3px"}},"Appointment Time"),a.default.createElement("div",{style:{fontWeight:"700",fontSize:ae?"12px":"13px"}},Q?.time||Q?.appointmentTime||"N/A"))),a.default.createElement("div",{style:{display:"flex",justifyContent:"space-between"}},a.default.createElement("div",{style:{textAlign:"left"}},a.default.createElement("div",{style:{fontSize:ae?"10px":"11px",color:"#888",marginBottom:"3px"}},"Doctor"),a.default.createElement("div",{style:{fontWeight:"700",fontSize:ae?"12px":"13px"}},Q?.doctor||Q?.doctorName||"N/A"))),a.default.createElement("div",{style:{display:"flex",justifyContent:"space-between"}},a.default.createElement("div",{style:{textAlign:"left"}},a.default.createElement("div",{style:{fontSize:ae?"10px":"11px",color:"#888",marginBottom:"3px"}},"Hospital"),a.default.createElement("div",{style:{fontWeight:"700",fontSize:ae?"12px":"13px"}},Q?.hospital||Q?.hospitalName||"N/A"))),a.default.createElement("div",{style:{display:"flex",justifyContent:"space-between"}},a.default.createElement("div",{style:{textAlign:"left"}},a.default.createElement("div",{style:{fontSize:ae?"10px":"11px",color:"#888",marginBottom:"3px"}},"Reason for Appointment"),a.default.createElement("div",{style:{fontWeight:"600",fontSize:ae?"11px":"12px",lineHeight:"1.4"}},Q?.reason||Q?.reasonForAppointment||"No reason provided"))),"upcoming"===X&&a.default.createElement("div",{style:{display:"flex",flexDirection:ae?"column":"row",gap:"6px",marginTop:"10px"}},a.default.createElement("button",{type:"button",onClick:ht,disabled:We,style:{flex:1,background:We?"#99e4e8":"#1CC3CE",color:"#FFFFFF",border:"1px solid #1CC3CE",borderRadius:"6px",padding:ae?"10px 8px":"8px 6px",fontFamily:kt,fontWeight:600,fontSize:ae?"11px":"12px",cursor:We?"not-allowed":"pointer"}},We?"Connecting...":"Join Call >")),"upcoming"===X&&Me&&a.default.createElement("div",{style:{fontSize:"11px",color:"#e53935",marginTop:"6px",textAlign:"center",width:"100%"}},"⚠️ ",Me))):a.default.createElement("div",{style:{display:"flex",justifyContent:"center",alignItems:"center",height:"100%",padding:"40px",color:"#888",textAlign:"center"}},a.default.createElement("div",null,a.default.createElement("div",{style:{fontSize:"16px",marginBottom:"8px"}},"📋"),a.default.createElement("div",{style:{fontSize:"13px"}},"Select an appointment to view details"))))))),Fe&&a.default.createElement("div",{style:{position:"fixed",left:ve?"0":ae?"10px":`${Re.x}px`,top:ve?"0":ae?"70px":`${Re.y}px`,right:ve?"0":ae?"10px":"auto",bottom:ve?"0":"auto",width:ve?"100vw":ae?"calc(100vw - 20px)":be?"350px":`${Pe.width}px`,height:ve?"100vh":be?"auto":ae?"300px":`${Pe.height}px`,background:"#FFFFFF",borderRadius:ve?"0":"8px",boxShadow:"0 8px 24px rgba(0, 0, 0, 0.3)",zIndex:1e5,overflow:"hidden",display:"flex",flexDirection:"column",transition:Be||$e?"none":"all 0.3s ease"}},a.default.createElement("div",{onPointerDown:ae||ve?void 0:wt,onPointerMove:ae||ve?void 0:bt,onPointerUp:ae||ve?void 0:St,onPointerCancel:ae||ve?void 0:St,style:{background:"linear-gradient(135deg, #4C4DDC 0%, #3A3BBD 100%)",color:"#FFFFFF",padding:ae?"8px 10px":"10px 12px",display:"flex",justifyContent:"space-between",alignItems:"center",cursor:ae||ve?"default":"move",userSelect:"none"}},a.default.createElement("div",{style:{display:"flex",alignItems:"center",gap:ae?"6px":"8px",flex:1,minWidth:0}},a.default.createElement("div",{style:{width:ae?"6px":"8px",height:ae?"6px":"8px",borderRadius:"50%",background:"#FF4444",animation:"pulse 2s infinite",flexShrink:0}}),a.default.createElement("span",{style:{fontSize:ae?"11px":"13px",fontWeight:600,fontFamily:kt,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"}},"Video Call - ",Q?.patientName||"Patient")),a.default.createElement("div",{style:{display:"flex",gap:ae?"4px":"6px",alignItems:"center",flexShrink:0}},!ve&&a.default.createElement("button",{onClick:Et,style:{background:"rgba(255, 255, 255, 0.2)",border:"1px solid rgba(255, 255, 255, 0.3)",borderRadius:"6px",color:"#FFFFFF",cursor:"pointer",padding:ae?"5px 8px":"6px 10px",lineHeight:1,display:"flex",alignItems:"center",justifyContent:"center",minWidth:ae?"28px":"32px",height:ae?"28px":"32px",transition:"background 0.2s ease"},onMouseEnter:e=>e.target.style.background="rgba(255, 255, 255, 0.3)",onMouseLeave:e=>e.target.style.background="rgba(255, 255, 255, 0.2)",title:be?"Restore":"Minimize"},be?a.default.createElement("svg",{width:ae?"14":"16",height:ae?"14":"16",viewBox:"0 0 16 16",fill:"none"},a.default.createElement("rect",{x:"3",y:"3",width:"10",height:"10",stroke:"white",strokeWidth:"1.8",fill:"none"})):a.default.createElement("svg",{width:ae?"14":"16",height:ae?"14":"16",viewBox:"0 0 16 16",fill:"none"},a.default.createElement("line",{x1:"3",y1:"8",x2:"13",y2:"8",stroke:"white",strokeWidth:"1.8",strokeLinecap:"round"}))),a.default.createElement("button",{onClick:Ft,style:{background:"rgba(255, 255, 255, 0.2)",border:"1px solid rgba(255, 255, 255, 0.3)",borderRadius:"6px",color:"#FFFFFF",cursor:"pointer",padding:ae?"5px 8px":"6px 10px",lineHeight:1,display:"flex",alignItems:"center",justifyContent:"center",minWidth:ae?"28px":"32px",height:ae?"28px":"32px",transition:"background 0.2s ease"},onMouseEnter:e=>e.target.style.background="rgba(255, 255, 255, 0.3)",onMouseLeave:e=>e.target.style.background="rgba(255, 255, 255, 0.2)",title:ve?"Exit Fullscreen":"Fullscreen"},ve?a.default.createElement("svg",{width:ae?"14":"16",height:ae?"14":"16",viewBox:"0 0 16 16",fill:"none"},a.default.createElement("path",{d:"M10 3H13V6M6 13H3V10M13 10V13H10M3 6V3H6",stroke:"white",strokeWidth:"1.8",strokeLinecap:"round",strokeLinejoin:"round"})):a.default.createElement("svg",{width:ae?"14":"16",height:ae?"14":"16",viewBox:"0 0 16 16",fill:"none"},a.default.createElement("path",{d:"M3 6V3H6M13 10V13H10M10 3H13V6M6 13H3V10",stroke:"white",strokeWidth:"1.8",strokeLinecap:"round",strokeLinejoin:"round"}))),a.default.createElement("button",{onClick:yt,style:{background:"rgba(255, 255, 255, 0.2)",border:"1px solid rgba(255, 255, 255, 0.3)",borderRadius:"6px",color:"#FFFFFF",cursor:"pointer",padding:ae?"5px 8px":"6px 10px",lineHeight:1,display:"flex",alignItems:"center",justifyContent:"center",minWidth:ae?"28px":"32px",height:ae?"28px":"32px",fontWeight:"bold",fontSize:ae?"18px":"22px",transition:"background 0.2s ease"},onMouseEnter:e=>e.target.style.background="rgba(255, 255, 255, 0.3)",onMouseLeave:e=>e.target.style.background="rgba(255, 255, 255, 0.2)",title:"Close"},"×"))),!be&&a.default.createElement("div",{style:{flex:1,background:"#000000",position:"relative"}},a.default.createElement("iframe",{src:(()=>{if(!Ce)return"";const e=String(O||"").replace(/\/?$/,"/");return console.log("${base}token=${callToken}",`${e}token=${Ce}`),`${e}token=${Ce}`})(),style:{width:"100%",height:"100%",border:"none"},allow:"camera; microphone; display-capture; autoplay",allowFullScreen:!0,title:"Video Call"})),!ae&&!ve&&!be&&a.default.createElement(a.default.Fragment,null,a.default.createElement("div",{onPointerDown:e=>vt("top-left",e),onPointerMove:bt,onPointerUp:St,onPointerCancel:St,style:{position:"absolute",left:0,top:0,width:"16px",height:"16px",cursor:"nwse-resize",background:"transparent",zIndex:10001}}),a.default.createElement("div",{onPointerDown:e=>vt("top-right",e),onPointerMove:bt,onPointerUp:St,onPointerCancel:St,style:{position:"absolute",right:0,top:0,width:"16px",height:"16px",cursor:"nesw-resize",background:"transparent",zIndex:10001}}),a.default.createElement("div",{onPointerDown:e=>vt("bottom-left",e),onPointerMove:bt,onPointerUp:St,onPointerCancel:St,style:{position:"absolute",left:0,bottom:0,width:"16px",height:"16px",cursor:"nesw-resize",background:"transparent",zIndex:10001}}),a.default.createElement("div",{onPointerDown:e=>vt("bottom-right",e),onPointerMove:bt,onPointerUp:St,onPointerCancel:St,style:{position:"absolute",right:0,bottom:0,width:"16px",height:"16px",cursor:"nwse-resize",background:"transparent",zIndex:10001}})),a.default.createElement("style",null,"\n            @keyframes pulse {\n              0%, 100% { opacity: 1; }\n              50% { opacity: 0.5; }\n            }\n          "))),Ct&&a.default.createElement("div",{style:{position:"fixed",inset:0,zIndex:1e5,display:"flex",alignItems:"center",justifyContent:"center",padding:"24px",background:"rgba(0,0,0,0.4)",boxSizing:"border-box"}},a.default.createElement("div",{style:{fontFamily:kt,maxWidth:"400px",width:"100%",padding:"32px 24px",background:"#FFFFFF",borderRadius:"12px",boxShadow:"0 8px 32px rgba(0,0,0,0.2)",textAlign:"center"}},a.default.createElement("div",{style:{fontSize:"48px",marginBottom:"16px"}},"🔒"),a.default.createElement("h2",{style:{fontSize:"20px",fontWeight:700,color:"#1a1a1a",margin:"0 0 8px 0"}},B?"Not authorised":"Sign in required"),a.default.createElement("p",{style:{fontSize:"14px",color:"#666",margin:0,lineHeight:1.5}},It),a.default.createElement("p",{style:{fontSize:"13px",color:"#999",marginTop:"16px",marginBottom:0}},"Redirecting to login...")))),a.default.createElement(w,null,Dt)};let S=null;const v={showWidget:(e,t)=>{S||(S=document.createElement("div"),document.body.appendChild(S));const n=()=>a.default.createElement(a.default.Fragment,null,a.default.createElement(b,{config:e}));i.default.render(a.default.createElement(n,null),S)},closePopup:()=>{S&&(i.default.unmountComponentAtNode(S),S=null)}};window.BookingSDK=v,e.AppointmentPage=b,e.PIH_APPOINTMENT_WIDGET_CLASS=E,e.default=v,Object.defineProperty(e,"__esModule",{value:!0})}));

package/dist/services/appointmentService.js

@@ -14,15 +14,15 @@ var _apiConfig = require("../constants/apiConfig");
  * @param {object} config - Optional configuration { apiBaseUrl, hospitalId, doctorId }
  * @returns {Promise} Appointments data
  */
-const getAppointmentsByStatus = async function (status, fromDate, toDate, type) {
-  let config = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : {};
+const getAppointmentsByStatus = async function (status, fromDate, toDate) {
+  let config = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
   // Map status to API format
   let apiStatus = (status || "").toUpperCase();
   if (apiStatus === "INPROGRESS") {
     apiStatus = "IN_PROGRESS";
   }
   const baseURL = config.apiBaseUrl;
-  const hospitalId = config.hospitalId || _apiConfig.DEFAULT_PARAMS.hospitalId;
+  const hospitalId = config.hospitalId;
   const doctorId = config.doctorId;
   const token = config.token || '';
   const params = {
@@ -32,9 +32,10 @@ const getAppointmentsByStatus = async function (status, fromDate, toDate, type)
     toDate,
     statuses: apiStatus
   };
-  if (type && String(type).toUpperCase() !== "ALL") {
-    params.appointmentType = String(type).toUpperCase();
-  }
+  // if (type && String(type).toUpperCase() !== "ALL") {
+  //   params.appointmentType = String(type).toUpperCase();
+  // }
+  params.appointmentType = 'ONLINE';
   const url = `${baseURL}${_apiConfig.API_PATHS.APPOINTMENTS}`;
 
   // Return raw response (including status) so caller can detect 401 and re-login
@@ -81,7 +82,7 @@ const initiateConsultation = async function (appointment) {
   const body = {
     patientId: String(appointment.patientId || ""),
     primaryPatientId: String(appointment.primaryPatientId || appointment.patientId || ""),
-    hospitalId: config.hospitalId || _apiConfig.DEFAULT_PARAMS.hospitalId,
+    hospitalId: config.hospitalId,
     doctorId: String(config.doctorId),
     patientName: appointment.patientName || appointment.name || "",
     doctorName: appointment.doctorName || config.doctorName,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pih-appointment-widget",
-  "version": "0.0.22",
+  "version": "0.0.24",
   "main": "dist/App.js",
   "module": "dist/App.js",
   "exports": {

package/src/components/AppointmentPage.js

@@ -26,6 +26,7 @@ const STORAGE_KEY_APP_TOKEN = "pih_appointment_appToken";
 const STORAGE_KEY_DOCTOR_ID = "pih_appointment_doctorId";
 const STORAGE_KEY_USER_NAME = "pih_appointment_userName";
 const STORAGE_KEY_API_BASE_URL = "pih_appointment_apiBaseUrl";
+const STORAGE_KEY_HOSPITAL_ID = "pih_appointment_hospitalId";
 
 const DEFAULT_PIP_WIDTH = 720;
 const DEFAULT_PIP_HEIGHT = 560;
@@ -105,8 +106,15 @@ const AppointmentPage = ({ config = {} }) => {
       return null;
     }
   });
+  const [storedHospitalId, setStoredHospitalId] = useState(() => {
+    try {
+      return typeof localStorage !== "undefined" ? localStorage.getItem(STORAGE_KEY_HOSPITAL_ID) : null;
+    } catch {
+      return null;
+    }
+  });
   const apiBaseUrl = config.apiBaseUrl || storedApiBaseUrl || API_BASE_URL;
-  const hospitalId = config.hospitalId || DEFAULT_PARAMS.hospitalId;
+  const hospitalId = config.hospitalId || storedHospitalId;
 
   // idToken/email: config first, then localStorage. When Flutter (or parent) passes a new token, we use it and re-login.
   const [storedIdToken, setStoredIdToken] = useState(() => {
@@ -153,8 +161,12 @@ const AppointmentPage = ({ config = {} }) => {
         localStorage.setItem(STORAGE_KEY_API_BASE_URL, config.apiBaseUrl.trim());
         setStoredApiBaseUrl(config.apiBaseUrl.trim());
       }
+      if (config.hospitalId != null && String(config.hospitalId).trim()) {
+        localStorage.setItem(STORAGE_KEY_HOSPITAL_ID, String(config.hospitalId).trim());
+        setStoredHospitalId(String(config.hospitalId).trim());
+      }
     } catch (e) {}
-  }, [config.idToken, config.token, config.email, config.apiBaseUrl]);
+  }, [config.idToken, config.token, config.email, config.apiBaseUrl, config.hospitalId]);
 
   const [appToken, setAppToken] = useState(() => {
     try {
@@ -413,11 +425,10 @@ const AppointmentPage = ({ config = {} }) => {
     }
   };
 
-  const fetchAppointments = useCallback(async (overrideType) => {
+  const fetchAppointments = useCallback(async () => {
     if (!appToken) return;
     console.log(doctorIdFromLogin, 'fetchAppointments -> doctorIdFromLogin')
     const doctorId = doctorIdFromLogin;
-    const typeToUse = overrideType !== undefined ? overrideType : appointmentTypeFilter;
     setLoading(true);
     setError(null);
     try {
@@ -427,7 +438,7 @@ const AppointmentPage = ({ config = {} }) => {
         doctorId,
         token: appToken,
       };
-      const response = await getAppointmentsByStatus(activeTab, fromDate, toDate, typeToUse, serviceConfig);
+      const response = await getAppointmentsByStatus(activeTab, fromDate, toDate, serviceConfig);
       if (response.status === 401 || response.status === 403) {
         // Token expired — clear stored token and trigger re-login (SSO effect will fire)
         try {
@@ -466,6 +477,7 @@ const AppointmentPage = ({ config = {} }) => {
   // Handle appointment selection - no API call, just show data from list
   const handleAppointmentSelect = (appointment) => {
     setSelectedAppointment(appointment);
+    setCallError(null);
   };
 
   // Logout: clear storage and redirect to login page
@@ -478,6 +490,7 @@ const AppointmentPage = ({ config = {} }) => {
         localStorage.removeItem(STORAGE_KEY_DOCTOR_ID);
         localStorage.removeItem(STORAGE_KEY_USER_NAME);
         localStorage.removeItem(STORAGE_KEY_API_BASE_URL);
+        localStorage.removeItem(STORAGE_KEY_HOSPITAL_ID);
       }
     } catch (e) {}
     setShowProfileDropdown(false);
@@ -503,21 +516,31 @@ const AppointmentPage = ({ config = {} }) => {
       console.log(selectedAppointment, 'selectedAppointment')
       console.log(callConfig, 'callConfig')
       const response = await initiateConsultation(selectedAppointment, callConfig);
+      console.log(response.status, 'response')
       if (response.status === 401 || response.status === 403) {
-        setCallError("Session expired. Please try again.");
-        setCallLoading(false);
+        // Token expired — clear stored token and trigger re-login (same as fetchAppointments)
+        try {
+          if (typeof localStorage !== "undefined") {
+            localStorage.removeItem(STORAGE_KEY_APP_TOKEN);
+            localStorage.removeItem(STORAGE_KEY_DOCTOR_ID);
+            localStorage.removeItem(STORAGE_KEY_USER_NAME);
+          }
+        } catch (e) {}
+        setAppToken(null);
+        setDoctorIdFromLogin(null);
+        setUserName(null);
+        setRefreshLoginTrigger((t) => t + 1);
+        setCallError("Session expired. Re-authenticating...");
         return;
       }
       if (response.err || !response.data?.token) {
         setCallError(String(response.err || "Failed to initiate call"));
-        setCallLoading(false);
         return;
       }
       const joinCallUrlBase = config.joinCallUrl || JOIN_CALL_URL;
       const joinCallUrl = response.data.token ? String(joinCallUrlBase || "").replace(/\/?$/, "/") + response.data.token : "";
       console.log("joinCallUrl", joinCallUrl)
       setCallToken(response.data.token);
-      // setCallUrl(response.data.url || "");
       setCallUrl(joinCallUrl || '');
       setShowPipVideo(true);
       setIsPipMinimized(false);
@@ -531,7 +554,6 @@ const AppointmentPage = ({ config = {} }) => {
     } catch (err) {
       setCallError(err.message || "Failed to initiate call");
     } finally {
-      setCallError(null);
       setCallLoading(false);
     }
   };
@@ -761,9 +783,10 @@ const AppointmentPage = ({ config = {} }) => {
     return () => { cancelled = true; };
   }, [apiBaseUrl, hospitalId, idToken, email, refreshLoginTrigger]);
 
-  // Reset page to 1 when filters change
+  // Reset page to 1 and clear call error when filters/tab change
   useEffect(() => {
     setCurrentPage(1);
+    setCallError(null);
   }, [activeTab, selectedDate, fromDate, toDate, searchQuery, appointmentTypeFilter]);
 
   // Fetch appointments when we have appToken (tab/date change triggers refetch via fetchAppointments deps)
@@ -1184,7 +1207,7 @@ const AppointmentPage = ({ config = {} }) => {
 
           {/* Date Filter + Type of Appointment Filter */}
           <div style={{ display: "flex", gap: "8px", alignItems: "center", width: isMobile ? "auto" : "auto", position: "relative", justifyContent: isMobile ? "flex-start" : "flex-end", flexWrap: "wrap" }}>
-            {/* Type of Appointment Filter */}
+            {/* Type of Appointment Filter 
             <div style={{ position: "relative" }} data-appointment-type-picker>
               <button
                 onClick={() => setShowAppointmentTypePicker(!showAppointmentTypePicker)}
@@ -1280,6 +1303,7 @@ const AppointmentPage = ({ config = {} }) => {
                 </div>
               )}
             </div>
+            */}
             {/* Date Filter */}
             <button
               onClick={() => {
@@ -2104,7 +2128,7 @@ const AppointmentPage = ({ config = {} }) => {
             background: "#FFFFFF",
             borderRadius: isPipFullscreen ? "0" : "8px",
             boxShadow: "0 8px 24px rgba(0, 0, 0, 0.3)",
-            zIndex: 10000,
+            zIndex: 100000,
             overflow: "hidden",
             display: "flex",
             flexDirection: "column",

package/src/services/appointmentService.js

@@ -13,7 +13,7 @@ import {
  * @param {object} config - Optional configuration { apiBaseUrl, hospitalId, doctorId }
  * @returns {Promise} Appointments data
  */
-export const getAppointmentsByStatus = async (status, fromDate, toDate, type, config = {}) => {
+export const getAppointmentsByStatus = async (status, fromDate, toDate, config = {}) => {
   // Map status to API format
   let apiStatus = (status || "").toUpperCase();
 
@@ -22,14 +22,15 @@ export const getAppointmentsByStatus = async (status, fromDate, toDate, type, co
   }
 
   const baseURL = config.apiBaseUrl;
-  const hospitalId = config.hospitalId || DEFAULT_PARAMS.hospitalId;
+  const hospitalId = config.hospitalId;
   const doctorId = config.doctorId;
   const token = config.token || '';
 
   const params = { hospitalId, doctorId, fromDate, toDate, statuses: apiStatus };
-  if (type && String(type).toUpperCase() !== "ALL") {
-    params.appointmentType = String(type).toUpperCase();
-  }
+  // if (type && String(type).toUpperCase() !== "ALL") {
+  //   params.appointmentType = String(type).toUpperCase();
+  // }
+  params.appointmentType = 'ONLINE';
   const url = `${baseURL}${API_PATHS.APPOINTMENTS}`;
 
   // Return raw response (including status) so caller can detect 401 and re-login
@@ -76,7 +77,7 @@ export const initiateConsultation = async (appointment, config = {}) => {
   const body = {
     patientId: String(appointment.patientId || ""),
     primaryPatientId: String(appointment.primaryPatientId || appointment.patientId || ""),
-    hospitalId: config.hospitalId || DEFAULT_PARAMS.hospitalId,
+    hospitalId: config.hospitalId,
     doctorId: String(config.doctorId),
     patientName: appointment.patientName || appointment.name || "",
     doctorName: appointment.doctorName || config.doctorName,