pih-appointment-widget 0.0.15 → 0.0.17

package/dist/components/AppointmentPage.js

@@ -41,6 +41,7 @@ function extractDoctorIdFromLoginResponse(response) {
   var _ref4, _response$data$doctor;
   if (!(response !== null && response !== void 0 && response.data)) return null;
   const id = (_ref4 = (_response$data$doctor = response.data.doctor_id) !== null && _response$data$doctor !== void 0 ? _response$data$doctor : response.data.doctorId) !== null && _ref4 !== void 0 ? _ref4 : null;
+  console.log(id, 'extractDoctorIdFromLoginResponse -> id');
   return id != null ? String(id) : null;
 }
 function extractUserNameFromLoginResponse(response) {
@@ -195,6 +196,7 @@ const AppointmentPage = _ref7 => {
     }
   });
   const [tokenError, setTokenError] = (0, _react.useState)(null);
+  const [redirectToHome, setRedirectToHome] = (0, _react.useState)(false);
   const [refreshLoginTrigger, setRefreshLoginTrigger] = (0, _react.useState)(0);
 
   // When we have appToken (e.g. from localStorage after refresh), never show loading — show main UI
@@ -202,6 +204,29 @@ const AppointmentPage = _ref7 => {
     if (appToken && tokenLoading) setTokenLoading(false);
   }, [appToken, tokenLoading]);
 
+  // No credentials: show error and auto-redirect to home
+  (0, _react.useEffect)(() => {
+    if (appToken) return;
+    if (!idToken || !email) {
+      setTokenError("Sign in required. Redirecting to home...");
+      setRedirectToHome(true);
+    } else {
+      setRedirectToHome(false);
+      setTokenError(prev => prev === "Sign in required. Redirecting to home..." ? null : prev);
+    }
+  }, [appToken, idToken, email]);
+
+  // Auto-redirect to home when error popup is shown (no credentials or 400)
+  (0, _react.useEffect)(() => {
+    if (!redirectToHome) return;
+    const homeUrl = config.homeUrl || _apiConfig.WEB_URL || "";
+    if (!homeUrl || typeof window === "undefined") return;
+    const t = setTimeout(() => {
+      window.location.href = homeUrl;
+    }, 2500);
+    return () => clearTimeout(t);
+  }, [redirectToHome, config.homeUrl]);
+
   // Timeout so we never show "Checking authorisation..." forever (no blank-like infinite loading)
   (0, _react.useEffect)(() => {
     if (!tokenLoading) return;
@@ -406,7 +431,8 @@ const AppointmentPage = _ref7 => {
   };
   const fetchAppointments = (0, _react.useCallback)(async () => {
     if (!appToken) return;
-    const doctorId = doctorIdFromLogin || _apiConfig.DEFAULT_PARAMS.doctorId;
+    console.log(doctorIdFromLogin, 'fetchAppointments -> doctorIdFromLogin');
+    const doctorId = doctorIdFromLogin;
     setLoading(true);
     setError(null);
     try {
@@ -485,7 +511,7 @@ const AppointmentPage = _ref7 => {
       const callConfig = {
         apiBaseUrl,
         hospitalId,
-        doctorId: doctorIdFromLogin || _apiConfig.DEFAULT_PARAMS.doctorId,
+        doctorId: doctorIdFromLogin,
         doctorName: userName || displayName,
         appToken
       };
@@ -705,16 +731,10 @@ const AppointmentPage = _ref7 => {
       if (cancelled) return;
       const token = extractAppToken(response);
       if (response.status === 400) {
-        // Login API returned 400 — show error message then redirect to home
-        const message = response.err + " " + ' Redirecting to home...' || "Invalid user. Redirecting to home...";
-        setTokenError(message);
+        // Login API returned 400 — show error popup and auto-redirect to home
+        setTokenError(response.err || "Invalid request. Redirecting to home...");
         setTokenLoading(false);
-        const homeUrl = config.homeUrl || _apiConfig.WEB_URL || "";
-        if (homeUrl && typeof window !== "undefined") {
-          setTimeout(() => {
-            window.location.href = homeUrl;
-          }, 3000);
-        }
+        setRedirectToHome(true);
         return;
       }
       if (response.err || !token) {
@@ -731,11 +751,13 @@ const AppointmentPage = _ref7 => {
         } catch (e) {}
       } else {
         const doctorId = extractDoctorIdFromLoginResponse(response);
+        console.log(doctorId, 'extractDoctorIdFromLoginResponse -> doctorId');
         const name = extractUserNameFromLoginResponse(response);
         setAppToken(token);
         setDoctorIdFromLogin(doctorId);
         setUserName(name);
         setTokenError(null);
+        setRedirectToHome(false);
         try {
           if (typeof localStorage !== "undefined") {
             localStorage.setItem(STORAGE_KEY_APP_TOKEN, token);
@@ -801,58 +823,11 @@ const AppointmentPage = _ref7 => {
   }, [showDatePicker]);
   let fontFamily = '"Nunito", serif';
 
-  // When token API fails, show only "Not authorized" / "Not found" — do not show the full Tele Consultation UI
+  // Error as popup overlay (main page stays in background); auto-redirect to home
+  const showAuthError = tokenError || !appToken && (!idToken || !email);
+  const authErrorMessage = tokenError || "Sign in required. Redirecting to home...";
   let content;
-  if (tokenError) {
-    content = /*#__PURE__*/_react.default.createElement("div", {
-      style: {
-        fontFamily,
-        background: "#F5F5F7",
-        boxSizing: "border-box",
-        height: "100vh",
-        display: "flex",
-        flexDirection: "column",
-        alignItems: "center",
-        justifyContent: "center",
-        padding: "24px",
-        textAlign: "center"
-      }
-    }, /*#__PURE__*/_react.default.createElement("div", {
-      style: {
-        maxWidth: "400px",
-        padding: "32px 24px",
-        background: "#FFFFFF",
-        borderRadius: "12px",
-        boxShadow: "0 4px 20px rgba(0,0,0,0.08)"
-      }
-    }, /*#__PURE__*/_react.default.createElement("div", {
-      style: {
-        fontSize: "48px",
-        marginBottom: "16px"
-      }
-    }, "\uD83D\uDD12"), /*#__PURE__*/_react.default.createElement("h2", {
-      style: {
-        fontSize: "20px",
-        fontWeight: 700,
-        color: "#1a1a1a",
-        margin: "0 0 8px 0"
-      }
-    }, "Not authorised"), /*#__PURE__*/_react.default.createElement("p", {
-      style: {
-        fontSize: "14px",
-        color: "#666",
-        margin: 0,
-        lineHeight: 1.5
-      }
-    }, tokenError), /*#__PURE__*/_react.default.createElement("p", {
-      style: {
-        fontSize: "13px",
-        color: "#999",
-        marginTop: "16px",
-        marginBottom: 0
-      }
-    }, "You are not authorised to use this service. Please sign in again or contact support.")));
-  } else if (tokenLoading && idToken && email) {
+  if (tokenLoading && idToken && email) {
     // While checking token (SSO in progress), show a simple loading state instead of the full UI
     content = /*#__PURE__*/_react.default.createElement("div", {
       style: {
@@ -884,7 +859,7 @@ const AppointmentPage = _ref7 => {
       }
     }, "Checking authorisation..."));
   } else {
-    content = /*#__PURE__*/_react.default.createElement("div", {
+    content = /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
       style: {
         fontFamily,
         background: "#F5F5F7",
@@ -945,7 +920,7 @@ const AppointmentPage = _ref7 => {
         fontSize: "16px"
       },
       title: "Clear search"
-    }, "\u2715")), /*#__PURE__*/_react.default.createElement("div", {
+    }, "\u2715")), false && /*#__PURE__*/_react.default.createElement("div", {
       style: {
         display: "flex",
         alignItems: "center",
@@ -2325,7 +2300,56 @@ const AppointmentPage = _ref7 => {
         pointerEvents: "none",
         zIndex: 10002
       }
-    })), /*#__PURE__*/_react.default.createElement("style", null, "\n            @keyframes pulse {\n              0%, 100% { opacity: 1; }\n              50% { opacity: 0.5; }\n            }\n          ")));
+    })), /*#__PURE__*/_react.default.createElement("style", null, "\n            @keyframes pulse {\n              0%, 100% { opacity: 1; }\n              50% { opacity: 0.5; }\n            }\n          "))), showAuthError && /*#__PURE__*/_react.default.createElement("div", {
+      style: {
+        position: "fixed",
+        inset: 0,
+        zIndex: 100000,
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        padding: "24px",
+        background: "rgba(0,0,0,0.4)",
+        boxSizing: "border-box"
+      }
+    }, /*#__PURE__*/_react.default.createElement("div", {
+      style: {
+        fontFamily,
+        maxWidth: "400px",
+        width: "100%",
+        padding: "32px 24px",
+        background: "#FFFFFF",
+        borderRadius: "12px",
+        boxShadow: "0 8px 32px rgba(0,0,0,0.2)",
+        textAlign: "center"
+      }
+    }, /*#__PURE__*/_react.default.createElement("div", {
+      style: {
+        fontSize: "48px",
+        marginBottom: "16px"
+      }
+    }, "\uD83D\uDD12"), /*#__PURE__*/_react.default.createElement("h2", {
+      style: {
+        fontSize: "20px",
+        fontWeight: 700,
+        color: "#1a1a1a",
+        margin: "0 0 8px 0"
+      }
+    }, tokenError ? "Not authorised" : "Sign in required"), /*#__PURE__*/_react.default.createElement("p", {
+      style: {
+        fontSize: "14px",
+        color: "#666",
+        margin: 0,
+        lineHeight: 1.5
+      }
+    }, authErrorMessage), /*#__PURE__*/_react.default.createElement("p", {
+      style: {
+        fontSize: "13px",
+        color: "#999",
+        marginTop: "16px",
+        marginBottom: 0
+      }
+    }, "Redirecting to login..."))));
   }
   return /*#__PURE__*/_react.default.createElement(AppointmentErrorBoundary, null, content);
 };

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

@@ -269,6 +269,7 @@
     var _ref4, _response$data$doctor;
     if (!(response !== null && response !== void 0 && response.data)) return null;
     const id = (_ref4 = (_response$data$doctor = response.data.doctor_id) !== null && _response$data$doctor !== void 0 ? _response$data$doctor : response.data.doctorId) !== null && _ref4 !== void 0 ? _ref4 : null;
+    console.log(id, 'extractDoctorIdFromLoginResponse -> id');
     return id != null ? String(id) : null;
   }
   function extractUserNameFromLoginResponse(response) {
@@ -423,6 +424,7 @@
       }
     });
     const [tokenError, setTokenError] = React.useState(null);
+    const [redirectToHome, setRedirectToHome] = React.useState(false);
     const [refreshLoginTrigger, setRefreshLoginTrigger] = React.useState(0);
 
     // When we have appToken (e.g. from localStorage after refresh), never show loading — show main UI
@@ -430,6 +432,29 @@
       if (appToken && tokenLoading) setTokenLoading(false);
     }, [appToken, tokenLoading]);
 
+    // No credentials: show error and auto-redirect to home
+    React.useEffect(() => {
+      if (appToken) return;
+      if (!idToken || !email) {
+        setTokenError("Sign in required. Redirecting to home...");
+        setRedirectToHome(true);
+      } else {
+        setRedirectToHome(false);
+        setTokenError(prev => prev === "Sign in required. Redirecting to home..." ? null : prev);
+      }
+    }, [appToken, idToken, email]);
+
+    // Auto-redirect to home when error popup is shown (no credentials or 400)
+    React.useEffect(() => {
+      if (!redirectToHome) return;
+      const homeUrl = config.homeUrl || WEB_URL || "";
+      if (!homeUrl || typeof window === "undefined") return;
+      const t = setTimeout(() => {
+        window.location.href = homeUrl;
+      }, 2500);
+      return () => clearTimeout(t);
+    }, [redirectToHome, config.homeUrl]);
+
     // Timeout so we never show "Checking authorisation..." forever (no blank-like infinite loading)
     React.useEffect(() => {
       if (!tokenLoading) return;
@@ -557,7 +582,7 @@
     });
 
     // Profile dropdown (logout)
-    const [showProfileDropdown, setShowProfileDropdown] = React.useState(false);
+    React.useState(false);
 
     // Pagination state (Frontend only)
     const [currentPage, setCurrentPage] = React.useState(1);
