@anker-in/ui 0.3.0 → 0.3.1

package/dist/index.mjs

@@ -864,12 +864,12 @@ function useBookingDesign(client, params, options) {
   });
   const enabled = options?.enabled !== false;
   useEffect(() => {
-    if (!enabled || !params.booking_token) return;
+    if (!enabled || !params.booking_token && !(params.demoroom_code && params.session_id)) return;
     let cancelled = false;
     const fetchData = async () => {
       setState((prev) => ({ ...prev, loading: true, error: null }));
       try {
-        const data = await client.getBookingDesign(params.booking_token);
+        const data = await client.getBookingDesign(params);
         if (!cancelled) {
           setState({ data, loading: false, error: null });
         }
@@ -887,7 +887,7 @@ function useBookingDesign(client, params, options) {
     return () => {
       cancelled = true;
     };
-  }, [client, params.booking_token, enabled]);
+  }, [client, params.booking_token, params.demoroom_code, params.session_id, enabled]);
   return state;
 }
 var AntdMobileIsolated = ({
@@ -1766,12 +1766,23 @@ var DemoRoomApiClient = class {
     return response.booking;
   }
   /**
-   * 查询 POD 作品信息（模式1：精确查询）
-   * @param bookingToken 预约凭证
+   * 查询 POD 作品信息
+   * 模式1（优先）：通过 booking_token 精确查询
+   * 模式2：通过 demoroom_code + session_id 查询（MIR 跳回时预约尚未创建的场景）
+   * @param params 查询参数
    */
-  async getBookingDesign(bookingToken) {
+  async getBookingDesign(params) {
     const searchParams = new URLSearchParams();
-    searchParams.append("booking_token", bookingToken);
+    if (params.booking_token) {
+      searchParams.append("booking_token", params.booking_token);
+    } else {
+      if (params.demoroom_code) {
+        searchParams.append("demoroom_code", params.demoroom_code);
+      }
+      if (params.session_id) {
+        searchParams.append("session_id", params.session_id);
+      }
+    }
     return this.request(
       `/api/v1/store/bookings/design?${searchParams.toString()}`
     );
@@ -11404,6 +11415,7 @@ var DateTimePicker2 = ({
   apiClient,
   demoRoomCode,
   demoRoom: demoRoomProp,
+  demoRoomLoading,
   token,
   booking,
   timezone: timezone5,
@@ -11432,11 +11444,12 @@ var DateTimePicker2 = ({
     loading: editLoading,
     error: editError
   } = useEditBooking(apiClient);
+  const isManagedByParent = demoRoomLoading !== void 0;
   const { data: fetchedDemoRoom } = useDemoRoom(
     apiClient,
     demoRoomCode || "",
     locale,
-    { enabled: !demoRoomProp && !!demoRoomCode }
+    { enabled: !isManagedByParent && !demoRoomProp && !!demoRoomCode }
   );
   const demoRoom = demoRoomProp ?? fetchedDemoRoom;
   const isPodPurpose = selectedPurposeType === "pod";
@@ -12074,6 +12087,7 @@ var DemoRoomDetail2 = ({
   demoRoomCode,
   locale,
   demoRoom: demoRoomProp,
+  demoRoomLoading,
   title: titleProp,
   descriptions: descriptionsProp,
   devices: devicesProp,
@@ -12089,7 +12103,8 @@ var DemoRoomDetail2 = ({
   className,
   ...props
 }) => {
-  const shouldFetch = !demoRoomProp && !!apiClient && !!demoRoomCode;
+  const isManagedByParent = demoRoomLoading !== void 0;
+  const shouldFetch = !isManagedByParent && !demoRoomProp && !!apiClient && !!demoRoomCode;
   const {
     data: fetchedDemoRoom,
     loading,
@@ -12111,7 +12126,8 @@ var DemoRoomDetail2 = ({
     }
     return "#";
   })();
-  if (loading && shouldFetch) {
+  const isLoading = isManagedByParent ? !!demoRoomLoading : loading && shouldFetch;
+  if (isLoading) {
     return /* @__PURE__ */ jsx("div", { className: cn("w-full pb-4", className), ...props, children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-8 items-start", children: [
       /* @__PURE__ */ jsxs("div", { className: "space-y-6", children: [
         /* @__PURE__ */ jsx("div", { className: "h-12 bg-gray-200 rounded animate-pulse" }),
@@ -12309,21 +12325,41 @@ var DemoRoomDetail2 = ({
 DemoRoomDetail2.displayName = "DemoRoomDetail";
 
 // src/components/BookingFormO2O/utils/buildMirUrl.ts
+var REDIRECT_URL_ALLOWED_PARAMS = ["code", "business_type", "token"];
+function sanitizeRedirectSource(source) {
+  if (!source) return source;
+  try {
+    const parsed = new URL(source);
+    const keptParams = new URLSearchParams();
+    REDIRECT_URL_ALLOWED_PARAMS.forEach((key) => {
+      const value = parsed.searchParams.get(key);
+      if (value) keptParams.set(key, value);
+    });
+    parsed.search = keptParams.toString();
+    return parsed.toString();
+  } catch {
+    return source;
+  }
+}
 function buildMirWelcomeUrl({
   baseUrl,
   language,
   managerId,
   credential,
-  currentUrl
+  currentUrl,
+  managerIdParam = "email",
+  credentialParam = "credential"
 }) {
   const url = new URL(baseUrl);
   if (language) {
     url.searchParams.set("language", language);
   }
   url.searchParams.set("countrycode", "US");
-  url.searchParams.set("email", managerId);
-  url.searchParams.set("credential", credential);
-  const redirectSource = currentUrl ?? (typeof window !== "undefined" ? window.location.href : "");
+  url.searchParams.set(managerIdParam, managerId);
+  url.searchParams.set(credentialParam, credential);
+  const redirectSource = sanitizeRedirectSource(
+    currentUrl ?? (typeof window !== "undefined" ? window.location.href : "")
+  );
   url.searchParams.set("redirect_url", encodeURIComponent(redirectSource));
   return url.toString();
 }
@@ -12400,7 +12436,7 @@ var getPurposeLabel = (pageData) => {
   return "What is your purpose of visit?";
 };
 var getPodContentDescription = (podContent) => podContent?.description || podContent?.subTitle;
-var getPodContentImage = (podContent) => podContent?.image || podContent?.defaultImg;
+var getPodContentImage = (podContent) => podContent?.defaultImg;
 var getPodContentButtonText = (podContent) => podContent?.buttonText || podContent?.btnText;
 var BookingFormO2O = ({
   layoutClassName,
@@ -12417,9 +12453,10 @@ var BookingFormO2O = ({
 }) => {
   const apiClient = useMemo(
     () => createDemoRoomApi(apiConfig),
-    [apiConfig]
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [apiConfig.baseUrl, apiConfig.apiKey, apiConfig.locale]
   );
-  const { data: demoRoom } = useDemoRoom(
+  const { data: demoRoom, loading: demoRoomLoading } = useDemoRoom(
     apiClient,
     demoRoomCode || "",
     apiConfig.locale,
@@ -12460,17 +12497,49 @@ var BookingFormO2O = ({
   }, [purposeOptions, selectedPurposeType]);
   const selectedPodContent = selectedPurpose?.podContent;
   const selectedPodDescription = getPodContentDescription(selectedPodContent);
-  const selectedPodButtonText = getPodContentButtonText(selectedPodContent);
+  const podDesignId = useMemo(() => getQueryParam("design_id"), []);
+  const isPodDesignEditMode = !!podDesignId || !!booking?.design_project_id;
+  const storeManagerIdFromUrl = useMemo(
+    () => getQueryParam("store_manager_id"),
+    []
+  );
+  const mirSessionId = useMemo(() => getQueryParam("session_id"), []);
+  const effectiveStoreManagerId = storeManagerIdFromUrl || demoRoom?.contact?.manager_id;
+  const effectiveMirSessionId = mirSessionId || booking?.design_project_id;
+  const { data: bookingDesign } = useBookingDesign(
+    apiClient,
+    { demoroom_code: demoRoomCode, session_id: effectiveMirSessionId },
+    { enabled: !!demoRoomCode && !!effectiveMirSessionId }
+  );
+  const selectedPodButtonText = isPodDesignEditMode ? selectedPodContent?.btnEditText : getPodContentButtonText(selectedPodContent);
   const selectedPodImage = getSafePageDataUrl(
-    getPodContentImage(selectedPodContent)
+    isPodDesignEditMode && bookingDesign?.thumb_url || getPodContentImage(selectedPodContent)
   );
-  const selectedPodButtonIcon = getSafePageDataUrl(selectedPodContent?.btnIcon);
-  const podDesignId = useMemo(() => getQueryParam("design_id"), []);
-  const managerId = "57b98522a6a81087af435727aab98dfd0f8be7d3033338ba0db5517e0e08d0a7b13635faa5fc16c33f36fab1a6ceb29e";
-  const isPodButtonDisabled = !managerId;
+  const selectedPodButtonIcon = getSafePageDataUrl(
+    isPodDesignEditMode ? selectedPodContent?.btnEditIcon : selectedPodContent?.btnIcon
+  );
+  const managerId = demoRoom?.contact?.manager_hash;
+  const isPodButtonDisabled = isPodDesignEditMode ? !effectiveStoreManagerId || !effectiveMirSessionId : !managerId;
   const mirCredential = useMemo(() => crypto.randomUUID(), [demoRoomCode]);
-  console.log(selectedPodContent);
   const selectedPodButtonLink = useMemo(() => {
+    if (isPodButtonDisabled) return void 0;
+    if (isPodDesignEditMode) {
+      const editBaseUrl = getSafePageDataUrl(
+        selectedPodContent?.buttonEditLink
+      );
+      if (!editBaseUrl || !effectiveStoreManagerId || !effectiveMirSessionId) {
+        return void 0;
+      }
+      return buildMirWelcomeUrl({
+        baseUrl: editBaseUrl,
+        language: apiConfig.locale,
+        managerId: effectiveStoreManagerId,
+        credential: effectiveMirSessionId,
+        managerIdParam: "store_manager_id",
+        credentialParam: "sessionid"
+      });
+    }
+    if (!managerId) return void 0;
     const baseUrl = getSafePageDataUrl(selectedPodContent?.buttonLink);
     if (!baseUrl) return void 0;
     return buildMirWelcomeUrl({
@@ -12484,7 +12553,10 @@ var BookingFormO2O = ({
     apiConfig.locale,
     managerId,
     isPodButtonDisabled,
-    mirCredential
+    mirCredential,
+    isPodDesignEditMode,
+    effectiveStoreManagerId,
+    effectiveMirSessionId
   ]);
   const dateTimePickerPageData = useMemo(
     () => ({
@@ -12501,6 +12573,7 @@ var BookingFormO2O = ({
         apiClient,
         demoRoomCode,
         demoRoom,
+        demoRoomLoading,
         locale: apiConfig.locale,
         pageData: pageData?.demoRoomDetail
       }
@@ -12548,7 +12621,7 @@ var BookingFormO2O = ({
             {
               src: selectedPodImage,
               alt: selectedPodContent.imageAlt || selectedPodContent.title || "",
-              className: "mt-[12px] h-[156px] w-full rounded-[8px] object-cover l:h-auto"
+              className: "mt-[12px] h-[220px] rounded-[8px] object-cover l:h-auto"
             }
           ),
           !!selectedPodButtonText && /* @__PURE__ */ jsxs(
@@ -12556,13 +12629,14 @@ var BookingFormO2O = ({
             {
               href: selectedPodButtonLink || "#",
               "aria-disabled": isPodButtonDisabled,
-              tabIndex: void 0,
+              tabIndex: isPodButtonDisabled ? -1 : void 0,
               onClick: (event2) => {
+                if (isPodButtonDisabled) event2.preventDefault();
               },
               rel: "noopener noreferrer",
               className: cn(
                 "mt-[12px] inline-flex h-[42px] items-center justify-center gap-[6px] rounded-full bg-[#080A0F] px-[24px] text-[14px] font-bold text-white transition-colors hover:bg-[#2A2C32]",
-                isPodButtonDisabled
+                isPodButtonDisabled && "pointer-events-none cursor-not-allowed opacity-50"
               ),
               children: [
                 selectedPodButtonIcon && /* @__PURE__ */ jsx(
@@ -12586,6 +12660,7 @@ var BookingFormO2O = ({
           apiClient,
           demoRoomCode,
           demoRoom,
+          demoRoomLoading,
           token,
           booking,
           timezone: timezone5,
@@ -12723,7 +12798,7 @@ var BookingSuccessO2O = ({
       const fetchBookingDesign = async () => {
         try {
           const apiClient = createDemoRoomApi(apiConfig);
-          const design = await apiClient.getBookingDesign(token);
+          const design = await apiClient.getBookingDesign({ booking_token: token });
           setBookingDesign(design);
         } catch (err) {
           console.error("Failed to fetch booking design:", err);