@@ -634,7 +659,8 @@
     };
     const fetchAppointments = React.useCallback(async () => {
       if (!appToken) return;
-      const doctorId = doctorIdFromLogin || DEFAULT_PARAMS.doctorId;
+      console.log(doctorIdFromLogin, 'fetchAppointments -> doctorIdFromLogin');
+      const doctorId = doctorIdFromLogin;
       setLoading(true);
       setError(null);
       try {
@@ -685,24 +711,6 @@
       setSelectedAppointment(appointment);
     };
 
-    // Logout: clear storage and redirect to login page
-    const handleLogout = () => {
-      try {
-        if (typeof localStorage !== "undefined") {
-          localStorage.removeItem(STORAGE_KEY_ID_TOKEN);
-          localStorage.removeItem(STORAGE_KEY_EMAIL);
-          localStorage.removeItem(STORAGE_KEY_APP_TOKEN);
-          localStorage.removeItem(STORAGE_KEY_DOCTOR_ID);
-          localStorage.removeItem(STORAGE_KEY_USER_NAME);
-        }
-      } catch (e) {}
-      setShowProfileDropdown(false);
-      const homeUrl = config.homeUrl || WEB_URL || "";
-      if (homeUrl && typeof window !== "undefined") {
-        window.location.href = homeUrl;
-      }
-    };
-
     // Handle join call — call initiate API to get LiveKit token+url, then open PiP
     const handleJoinCall = async () => {
       if (!selectedAppointment || !appToken) return;
@@ -713,7 +721,7 @@
         const callConfig = {
           apiBaseUrl,
           hospitalId,
-          doctorId: doctorIdFromLogin || DEFAULT_PARAMS.doctorId,
+          doctorId: doctorIdFromLogin,
           doctorName: userName || displayName,
           appToken
         };
@@ -933,16 +941,10 @@
         if (cancelled) return;
         const token = extractAppToken(response);
         if (response.status === 400) {
-          // Login API returned 400 — show error message then redirect to home
-          const message = response.err + " " + ' Redirecting to home...' || "Invalid user. Redirecting to home...";
-          setTokenError(message);
+          // Login API returned 400 — show error popup and auto-redirect to home
+          setTokenError(response.err || "Invalid request. Redirecting to home...");
           setTokenLoading(false);
-          const homeUrl = config.homeUrl || WEB_URL || "";
-          if (homeUrl && typeof window !== "undefined") {
-            setTimeout(() => {
-              window.location.href = homeUrl;
-            }, 3000);
-          }
+          setRedirectToHome(true);
           return;
         }
         if (response.err || !token) {
@@ -959,11 +961,13 @@
           } catch (e) {}
         } else {
           const doctorId = extractDoctorIdFromLoginResponse(response);
+          console.log(doctorId, 'extractDoctorIdFromLoginResponse -> doctorId');
           const name = extractUserNameFromLoginResponse(response);
           setAppToken(token);
           setDoctorIdFromLogin(doctorId);
           setUserName(name);
           setTokenError(null);
+          setRedirectToHome(false);
           try {
             if (typeof localStorage !== "undefined") {
               localStorage.setItem(STORAGE_KEY_APP_TOKEN, token);
@@ -1029,58 +1033,11 @@
     }, [showDatePicker]);
     let fontFamily = '"Nunito", serif';
 
-    // When token API fails, show only "Not authorized" / "Not found" — do not show the full Tele Consultation UI
+    // Error as popup overlay (main page stays in background); auto-redirect to home
+    const showAuthError = tokenError || !appToken && (!idToken || !email);
+    const authErrorMessage = tokenError || "Sign in required. Redirecting to home...";
     let content;
-    if (tokenError) {
-      content = /*#__PURE__*/React__default["default"].createElement("div", {
-        style: {
-          fontFamily,
-          background: "#F5F5F7",
-          boxSizing: "border-box",
-          height: "100vh",
-          display: "flex",
-          flexDirection: "column",
-          alignItems: "center",
-          justifyContent: "center",
-          padding: "24px",
-          textAlign: "center"
-        }
-      }, /*#__PURE__*/React__default["default"].createElement("div", {
-        style: {
-          maxWidth: "400px",
-          padding: "32px 24px",
-          background: "#FFFFFF",
-          borderRadius: "12px",
-          boxShadow: "0 4px 20px rgba(0,0,0,0.08)"
-        }
-      }, /*#__PURE__*/React__default["default"].createElement("div", {
-        style: {
-          fontSize: "48px",
-          marginBottom: "16px"
-        }
-      }, "\uD83D\uDD12"), /*#__PURE__*/React__default["default"].createElement("h2", {
-        style: {
-          fontSize: "20px",
-          fontWeight: 700,
-          color: "#1a1a1a",
-          margin: "0 0 8px 0"
-        }
-      }, "Not authorised"), /*#__PURE__*/React__default["default"].createElement("p", {
-        style: {
-          fontSize: "14px",
-          color: "#666",
-          margin: 0,
-          lineHeight: 1.5
-        }
-      }, tokenError), /*#__PURE__*/React__default["default"].createElement("p", {
-        style: {
-          fontSize: "13px",
-          color: "#999",
-          marginTop: "16px",
-          marginBottom: 0
-        }
-      }, "You are not authorised to use this service. Please sign in again or contact support.")));
-    } else if (tokenLoading && idToken && email) {
+    if (tokenLoading && idToken && email) {
       // While checking token (SSO in progress), show a simple loading state instead of the full UI
       content = /*#__PURE__*/React__default["default"].createElement("div", {
         style: {
@@ -1112,7 +1069,7 @@
         }
       }, "Checking authorisation..."));
     } else {
-      content = /*#__PURE__*/React__default["default"].createElement("div", {
+      content = /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
         style: {
           fontFamily,
           background: "#F5F5F7",
@@ -1173,153 +1130,7 @@
           fontSize: "16px"
         },
         title: "Clear search"
-      }, "\u2715")), /*#__PURE__*/React__default["default"].createElement("div", {
-        style: {
-          display: "flex",
-          alignItems: "center",
-          gap: isMobile ? "10px" : "16px"
-        }
-      }, /*#__PURE__*/React__default["default"].createElement("div", {
-        style: {
-          position: "relative",
-          cursor: "pointer"
-        }
-      }, /*#__PURE__*/React__default["default"].createElement("svg", {
-        width: "20",
-        height: "20",
-        viewBox: "0 0 24 24",
-        fill: "none",
-        stroke: "#555",
-        strokeWidth: "2",
-        strokeLinecap: "round",
-        strokeLinejoin: "round"
-      }, /*#__PURE__*/React__default["default"].createElement("path", {
-        d: "M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9"
-      }), /*#__PURE__*/React__default["default"].createElement("path", {
-        d: "M13.73 21a2 2 0 0 1-3.46 0"
-      })), /*#__PURE__*/React__default["default"].createElement("span", {
-        style: {
-          position: "absolute",
-          top: "-5px",
-          right: "-5px",
-          background: "#1CC3CE",
-          color: "white",
-          borderRadius: "50%",
-          width: "16px",
-          height: "16px",
-          fontSize: "10px",
-          fontWeight: 600,
-          display: "flex",
-          alignItems: "center",
-          justifyContent: "center"
-        }
-      }, "1")), /*#__PURE__*/React__default["default"].createElement("div", {
-        style: {
-          position: "relative"
-        }
-      }, /*#__PURE__*/React__default["default"].createElement("button", {
-        type: "button",
-        onClick: () => setShowProfileDropdown(v => !v),
-        style: {
-          display: "flex",
-          alignItems: "center",
-          gap: "8px",
-          background: "none",
-          border: "none",
-          cursor: "pointer",
-          padding: "4px 0",
-          fontFamily
-        },
-        "aria-expanded": showProfileDropdown,
-        "aria-haspopup": "true"
-      }, !isMobile && /*#__PURE__*/React__default["default"].createElement("span", {
-        style: {
-          fontSize: "13px",
-          color: "#555"
-        }
-      }, "Hello, ", /*#__PURE__*/React__default["default"].createElement("strong", {
-        style: {
-          color: "#1a1a1a"
-        }
-      }, displayName)), /*#__PURE__*/React__default["default"].createElement("img", {
-        src: "https://w7.pngwing.com/pngs/340/946/png-transparent-avatar-user-computer-icons-software-developer-avatar-child-face-heroes-thumbnail.png",
-        alt: "User",
-        style: {
-          width: "32px",
-          height: "32px",
-          borderRadius: "50%",
-          objectFit: "cover"
-        }
-      }), /*#__PURE__*/React__default["default"].createElement("svg", {
-        width: "12",
-        height: "12",
-        viewBox: "0 0 24 24",
-        fill: "none",
-        stroke: "currentColor",
-        strokeWidth: "2",
-        style: {
-          flexShrink: 0,
-          opacity: showProfileDropdown ? 0.8 : 0.5
-        }
-      }, /*#__PURE__*/React__default["default"].createElement("polyline", {
-        points: "6 9 12 15 18 9"
-      }))), showProfileDropdown && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
-        style: {
-          position: "fixed",
-          inset: 0,
-          zIndex: 9998
-        },
-        onClick: () => setShowProfileDropdown(false),
-        "aria-hidden": "true"
-      }), /*#__PURE__*/React__default["default"].createElement("div", {
-        style: {
-          position: "absolute",
-          right: 0,
-          top: "100%",
-          marginTop: "4px",
-          minWidth: "140px",
-          background: "#FFFFFF",
-          border: "1px solid #E5E5E5",
-          borderRadius: "8px",
-          boxShadow: "0 4px 16px rgba(0,0,0,0.12)",
-          zIndex: 9999,
-          overflow: "hidden"
-        }
-      }, /*#__PURE__*/React__default["default"].createElement("button", {
-        type: "button",
-        onClick: handleLogout,
-        style: {
-          width: "100%",
-          padding: "10px 14px",
-          textAlign: "left",
-          background: "none",
-          border: "none",
-          cursor: "pointer",
-          fontSize: "13px",
-          fontFamily,
-          color: "#e53935",
-          fontWeight: 500,
-          display: "flex",
-          alignItems: "center",
-          gap: "8px"
-        }
-      }, /*#__PURE__*/React__default["default"].createElement("svg", {
-        width: "16",
-        height: "16",
-        viewBox: "0 0 24 24",
-        fill: "none",
-        stroke: "currentColor",
-        strokeWidth: "2"
-      }, /*#__PURE__*/React__default["default"].createElement("path", {
-        d: "M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4"
-      }), /*#__PURE__*/React__default["default"].createElement("polyline", {
-        points: "16 17 21 12 16 7"
-      }), /*#__PURE__*/React__default["default"].createElement("line", {
-        x1: "21",
-        y1: "12",
-        x2: "9",
-        y2: "12"
-      })), "Logout")))))), /*#__PURE__*/React__default["default"].createElement("div", {
+      }, "\u2715")), false ), /*#__PURE__*/React__default["default"].createElement("div", {
         style: {
           padding: isMobile ? "12px" : "16px 24px",
           flex: 1,
@@ -2553,7 +2364,56 @@
           pointerEvents: "none",
           zIndex: 10002
         }
-      })), /*#__PURE__*/React__default["default"].createElement("style", null, "\n            @keyframes pulse {\n              0%, 100% { opacity: 1; }\n              50% { opacity: 0.5; }\n            }\n          ")));
+      })), /*#__PURE__*/React__default["default"].createElement("style", null, "\n            @keyframes pulse {\n              0%, 100% { opacity: 1; }\n              50% { opacity: 0.5; }\n            }\n          "))), showAuthError && /*#__PURE__*/React__default["default"].createElement("div", {
+        style: {
+          position: "fixed",
+          inset: 0,
+          zIndex: 100000,
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          padding: "24px",
+          background: "rgba(0,0,0,0.4)",
+          boxSizing: "border-box"
+        }
+      }, /*#__PURE__*/React__default["default"].createElement("div", {
+        style: {
+          fontFamily,
+          maxWidth: "400px",
+          width: "100%",
+          padding: "32px 24px",
+          background: "#FFFFFF",
+          borderRadius: "12px",
+          boxShadow: "0 8px 32px rgba(0,0,0,0.2)",
+          textAlign: "center"
+        }
+      }, /*#__PURE__*/React__default["default"].createElement("div", {
+        style: {
+          fontSize: "48px",
+          marginBottom: "16px"
+        }
+      }, "\uD83D\uDD12"), /*#__PURE__*/React__default["default"].createElement("h2", {
+        style: {
+          fontSize: "20px",
+          fontWeight: 700,
+          color: "#1a1a1a",
+          margin: "0 0 8px 0"
+        }
+      }, tokenError ? "Not authorised" : "Sign in required"), /*#__PURE__*/React__default["default"].createElement("p", {
+        style: {
+          fontSize: "14px",
+          color: "#666",
+          margin: 0,
+          lineHeight: 1.5
+        }
+      }, authErrorMessage), /*#__PURE__*/React__default["default"].createElement("p", {
+        style: {
+          fontSize: "13px",
+          color: "#999",
+          marginTop: "16px",
+          marginBottom: 0
+        }
+      }, "Redirecting to login..."))));
     }
     return /*#__PURE__*/React__default["default"].createElement(AppointmentErrorBoundary, null, content);
   };

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),l=o(n);function i(e,t,n){return(t=function(e){var t=function(e,t){if("object"!=typeof e||!e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var o=n.call(e,t||"default");if("object"!=typeof o)return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"==typeof t?t:t+""}(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}const r="https://afiyaapiqa.powermindinc.com",d="/appointment/V1/consultant/all-appointments",s="/notification/V1/consultation/online/initiate",p="dMtEGhak",c=6694,u="https://wbafedevittisalwe01-had2b3e0a7h6fyey.westeurope-01.azurewebsites.net/call/",f="https://wbaemrdevittisalwe01-fnapdpfme7bvduhh.westeurope-01.azurewebsites.net/",m=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 l=o.apiBaseUrl||r,i=o.hospitalId||p,s=o.doctorId||c,u=o.token||"",f={hospitalId:i,doctorId:s,fromDate:t,toDate:n,statuses:a},m="".concat(l).concat(d),x=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);o.search=new URLSearchParams(t).toString();const a={method:"GET",headers:{"Content-Type":"application/json",Authorization:"".concat(n)}};return fetch(o,a).then(async e=>{const t=await e.json().catch(()=>({}));var n;return e.ok?t:{err:(null==t||null===(n=t.resultInfo)||void 0===n?void 0:n.message)||"Something went wrong!",status:e.status}}).catch(e=>(console.error("Fetch error:",e),{err:(null==e?void 0:e.message)||String(e)||"Network error"}))}(m,f,"PIH-Appointment-Widget",u);return x},x=async function(e){let t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};const n=(t.apiBaseUrl||r).replace(/\/$/,""),o="".concat(n).concat(s),a=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 l={"Content-Type":"application/json"};o&&(l.Authorization=o);const i={method:"POST",headers:l,body:JSON.stringify(t)};return fetch(a.toString(),i).then(async e=>{const t=await e.json().catch(()=>({}));var n;return e.ok?t:{err:(null==t||null===(n=t.resultInfo)||void 0===n?void 0:n.message)||"Something went wrong!",status:e.status}}).catch(e=>(console.error("Fetch error:",e),{err:e.message||"Network error"}))}(o,{patientId:String(e.patientId||""),primaryPatientId:String(e.primaryPatientId||e.patientId||""),hospitalId:t.hospitalId||p,doctorId:String(t.doctor_id||c),patientName:e.patientName||e.name||"",doctorName:e.doctorName||t.doctorName,appointmentId:String(e.id||e.appointmentId||e._id||"")},"PIH-Appointment-Widget",{},a)};const g="pih_appointment_idToken",h="pih_appointment_email",y="pih_appointment_appToken",E="pih_appointment_doctorId",v="pih_appointment_userName";class b extends t.Component{constructor(){super(...arguments),i(this,"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",{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 F=e=>{let{config:n={}}=e;const o=n.apiBaseUrl||r,l=n.hospitalId||p,[i,d]=t.useState(()=>{try{return"undefined"!=typeof localStorage?localStorage.getItem(g):null}catch(e){return null}}),[s,F]=t.useState(()=>{try{return"undefined"!=typeof localStorage?localStorage.getItem(h):null}catch(e){return null}}),w=n.idToken||n.token||i,S=n.email||s;t.useEffect(()=>{try{if("undefined"==typeof localStorage)return;const e=n.idToken||n.token;if(e&&String(e).trim()){localStorage.getItem(g)!==e&&(C(null),z(null),W(null),localStorage.removeItem(y),localStorage.removeItem(E),localStorage.removeItem(v)),localStorage.setItem(g,e),d(e)}n.email&&String(n.email).trim()&&(localStorage.setItem(h,n.email),F(n.email))}catch(e){}},[n.idToken,n.token,n.email]);const[k,C]=t.useState(()=>{try{return"undefined"!=typeof localStorage?localStorage.getItem(y):null}catch(e){return null}}),[I,z]=t.useState(()=>{try{return"undefined"!=typeof localStorage?localStorage.getItem(E):null}catch(e){return null}}),[D,W]=t.useState(()=>{try{return"undefined"!=typeof localStorage?localStorage.getItem(v):null}catch(e){return null}}),[T,M]=t.useState(()=>{try{if("undefined"==typeof localStorage)return!1;const e=localStorage.getItem(y),t=localStorage.getItem(g),n=localStorage.getItem(h);return!e&&!(!t||!n)}catch(e){return!1}}),[A,R]=t.useState(null),[j,N]=t.useState(0);t.useEffect(()=>{k&&T&&M(!1)},[k,T]),t.useEffect(()=>{if(!T)return;const e=setTimeout(()=>{R("Request timed out. Please try again."),M(!1)},3e4);return()=>clearTimeout(e)},[T]);const B=n.joinCallUrl||u;k&&String(B||"").replace(/\/?$/,"/");const L=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(e){return{}}}(w),H=D||L.name||L.sub||"User",P=()=>(new Date).toISOString().split("T")[0],[Y,O]=t.useState("upcoming"),[_,U]=t.useState([]),[V,X]=t.useState(null),[$,q]=t.useState(!1),[G,J]=t.useState(null),[K,Q]=t.useState(window.innerWidth<768),[Z,ee]=t.useState("today"),[te,ne]=t.useState("today"),[oe,ae]=t.useState(!1),[le,ie]=t.useState("asc"),[re,de]=t.useState(""),[se,pe]=t.useState(!1),[ce,ue]=t.useState(!1),[fe,me]=t.useState(!1),[xe,ge]=t.useState(null),[he,ye]=t.useState(null),[Ee,ve]=t.useState(!1),[be,Fe]=t.useState(null),[we,Se]=t.useState({x:window.innerWidth-550,y:80}),[ke,Ce]=t.useState({width:550,height:450}),[Ie,ze]=t.useState(!1),[De,We]=t.useState({x:0,y:0}),[Te,Me]=t.useState(!1),[Ae,Re]=t.useState(null),[je,Ne]=t.useState({x:0,y:0,width:0,height:0}),[Be,Le]=t.useState(!1),[He,Pe]=t.useState(1),Ye=_.filter(e=>{if(!re.trim())return!0;const t=re.toLowerCase(),n=(e.patientName||"").toLowerCase(),o=String(e.patientId||"").toLowerCase();return n.includes(t)||o.includes(t)}),Oe=20*(He-1),_e=Oe+20,Ue=Ye.slice(Oe,_e),Ve=Math.ceil(Ye.length/20),Xe=Ye.length,[$e,qe]=t.useState(P()),[Ge,Je]=t.useState(P()),[Ke,Qe]=t.useState(),[Ze,et]=t.useState(),tt=e=>(null==e?void 0:e.id)||(null==e?void 0:e._id)||(null==e?void 0:e.appointmentId)||(null==e?void 0:e.patientId)||JSON.stringify(e),nt=e=>null!=e&&e.image?e.image:null,ot=e=>e?e.charAt(0).toUpperCase():"?",at=e=>{if(!e)return"#4C4DDC";const t=["#4C4DDC","#1CC3CE","#FF6B6B","#4ECDC4","#45B7D1","#FFA07A","#98D8C8","#F7DC6F"];return t[e.charCodeAt(0)%t.length]},lt=()=>{const e="asc"===le?"desc":"asc";ie(e);const t=[..._].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});U(t),Pe(1),t.length>0&&X(t[0])},it=t.useCallback(async()=>{if(!k)return;const e=I||c;q(!0),J(null);try{const t={apiBaseUrl:o,hospitalId:l,doctorId:e,token:k},n=await m(Y,$e,Ge,t);if(401===n.status||403===n.status){try{"undefined"!=typeof localStorage&&(localStorage.removeItem(y),localStorage.removeItem(E),localStorage.removeItem(v))}catch(e){}return C(null),z(null),W(null),N(e=>e+1),void J("Session expired. Re-authenticating...")}if(n.err)return void J(String(n.err||"Failed to fetch appointments"));const a=n.data||n.appointments||n||[];U(Array.isArray(a)?a:[]),Array.isArray(a)&&a.length>0?X(a[0]):X(null)}catch(e){console.error("Error fetching appointments:",e),J(e.message||"Failed to fetch appointments")}finally{q(!1)}},[Y,$e,Ge,o,l,I,k]),rt=e=>{X(e)},dt=()=>{try{"undefined"!=typeof localStorage&&(localStorage.removeItem(g),localStorage.removeItem(h),localStorage.removeItem(y),localStorage.removeItem(E),localStorage.removeItem(v))}catch(e){}Le(!1);const e=n.homeUrl||f||"";e&&"undefined"!=typeof window&&(window.location.href=e)},st=async()=>{if(V&&k){ve(!0),Fe(null);try{var e;const t={apiBaseUrl:o,hospitalId:l,doctorId:I||c,doctorName:D||H,appToken:k};console.log(V,"selectedAppointment"),console.log(t,"callConfig");const a=await x(V,t);if(401===a.status||403===a.status)return Fe("Session expired. Please try again."),void ve(!1);if(a.err||null===(e=a.data)||void 0===e||!e.token)return Fe(String(a.err||"Failed to initiate call")),void ve(!1);const i=n.joinCallUrl||u,r=a.data.token?String(i||"").replace(/\/?$/,"/")+a.data.token:"";console.log("joinCallUrl",r),ge(a.data.token),ye(r||""),pe(!0),ue(!1),me(!1)}catch(e){Fe(e.message||"Failed to initiate call")}finally{ve(!1)}}},pt=()=>{pe(!1),ue(!1),me(!1),ge(null),ye(null),Fe(null)},ct=()=>{fe&&me(!1),ue(!ce)},ut=()=>{ce&&ue(!1),me(!fe)},ft=e=>{ze(!0);const t=e.currentTarget.getBoundingClientRect();We({x:e.clientX-t.left,y:e.clientY-t.top})},mt=t.useCallback(e=>{if(!fe)if(Ie){const t=e.clientX-De.x,n=e.clientY-De.y,o=window.innerWidth-ke.width,a=window.innerHeight-ke.height;Se({x:Math.max(0,Math.min(t,o)),y:Math.max(0,Math.min(n,a))})}else if(Te){const t=e.clientX-je.x,n=e.clientY-je.y;let o=je.width,a=je.height,l=je.posX,i=je.posY;const r=300,d=250,s=window.innerWidth-40,p=window.innerHeight-100;if("right"===Ae)o=Math.min(Math.max(je.width+t,r),s),l+o>window.innerWidth&&(o=window.innerWidth-l);else if("left"===Ae){const e=Math.min(Math.max(je.width-t,r),s),n=e-je.width;o=e,l=Math.max(0,je.posX-n),0===l&&(o=je.posX+je.width)}else if("bottom"===Ae)a=Math.min(Math.max(je.height+n,d),p),i+a>window.innerHeight&&(a=window.innerHeight-i);else if("top"===Ae){const e=Math.min(Math.max(je.height-n,d),p),t=e-je.height;a=e,i=Math.max(0,je.posY-t),0===i&&(a=je.posY+je.height)}Ce({width:o,height:a}),Se({x:l,y:i})}},[Ie,Te,De,Ae,je,we,ke,fe]),xt=()=>{ze(!1),Me(!1),Re(null)},gt=(e,t)=>{t.preventDefault(),t.stopPropagation(),Me(!0),Re(e),Ne({x:t.clientX,y:t.clientY,width:ke.width,height:ke.height,posX:we.x,posY:we.y})};t.useEffect(()=>{if(Ie||Te)return window.addEventListener("mousemove",mt),window.addEventListener("mouseup",xt),()=>{window.removeEventListener("mousemove",mt),window.removeEventListener("mouseup",xt)}},[Ie,Te,mt]),t.useEffect(()=>{if(!se||fe)return;const e=()=>{if(!(window.innerWidth<768)){const e=ce?350:ke.width,t=ce?60:ke.height,n=window.innerWidth-40,o=window.innerHeight-100,a=Math.min(e,n),l=Math.min(t,o);a===ke.width&&l===ke.height||Ce({width:a,height:l});const i=window.innerWidth-a-20,r=window.innerHeight-l-20;Se(e=>({x:Math.min(e.x,i),y:Math.min(e.y,r)}))}};return window.addEventListener("resize",e),()=>window.removeEventListener("resize",e)},[se,ce,fe,ke]),t.useEffect(()=>{if(!(w&&S&&(!k||j>0)))return;let e=!1;return M(!0),R(null),(async(e,t,n,o)=>{const a=e.replace(/\/$/,""),l="".concat(a,"/um/user/V1/sso/login?hospitalId=").concat(encodeURIComponent(t)),i={method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({idToken:n,email:o})};return console.log("[getTokenFromSso] request",{url:l,body:{idToken:n?n.slice(0,50)+"...":null,email:o}}),fetch(l,i).then(e=>(console.log("[getTokenFromSso] response status",e.status,e.statusText),e.ok?e.json().then(e=>{var t;return console.log("[getTokenFromSso] success",{hasData:!!e,dataKeys:e?Object.keys(e):[],hasAccessToken:!(null==e||null===(t=e.data)||void 0===t||!t.access_token)}),e}):e.json().then(t=>{var n;const o=(null==t||null===(n=t.resultInfo)||void 0===n?void 0:n.message)||"SSO login failed";return console.log("[getTokenFromSso] error body",t),{err:o,status:e.status}}).catch(()=>({err:"Something went wrong!",status:e.status})))).catch(e=>(console.error("[getTokenFromSso] catch",e),{err:e.message||"Network error"}))})(o,l,w,S).then(t=>{if(e)return;const o=function(e){var t,n,o,a,l,i;return!e||e.err?null:null!==(t=null!==(n=null!==(o=null!==(a=null===(l=e.data)||void 0===l?void 0:l.access_token)&&void 0!==a?a:null===(i=e.data)||void 0===i?void 0:i.token)&&void 0!==o?o:e.token)&&void 0!==n?n:e.accessToken)&&void 0!==t?t:null}(t);if(400===t.status){const e=t.err+"  Redirecting to home..."||"Invalid user. Redirecting to home...";R(e),M(!1);const o=n.homeUrl||f||"";return void(o&&"undefined"!=typeof window&&setTimeout(()=>{window.location.href=o},3e3))}if(t.err||!o){R(String(t.err||"Failed to get token")),C(null),z(null),W(null);try{"undefined"!=typeof localStorage&&(localStorage.removeItem(y),localStorage.removeItem(E),localStorage.removeItem(v))}catch(e){}}else{const e=function(e){var t,n;if(null==e||!e.data)return null;const o=null!==(t=null!==(n=e.data.doctor_id)&&void 0!==n?n:e.data.doctorId)&&void 0!==t?t:null;return null!=o?String(o):null}(t),n=function(e){var t,n,o;if(null==e||!e.data)return null;const a=null!==(t=null!==(n=null!==(o=e.data.name)&&void 0!==o?o:e.data.doctor_name)&&void 0!==n?n:e.data.userName)&&void 0!==t?t:null;return null!=a?String(a):null}(t);C(o),z(e),W(n),R(null);try{"undefined"!=typeof localStorage&&(localStorage.setItem(y,o),e&&localStorage.setItem(E,e),n&&localStorage.setItem(v,n))}catch(e){}}}).catch(()=>{}).finally(()=>{e||M(!1)}),()=>{e=!0}},[o,l,w,S,j]),t.useEffect(()=>{Pe(1)},[Y,Z,$e,Ge,re]),t.useEffect(()=>{!T&&k&&it()},[it,k,T]),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=()=>{Q(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=>{!oe||e.target.closest("button")||e.target.closest('input[type="date"]')||ae(!1)};return document.addEventListener("click",e),()=>{document.removeEventListener("click",e)}},[oe]);let ht,yt='"Nunito", serif';return ht=A?a.default.createElement("div",{style:{fontFamily:yt,background:"#F5F5F7",boxSizing:"border-box",height:"100vh",display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",padding:"24px",textAlign:"center"}},a.default.createElement("div",{style:{maxWidth:"400px",padding:"32px 24px",background:"#FFFFFF",borderRadius:"12px",boxShadow:"0 4px 20px rgba(0,0,0,0.08)"}},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"}},"Not authorised"),a.default.createElement("p",{style:{fontSize:"14px",color:"#666",margin:0,lineHeight:1.5}},A),a.default.createElement("p",{style:{fontSize:"13px",color:"#999",marginTop:"16px",marginBottom:0}},"You are not authorised to use this service. Please sign in again or contact support."))):T&&w&&S?a.default.createElement("div",{style:{fontFamily:yt,background:"#F5F5F7",boxSizing:"border-box",height:"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("div",{style:{fontFamily:yt,background:"#F5F5F7",boxSizing:"border-box",height:"100vh",display:"flex",flexDirection:"column",overflow:"hidden"}},a.default.createElement("div",{style:{background:"#FFFFFF",padding:K?"10px 12px":"12px 24px",display:"flex",justifyContent:"space-between",alignItems:"center",borderBottom:"1px solid #E5E5E5",flexWrap:"nowrap",gap:K?"8px":"0"}},a.default.createElement("div",{style:{position:"relative",width:K?"calc(100% - 90px)":"480px",maxWidth:K?"none":"480px"}},a.default.createElement("input",{type:"text",placeholder:"Search by patient name or ID",value:re,onChange:e=>de(e.target.value),style:{width:"100%",padding:K?"8px 32px 8px 10px":"8px 36px 8px 14px",border:"1px solid #E5E5E5",borderRadius:"6px",fontSize:K?"12px":"13px",fontFamily:yt,background:"#FFFFFF",outline:"none",boxSizing:"border-box"}}),re&&a.default.createElement("button",{onClick:()=>de(""),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"},"✕")),a.default.createElement("div",{style:{display:"flex",alignItems:"center",gap:K?"10px":"16px"}},a.default.createElement("div",{style:{position:"relative",cursor:"pointer"}},a.default.createElement("svg",{width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:"#555",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"},a.default.createElement("path",{d:"M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9"}),a.default.createElement("path",{d:"M13.73 21a2 2 0 0 1-3.46 0"})),a.default.createElement("span",{style:{position:"absolute",top:"-5px",right:"-5px",background:"#1CC3CE",color:"white",borderRadius:"50%",width:"16px",height:"16px",fontSize:"10px",fontWeight:600,display:"flex",alignItems:"center",justifyContent:"center"}},"1")),a.default.createElement("div",{style:{position:"relative"}},a.default.createElement("button",{type:"button",onClick:()=>Le(e=>!e),style:{display:"flex",alignItems:"center",gap:"8px",background:"none",border:"none",cursor:"pointer",padding:"4px 0",fontFamily:yt},"aria-expanded":Be,"aria-haspopup":"true"},!K&&a.default.createElement("span",{style:{fontSize:"13px",color:"#555"}},"Hello, ",a.default.createElement("strong",{style:{color:"#1a1a1a"}},H)),a.default.createElement("img",{src:"https://w7.pngwing.com/pngs/340/946/png-transparent-avatar-user-computer-icons-software-developer-avatar-child-face-heroes-thumbnail.png",alt:"User",style:{width:"32px",height:"32px",borderRadius:"50%",objectFit:"cover"}}),a.default.createElement("svg",{width:"12",height:"12",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",style:{flexShrink:0,opacity:Be?.8:.5}},a.default.createElement("polyline",{points:"6 9 12 15 18 9"}))),Be&&a.default.createElement(a.default.Fragment,null,a.default.createElement("div",{style:{position:"fixed",inset:0,zIndex:9998},onClick:()=>Le(!1),"aria-hidden":"true"}),a.default.createElement("div",{style:{position:"absolute",right:0,top:"100%",marginTop:"4px",minWidth:"140px",background:"#FFFFFF",border:"1px solid #E5E5E5",borderRadius:"8px",boxShadow:"0 4px 16px rgba(0,0,0,0.12)",zIndex:9999,overflow:"hidden"}},a.default.createElement("button",{type:"button",onClick:dt,style:{width:"100%",padding:"10px 14px",textAlign:"left",background:"none",border:"none",cursor:"pointer",fontSize:"13px",fontFamily:yt,color:"#e53935",fontWeight:500,display:"flex",alignItems:"center",gap:"8px"}},a.default.createElement("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2"},a.default.createElement("path",{d:"M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4"}),a.default.createElement("polyline",{points:"16 17 21 12 16 7"}),a.default.createElement("line",{x1:"21",y1:"12",x2:"9",y2:"12"})),"Logout")))))),a.default.createElement("div",{style:{padding:K?"12px":"16px 24px",flex:1,overflow:"hidden",display:"flex",flexDirection:"column"}},a.default.createElement("div",{style:{marginBottom:K?"10px":"14px"}},a.default.createElement("h1",{style:{fontSize:K?"18px":"22px",fontWeight:700,color:"#1a1a1a",margin:"0 0 2px 0"}},"Tele Consultation"),a.default.createElement("p",{style:{fontSize:K?"11px":"12px",color:"#999",margin:0}},"Displaying All Tele Consultation Appointments")),a.default.createElement("div",{style:{display:"flex",justifyContent:"space-between",alignItems:K?"flex-start":"center",marginBottom:K?"10px":"14px",flexDirection:K?"column":"row",gap:K?"12px":"0"}},a.default.createElement("div",{style:{display:"flex",gap:"6px",flexWrap:"wrap",width:K?"100%":"auto"}},a.default.createElement("button",{onClick:()=>O("upcoming"),style:{background:"upcoming"===Y?"#4C4DDC":"#FFFFFF",padding:K?"8px 10px":"9px 16px",border:"upcoming"===Y?"none":"1px solid #E5E5E5",borderRadius:"6px",fontSize:K?"10px":"13px",color:"upcoming"===Y?"white":"#555555",fontWeight:600,fontFamily:yt,cursor:"pointer",flex:K?"1 1 auto":"none",minWidth:K?"0":"auto",transition:"all 0.3s ease",whiteSpace:"nowrap"}},"Upcoming Appointments"),a.default.createElement("button",{onClick:()=>O("completed"),style:{background:"completed"===Y?"#4C4DDC":"#FFFFFF",padding:K?"8px 10px":"9px 16px",border:"completed"===Y?"none":"1px solid #E5E5E5",borderRadius:"6px",fontSize:K?"10px":"13px",color:"completed"===Y?"white":"#555555",fontWeight:600,fontFamily:yt,cursor:"pointer",flex:K?"1 1 auto":"none",minWidth:K?"0":"auto",transition:"all 0.3s ease",whiteSpace:"nowrap"}},"Completed Appointments"),a.default.createElement("button",{onClick:()=>O("cancelled"),style:{background:"cancelled"===Y?"#4C4DDC":"#FFFFFF",padding:K?"8px 10px":"9px 16px",border:"cancelled"===Y?"none":"1px solid #E5E5E5",borderRadius:"6px",fontSize:K?"10px":"13px",color:"cancelled"===Y?"white":"#555555",fontWeight:600,fontFamily:yt,cursor:"pointer",flex:K?"1 1 auto":"none",minWidth:K?"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:K?"flex-start":"flex-end"}},a.default.createElement("button",{onClick:()=>{oe||(Qe($e),et(Ge),ne(Z)),ae(!oe)},style:{padding:"8px 12px",fontFamily:yt,fontWeight:600,border:"1px solid #E5E5E5",borderRadius:"6px",fontSize:K?"11px":"13px",color:"#1a1a1a",background:"#FFFFFF",display:"flex",alignItems:"center",gap:K?"4px":"6px",cursor:"pointer",flex:"none",minWidth:K?"100px":"auto",justifyContent:"center"}},a.default.createElement("svg",{width:K?"12":"14",height:K?"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(Z){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 K?"Custom":"".concat($e," to ").concat(Ge)}})()),a.default.createElement("svg",{width:K?"8":"10",height:K?"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"}))),oe&&a.default.createElement("div",{style:{position:"absolute",top:"100%",right:K?"auto":0,left:K?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:K?"280px":"240px",width:K?"calc(100vw - 24px)":"auto",maxWidth:K?"calc(100vw - 24px)":"280px"}},a.default.createElement("div",{style:{marginBottom:"custom"===te?"12px":"0"}},["thisMonth","today","tomorrow","currentWeek","currentYear","custom"].map(e=>a.default.createElement("button",{key:e,onClick:()=>{if(ne(e),"custom"!==e){const t=(e=>{const t=new Date;let n,o;switch(e){case"today":default:n=o=P();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),l=new Date(t),i=t.getDay(),r=0===i?-6:1-i;a.setDate(t.getDate()+r),l.setDate(a.getDate()+6),n=a.toISOString().split("T")[0],o=l.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="".concat(t.getFullYear(),"-01-01"),o="".concat(t.getFullYear(),"-12-31")}return{from:n,to:o}})(e);ee(e),qe(t.from),Je(t.to),Qe(t.from),et(t.to),ae(!1)}else Qe(""),et("")},style:{width:"100%",padding:"10px 12px",background:te===e?"#E8EEF4":"#FFFFFF",border:"none",borderRadius:"4px",fontSize:"13px",fontFamily:yt,cursor:"pointer",textAlign:"left",fontWeight:te===e?600:400,color:te===e?"#4C4DDC":"#1a1a1a",marginBottom:"4px",display:"flex",justifyContent:"space-between",alignItems:"center",transition:"all 0.2s ease"},onMouseEnter:t=>{te!==e&&(t.target.style.background="#F5F5F5")},onMouseLeave:t=>{te!==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]),te===e&&a.default.createElement("span",{style:{color:"#4C4DDC",fontSize:"16px"}},"✓")))),"custom"===te&&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:Ke,onChange:e=>Qe(e.target.value),placeholder:"Start Date",style:{width:"100%",padding:"10px 8px",border:"1px solid #E5E5E5",borderRadius:"4px",fontSize:"13px",fontFamily:yt,boxSizing:"border-box",cursor:"pointer"}})),a.default.createElement("div",{style:{marginBottom:"12px"}},a.default.createElement("input",{type:"date",value:Ze,onChange:e=>et(e.target.value),placeholder:"End Date",style:{width:"100%",padding:"10px 8px",border:"1px solid #E5E5E5",borderRadius:"4px",fontSize:"13px",fontFamily:yt,boxSizing:"border-box",cursor:"pointer"}})),a.default.createElement("div",{style:{display:"flex",gap:"8px"}},a.default.createElement("button",{onClick:()=>{ne(Z),Qe($e),et(Ge),ae(!1)},style:{flex:1,padding:"10px 12px",background:"#FFFFFF",color:"#4C4DDC",border:"1px solid #4C4DDC",borderRadius:"4px",fontSize:"13px",fontFamily:yt,fontWeight:600,cursor:"pointer"}},"Cancel"),a.default.createElement("button",{onClick:()=>{Ke&&Ze&&(ee("custom"),qe(Ke),Je(Ze),ae(!1))},style:{flex:1,padding:"10px 12px",background:"#4C4DDC",color:"#FFFFFF",border:"none",borderRadius:"4px",fontSize:"13px",fontFamily:yt,fontWeight:600,cursor:"pointer"}},"Submit")))))),a.default.createElement("div",{style:{display:"flex",flexDirection:K?"column":"row",gap:K?"12px":"14px",flex:1,minHeight:0,overflow:K?"auto":"hidden"}},a.default.createElement("div",{style:{flex:K?"none":"1 1 65%",width:K?"100%":"auto",display:"flex",flexDirection:"column",minHeight:K?"400px":"auto"}},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",height:K?"auto":"100%"}},a.default.createElement("div",{style:{display:"flex",justifyContent:"space-between",alignItems:"center",padding:K?"12px 14px":"14px 18px",borderBottom:"1px solid #F1F1F1"}},a.default.createElement("div",{style:{display:"flex",alignItems:"center",gap:K?"6px":"8px"}},a.default.createElement("span",{style:{fontSize:K?"14px":"15px",fontWeight:700,color:"#1a1a1a"}},"Appointments"),a.default.createElement("span",{style:{background:"#4C4DDC",color:"#fff",fontSize:K?"10px":"11px",fontWeight:600,padding:K?"2px 7px":"3px 8px",borderRadius:"12px"}},Xe))),a.default.createElement("div",{className:"appointments-header-grid",style:{display:"grid",gridTemplateColumns:K?"1.5fr 1fr 0.8fr":"2.5fr 1fr 1.5fr 0.8fr 1.2fr",gap:K?"8px":"12px",padding:K?"8px 12px":"10px 18px",background:"#F5F5F5",fontSize:K?"10px":"12px",fontWeight:600,color:"#666"}},a.default.createElement("div",null,"Patients name"),!K&&a.default.createElement("div",null,"Patient ID"),a.default.createElement("div",{onClick:lt,style:{display:"flex",alignItems:"center",gap:"3px",cursor:"pointer",userSelect:"none"}},"Date",a.default.createElement("span",{style:{opacity:.7,fontSize:"10px"}},"asc"===le?"▲":"▼")),!K&&a.default.createElement("div",null,"Slot"),!K&&a.default.createElement("div",null,"Doctor")),a.default.createElement("div",{style:{overflow:"auto",flex:1}},T?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...")):$?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...")):G?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"}},G),a.default.createElement("button",{onClick:it,style:{marginTop:"16px",padding:"8px 16px",background:"#4C4DDC",color:"white",border:"none",borderRadius:"6px",cursor:"pointer",fontFamily:yt}},"Retry")):0===Ue.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"}},re?'No appointments found for "'.concat(re,'"'):"No appointments found"),re&&a.default.createElement("button",{onClick:()=>de(""),style:{marginTop:"12px",padding:"6px 12px",background:"#4C4DDC",color:"white",border:"none",borderRadius:"4px",cursor:"pointer",fontSize:"12px",fontFamily:yt}},"Clear Search")):Ue.map(e=>a.default.createElement("div",{key:tt(e),role:"button",tabIndex:0,onClick:()=>rt(e),onKeyDown:t=>"Enter"===t.key&&rt(e),className:"appointments-grid",style:{display:"grid",gridTemplateColumns:K?"1.5fr 1fr 0.8fr":"2.5fr 1fr 1.5fr 0.8fr 1.2fr",gap:K?"8px":"12px",padding:K?"10px 12px":"12px 18px",background:tt(V)===tt(e)?"#E8EEF4":"#FFFFFF",borderTop:"1px solid #F1F1F1",alignItems:"center",cursor:"pointer",fontSize:K?"11px":"13px"}},a.default.createElement("div",{style:{display:"flex",alignItems:"center",gap:K?"8px":"10px"}},nt(e)?a.default.createElement("img",{src:e.image,alt:"",style:{width:K?"32px":"36px",height:K?"32px":"36px",borderRadius:"50%",objectFit:"cover"}}):a.default.createElement("div",{style:{width:K?"32px":"36px",height:K?"32px":"36px",borderRadius:"50%",background:at(e.patientName),display:"flex",alignItems:"center",justifyContent:"center",color:"#FFFFFF",fontWeight:600,fontSize:K?"14px":"16px"}},ot(e.patientName)),a.default.createElement("div",null,a.default.createElement("div",{style:{fontWeight:600,color:"#1a1a1a",fontSize:K?"11px":"13px"}},e.patientName),a.default.createElement("div",{style:{fontSize:K?"9px":"11px",color:"#888"}},e.email))),!K&&a.default.createElement("div",{style:{color:"#555",fontSize:"12px"}},e.patientId),a.default.createElement("div",{style:{color:"#555",fontSize:K?"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:K?"9px":"11px",color:"#888"}},n[1].trim())):a.default.createElement("div",null,t)})()),!K&&a.default.createElement("div",{style:{color:"#555",fontSize:"12px"}},e.appointmentTime||"-"),!K&&a.default.createElement("div",{style:{color:"#555",fontSize:"12px"}},e.doctorName||e.doctor||"-")))),!$&&!G&&Ue.length>0&&a.default.createElement("div",{style:{padding:K?"12px 14px":"14px 18px",borderTop:"1px solid #F1F1F1",display:"flex",justifyContent:"space-between",alignItems:"center",background:"#FFFFFF",flexWrap:K?"wrap":"nowrap",gap:K?"10px":"0"}},a.default.createElement("div",{style:{fontSize:K?"11px":"12px",color:"#666"}},"Showing page ",He," of ",Ve," (",Xe," total)"),a.default.createElement("div",{style:{display:"flex",gap:"6px",alignItems:"center"}},a.default.createElement("button",{onClick:()=>Pe(e=>Math.max(1,e-1)),disabled:1===He,style:{padding:K?"6px 10px":"6px 12px",border:"1px solid #E5E5E5",borderRadius:"4px",background:1===He?"#F5F5F5":"#FFFFFF",color:1===He?"#999":"#1a1a1a",fontSize:K?"11px":"12px",fontFamily:yt,fontWeight:600,cursor:1===He?"not-allowed":"pointer",opacity:1===He?.5:1}},"Previous"),a.default.createElement("div",{style:{display:"flex",gap:"4px"}},[...Array(Math.min(5,Ve))].map((e,t)=>{let n;return n=Ve<=5||He<=3?t+1:He>=Ve-2?Ve-4+t:He-2+t,a.default.createElement("button",{key:n,onClick:()=>Pe(n),style:{padding:K?"6px 10px":"6px 12px",border:He===n?"none":"1px solid #E5E5E5",borderRadius:"4px",background:He===n?"#4C4DDC":"#FFFFFF",color:He===n?"#FFFFFF":"#1a1a1a",fontSize:K?"11px":"12px",fontFamily:yt,fontWeight:600,cursor:"pointer",minWidth:K?"32px":"36px"}},n)})),a.default.createElement("button",{onClick:()=>Pe(e=>Math.min(Ve,e+1)),disabled:He===Ve,style:{padding:K?"6px 10px":"6px 12px",border:"1px solid #E5E5E5",borderRadius:"4px",background:He===Ve?"#F5F5F5":"#FFFFFF",color:He===Ve?"#999":"#1a1a1a",fontSize:K?"11px":"12px",fontFamily:yt,fontWeight:600,cursor:He===Ve?"not-allowed":"pointer",opacity:He===Ve?.5:1}},"Next"))))),a.default.createElement("div",{style:{flex:K?"none":"1 1 35%",width:K?"100%":"auto",display:V||!K?"flex":"none",flexDirection:"column",minHeight:"auto"}},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",height:K?"auto":"100%"}},V?a.default.createElement(a.default.Fragment,null,a.default.createElement("div",{style:{display:"flex",justifyContent:"space-between",alignItems:"center",padding:K?"12px 14px":"16px 18px",background:"#E8EEF4",borderBottom:"1px solid #E5E5E5"}},a.default.createElement("div",null,a.default.createElement("div",{style:{color:"#002668",fontSize:K?"14px":"16px",fontWeight:"700"}},V.patientName||"N/A"),a.default.createElement("div",{style:{color:"#002668",fontSize:K?"11px":"13px"}},V.patientId||V.mrn||"N/A")),a.default.createElement("div",null,nt(V)?a.default.createElement("img",{style:{width:K?"36px":"44px",height:K?"36px":"44px",borderRadius:"50%",objectFit:"cover"},src:V.image,alt:V.patientName}):a.default.createElement("div",{style:{width:K?"36px":"44px",height:K?"36px":"44px",borderRadius:"50%",background:at(V.patientName),display:"flex",alignItems:"center",justifyContent:"center",color:"#FFFFFF",fontWeight:700,fontSize:K?"16px":"20px"}},ot(V.patientName)))),a.default.createElement("div",{style:{padding:K?"12px 14px":"14px 18px",gap:K?"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:K?"10px":"11px",color:"#888",marginBottom:"3px"}},"Speciality"),a.default.createElement("div",{style:{fontWeight:"700",fontSize:K?"12px":"13px"}},(null==V?void 0:V.specialisation)||(null==V?void 0:V.speciality)||"N/A")),a.default.createElement("div",{style:{textAlign:"right"}},a.default.createElement("div",{style:{fontSize:K?"10px":"11px",color:"#888",marginBottom:"3px"}},"Appointment Type"),a.default.createElement("div",{style:{fontWeight:"700",fontSize:K?"12px":"13px"}},(null==V?void 0:V.type)||(null==V?void 0:V.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:K?"10px":"11px",color:"#888",marginBottom:"3px"}},"Appointment Date"),a.default.createElement("div",{style:{fontWeight:"700",fontSize:K?"12px":"13px"}},(null==V?void 0:V.date)||(null==V?void 0:V.appointmentDate)||"N/A")),a.default.createElement("div",{style:{textAlign:"right"}},a.default.createElement("div",{style:{fontSize:K?"10px":"11px",color:"#888",marginBottom:"3px"}},"Appointment Time"),a.default.createElement("div",{style:{fontWeight:"700",fontSize:K?"12px":"13px"}},(null==V?void 0:V.time)||(null==V?void 0:V.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:K?"10px":"11px",color:"#888",marginBottom:"3px"}},"Doctor"),a.default.createElement("div",{style:{fontWeight:"700",fontSize:K?"12px":"13px"}},(null==V?void 0:V.doctor)||(null==V?void 0:V.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:K?"10px":"11px",color:"#888",marginBottom:"3px"}},"Hospital"),a.default.createElement("div",{style:{fontWeight:"700",fontSize:K?"12px":"13px"}},(null==V?void 0:V.hospital)||(null==V?void 0:V.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:K?"10px":"11px",color:"#888",marginBottom:"3px"}},"Reason for Appointment"),a.default.createElement("div",{style:{fontWeight:"600",fontSize:K?"11px":"12px",lineHeight:"1.4"}},(null==V?void 0:V.reason)||(null==V?void 0:V.reasonForAppointment)||"No reason provided"))),a.default.createElement("div",{style:{display:"flex",flexDirection:K?"column":"row",gap:"6px",marginTop:"10px"}},a.default.createElement("button",{type:"button",onClick:st,disabled:Ee,style:{flex:1,background:Ee?"#99e4e8":"#1CC3CE",color:"#FFFFFF",border:"1px solid #1CC3CE",borderRadius:"6px",padding:K?"10px 8px":"8px 6px",fontFamily:yt,fontWeight:600,fontSize:K?"11px":"12px",cursor:Ee?"not-allowed":"pointer"}},Ee?"Connecting...":"Join Call >")),be&&a.default.createElement("div",{style:{fontSize:"11px",color:"#e53935",marginTop:"6px",textAlign:"center",width:"100%"}},"⚠️ ",be))):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"))))))),se&&a.default.createElement("div",{style:{position:"fixed",left:fe?"0":K?"10px":"".concat(we.x,"px"),top:fe?"0":K?"70px":"".concat(we.y,"px"),right:fe?"0":K?"10px":"auto",bottom:fe?"0":"auto",width:fe?"100vw":K?"calc(100vw - 20px)":ce?"350px":"".concat(ke.width,"px"),height:fe?"100vh":ce?"auto":K?"300px":"".concat(ke.height,"px"),background:"#FFFFFF",borderRadius:fe?"0":"8px",boxShadow:"0 8px 24px rgba(0, 0, 0, 0.3)",zIndex:1e4,overflow:"hidden",display:"flex",flexDirection:"column",transition:Ie||Te?"none":"all 0.3s ease"}},a.default.createElement("div",{onMouseDown:K||fe?void 0:ft,style:{background:"linear-gradient(135deg, #4C4DDC 0%, #3A3BBD 100%)",color:"#FFFFFF",padding:K?"8px 10px":"10px 12px",display:"flex",justifyContent:"space-between",alignItems:"center",cursor:!K&&!fe&&(Ie?"grabbing":"grab"),userSelect:"none"}},a.default.createElement("div",{style:{display:"flex",alignItems:"center",gap:K?"6px":"8px",flex:1,minWidth:0}},a.default.createElement("div",{style:{width:K?"6px":"8px",height:K?"6px":"8px",borderRadius:"50%",background:"#FF4444",animation:"pulse 2s infinite",flexShrink:0}}),a.default.createElement("span",{style:{fontSize:K?"11px":"13px",fontWeight:600,fontFamily:yt,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"}},"Video Call - ",(null==V?void 0:V.patientName)||"Patient")),a.default.createElement("div",{style:{display:"flex",gap:K?"4px":"6px",alignItems:"center",flexShrink:0}},!fe&&a.default.createElement("button",{onClick:ct,style:{background:"rgba(255, 255, 255, 0.2)",border:"1px solid rgba(255, 255, 255, 0.3)",borderRadius:"6px",color:"#FFFFFF",cursor:"pointer",padding:K?"5px 8px":"6px 10px",lineHeight:1,display:"flex",alignItems:"center",justifyContent:"center",minWidth:K?"28px":"32px",height:K?"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:ce?"Restore":"Minimize"},ce?a.default.createElement("svg",{width:K?"14":"16",height:K?"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:K?"14":"16",height:K?"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:ut,style:{background:"rgba(255, 255, 255, 0.2)",border:"1px solid rgba(255, 255, 255, 0.3)",borderRadius:"6px",color:"#FFFFFF",cursor:"pointer",padding:K?"5px 8px":"6px 10px",lineHeight:1,display:"flex",alignItems:"center",justifyContent:"center",minWidth:K?"28px":"32px",height:K?"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?"Exit Fullscreen":"Fullscreen"},fe?a.default.createElement("svg",{width:K?"14":"16",height:K?"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:K?"14":"16",height:K?"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:pt,style:{background:"rgba(255, 255, 255, 0.2)",border:"1px solid rgba(255, 255, 255, 0.3)",borderRadius:"6px",color:"#FFFFFF",cursor:"pointer",padding:K?"5px 8px":"6px 10px",lineHeight:1,display:"flex",alignItems:"center",justifyContent:"center",minWidth:K?"28px":"32px",height:K?"28px":"32px",fontWeight:"bold",fontSize:K?"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"},"×"))),!ce&&a.default.createElement("div",{style:{flex:1,background:"#000000",position:"relative"}},a.default.createElement("iframe",{src:(()=>{if(!xe)return"";const e=String(B||"").replace(/\/?$/,"/");return console.log("${base}token=${callToken}","".concat(e,"token=").concat(xe)),"".concat(e,"token=").concat(xe)})(),style:{width:"100%",height:"100%",border:"none"},allow:"camera; microphone; display-capture; autoplay",allowFullScreen:!0,title:"Video Call"})),!K&&!fe&&!ce&&a.default.createElement(a.default.Fragment,null,a.default.createElement("div",{onMouseDown:e=>gt("left",e),style:{position:"absolute",left:0,top:"50%",transform:"translateY(-50%)",width:"8px",height:"60px",cursor:"ew-resize",background:"transparent",zIndex:10001}}),a.default.createElement("div",{onMouseDown:e=>gt("right",e),style:{position:"absolute",right:0,top:"50%",transform:"translateY(-50%)",width:"8px",height:"60px",cursor:"ew-resize",background:"transparent",zIndex:10001}}),a.default.createElement("div",{onMouseDown:e=>gt("top",e),style:{position:"absolute",left:"50%",transform:"translateX(-50%)",top:0,width:"60px",height:"8px",cursor:"ns-resize",background:"transparent",zIndex:10001}}),a.default.createElement("div",{onMouseDown:e=>gt("bottom",e),style:{position:"absolute",left:"50%",transform:"translateX(-50%)",bottom:0,width:"60px",height:"8px",cursor:"ns-resize",background:"transparent",zIndex:10001}}),a.default.createElement("div",{style:{position:"absolute",left:0,top:"50%",transform:"translateY(-50%)",width:"4px",height:"30px",background:"rgba(76, 77, 220, 0.6)",borderRadius:"0 2px 2px 0",opacity:Te&&"left"===Ae?1:0,transition:"opacity 0.2s ease",pointerEvents:"none",zIndex:10002}}),a.default.createElement("div",{style:{position:"absolute",right:0,top:"50%",transform:"translateY(-50%)",width:"4px",height:"30px",background:"rgba(76, 77, 220, 0.6)",borderRadius:"2px 0 0 2px",opacity:Te&&"right"===Ae?1:0,transition:"opacity 0.2s ease",pointerEvents:"none",zIndex:10002}})),a.default.createElement("style",null,"\n            @keyframes pulse {\n              0%, 100% { opacity: 1; }\n              50% { opacity: 0.5; }\n            }\n          "))),a.default.createElement(b,null,ht)};let w=null;const S={showWidget:(e,t)=>{w||(w=document.createElement("div"),document.body.appendChild(w));const n=()=>a.default.createElement(a.default.Fragment,null,a.default.createElement(F,{config:e}));l.default.render(a.default.createElement(n,null),w)},closePopup:()=>{w&&(l.default.unmountComponentAtNode(w),w=null)}};window.BookingSDK=S,e.AppointmentPage=F,e.default=S,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),l=o(n);function i(e,t,n){return(t=function(e){var t=function(e,t){if("object"!=typeof e||!e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var o=n.call(e,t||"default");if("object"!=typeof o)return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"==typeof t?t:t+""}(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}const r="https://afiyaapiqa.powermindinc.com",d="/appointment/V1/consultant/all-appointments",s="/notification/V1/consultation/online/initiate",p="dMtEGhak",c=6694,u="https://wbafedevittisalwe01-had2b3e0a7h6fyey.westeurope-01.azurewebsites.net/call/",f=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 l=o.apiBaseUrl||r,i=o.hospitalId||p,s=o.doctorId||c,u=o.token||"",f={hospitalId:i,doctorId:s,fromDate:t,toDate:n,statuses:a},m="".concat(l).concat(d),x=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);o.search=new URLSearchParams(t).toString();const a={method:"GET",headers:{"Content-Type":"application/json",Authorization:"".concat(n)}};return fetch(o,a).then(async e=>{const t=await e.json().catch(()=>({}));var n;return e.ok?t:{err:(null==t||null===(n=t.resultInfo)||void 0===n?void 0:n.message)||"Something went wrong!",status:e.status}}).catch(e=>(console.error("Fetch error:",e),{err:(null==e?void 0:e.message)||String(e)||"Network error"}))}(m,f,"PIH-Appointment-Widget",u);return x},m=async function(e){let t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};const n=(t.apiBaseUrl||r).replace(/\/$/,""),o="".concat(n).concat(s),a=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 l={"Content-Type":"application/json"};o&&(l.Authorization=o);const i={method:"POST",headers:l,body:JSON.stringify(t)};return fetch(a.toString(),i).then(async e=>{const t=await e.json().catch(()=>({}));var n;return e.ok?t:{err:(null==t||null===(n=t.resultInfo)||void 0===n?void 0:n.message)||"Something went wrong!",status:e.status}}).catch(e=>(console.error("Fetch error:",e),{err:e.message||"Network error"}))}(o,{patientId:String(e.patientId||""),primaryPatientId:String(e.primaryPatientId||e.patientId||""),hospitalId:t.hospitalId||p,doctorId:String(t.doctor_id||c),patientName:e.patientName||e.name||"",doctorName:e.doctorName||t.doctorName,appointmentId:String(e.id||e.appointmentId||e._id||"")},"PIH-Appointment-Widget",{},a)};const x="pih_appointment_idToken",g="pih_appointment_email",h="pih_appointment_appToken",y="pih_appointment_doctorId",E="pih_appointment_userName";class v extends t.Component{constructor(){super(...arguments),i(this,"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",{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=n.apiBaseUrl||r,l=n.hospitalId||p,[i,d]=t.useState(()=>{try{return"undefined"!=typeof localStorage?localStorage.getItem(x):null}catch(e){return null}}),[s,c]=t.useState(()=>{try{return"undefined"!=typeof localStorage?localStorage.getItem(g):null}catch(e){return null}}),b=n.idToken||n.token||i,F=n.email||s;t.useEffect(()=>{try{if("undefined"==typeof localStorage)return;const e=n.idToken||n.token;if(e&&String(e).trim()){localStorage.getItem(x)!==e&&(S(null),C(null),z(null),localStorage.removeItem(h),localStorage.removeItem(y),localStorage.removeItem(E)),localStorage.setItem(x,e),d(e)}n.email&&String(n.email).trim()&&(localStorage.setItem(g,n.email),c(n.email))}catch(e){}},[n.idToken,n.token,n.email]);const[w,S]=t.useState(()=>{try{return"undefined"!=typeof localStorage?localStorage.getItem(h):null}catch(e){return null}}),[k,C]=t.useState(()=>{try{return"undefined"!=typeof localStorage?localStorage.getItem(y):null}catch(e){return null}}),[I,z]=t.useState(()=>{try{return"undefined"!=typeof localStorage?localStorage.getItem(E):null}catch(e){return null}}),[D,W]=t.useState(()=>{try{if("undefined"==typeof localStorage)return!1;const e=localStorage.getItem(h),t=localStorage.getItem(x),n=localStorage.getItem(g);return!e&&!(!t||!n)}catch(e){return!1}}),[T,M]=t.useState(null),[R,A]=t.useState(!1),[j,N]=t.useState(0);t.useEffect(()=>{w&&D&&W(!1)},[w,D]),t.useEffect(()=>{w||(b&&F?(A(!1),M(e=>"Sign in required. Redirecting to home..."===e?null:e)):(M("Sign in required. Redirecting to home..."),A(!0)))},[w,b,F]),t.useEffect(()=>{if(!R)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)},[R,n.homeUrl]),t.useEffect(()=>{if(!D)return;const e=setTimeout(()=>{M("Request timed out. Please try again."),W(!1)},3e4);return()=>clearTimeout(e)},[D]);const B=n.joinCallUrl||u;w&&String(B||"").replace(/\/?$/,"/");const L=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(e){return{}}}(b),H=I||L.name||L.sub||"User",P=()=>(new Date).toISOString().split("T")[0],[O,Y]=t.useState("upcoming"),[_,U]=t.useState([]),[V,q]=t.useState(null),[X,$]=t.useState(!1),[G,J]=t.useState(null),[K,Q]=t.useState(window.innerWidth<768),[Z,ee]=t.useState("today"),[te,ne]=t.useState("today"),[oe,ae]=t.useState(!1),[le,ie]=t.useState("asc"),[re,de]=t.useState(""),[se,pe]=t.useState(!1),[ce,ue]=t.useState(!1),[fe,me]=t.useState(!1),[xe,ge]=t.useState(null),[he,ye]=t.useState(null),[Ee,ve]=t.useState(!1),[be,Fe]=t.useState(null),[we,Se]=t.useState({x:window.innerWidth-550,y:80}),[ke,Ce]=t.useState({width:550,height:450}),[Ie,ze]=t.useState(!1),[De,We]=t.useState({x:0,y:0}),[Te,Me]=t.useState(!1),[Re,Ae]=t.useState(null),[je,Ne]=t.useState({x:0,y:0,width:0,height:0});t.useState(!1);const[Be,Le]=t.useState(1),He=_.filter(e=>{if(!re.trim())return!0;const t=re.toLowerCase(),n=(e.patientName||"").toLowerCase(),o=String(e.patientId||"").toLowerCase();return n.includes(t)||o.includes(t)}),Pe=20*(Be-1),Oe=Pe+20,Ye=He.slice(Pe,Oe),_e=Math.ceil(He.length/20),Ue=He.length,[Ve,qe]=t.useState(P()),[Xe,$e]=t.useState(P()),[Ge,Je]=t.useState(),[Ke,Qe]=t.useState(),Ze=e=>(null==e?void 0:e.id)||(null==e?void 0:e._id)||(null==e?void 0:e.appointmentId)||(null==e?void 0:e.patientId)||JSON.stringify(e),et=e=>null!=e&&e.image?e.image:null,tt=e=>e?e.charAt(0).toUpperCase():"?",nt=e=>{if(!e)return"#4C4DDC";const t=["#4C4DDC","#1CC3CE","#FF6B6B","#4ECDC4","#45B7D1","#FFA07A","#98D8C8","#F7DC6F"];return t[e.charCodeAt(0)%t.length]},ot=()=>{const e="asc"===le?"desc":"asc";ie(e);const t=[..._].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});U(t),Le(1),t.length>0&&q(t[0])},at=t.useCallback(async()=>{if(!w)return;console.log(k,"fetchAppointments -> doctorIdFromLogin");const e=k;$(!0),J(null);try{const t={apiBaseUrl:o,hospitalId:l,doctorId:e,token:w},n=await f(O,Ve,Xe,t);if(401===n.status||403===n.status){try{"undefined"!=typeof localStorage&&(localStorage.removeItem(h),localStorage.removeItem(y),localStorage.removeItem(E))}catch(e){}return S(null),C(null),z(null),N(e=>e+1),void J("Session expired. Re-authenticating...")}if(n.err)return void J(String(n.err||"Failed to fetch appointments"));const a=n.data||n.appointments||n||[];U(Array.isArray(a)?a:[]),Array.isArray(a)&&a.length>0?q(a[0]):q(null)}catch(e){console.error("Error fetching appointments:",e),J(e.message||"Failed to fetch appointments")}finally{$(!1)}},[O,Ve,Xe,o,l,k,w]),lt=e=>{q(e)},it=async()=>{if(V&&w){ve(!0),Fe(null);try{var e;const t={apiBaseUrl:o,hospitalId:l,doctorId:k,doctorName:I||H,appToken:w};console.log(V,"selectedAppointment"),console.log(t,"callConfig");const a=await m(V,t);if(401===a.status||403===a.status)return Fe("Session expired. Please try again."),void ve(!1);if(a.err||null===(e=a.data)||void 0===e||!e.token)return Fe(String(a.err||"Failed to initiate call")),void ve(!1);const i=n.joinCallUrl||u,r=a.data.token?String(i||"").replace(/\/?$/,"/")+a.data.token:"";console.log("joinCallUrl",r),ge(a.data.token),ye(r||""),pe(!0),ue(!1),me(!1)}catch(e){Fe(e.message||"Failed to initiate call")}finally{ve(!1)}}},rt=()=>{pe(!1),ue(!1),me(!1),ge(null),ye(null),Fe(null)},dt=()=>{fe&&me(!1),ue(!ce)},st=()=>{ce&&ue(!1),me(!fe)},pt=e=>{ze(!0);const t=e.currentTarget.getBoundingClientRect();We({x:e.clientX-t.left,y:e.clientY-t.top})},ct=t.useCallback(e=>{if(!fe)if(Ie){const t=e.clientX-De.x,n=e.clientY-De.y,o=window.innerWidth-ke.width,a=window.innerHeight-ke.height;Se({x:Math.max(0,Math.min(t,o)),y:Math.max(0,Math.min(n,a))})}else if(Te){const t=e.clientX-je.x,n=e.clientY-je.y;let o=je.width,a=je.height,l=je.posX,i=je.posY;const r=300,d=250,s=window.innerWidth-40,p=window.innerHeight-100;if("right"===Re)o=Math.min(Math.max(je.width+t,r),s),l+o>window.innerWidth&&(o=window.innerWidth-l);else if("left"===Re){const e=Math.min(Math.max(je.width-t,r),s),n=e-je.width;o=e,l=Math.max(0,je.posX-n),0===l&&(o=je.posX+je.width)}else if("bottom"===Re)a=Math.min(Math.max(je.height+n,d),p),i+a>window.innerHeight&&(a=window.innerHeight-i);else if("top"===Re){const e=Math.min(Math.max(je.height-n,d),p),t=e-je.height;a=e,i=Math.max(0,je.posY-t),0===i&&(a=je.posY+je.height)}Ce({width:o,height:a}),Se({x:l,y:i})}},[Ie,Te,De,Re,je,we,ke,fe]),ut=()=>{ze(!1),Me(!1),Ae(null)},ft=(e,t)=>{t.preventDefault(),t.stopPropagation(),Me(!0),Ae(e),Ne({x:t.clientX,y:t.clientY,width:ke.width,height:ke.height,posX:we.x,posY:we.y})};t.useEffect(()=>{if(Ie||Te)return window.addEventListener("mousemove",ct),window.addEventListener("mouseup",ut),()=>{window.removeEventListener("mousemove",ct),window.removeEventListener("mouseup",ut)}},[Ie,Te,ct]),t.useEffect(()=>{if(!se||fe)return;const e=()=>{if(!(window.innerWidth<768)){const e=ce?350:ke.width,t=ce?60:ke.height,n=window.innerWidth-40,o=window.innerHeight-100,a=Math.min(e,n),l=Math.min(t,o);a===ke.width&&l===ke.height||Ce({width:a,height:l});const i=window.innerWidth-a-20,r=window.innerHeight-l-20;Se(e=>({x:Math.min(e.x,i),y:Math.min(e.y,r)}))}};return window.addEventListener("resize",e),()=>window.removeEventListener("resize",e)},[se,ce,fe,ke]),t.useEffect(()=>{if(!(b&&F&&(!w||j>0)))return;let e=!1;return W(!0),M(null),(async(e,t,n,o)=>{const a=e.replace(/\/$/,""),l="".concat(a,"/um/user/V1/sso/login?hospitalId=").concat(encodeURIComponent(t)),i={method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({idToken:n,email:o})};return console.log("[getTokenFromSso] request",{url:l,body:{idToken:n?n.slice(0,50)+"...":null,email:o}}),fetch(l,i).then(e=>(console.log("[getTokenFromSso] response status",e.status,e.statusText),e.ok?e.json().then(e=>{var t;return console.log("[getTokenFromSso] success",{hasData:!!e,dataKeys:e?Object.keys(e):[],hasAccessToken:!(null==e||null===(t=e.data)||void 0===t||!t.access_token)}),e}):e.json().then(t=>{var n;const o=(null==t||null===(n=t.resultInfo)||void 0===n?void 0:n.message)||"SSO login failed";return console.log("[getTokenFromSso] error body",t),{err:o,status:e.status}}).catch(()=>({err:"Something went wrong!",status:e.status})))).catch(e=>(console.error("[getTokenFromSso] catch",e),{err:e.message||"Network error"}))})(o,l,b,F).then(t=>{if(e)return;const n=function(e){var t,n,o,a,l,i;return!e||e.err?null:null!==(t=null!==(n=null!==(o=null!==(a=null===(l=e.data)||void 0===l?void 0:l.access_token)&&void 0!==a?a:null===(i=e.data)||void 0===i?void 0:i.token)&&void 0!==o?o:e.token)&&void 0!==n?n:e.accessToken)&&void 0!==t?t:null}(t);if(400===t.status)return M(t.err||"Invalid request. Redirecting to home..."),W(!1),void A(!0);if(t.err||!n){M(String(t.err||"Failed to get token")),S(null),C(null),z(null);try{"undefined"!=typeof localStorage&&(localStorage.removeItem(h),localStorage.removeItem(y),localStorage.removeItem(E))}catch(e){}}else{const e=function(e){var t,n;if(null==e||!e.data)return null;const o=null!==(t=null!==(n=e.data.doctor_id)&&void 0!==n?n:e.data.doctorId)&&void 0!==t?t:null;return console.log(o,"extractDoctorIdFromLoginResponse -> id"),null!=o?String(o):null}(t);console.log(e,"extractDoctorIdFromLoginResponse -> doctorId");const o=function(e){var t,n,o;if(null==e||!e.data)return null;const a=null!==(t=null!==(n=null!==(o=e.data.name)&&void 0!==o?o:e.data.doctor_name)&&void 0!==n?n:e.data.userName)&&void 0!==t?t:null;return null!=a?String(a):null}(t);S(n),C(e),z(o),M(null),A(!1);try{"undefined"!=typeof localStorage&&(localStorage.setItem(h,n),e&&localStorage.setItem(y,e),o&&localStorage.setItem(E,o))}catch(e){}}}).catch(()=>{}).finally(()=>{e||W(!1)}),()=>{e=!0}},[o,l,b,F,j]),t.useEffect(()=>{Le(1)},[O,Z,Ve,Xe,re]),t.useEffect(()=>{!D&&w&&at()},[at,w,D]),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=()=>{Q(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=>{!oe||e.target.closest("button")||e.target.closest('input[type="date"]')||ae(!1)};return document.addEventListener("click",e),()=>{document.removeEventListener("click",e)}},[oe]);let mt='"Nunito", serif';const xt=T||!w&&(!b||!F),gt=T||"Sign in required. Redirecting to home...";let ht;return ht=D&&b&&F?a.default.createElement("div",{style:{fontFamily:mt,background:"#F5F5F7",boxSizing:"border-box",height:"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",{style:{fontFamily:mt,background:"#F5F5F7",boxSizing:"border-box",height:"100vh",display:"flex",flexDirection:"column",overflow:"hidden"}},a.default.createElement("div",{style:{background:"#FFFFFF",padding:K?"10px 12px":"12px 24px",display:"flex",justifyContent:"space-between",alignItems:"center",borderBottom:"1px solid #E5E5E5",flexWrap:"nowrap",gap:K?"8px":"0"}},a.default.createElement("div",{style:{position:"relative",width:K?"calc(100% - 90px)":"480px",maxWidth:K?"none":"480px"}},a.default.createElement("input",{type:"text",placeholder:"Search by patient name or ID",value:re,onChange:e=>de(e.target.value),style:{width:"100%",padding:K?"8px 32px 8px 10px":"8px 36px 8px 14px",border:"1px solid #E5E5E5",borderRadius:"6px",fontSize:K?"12px":"13px",fontFamily:mt,background:"#FFFFFF",outline:"none",boxSizing:"border-box"}}),re&&a.default.createElement("button",{onClick:()=>de(""),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:K?"12px":"16px 24px",flex:1,overflow:"hidden",display:"flex",flexDirection:"column"}},a.default.createElement("div",{style:{marginBottom:K?"10px":"14px"}},a.default.createElement("h1",{style:{fontSize:K?"18px":"22px",fontWeight:700,color:"#1a1a1a",margin:"0 0 2px 0"}},"Tele Consultation"),a.default.createElement("p",{style:{fontSize:K?"11px":"12px",color:"#999",margin:0}},"Displaying All Tele Consultation Appointments")),a.default.createElement("div",{style:{display:"flex",justifyContent:"space-between",alignItems:K?"flex-start":"center",marginBottom:K?"10px":"14px",flexDirection:K?"column":"row",gap:K?"12px":"0"}},a.default.createElement("div",{style:{display:"flex",gap:"6px",flexWrap:"wrap",width:K?"100%":"auto"}},a.default.createElement("button",{onClick:()=>Y("upcoming"),style:{background:"upcoming"===O?"#4C4DDC":"#FFFFFF",padding:K?"8px 10px":"9px 16px",border:"upcoming"===O?"none":"1px solid #E5E5E5",borderRadius:"6px",fontSize:K?"10px":"13px",color:"upcoming"===O?"white":"#555555",fontWeight:600,fontFamily:mt,cursor:"pointer",flex:K?"1 1 auto":"none",minWidth:K?"0":"auto",transition:"all 0.3s ease",whiteSpace:"nowrap"}},"Upcoming Appointments"),a.default.createElement("button",{onClick:()=>Y("completed"),style:{background:"completed"===O?"#4C4DDC":"#FFFFFF",padding:K?"8px 10px":"9px 16px",border:"completed"===O?"none":"1px solid #E5E5E5",borderRadius:"6px",fontSize:K?"10px":"13px",color:"completed"===O?"white":"#555555",fontWeight:600,fontFamily:mt,cursor:"pointer",flex:K?"1 1 auto":"none",minWidth:K?"0":"auto",transition:"all 0.3s ease",whiteSpace:"nowrap"}},"Completed Appointments"),a.default.createElement("button",{onClick:()=>Y("cancelled"),style:{background:"cancelled"===O?"#4C4DDC":"#FFFFFF",padding:K?"8px 10px":"9px 16px",border:"cancelled"===O?"none":"1px solid #E5E5E5",borderRadius:"6px",fontSize:K?"10px":"13px",color:"cancelled"===O?"white":"#555555",fontWeight:600,fontFamily:mt,cursor:"pointer",flex:K?"1 1 auto":"none",minWidth:K?"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:K?"flex-start":"flex-end"}},a.default.createElement("button",{onClick:()=>{oe||(Je(Ve),Qe(Xe),ne(Z)),ae(!oe)},style:{padding:"8px 12px",fontFamily:mt,fontWeight:600,border:"1px solid #E5E5E5",borderRadius:"6px",fontSize:K?"11px":"13px",color:"#1a1a1a",background:"#FFFFFF",display:"flex",alignItems:"center",gap:K?"4px":"6px",cursor:"pointer",flex:"none",minWidth:K?"100px":"auto",justifyContent:"center"}},a.default.createElement("svg",{width:K?"12":"14",height:K?"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(Z){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 K?"Custom":"".concat(Ve," to ").concat(Xe)}})()),a.default.createElement("svg",{width:K?"8":"10",height:K?"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"}))),oe&&a.default.createElement("div",{style:{position:"absolute",top:"100%",right:K?"auto":0,left:K?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:K?"280px":"240px",width:K?"calc(100vw - 24px)":"auto",maxWidth:K?"calc(100vw - 24px)":"280px"}},a.default.createElement("div",{style:{marginBottom:"custom"===te?"12px":"0"}},["thisMonth","today","tomorrow","currentWeek","currentYear","custom"].map(e=>a.default.createElement("button",{key:e,onClick:()=>{if(ne(e),"custom"!==e){const t=(e=>{const t=new Date;let n,o;switch(e){case"today":default:n=o=P();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),l=new Date(t),i=t.getDay(),r=0===i?-6:1-i;a.setDate(t.getDate()+r),l.setDate(a.getDate()+6),n=a.toISOString().split("T")[0],o=l.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="".concat(t.getFullYear(),"-01-01"),o="".concat(t.getFullYear(),"-12-31")}return{from:n,to:o}})(e);ee(e),qe(t.from),$e(t.to),Je(t.from),Qe(t.to),ae(!1)}else Je(""),Qe("")},style:{width:"100%",padding:"10px 12px",background:te===e?"#E8EEF4":"#FFFFFF",border:"none",borderRadius:"4px",fontSize:"13px",fontFamily:mt,cursor:"pointer",textAlign:"left",fontWeight:te===e?600:400,color:te===e?"#4C4DDC":"#1a1a1a",marginBottom:"4px",display:"flex",justifyContent:"space-between",alignItems:"center",transition:"all 0.2s ease"},onMouseEnter:t=>{te!==e&&(t.target.style.background="#F5F5F5")},onMouseLeave:t=>{te!==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]),te===e&&a.default.createElement("span",{style:{color:"#4C4DDC",fontSize:"16px"}},"✓")))),"custom"===te&&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:Ge,onChange:e=>Je(e.target.value),placeholder:"Start Date",style:{width:"100%",padding:"10px 8px",border:"1px solid #E5E5E5",borderRadius:"4px",fontSize:"13px",fontFamily:mt,boxSizing:"border-box",cursor:"pointer"}})),a.default.createElement("div",{style:{marginBottom:"12px"}},a.default.createElement("input",{type:"date",value:Ke,onChange:e=>Qe(e.target.value),placeholder:"End Date",style:{width:"100%",padding:"10px 8px",border:"1px solid #E5E5E5",borderRadius:"4px",fontSize:"13px",fontFamily:mt,boxSizing:"border-box",cursor:"pointer"}})),a.default.createElement("div",{style:{display:"flex",gap:"8px"}},a.default.createElement("button",{onClick:()=>{ne(Z),Je(Ve),Qe(Xe),ae(!1)},style:{flex:1,padding:"10px 12px",background:"#FFFFFF",color:"#4C4DDC",border:"1px solid #4C4DDC",borderRadius:"4px",fontSize:"13px",fontFamily:mt,fontWeight:600,cursor:"pointer"}},"Cancel"),a.default.createElement("button",{onClick:()=>{Ge&&Ke&&(ee("custom"),qe(Ge),$e(Ke),ae(!1))},style:{flex:1,padding:"10px 12px",background:"#4C4DDC",color:"#FFFFFF",border:"none",borderRadius:"4px",fontSize:"13px",fontFamily:mt,fontWeight:600,cursor:"pointer"}},"Submit")))))),a.default.createElement("div",{style:{display:"flex",flexDirection:K?"column":"row",gap:K?"12px":"14px",flex:1,minHeight:0,overflow:K?"auto":"hidden"}},a.default.createElement("div",{style:{flex:K?"none":"1 1 65%",width:K?"100%":"auto",display:"flex",flexDirection:"column",minHeight:K?"400px":"auto"}},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",height:K?"auto":"100%"}},a.default.createElement("div",{style:{display:"flex",justifyContent:"space-between",alignItems:"center",padding:K?"12px 14px":"14px 18px",borderBottom:"1px solid #F1F1F1"}},a.default.createElement("div",{style:{display:"flex",alignItems:"center",gap:K?"6px":"8px"}},a.default.createElement("span",{style:{fontSize:K?"14px":"15px",fontWeight:700,color:"#1a1a1a"}},"Appointments"),a.default.createElement("span",{style:{background:"#4C4DDC",color:"#fff",fontSize:K?"10px":"11px",fontWeight:600,padding:K?"2px 7px":"3px 8px",borderRadius:"12px"}},Ue))),a.default.createElement("div",{className:"appointments-header-grid",style:{display:"grid",gridTemplateColumns:K?"1.5fr 1fr 0.8fr":"2.5fr 1fr 1.5fr 0.8fr 1.2fr",gap:K?"8px":"12px",padding:K?"8px 12px":"10px 18px",background:"#F5F5F5",fontSize:K?"10px":"12px",fontWeight:600,color:"#666"}},a.default.createElement("div",null,"Patients name"),!K&&a.default.createElement("div",null,"Patient ID"),a.default.createElement("div",{onClick:ot,style:{display:"flex",alignItems:"center",gap:"3px",cursor:"pointer",userSelect:"none"}},"Date",a.default.createElement("span",{style:{opacity:.7,fontSize:"10px"}},"asc"===le?"▲":"▼")),!K&&a.default.createElement("div",null,"Slot"),!K&&a.default.createElement("div",null,"Doctor")),a.default.createElement("div",{style:{overflow:"auto",flex:1}},D?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...")):X?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...")):G?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"}},G),a.default.createElement("button",{onClick:at,style:{marginTop:"16px",padding:"8px 16px",background:"#4C4DDC",color:"white",border:"none",borderRadius:"6px",cursor:"pointer",fontFamily:mt}},"Retry")):0===Ye.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"}},re?'No appointments found for "'.concat(re,'"'):"No appointments found"),re&&a.default.createElement("button",{onClick:()=>de(""),style:{marginTop:"12px",padding:"6px 12px",background:"#4C4DDC",color:"white",border:"none",borderRadius:"4px",cursor:"pointer",fontSize:"12px",fontFamily:mt}},"Clear Search")):Ye.map(e=>a.default.createElement("div",{key:Ze(e),role:"button",tabIndex:0,onClick:()=>lt(e),onKeyDown:t=>"Enter"===t.key&&lt(e),className:"appointments-grid",style:{display:"grid",gridTemplateColumns:K?"1.5fr 1fr 0.8fr":"2.5fr 1fr 1.5fr 0.8fr 1.2fr",gap:K?"8px":"12px",padding:K?"10px 12px":"12px 18px",background:Ze(V)===Ze(e)?"#E8EEF4":"#FFFFFF",borderTop:"1px solid #F1F1F1",alignItems:"center",cursor:"pointer",fontSize:K?"11px":"13px"}},a.default.createElement("div",{style:{display:"flex",alignItems:"center",gap:K?"8px":"10px"}},et(e)?a.default.createElement("img",{src:e.image,alt:"",style:{width:K?"32px":"36px",height:K?"32px":"36px",borderRadius:"50%",objectFit:"cover"}}):a.default.createElement("div",{style:{width:K?"32px":"36px",height:K?"32px":"36px",borderRadius:"50%",background:nt(e.patientName),display:"flex",alignItems:"center",justifyContent:"center",color:"#FFFFFF",fontWeight:600,fontSize:K?"14px":"16px"}},tt(e.patientName)),a.default.createElement("div",null,a.default.createElement("div",{style:{fontWeight:600,color:"#1a1a1a",fontSize:K?"11px":"13px"}},e.patientName),a.default.createElement("div",{style:{fontSize:K?"9px":"11px",color:"#888"}},e.email))),!K&&a.default.createElement("div",{style:{color:"#555",fontSize:"12px"}},e.patientId),a.default.createElement("div",{style:{color:"#555",fontSize:K?"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:K?"9px":"11px",color:"#888"}},n[1].trim())):a.default.createElement("div",null,t)})()),!K&&a.default.createElement("div",{style:{color:"#555",fontSize:"12px"}},e.appointmentTime||"-"),!K&&a.default.createElement("div",{style:{color:"#555",fontSize:"12px"}},e.doctorName||e.doctor||"-")))),!X&&!G&&Ye.length>0&&a.default.createElement("div",{style:{padding:K?"12px 14px":"14px 18px",borderTop:"1px solid #F1F1F1",display:"flex",justifyContent:"space-between",alignItems:"center",background:"#FFFFFF",flexWrap:K?"wrap":"nowrap",gap:K?"10px":"0"}},a.default.createElement("div",{style:{fontSize:K?"11px":"12px",color:"#666"}},"Showing page ",Be," of ",_e," (",Ue," total)"),a.default.createElement("div",{style:{display:"flex",gap:"6px",alignItems:"center"}},a.default.createElement("button",{onClick:()=>Le(e=>Math.max(1,e-1)),disabled:1===Be,style:{padding:K?"6px 10px":"6px 12px",border:"1px solid #E5E5E5",borderRadius:"4px",background:1===Be?"#F5F5F5":"#FFFFFF",color:1===Be?"#999":"#1a1a1a",fontSize:K?"11px":"12px",fontFamily:mt,fontWeight:600,cursor:1===Be?"not-allowed":"pointer",opacity:1===Be?.5:1}},"Previous"),a.default.createElement("div",{style:{display:"flex",gap:"4px"}},[...Array(Math.min(5,_e))].map((e,t)=>{let n;return n=_e<=5||Be<=3?t+1:Be>=_e-2?_e-4+t:Be-2+t,a.default.createElement("button",{key:n,onClick:()=>Le(n),style:{padding:K?"6px 10px":"6px 12px",border:Be===n?"none":"1px solid #E5E5E5",borderRadius:"4px",background:Be===n?"#4C4DDC":"#FFFFFF",color:Be===n?"#FFFFFF":"#1a1a1a",fontSize:K?"11px":"12px",fontFamily:mt,fontWeight:600,cursor:"pointer",minWidth:K?"32px":"36px"}},n)})),a.default.createElement("button",{onClick:()=>Le(e=>Math.min(_e,e+1)),disabled:Be===_e,style:{padding:K?"6px 10px":"6px 12px",border:"1px solid #E5E5E5",borderRadius:"4px",background:Be===_e?"#F5F5F5":"#FFFFFF",color:Be===_e?"#999":"#1a1a1a",fontSize:K?"11px":"12px",fontFamily:mt,fontWeight:600,cursor:Be===_e?"not-allowed":"pointer",opacity:Be===_e?.5:1}},"Next"))))),a.default.createElement("div",{style:{flex:K?"none":"1 1 35%",width:K?"100%":"auto",display:V||!K?"flex":"none",flexDirection:"column",minHeight:"auto"}},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",height:K?"auto":"100%"}},V?a.default.createElement(a.default.Fragment,null,a.default.createElement("div",{style:{display:"flex",justifyContent:"space-between",alignItems:"center",padding:K?"12px 14px":"16px 18px",background:"#E8EEF4",borderBottom:"1px solid #E5E5E5"}},a.default.createElement("div",null,a.default.createElement("div",{style:{color:"#002668",fontSize:K?"14px":"16px",fontWeight:"700"}},V.patientName||"N/A"),a.default.createElement("div",{style:{color:"#002668",fontSize:K?"11px":"13px"}},V.patientId||V.mrn||"N/A")),a.default.createElement("div",null,et(V)?a.default.createElement("img",{style:{width:K?"36px":"44px",height:K?"36px":"44px",borderRadius:"50%",objectFit:"cover"},src:V.image,alt:V.patientName}):a.default.createElement("div",{style:{width:K?"36px":"44px",height:K?"36px":"44px",borderRadius:"50%",background:nt(V.patientName),display:"flex",alignItems:"center",justifyContent:"center",color:"#FFFFFF",fontWeight:700,fontSize:K?"16px":"20px"}},tt(V.patientName)))),a.default.createElement("div",{style:{padding:K?"12px 14px":"14px 18px",gap:K?"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:K?"10px":"11px",color:"#888",marginBottom:"3px"}},"Speciality"),a.default.createElement("div",{style:{fontWeight:"700",fontSize:K?"12px":"13px"}},(null==V?void 0:V.specialisation)||(null==V?void 0:V.speciality)||"N/A")),a.default.createElement("div",{style:{textAlign:"right"}},a.default.createElement("div",{style:{fontSize:K?"10px":"11px",color:"#888",marginBottom:"3px"}},"Appointment Type"),a.default.createElement("div",{style:{fontWeight:"700",fontSize:K?"12px":"13px"}},(null==V?void 0:V.type)||(null==V?void 0:V.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:K?"10px":"11px",color:"#888",marginBottom:"3px"}},"Appointment Date"),a.default.createElement("div",{style:{fontWeight:"700",fontSize:K?"12px":"13px"}},(null==V?void 0:V.date)||(null==V?void 0:V.appointmentDate)||"N/A")),a.default.createElement("div",{style:{textAlign:"right"}},a.default.createElement("div",{style:{fontSize:K?"10px":"11px",color:"#888",marginBottom:"3px"}},"Appointment Time"),a.default.createElement("div",{style:{fontWeight:"700",fontSize:K?"12px":"13px"}},(null==V?void 0:V.time)||(null==V?void 0:V.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:K?"10px":"11px",color:"#888",marginBottom:"3px"}},"Doctor"),a.default.createElement("div",{style:{fontWeight:"700",fontSize:K?"12px":"13px"}},(null==V?void 0:V.doctor)||(null==V?void 0:V.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:K?"10px":"11px",color:"#888",marginBottom:"3px"}},"Hospital"),a.default.createElement("div",{style:{fontWeight:"700",fontSize:K?"12px":"13px"}},(null==V?void 0:V.hospital)||(null==V?void 0:V.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:K?"10px":"11px",color:"#888",marginBottom:"3px"}},"Reason for Appointment"),a.default.createElement("div",{style:{fontWeight:"600",fontSize:K?"11px":"12px",lineHeight:"1.4"}},(null==V?void 0:V.reason)||(null==V?void 0:V.reasonForAppointment)||"No reason provided"))),a.default.createElement("div",{style:{display:"flex",flexDirection:K?"column":"row",gap:"6px",marginTop:"10px"}},a.default.createElement("button",{type:"button",onClick:it,disabled:Ee,style:{flex:1,background:Ee?"#99e4e8":"#1CC3CE",color:"#FFFFFF",border:"1px solid #1CC3CE",borderRadius:"6px",padding:K?"10px 8px":"8px 6px",fontFamily:mt,fontWeight:600,fontSize:K?"11px":"12px",cursor:Ee?"not-allowed":"pointer"}},Ee?"Connecting...":"Join Call >")),be&&a.default.createElement("div",{style:{fontSize:"11px",color:"#e53935",marginTop:"6px",textAlign:"center",width:"100%"}},"⚠️ ",be))):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"))))))),se&&a.default.createElement("div",{style:{position:"fixed",left:fe?"0":K?"10px":"".concat(we.x,"px"),top:fe?"0":K?"70px":"".concat(we.y,"px"),right:fe?"0":K?"10px":"auto",bottom:fe?"0":"auto",width:fe?"100vw":K?"calc(100vw - 20px)":ce?"350px":"".concat(ke.width,"px"),height:fe?"100vh":ce?"auto":K?"300px":"".concat(ke.height,"px"),background:"#FFFFFF",borderRadius:fe?"0":"8px",boxShadow:"0 8px 24px rgba(0, 0, 0, 0.3)",zIndex:1e4,overflow:"hidden",display:"flex",flexDirection:"column",transition:Ie||Te?"none":"all 0.3s ease"}},a.default.createElement("div",{onMouseDown:K||fe?void 0:pt,style:{background:"linear-gradient(135deg, #4C4DDC 0%, #3A3BBD 100%)",color:"#FFFFFF",padding:K?"8px 10px":"10px 12px",display:"flex",justifyContent:"space-between",alignItems:"center",cursor:!K&&!fe&&(Ie?"grabbing":"grab"),userSelect:"none"}},a.default.createElement("div",{style:{display:"flex",alignItems:"center",gap:K?"6px":"8px",flex:1,minWidth:0}},a.default.createElement("div",{style:{width:K?"6px":"8px",height:K?"6px":"8px",borderRadius:"50%",background:"#FF4444",animation:"pulse 2s infinite",flexShrink:0}}),a.default.createElement("span",{style:{fontSize:K?"11px":"13px",fontWeight:600,fontFamily:mt,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"}},"Video Call - ",(null==V?void 0:V.patientName)||"Patient")),a.default.createElement("div",{style:{display:"flex",gap:K?"4px":"6px",alignItems:"center",flexShrink:0}},!fe&&a.default.createElement("button",{onClick:dt,style:{background:"rgba(255, 255, 255, 0.2)",border:"1px solid rgba(255, 255, 255, 0.3)",borderRadius:"6px",color:"#FFFFFF",cursor:"pointer",padding:K?"5px 8px":"6px 10px",lineHeight:1,display:"flex",alignItems:"center",justifyContent:"center",minWidth:K?"28px":"32px",height:K?"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:ce?"Restore":"Minimize"},ce?a.default.createElement("svg",{width:K?"14":"16",height:K?"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:K?"14":"16",height:K?"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:st,style:{background:"rgba(255, 255, 255, 0.2)",border:"1px solid rgba(255, 255, 255, 0.3)",borderRadius:"6px",color:"#FFFFFF",cursor:"pointer",padding:K?"5px 8px":"6px 10px",lineHeight:1,display:"flex",alignItems:"center",justifyContent:"center",minWidth:K?"28px":"32px",height:K?"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?"Exit Fullscreen":"Fullscreen"},fe?a.default.createElement("svg",{width:K?"14":"16",height:K?"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:K?"14":"16",height:K?"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:rt,style:{background:"rgba(255, 255, 255, 0.2)",border:"1px solid rgba(255, 255, 255, 0.3)",borderRadius:"6px",color:"#FFFFFF",cursor:"pointer",padding:K?"5px 8px":"6px 10px",lineHeight:1,display:"flex",alignItems:"center",justifyContent:"center",minWidth:K?"28px":"32px",height:K?"28px":"32px",fontWeight:"bold",fontSize:K?"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"},"×"))),!ce&&a.default.createElement("div",{style:{flex:1,background:"#000000",position:"relative"}},a.default.createElement("iframe",{src:(()=>{if(!xe)return"";const e=String(B||"").replace(/\/?$/,"/");return console.log("${base}token=${callToken}","".concat(e,"token=").concat(xe)),"".concat(e,"token=").concat(xe)})(),style:{width:"100%",height:"100%",border:"none"},allow:"camera; microphone; display-capture; autoplay",allowFullScreen:!0,title:"Video Call"})),!K&&!fe&&!ce&&a.default.createElement(a.default.Fragment,null,a.default.createElement("div",{onMouseDown:e=>ft("left",e),style:{position:"absolute",left:0,top:"50%",transform:"translateY(-50%)",width:"8px",height:"60px",cursor:"ew-resize",background:"transparent",zIndex:10001}}),a.default.createElement("div",{onMouseDown:e=>ft("right",e),style:{position:"absolute",right:0,top:"50%",transform:"translateY(-50%)",width:"8px",height:"60px",cursor:"ew-resize",background:"transparent",zIndex:10001}}),a.default.createElement("div",{onMouseDown:e=>ft("top",e),style:{position:"absolute",left:"50%",transform:"translateX(-50%)",top:0,width:"60px",height:"8px",cursor:"ns-resize",background:"transparent",zIndex:10001}}),a.default.createElement("div",{onMouseDown:e=>ft("bottom",e),style:{position:"absolute",left:"50%",transform:"translateX(-50%)",bottom:0,width:"60px",height:"8px",cursor:"ns-resize",background:"transparent",zIndex:10001}}),a.default.createElement("div",{style:{position:"absolute",left:0,top:"50%",transform:"translateY(-50%)",width:"4px",height:"30px",background:"rgba(76, 77, 220, 0.6)",borderRadius:"0 2px 2px 0",opacity:Te&&"left"===Re?1:0,transition:"opacity 0.2s ease",pointerEvents:"none",zIndex:10002}}),a.default.createElement("div",{style:{position:"absolute",right:0,top:"50%",transform:"translateY(-50%)",width:"4px",height:"30px",background:"rgba(76, 77, 220, 0.6)",borderRadius:"2px 0 0 2px",opacity:Te&&"right"===Re?1:0,transition:"opacity 0.2s ease",pointerEvents:"none",zIndex:10002}})),a.default.createElement("style",null,"\n            @keyframes pulse {\n              0%, 100% { opacity: 1; }\n              50% { opacity: 0.5; }\n            }\n          "))),xt&&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:mt,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"}},T?"Not authorised":"Sign in required"),a.default.createElement("p",{style:{fontSize:"14px",color:"#666",margin:0,lineHeight:1.5}},gt),a.default.createElement("p",{style:{fontSize:"13px",color:"#999",marginTop:"16px",marginBottom:0}},"Redirecting to login...")))),a.default.createElement(v,null,ht)};let F=null;const w={showWidget:(e,t)=>{F||(F=document.createElement("div"),document.body.appendChild(F));const n=()=>a.default.createElement(a.default.Fragment,null,a.default.createElement(b,{config:e}));l.default.render(a.default.createElement(n,null),F)},closePopup:()=>{F&&(l.default.unmountComponentAtNode(F),F=null)}};window.BookingSDK=w,e.AppointmentPage=b,e.default=w,Object.defineProperty(e,"__esModule",{value:!0})});

package/package.json

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

package/src/components/AppointmentPage.js

@@ -34,6 +34,7 @@ function extractAppToken(response) {
 function extractDoctorIdFromLoginResponse(response) {
   if (!response?.data) return null;
   const id = response.data.doctor_id ?? response.data.doctorId ?? null;
+  console.log(id, 'extractDoctorIdFromLoginResponse -> id')
   return id != null ? String(id) : null;
 }
 function extractUserNameFromLoginResponse(response) {
@@ -167,6 +168,7 @@ const AppointmentPage = ({ config = {}}) => {
     }
   });
   const [tokenError, setTokenError] = useState(null);
+  const [redirectToHome, setRedirectToHome] = useState(false);
   const [refreshLoginTrigger, setRefreshLoginTrigger] = useState(0);
 
   // When we have appToken (e.g. from localStorage after refresh), never show loading — show main UI
@@ -174,6 +176,29 @@ const AppointmentPage = ({ config = {}}) => {
     if (appToken && tokenLoading) setTokenLoading(false);
   }, [appToken, tokenLoading]);
 
+  // No credentials: show error and auto-redirect to home
+  useEffect(() => {
+    if (appToken) return;
+    if (!idToken || !email) {
+      setTokenError("Sign in required. Redirecting to home...");
+      setRedirectToHome(true);
+    } else {
+      setRedirectToHome(false);
+      setTokenError((prev) => (prev === "Sign in required. Redirecting to home..." ? null : prev));
+    }
+  }, [appToken, idToken, email]);
+
+  // Auto-redirect to home when error popup is shown (no credentials or 400)
+  useEffect(() => {
+    if (!redirectToHome) return;
+    const homeUrl = config.homeUrl || WEB_URL || "";
+    if (!homeUrl || typeof window === "undefined") return;
+    const t = setTimeout(() => {
+      window.location.href = homeUrl;
+    }, 2500);
+    return () => clearTimeout(t);
+  }, [redirectToHome, config.homeUrl]);
+
   // Timeout so we never show "Checking authorisation..." forever (no blank-like infinite loading)
   useEffect(() => {
     if (!tokenLoading) return;
@@ -364,7 +389,8 @@ const AppointmentPage = ({ config = {}}) => {
 
   const fetchAppointments = useCallback(async () => {
     if (!appToken) return;
-    const doctorId = doctorIdFromLogin || DEFAULT_PARAMS.doctorId;
+    console.log(doctorIdFromLogin, 'fetchAppointments -> doctorIdFromLogin')
+    const doctorId = doctorIdFromLogin;
     setLoading(true);
     setError(null);
     try {
@@ -442,7 +468,7 @@ const AppointmentPage = ({ config = {}}) => {
       const callConfig = {
         apiBaseUrl,
         hospitalId,
-        doctorId: doctorIdFromLogin || DEFAULT_PARAMS.doctorId,
+        doctorId: doctorIdFromLogin,
         doctorName: userName || displayName,
         appToken,
       };
@@ -663,16 +689,10 @@ const AppointmentPage = ({ config = {}}) => {
         if (cancelled) return;
         const token = extractAppToken(response);
         if (response.status === 400) {
-          // Login API returned 400 — show error message then redirect to home
-          const message = response.err+ " " + ' Redirecting to home...' || "Invalid user. Redirecting to home...";
-          setTokenError(message);
+          // Login API returned 400 — show error popup and auto-redirect to home
+          setTokenError(response.err || "Invalid request. Redirecting to home...");
           setTokenLoading(false);
-          const homeUrl = config.homeUrl || WEB_URL || "";
-          if (homeUrl && typeof window !== "undefined") {
-            setTimeout(() => {
-              window.location.href = homeUrl;
-            }, 3000);
-          }
+          setRedirectToHome(true);
           return;
         }
         if (response.err || !token) {
@@ -689,11 +709,13 @@ const AppointmentPage = ({ config = {}}) => {
           } catch (e) {}
         } else {
           const doctorId = extractDoctorIdFromLoginResponse(response);
+          console.log(doctorId, 'extractDoctorIdFromLoginResponse -> doctorId')
           const name = extractUserNameFromLoginResponse(response);
           setAppToken(token);
           setDoctorIdFromLogin(doctorId);
           setUserName(name);
           setTokenError(null);
+          setRedirectToHome(false);
           try {
             if (typeof localStorage !== "undefined") {
               localStorage.setItem(STORAGE_KEY_APP_TOKEN, token);
@@ -789,47 +811,11 @@ const AppointmentPage = ({ config = {}}) => {
 
   let fontFamily = '"Nunito", serif';
 
-  // When token API fails, show only "Not authorized" / "Not found" — do not show the full Tele Consultation UI
+  // Error as popup overlay (main page stays in background); auto-redirect to home
+  const showAuthError = tokenError || (!appToken && (!idToken || !email));
+  const authErrorMessage = tokenError || "Sign in required. Redirecting to home...";
   let content;
-  if (tokenError) {
-    content = (
-      <div
-        style={{
-          fontFamily,
-          background: "#F5F5F7",
-          boxSizing: "border-box",
-          height: "100vh",
-          display: "flex",
-          flexDirection: "column",
-          alignItems: "center",
-          justifyContent: "center",
-          padding: "24px",
-          textAlign: "center",
-        }}
-      >
-        <div
-          style={{
-            maxWidth: "400px",
-            padding: "32px 24px",
-            background: "#FFFFFF",
-            borderRadius: "12px",
-            boxShadow: "0 4px 20px rgba(0,0,0,0.08)",
-          }}
-        >
-          <div style={{ fontSize: "48px", marginBottom: "16px" }}>🔒</div>
-          <h2 style={{ fontSize: "20px", fontWeight: 700, color: "#1a1a1a", margin: "0 0 8px 0" }}>
-            Not authorised
-          </h2>
-          <p style={{ fontSize: "14px", color: "#666", margin: 0, lineHeight: 1.5 }}>
-            {tokenError}
-          </p>
-          <p style={{ fontSize: "13px", color: "#999", marginTop: "16px", marginBottom: 0 }}>
-            You are not authorised to use this service. Please sign in again or contact support.
-          </p>
-        </div>
-      </div>
-    );
-  } else if (tokenLoading && idToken && email) {
+  if (tokenLoading && idToken && email) {
     // While checking token (SSO in progress), show a simple loading state instead of the full UI
     content = (
       <div
@@ -862,6 +848,7 @@ const AppointmentPage = ({ config = {}}) => {
     );
   } else {
     content = (
+    <>
     <div
       style={{
         fontFamily,
@@ -930,7 +917,8 @@ const AppointmentPage = ({ config = {}}) => {
           )}
         </div>
 
-        {/* Right side: Notification and User Profile */}
+        {/* Profile and notification — commented out for widget */}
+        {false && (
         <div style={{ display: "flex", alignItems: "center", gap: isMobile ? "10px" : "16px" }}>
           {/* Notification Bell */}
           <div style={{ position: "relative", cursor: "pointer" }}>
@@ -1058,6 +1046,7 @@ const AppointmentPage = ({ config = {}}) => {
             )}
           </div>
         </div>
+        )}
       </div>
 
       {/* Main Content Area */}
@@ -2260,6 +2249,48 @@ const AppointmentPage = ({ config = {}}) => {
         </div>
       )}
     </div>
+
+    {/* Error popup overlay — main page visible in background */}
+    {showAuthError && (
+      <div
+        style={{
+          position: "fixed",
+          inset: 0,
+          zIndex: 100000,
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          padding: "24px",
+          background: "rgba(0,0,0,0.4)",
+          boxSizing: "border-box",
+        }}
+      >
+        <div
+          style={{
+            fontFamily,
+            maxWidth: "400px",
+            width: "100%",
+            padding: "32px 24px",
+            background: "#FFFFFF",
+            borderRadius: "12px",
+            boxShadow: "0 8px 32px rgba(0,0,0,0.2)",
+            textAlign: "center",
+          }}
+        >
+          <div style={{ fontSize: "48px", marginBottom: "16px" }}>🔒</div>
+          <h2 style={{ fontSize: "20px", fontWeight: 700, color: "#1a1a1a", margin: "0 0 8px 0" }}>
+            {tokenError ? "Not authorised" : "Sign in required"}
+          </h2>
+          <p style={{ fontSize: "14px", color: "#666", margin: 0, lineHeight: 1.5 }}>
+            {authErrorMessage}
+          </p>
+          <p style={{ fontSize: "13px", color: "#999", marginTop: "16px", marginBottom: 0 }}>
+            Redirecting to login...
+          </p>
+        </div>
+      </div>
+    )}
+    </>
   );
   }
   return <AppointmentErrorBoundary>{content}</AppointmentErrorBoundary>;