@rxdrag/website-studio 0.0.50 → 0.0.51

package/dist/{index-525006cd.js → index-310e120c.js}

@@ -24,7 +24,7 @@ import { ErrorBoundary, ColorPicker, useSave, CheckCircleIcon as CheckCircleIcon
 import { PageLoader, PopoverController, ModalController, AnimateController, TabsController, NumberController, FlipController, CollapseController, AosController } from "@rxdrag/website-lib-core";
 import gsap$2 from "gsap";
 import { Input, Textarea, StringArrayInput, ImageSelect, TargetSetter, propSetters, DeviceBreakpoints, DeviceContext } from "@rxdrag/schema-setters";
-import { Switch, Card, CardBody, Button as Button$2, CircularProgress, CardHeader, Select, SelectItem, Dropdown, DropdownTrigger, DropdownMenu as DropdownMenu$1, DropdownItem, Accordion, AccordionItem, Input as Input$1, Tabs, Tab, Divider, cn, Checkbox, Chip, Skeleton, CardFooter, Image, useDisclosure, Modal as Modal$2, ModalContent as ModalContent$2, ModalHeader as ModalHeader$1, ModalBody as ModalBody$1, RadioGroup, ModalFooter as ModalFooter$1, Radio, Popover, PopoverTrigger, PopoverContent } from "@heroui/react";
+import { Switch, Card, CardBody, Button as Button$2, CircularProgress, addToast, CardHeader, Select, SelectItem, Dropdown, DropdownTrigger, DropdownMenu as DropdownMenu$1, DropdownItem, Accordion, AccordionItem, Input as Input$1, Tabs, Tab, Divider, cn, Checkbox, Chip, Skeleton, CardFooter, Image, useDisclosure, Modal as Modal$2, ModalContent as ModalContent$2, ModalHeader as ModalHeader$1, ModalBody as ModalBody$1, RadioGroup, ModalFooter as ModalFooter$1, Radio, Popover, PopoverTrigger, PopoverContent } from "@heroui/react";
 import { useEntifyWrapperStore, useUpsertEntityWithIndicator } from "@rxdrag/rxcms-entify-wrapper";
 import JSZip from "jszip";
 import { create as create$4 } from "zustand";
@@ -39,7 +39,7 @@ import $4AOtR$reactdom, { createPortal } from "react-dom";
 import { DeployType, useExportWebsite as useExportWebsite$1 } from "@rxdrag/code-generator";
 import { ComponentRender } from "@rxdrag/react-runner-pro";
 import tinycolor from "tinycolor2";
-import { useInprogressTaskByKey, useUpdateTask, taskPool, ResetPageTask, ImportPagesTask, ImportComponentsTask } from "@rxdrag/ai-tasks";
+import { useInprogressTaskByKey, useUpdateTask, taskPool, ResetPageTask, ImportPagesTask } from "@rxdrag/ai-tasks";
 var jsxRuntime = { exports: {} };
 var reactJsxRuntime_production_min = {};
 /**
@@ -6725,48 +6725,169 @@ function useIsBaseLangTheme() {
   const website = useWebsite();
   return ((_a3 = theme == null ? void 0 : theme.lang) == null ? void 0 : _a3.id) === ((_b3 = website == null ? void 0 : website.baseLang) == null ? void 0 : _b3.id);
 }
-function useTranslateTheme() {
+function useTranslateRequest() {
   const baseURL = useAiUrl();
   const token = useEntifyToken();
   const website = useWebsite();
+  const isAxiosError = useCallback((err) => {
+    return typeof err === "object" && err !== null;
+  }, []);
+  const validateBaseParams = useCallback((langId) => {
+    if (!(langId == null ? void 0 : langId.trim())) {
+      throw new Error("语言ID不能为空");
+    }
+    if (!token) {
+      throw new Error("用户未登录或token已过期");
+    }
+    if (!(website == null ? void 0 : website.id)) {
+      throw new Error("未找到网站信息");
+    }
+    if (!baseURL) {
+      throw new Error("AI服务URL未配置");
+    }
+  }, [token, website == null ? void 0 : website.id, baseURL]);
+  const extractErrorMessage = useCallback((responseData) => {
+    if (!responseData)
+      return "翻译请求失败";
+    if (typeof responseData === "string") {
+      return responseData;
+    }
+    if (typeof responseData === "object" && responseData !== null) {
+      const data = responseData;
+      return data.error || data.message || data.msg || "翻译请求失败";
+    }
+    return "翻译请求失败";
+  }, []);
+  const getStatusErrorMessage = useCallback((status2) => {
+    switch (status2) {
+      case 400:
+        return "请求参数错误";
+      case 401:
+        return "认证失败，请重新登录";
+      case 403:
+        return "没有权限执行此操作";
+      case 404:
+        return "翻译服务不存在";
+      case 429:
+        return "请求过于频繁，请稍后再试";
+      case 500:
+        return "服务器内部错误";
+      case 502:
+      case 503:
+      case 504:
+        return "服务暂时不可用，请稍后再试";
+      default:
+        return `请求失败 (${status2})`;
+    }
+  }, []);
+  const handleError = useCallback((error, context) => {
+    var _a3, _b3;
+    if (isAxiosError(error) && (error.code === "NETWORK_ERROR" || ((_a3 = error.message) == null ? void 0 : _a3.includes("fetch")))) {
+      console.error(`${context}网络错误:`, error);
+      throw new Error("网络连接失败，请检查网络连接");
+    }
+    if (isAxiosError(error) && ((_b3 = error.response) == null ? void 0 : _b3.status)) {
+      const status2 = error.response.status;
+      const responseData = error.response.data;
+      let errorMsg2 = extractErrorMessage(responseData);
+      if (errorMsg2 === "翻译请求失败") {
+        errorMsg2 = getStatusErrorMessage(status2);
+      }
+      console.error(`${context}HTTP错误:`, {
+        status: status2,
+        statusText: error.response.statusText,
+        responseData,
+        error
+      });
+      throw new Error(errorMsg2);
+    }
+    const errorMsg = isAxiosError(error) && error.message ? error.message : "翻译过程中发生未知错误";
+    console.error(`${context}未知错误:`, error);
+    throw new Error(errorMsg);
+  }, [isAxiosError, extractErrorMessage, getStatusErrorMessage]);
+  const translateRequest = useCallback(
+    async (endpoint, params, options) => {
+      validateBaseParams(params.langId);
+      if (options == null ? void 0 : options.validateParams) {
+        options.validateParams(params);
+      }
+      try {
+        const http = createHttpClient({ baseURL, token });
+        const websiteId = website.id;
+        const requestParams = (options == null ? void 0 : options.transformParams) ? options.transformParams(params, websiteId) : {
+          websiteId,
+          ...params,
+          langId: params.langId.trim()
+        };
+        const response = await http.post(endpoint, requestParams);
+        return response;
+      } catch (error) {
+        handleError(error, "翻译");
+      }
+    },
+    [baseURL, token, website, validateBaseParams, handleError]
+  );
+  return translateRequest;
+}
+function useTranslateTheme() {
+  const translateRequest = useTranslateRequest();
   const translate = useCallback(
     async (langId, title) => {
+      return await translateRequest(
+        "/api/studio/translate-theme",
+        { langId, title },
+        {
+          validateParams: (params) => {
+            const { title: title2 } = params;
+            if (!(title2 == null ? void 0 : title2.trim())) {
+              throw new Error("标题不能为空");
+            }
+          },
+          transformParams: (params, websiteId) => ({
+            websiteId,
+            langId: params.langId.trim(),
+            title: params.title.trim()
+          })
+        }
+      );
+    },
+    [translateRequest]
+  );
+  return translate;
+}
+function useStopTask() {
+  const baseURL = useAiUrl();
+  const token = useEntifyToken();
+  const [isMutating, setIsMutating] = useState(false);
+  const stopTask = useCallback(
+    async (taskId) => {
       var _a3, _b3;
-      if (!(langId == null ? void 0 : langId.trim())) {
-        throw new Error("语言ID不能为空");
-      }
-      if (!(title == null ? void 0 : title.trim())) {
-        throw new Error("标题不能为空");
+      if (!(taskId == null ? void 0 : taskId.trim())) {
+        throw new Error("任务ID不能为空");
       }
       if (!token) {
         throw new Error("用户未登录或token已过期");
       }
-      if (!(website == null ? void 0 : website.id)) {
-        throw new Error("未找到网站信息");
-      }
       if (!baseURL) {
         throw new Error("AI服务URL未配置");
       }
       try {
+        setIsMutating(true);
         const http = createHttpClient({ baseURL, token });
-        const response = await http.post("/api/studio/translate-theme", {
-          websiteId: website.id,
-          langId: langId.trim(),
-          title: title.trim()
-        });
+        const response = await http.post(`/api/stop-task/${taskId.trim()}`);
         return response;
       } catch (error) {
         const isAxiosError = (err) => {
           return typeof err === "object" && err !== null;
         };
         if (isAxiosError(error) && (error.code === "NETWORK_ERROR" || ((_a3 = error.message) == null ? void 0 : _a3.includes("fetch")))) {
-          console.error("翻译主题网络错误:", error);
+          console.error("停止任务网络错误:", error);
           throw new Error("网络连接失败，请检查网络连接");
         }
         if (isAxiosError(error) && ((_b3 = error.response) == null ? void 0 : _b3.status)) {
           const status2 = error.response.status;
           const responseData = error.response.data;
-          let errorMsg2 = "翻译请求失败";
+          let errorMsg2 = "停止任务失败";
           if (responseData) {
             if (typeof responseData === "string") {
               errorMsg2 = responseData;
@@ -6778,7 +6899,7 @@ function useTranslateTheme() {
               errorMsg2 = responseData.msg;
             }
           }
-          if (errorMsg2 === "翻译请求失败") {
+          if (errorMsg2 === "停止任务失败") {
             switch (status2) {
               case 400:
                 errorMsg2 = "请求参数错误";
@@ -6790,7 +6911,7 @@ function useTranslateTheme() {
                 errorMsg2 = "没有权限执行此操作";
                 break;
               case 404:
-                errorMsg2 = "翻译服务不存在";
+                errorMsg2 = "任务不存在或已完成";
                 break;
               case 429:
                 errorMsg2 = "请求过于频繁，请稍后再试";
@@ -6807,7 +6928,7 @@ function useTranslateTheme() {
                 errorMsg2 = `请求失败 (${status2})`;
             }
           }
-          console.error("翻译主题HTTP错误:", {
+          console.error("停止任务HTTP错误:", {
             status: status2,
             statusText: error.response.statusText,
             responseData,
@@ -6815,14 +6936,16 @@ function useTranslateTheme() {
           });
           throw new Error(errorMsg2);
         }
-        const errorMsg = isAxiosError(error) && error.message ? error.message : "翻译过程中发生未知错误";
-        console.error("翻译主题未知错误:", error);
+        const errorMsg = isAxiosError(error) && error.message ? error.message : "停止任务过程中发生未知错误";
+        console.error("停止任务未知错误:", error);
         throw new Error(errorMsg);
+      } finally {
+        setIsMutating(false);
       }
     },
-    [baseURL, token, website == null ? void 0 : website.id]
+    [baseURL, token]
   );
-  return translate;
+  return [stopTask, { isMutating }];
 }
 const linkTypes = [
   {
@@ -6895,8 +7018,6 @@ function MultiLangPanel() {
   const [linkType, setLinkType] = useState("subdomain");
   const [confirmOpen, setConfirmOpen] = useState(false);
   const [currentLangId, setCurrentLangId] = useCurrentLangId();
-  const setError = useEntifyWrapperStore((state) => state.setGlobalError);
-  const setSuccess = useEntifyWrapperStore((state) => state.setGlobalSuccess);
   const tasksNotDone = useTasksNotDone();
   const lastTask = useStudioStore((state) => state.lastedTaskEvent);
   const selectedContent = useStudioStore((state) => state.selectedContent);
@@ -7024,13 +7145,19 @@ function MultiLangPanel() {
       const title = `网站代码翻译到：${(lang == null ? void 0 : lang.cnName) || (lang == null ? void 0 : lang.enName) || (lang == null ? void 0 : lang.localName) || (lang == null ? void 0 : lang.abbr) || ""}`;
       const task2 = await translateTheme(currentLangId, title);
       setTask(task2);
-      setSuccess("翻译任务已提交");
+      addToast({
+        title: "翻译任务已提交",
+        color: "success"
+      });
     } catch (error) {
       console.error("翻译主题失败:", error);
       const errorString = error instanceof Error ? error.message : String(error);
-      setError(errorString);
+      addToast({
+        title: errorString,
+        color: "danger"
+      });
     }
-  }, [currentLangId, allLangs == null ? void 0 : allLangs.items, translateTheme, setSuccess, setError]);
+  }, [currentLangId, allLangs == null ? void 0 : allLangs.items, translateTheme]);
   const isRunning = (task == null ? void 0 : task.status) === TaskStatus.B_Pending || (task == null ? void 0 : task.status) === TaskStatus.A_Progress;
   return /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
     /* @__PURE__ */ jsxRuntimeExports.jsx(ModalBody, { className: "flex-1 p-4 min-h-0 overflow-auto", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex flex-col gap-4", children: [
@@ -138390,7 +138517,7 @@ registerLanguage({
   aliases: ["FreeMarker2", "Apache FreeMarker2"],
   loader: () => {
     {
-      return import("./freemarker2-1fbc5bf0.js").then((m2) => m2.TagAutoInterpolationDollar);
+      return import("./freemarker2-f83d1246.js").then((m2) => m2.TagAutoInterpolationDollar);
     }
   }
 });
@@ -138399,7 +138526,7 @@ registerLanguage({
   aliases: ["FreeMarker2 (Angle/Dollar)", "Apache FreeMarker2 (Angle/Dollar)"],
   loader: () => {
     {
-      return import("./freemarker2-1fbc5bf0.js").then((m2) => m2.TagAngleInterpolationDollar);
+      return import("./freemarker2-f83d1246.js").then((m2) => m2.TagAngleInterpolationDollar);
     }
   }
 });
@@ -138408,7 +138535,7 @@ registerLanguage({
   aliases: ["FreeMarker2 (Bracket/Dollar)", "Apache FreeMarker2 (Bracket/Dollar)"],
   loader: () => {
     {
-      return import("./freemarker2-1fbc5bf0.js").then((m2) => m2.TagBracketInterpolationDollar);
+      return import("./freemarker2-f83d1246.js").then((m2) => m2.TagBracketInterpolationDollar);
     }
   }
 });
@@ -138417,7 +138544,7 @@ registerLanguage({
   aliases: ["FreeMarker2 (Angle/Bracket)", "Apache FreeMarker2 (Angle/Bracket)"],
   loader: () => {
     {
-      return import("./freemarker2-1fbc5bf0.js").then((m2) => m2.TagAngleInterpolationBracket);
+      return import("./freemarker2-f83d1246.js").then((m2) => m2.TagAngleInterpolationBracket);
     }
   }
 });
@@ -138426,7 +138553,7 @@ registerLanguage({
   aliases: ["FreeMarker2 (Bracket/Bracket)", "Apache FreeMarker2 (Bracket/Bracket)"],
   loader: () => {
     {
-      return import("./freemarker2-1fbc5bf0.js").then((m2) => m2.TagBracketInterpolationBracket);
+      return import("./freemarker2-f83d1246.js").then((m2) => m2.TagBracketInterpolationBracket);
     }
   }
 });
@@ -138435,7 +138562,7 @@ registerLanguage({
   aliases: ["FreeMarker2 (Auto/Dollar)", "Apache FreeMarker2 (Auto/Dollar)"],
   loader: () => {
     {
-      return import("./freemarker2-1fbc5bf0.js").then((m2) => m2.TagAutoInterpolationDollar);
+      return import("./freemarker2-f83d1246.js").then((m2) => m2.TagAutoInterpolationDollar);
     }
   }
 });
@@ -138444,7 +138571,7 @@ registerLanguage({
   aliases: ["FreeMarker2 (Auto/Bracket)", "Apache FreeMarker2 (Auto/Bracket)"],
   loader: () => {
     {
-      return import("./freemarker2-1fbc5bf0.js").then((m2) => m2.TagAutoInterpolationBracket);
+      return import("./freemarker2-f83d1246.js").then((m2) => m2.TagAutoInterpolationBracket);
     }
   }
 });
@@ -138494,7 +138621,7 @@ registerLanguage({
   mimetypes: ["text/x-handlebars-template"],
   loader: () => {
     {
-      return import("./handlebars-0d2d8087.js");
+      return import("./handlebars-0a80f575.js");
     }
   }
 });
@@ -138527,7 +138654,7 @@ registerLanguage({
   mimetypes: ["text/html", "text/x-jshtm", "text/template", "text/ng-template"],
   loader: () => {
     {
-      return import("./html-1f416956.js");
+      return import("./html-6a9d914d.js");
     }
   }
 });
@@ -138580,7 +138707,7 @@ registerLanguage({
   mimetypes: ["text/javascript"],
   loader: () => {
     {
-      return import("./javascript-fa1a44fb.js");
+      return import("./javascript-85b04aa6.js");
     }
   }
 });
@@ -138679,7 +138806,7 @@ registerLanguage({
   mimetypes: ["application/liquid"],
   loader: () => {
     {
-      return import("./liquid-f59e1243.js");
+      return import("./liquid-a45e3197.js");
     }
   }
 });
@@ -138727,7 +138854,7 @@ registerLanguage({
   aliases: ["MDX", "mdx"],
   loader: () => {
     {
-      return import("./mdx-831aab9e.js");
+      return import("./mdx-701cd16d.js");
     }
   }
 });
@@ -138986,7 +139113,7 @@ registerLanguage({
   firstLine: "^#!/.*\\bpython[0-9.-]*\\b",
   loader: () => {
     {
-      return import("./python-c08d64d5.js");
+      return import("./python-9e486ae7.js");
     }
   }
 });
@@ -139035,7 +139162,7 @@ registerLanguage({
   mimetypes: ["text/x-cshtml"],
   loader: () => {
     {
-      return import("./razor-c37a2ffd.js");
+      return import("./razor-6bc3c261.js");
     }
   }
 });
@@ -139371,7 +139498,7 @@ registerLanguage({
   mimetypes: ["text/typescript"],
   loader: () => {
     {
-      return import("./typescript-37e16b75.js");
+      return import("./typescript-d99b2a48.js");
     }
   }
 });
@@ -139455,7 +139582,7 @@ registerLanguage({
   mimetypes: ["text/xml", "application/xml", "application/xaml+xml", "application/xml-dtd"],
   loader: () => {
     {
-      return import("./xml-68f06860.js");
+      return import("./xml-a116de23.js");
     }
   }
 });
@@ -139472,7 +139599,7 @@ registerLanguage({
   mimetypes: ["application/x-yaml", "text/x-yaml"],
   loader: () => {
     {
-      return import("./yaml-11d37d04.js");
+      return import("./yaml-331a88a9.js");
     }
   }
 });
@@ -139596,7 +139723,7 @@ var lessDefaults = new LanguageServiceDefaultsImpl$3(
 monaco_editor_core_exports$3.languages.css = { cssDefaults, lessDefaults, scssDefaults };
 function getMode$3() {
   {
-    return import("./cssMode-3b37fb1f.js");
+    return import("./cssMode-a282f3f6.js");
   }
 }
 monaco_editor_core_exports$3.languages.onLanguage("less", () => {
@@ -139727,7 +139854,7 @@ monaco_editor_core_exports$2.languages.html = {
 };
 function getMode$2() {
   {
-    return import("./htmlMode-f8f5f503.js");
+    return import("./htmlMode-9f16f56b.js");
   }
 }
 function registerHTMLLanguageService(languageId, options = optionsDefault, modeConfiguration = getConfigurationDefault(languageId)) {
@@ -139825,7 +139952,7 @@ var getWorker = () => getMode$1().then((mode) => mode.getWorker());
 monaco_editor_core_exports$1.languages.json = { jsonDefaults, getWorker };
 function getMode$1() {
   {
-    return import("./jsonMode-c7e6869c.js");
+    return import("./jsonMode-61089a60.js");
   }
 }
 monaco_editor_core_exports$1.languages.register({
@@ -140101,7 +140228,7 @@ monaco_editor_core_exports.languages.typescript = {
 };
 function getMode() {
   {
-    return import("./tsMode-fe874300.js");
+    return import("./tsMode-f84b3afc.js");
   }
 }
 monaco_editor_core_exports.languages.onLanguage("typescript", () => {
@@ -198625,21 +198752,35 @@ const RightPanel = memo(() => {
 });
 const StopButton = forwardRef$2(
   (props, ref2) => {
-    const { confirm, onStop, ...rest } = props;
+    const { confirm, taskId, ...rest } = props;
     const [open, setOpen] = useState(false);
+    const [stopTask, { isMutating }] = useStopTask();
     const handleClick = useCallback(() => {
       if (confirm) {
         setOpen(true);
       } else {
-        onStop == null ? void 0 : onStop();
+        if (taskId) {
+          stopTask(taskId);
+        }
       }
-    }, [confirm, onStop]);
+    }, [confirm, stopTask, taskId]);
     const handleConfirm = useCallback(() => {
-      onStop == null ? void 0 : onStop();
+      if (taskId) {
+        stopTask(taskId);
+      }
       setOpen(false);
-    }, [onStop]);
+    }, [stopTask, taskId]);
     return /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx(StyledTooltip, { content: "停止任务", children: /* @__PURE__ */ jsxRuntimeExports.jsx(Button$2, { ref: ref2, onPress: handleClick, ...rest }) }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx(StyledTooltip, { content: "停止任务", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+        Button$2,
+        {
+          ref: ref2,
+          isDisabled: !taskId,
+          onPress: handleClick,
+          loading: isMutating,
+          ...rest
+        }
+      ) }),
       /* @__PURE__ */ jsxRuntimeExports.jsx(
         ConfirmDialog,
         {
@@ -198773,7 +198914,7 @@ function TaskTable() {
         width: 80,
         title: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-full text-center", children: "操作" }),
         cellRender: (text2, row) => /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex gap-0.5 items-center", children: [
-          (row == null ? void 0 : row.status) === TaskStatus.A_Progress && /* @__PURE__ */ jsxRuntimeExports.jsx(StopButton, { isIconOnly: true, size: "sm", variant: "light", children: /* @__PURE__ */ jsxRuntimeExports.jsx(StopOutlineIcon, { className: "size-4 text-default-500" }) }),
+          (row == null ? void 0 : row.status) === TaskStatus.A_Progress && /* @__PURE__ */ jsxRuntimeExports.jsx(StopButton, { taskId: row.id, isIconOnly: true, size: "sm", variant: "light", children: /* @__PURE__ */ jsxRuntimeExports.jsx(StopOutlineIcon, { className: "size-4 text-default-500" }) }),
           (row == null ? void 0 : row.status) !== TaskStatus.A_Progress && /* @__PURE__ */ jsxRuntimeExports.jsx(
             RemoveButton,
             {
@@ -198910,6 +199051,33 @@ function StatusBar({ doc }) {
         requested: event,
         response: event
       });
+      if (event.type === TaskType.TranslateTheme) {
+        emit(EVENT_ENTITY_POSTED, {
+          entityName: ThemeEntityName,
+          requested: event,
+          response: event
+        });
+      }
+      if (event.type === TaskType.TranslateCusomizedPage || event.type === TaskType.TranslateBuiltinPage || event.type === TaskType.TranslateTheme) {
+        emit(EVENT_ENTITY_POSTED, {
+          entityName: PageEntityName,
+          requested: event,
+          response: event
+        });
+      }
+      if (event.type === TaskType.TranslateComponent || event.type === TaskType.TranslateTheme) {
+        console.log("===>收到组件任务事件:", event);
+        emit(EVENT_ENTITY_POSTED, {
+          entityName: FrontComponentEntityName,
+          requested: event,
+          response: event
+        });
+        emit(EVENT_ENTITY_POSTED, {
+          entityName: ComponentCategoryEntityName,
+          requested: event,
+          response: event
+        });
+      }
     },
     [setLastedTaskEvent]
   );
@@ -202746,89 +202914,185 @@ function ComponentCategoryModal(props) {
 function ComponentsSkeletons() {
   return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "w-full p-4", children: /* @__PURE__ */ jsxRuntimeExports.jsx("ul", { className: "space-y-4", children: Array.from({ length: 6 }).map((_2, index2) => /* @__PURE__ */ jsxRuntimeExports.jsx("li", { className: "flex items-center py-0.5", children: /* @__PURE__ */ jsxRuntimeExports.jsx(Skeleton, { className: "w-full h-12 rounded-md" }) }, index2)) }) });
 }
-const IMPORT_COMPONENTS_KEY = "import-components";
+class ImportComponentsTask {
+  constructor(options, components, categories) {
+    __publicField(this, "entifyClient");
+    __publicField(this, "taskData");
+    __publicField(this, "importOneComponent", async (component, overrideId, existCategory) => {
+      var _a3;
+      await this.entifyClient.upsertEntity(FrontComponentEntityName, {
+        id: overrideId,
+        theme: { sync: { id: (_a3 = this.taskData) == null ? void 0 : _a3.themeId } },
+        category: (existCategory == null ? void 0 : existCategory.id) ? { sync: { id: existCategory.id } } : { clear: true },
+        name: component.name,
+        title: component.title,
+        description: component.description,
+        code: component.code,
+        props: component.props,
+        testConfig: component.testConfig
+      });
+    });
+    this.components = components;
+    this.categories = categories;
+    this.entifyClient = options.entifyClient;
+    this.taskData = {
+      ids: options.ids,
+      themeId: options.themeId,
+      lang: options.lang
+    };
+  }
+  /**
+   * 实际执行导入页面的逻辑
+   * @returns Promise
+   */
+  async importComponents() {
+    var _a3;
+    for (const comId of this.taskData.ids) {
+      const com = await this.entifyClient.oneEntity(
+        new FrontComponentQueryOptions(
+          [
+            FrontComponentFields.id,
+            FrontComponentFields.id,
+            FrontComponentFields.name,
+            FrontComponentFields.code,
+            FrontComponentFields.description,
+            FrontComponentFields.title,
+            FrontComponentFields.seqValue,
+            FrontComponentFields.testConfig,
+            FrontComponentFields.props
+          ],
+          {
+            where: {
+              id: {
+                _eq: comId
+              }
+            }
+          }
+        ).category([
+          ComponentCategoryFields.id,
+          ComponentCategoryFields.name,
+          ComponentCategoryFields.seqValue
+        ])
+      );
+      if (!com) {
+        throw Error("没有找到要导入的页面");
+      }
+      const existCom = (_a3 = this.components) == null ? void 0 : _a3.find((p2) => p2.name === com.name);
+      let existCategory = this.categories.find(
+        (c) => {
+          var _a4;
+          return c.name === ((_a4 = com.category) == null ? void 0 : _a4.name);
+        }
+      );
+      if (!existCategory && com.category) {
+        existCategory = await this.entifyClient.upsertEntity(
+          ComponentCategoryEntityName,
+          {
+            ...com.category,
+            id: void 0,
+            theme: { sync: { id: this.taskData.themeId } }
+          }
+        );
+        if (existCategory) {
+          this.categories.push({ ...existCategory, name: com.category.name });
+        }
+      }
+      await this.importOneComponent(com, existCom == null ? void 0 : existCom.id, existCategory);
+    }
+    const msg = `成功导入 ${this.taskData.ids.length} 个文件`;
+    addToast({
+      title: "导入完成",
+      description: msg,
+      color: "success"
+    });
+  }
+}
 function useComponentsImportTask() {
+  const [isImporting, setIsImporting] = useState(false);
   const theme = useStudioTheme();
   const lang = useCurrentLang();
   const components = useFrontComponents();
-  const appKey = (theme == null ? void 0 : theme.id) || "";
-  const taskState = useInprogressTaskByKey(IMPORT_COMPONENTS_KEY, appKey);
-  const setTask = useUpdateTask(appKey);
-  const setTaskRef = useRef(setTask);
-  setTaskRef.current = setTask;
   const entifyClient = useCreateEntityClient();
-  const task = taskState && taskState.status !== "done" ? taskPool[taskState.taskId] : void 0;
-  const aiUrl = useAiUrl();
   const componentCategories = useComponentCategories();
-  const handleTaskChange = useCallback((data) => {
-    setTaskRef.current(data);
-  }, []);
   const importComponents = useCallback(
-    (ids, needTranslate) => {
-      if (!(theme == null ? void 0 : theme.id)) {
-        console.error("没设置Theme");
-        return;
-      }
-      if (!entifyClient) {
-        console.error("entifyClient 创建失败");
-        return;
-      }
-      if (!aiUrl) {
-        console.error("没设置aiUrl");
-        return;
+    async (ids) => {
+      setIsImporting(true);
+      try {
+        if (!(theme == null ? void 0 : theme.id)) {
+          console.error("没设置Theme");
+          return;
+        }
+        if (!entifyClient) {
+          console.error("entifyClient 创建失败");
+          return;
+        }
+        const task = new ImportComponentsTask(
+          {
+            ids,
+            entifyClient,
+            themeId: theme == null ? void 0 : theme.id,
+            lang
+          },
+          components || [],
+          (componentCategories == null ? void 0 : componentCategories.items) || []
+        );
+        await task.importComponents();
+      } catch (error) {
+        console.error("导入组件失败", error);
+      } finally {
+        setIsImporting(false);
       }
-      const task2 = new ImportComponentsTask(
+    },
+    [theme == null ? void 0 : theme.id, entifyClient, lang, components, componentCategories]
+  );
+  return {
+    importComponents,
+    isImporting
+  };
+}
+function useTranlateComponents() {
+  const translateRequest = useTranslateRequest();
+  const translate = useCallback(
+    async (langId, ids) => {
+      return await translateRequest(
+        "/api/studio/translate-components",
+        { langId, ids },
         {
-          key: IMPORT_COMPONENTS_KEY,
-          ids,
-          entifyClient,
-          needTranslate,
-          themeId: theme == null ? void 0 : theme.id,
-          lang,
-          aiUrl
-          //categoryId,
-        },
-        components || [],
-        (componentCategories == null ? void 0 : componentCategories.items) || []
+          validateParams: (params) => {
+            const { ids: ids2 } = params;
+            if (!Array.isArray(ids2) || ids2.length === 0) {
+              throw new Error("组件ID列表不能为空");
+            }
+          },
+          transformParams: (params, websiteId) => ({
+            websiteId,
+            targetLangId: params.langId.trim(),
+            sourceComponentIds: params.ids
+          })
+        }
       );
-      taskPool[task2.id] = task2;
-      task2.onDataChange(handleTaskChange);
-      task2.start();
     },
-    [
-      theme == null ? void 0 : theme.id,
-      entifyClient,
-      aiUrl,
-      lang,
-      components,
-      componentCategories,
-      handleTaskChange
-    ]
+    [translateRequest]
   );
-  return { taskState, importComponents, task };
+  return translate;
 }
 function ImportComponentModal({
   open,
   onClose
 }) {
+  var _a3;
   const [selection, setSelections] = useState([]);
+  const [loading, setLoading] = useState(false);
   const [confirmTitle, setConfirmTitle] = useState(
     void 0
   );
   const baseThemeId = useBaseLangThemeId();
+  const theme = useStudioTheme();
   const isBaseTheme = useIsBaseLangTheme();
   const parentTheme = useParentTheme();
   const themeComs = useFrontComponents();
-  const { taskState, importComponents, task } = useComponentsImportTask();
-  useEffect(() => {
-    var _a3;
-    setSelections == null ? void 0 : setSelections(((_a3 = taskState == null ? void 0 : taskState.data) == null ? void 0 : _a3.ids) || []);
-  }, [setSelections, taskState == null ? void 0 : taskState.data]);
-  useEffect(() => {
-    if ((taskState == null ? void 0 : taskState.status) === "done") {
-      setSelections == null ? void 0 : setSelections([]);
-    }
-  }, [setSelections, taskState]);
+  const { importComponents } = useComponentsImportTask();
+  const translateComponents = useTranlateComponents();
   const confirmResolveRef = useRef();
   const { data: baseTheme, isLoading } = useOneThemeById(
     baseThemeId || void 0,
@@ -202858,8 +203122,8 @@ function ImportComponentModal({
   }, [baseTheme == null ? void 0 : baseTheme.components, parentTheme == null ? void 0 : parentTheme.components, isBaseTheme]);
   const noCategoryComponents = useMemo(() => {
     return components.filter((component) => {
-      var _a3;
-      return !((_a3 = component.category) == null ? void 0 : _a3.id);
+      var _a4;
+      return !((_a4 = component.category) == null ? void 0 : _a4.id);
     });
   }, [components]);
   const handleToggleSelect = React__default.useCallback((id) => {
@@ -202885,26 +203149,51 @@ function ImportComponentModal({
     });
   }, []);
   const handleImport = useCallback(async () => {
-    const comsToImport = components.filter(
-      (c) => selection.includes(c.id || "")
-    );
-    const existings = themeComs == null ? void 0 : themeComs.filter(
-      (c) => comsToImport == null ? void 0 : comsToImport.find((com) => c.name === com.name)
-    );
-    if (existings == null ? void 0 : existings.length) {
-      const result = await confirmOverride(existings.length);
-      if (!result) {
-        return;
+    var _a4;
+    setLoading(true);
+    try {
+      const comsToImport = components.filter(
+        (c) => selection.includes(c.id || "")
+      );
+      const existings = themeComs == null ? void 0 : themeComs.filter(
+        (c) => comsToImport == null ? void 0 : comsToImport.find((com) => c.name === com.name)
+      );
+      if (existings == null ? void 0 : existings.length) {
+        const result = await confirmOverride(existings.length);
+        if (!result) {
+          return;
+        }
       }
+      if (isBaseTheme) {
+        await importComponents(selection);
+      } else {
+        await translateComponents(((_a4 = theme == null ? void 0 : theme.lang) == null ? void 0 : _a4.id) || "", selection);
+        addToast({
+          title: "成功添加导入任务",
+          color: "success"
+        });
+      }
+      setSelections([]);
+      onClose();
+    } catch (error) {
+      console.error("导入组件失败:", error);
+      addToast({
+        title: "导入组件失败",
+        color: "danger"
+      });
+    } finally {
+      setLoading(false);
     }
-    importComponents(selection, !isBaseTheme);
   }, [
     components,
     confirmOverride,
     importComponents,
     isBaseTheme,
+    onClose,
     selection,
-    themeComs
+    (_a3 = theme == null ? void 0 : theme.lang) == null ? void 0 : _a3.id,
+    themeComs,
+    translateComponents
   ]);
   return /* @__PURE__ */ jsxRuntimeExports.jsxs(Modal$1, { isOpen: open, onClose, children: [
     /* @__PURE__ */ jsxRuntimeExports.jsx(ModalOverlay$1, { className: "z-10" }),
@@ -202922,8 +203211,8 @@ function ImportComponentModal({
           /* @__PURE__ */ jsxRuntimeExports.jsx(ModalBody, { className: "flex-1 overflow-y-auto min-h-0 p-2", children: isLoading ? /* @__PURE__ */ jsxRuntimeExports.jsx(ComponentsSkeletons, {}) : /* @__PURE__ */ jsxRuntimeExports.jsxs(TreeView, { children: [
             categories == null ? void 0 : categories.map((category) => /* @__PURE__ */ jsxRuntimeExports.jsx(GroupNode, { title: category.name, icon: false, children: components.filter(
               (component) => {
-                var _a3;
-                return ((_a3 = component.category) == null ? void 0 : _a3.id) === category.id;
+                var _a4;
+                return ((_a4 = component.category) == null ? void 0 : _a4.id) === category.id;
               }
             ).map((component) => /* @__PURE__ */ jsxRuntimeExports.jsx(
               LeafNode,
@@ -202958,22 +203247,7 @@ function ImportComponentModal({
           ] }) }),
           /* @__PURE__ */ jsxRuntimeExports.jsx(Divider, {}),
           /* @__PURE__ */ jsxRuntimeExports.jsxs(ModalFooter, { className: "justify-between", children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "text-xs text-default-500 flex items-center gap-2", children: [
-              selection.length > 0 && (taskState == null ? void 0 : taskState.status) !== "in-progress" ? `${selection.length}个组件选中` : "",
-              taskState == null ? void 0 : taskState.infoMessage,
-              (taskState == null ? void 0 : taskState.status) === "in-progress" && /* @__PURE__ */ jsxRuntimeExports.jsx(
-                Button$2,
-                {
-                  variant: "light",
-                  size: "sm",
-                  isIconOnly: true,
-                  onPress: () => {
-                    task == null ? void 0 : task.stop();
-                  },
-                  children: /* @__PURE__ */ jsxRuntimeExports.jsx(TaskStopIcon, { className: "size-9 text-primary" })
-                }
-              )
-            ] }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-xs text-default-500 flex items-center gap-2" }),
             /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex gap-2", children: [
               /* @__PURE__ */ jsxRuntimeExports.jsx(Button$2, { variant: "light", onPress: onClose, children: "关闭" }),
               /* @__PURE__ */ jsxRuntimeExports.jsx(
@@ -202982,7 +203256,7 @@ function ImportComponentModal({
                   variant: "solid",
                   color: "primary",
                   onPress: handleImport,
-                  isLoading: (taskState == null ? void 0 : taskState.status) === "in-progress",
+                  isLoading: loading,
                   children: "转入"
                 }
               )
@@ -203018,7 +203292,6 @@ function ComponentsRootNode(props) {
   const website = useWebsite();
   const handleNewCagegory = useNewRow();
   const components = useFrontComponents();
-  const { taskState } = useComponentsImportTask();
   const comsNoCategory = useMemo(
     () => components == null ? void 0 : components.filter((item) => {
       var _a3;
@@ -203058,7 +203331,6 @@ function ComponentsRootNode(props) {
     },
     [setEditingPage, components, setEditingComponent, onSelectContent]
   );
-  const importting = (taskState == null ? void 0 : taskState.status) === "in-progress";
   if (!themeId) {
     return null;
   }
@@ -203067,7 +203339,7 @@ function ComponentsRootNode(props) {
       GroupNode,
       {
         title: "自定义组件",
-        fiexdAction: open || importting,
+        fiexdAction: open,
         icon: null,
         classNames: {
           title: "text-sm font-semibold"
@@ -203080,7 +203352,6 @@ function ComponentsRootNode(props) {
               size: "sm",
               variant: "light",
               isIconOnly: true,
-              isLoading: importting,
               children: /* @__PURE__ */ jsxRuntimeExports.jsx(
                 Icon,
                 {
@@ -203511,11 +203782,20 @@ function WebsiteStudioInner(props) {
   const { aiUrl, deployUrl } = props;
   const website = useWebsite();
   const langId = ((_a3 = useCurrentLang()) == null ? void 0 : _a3.id) || ((_b3 = website == null ? void 0 : website.baseLang) == null ? void 0 : _b3.id);
+  const token = useEntifyToken();
   const { data: theme, isLoading: themeLoading } = useOneTheme(
     newThemeQueryOptions(website == null ? void 0 : website.id, langId)
   );
   return /* @__PURE__ */ jsxRuntimeExports.jsxs(StudioRoot, { theme, deployUrl, children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsx(EditorScope, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(AiAgentRoot, { endpoint: aiUrl, globalProvider: WEBSITE_DESIGN_PROMPT, children: /* @__PURE__ */ jsxRuntimeExports.jsx(WebsiteDesigner, { themeLoading, deployUrl }) }) }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(EditorScope, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+      AiAgentRoot,
+      {
+        endpoint: aiUrl,
+        globalProvider: WEBSITE_DESIGN_PROMPT,
+        token,
+        children: /* @__PURE__ */ jsxRuntimeExports.jsx(WebsiteDesigner, { themeLoading, deployUrl })
+      }
+    ) }),
     /* @__PURE__ */ jsxRuntimeExports.jsx(GlobalLoading, { loading: themeLoading })
   ] });
 }
@@ -204389,8 +204669,17 @@ const ThemeStudio = (props) => {
     themeId,
     newThemeByIdQueryOptions()
   );
+  const token = useEntifyToken();
   return /* @__PURE__ */ jsxRuntimeExports.jsxs(StudioRoot, { theme, deployUrl: deployURL, children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsx(EditorScope, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(AiAgentRoot, { endpoint: aiUrl, globalProvider: WEBSITE_DESIGN_PROMPT, children: /* @__PURE__ */ jsxRuntimeExports.jsx(ThemeDesigner, {}) }) }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(EditorScope, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+      AiAgentRoot,
+      {
+        endpoint: aiUrl,
+        globalProvider: WEBSITE_DESIGN_PROMPT,
+        token,
+        children: /* @__PURE__ */ jsxRuntimeExports.jsx(ThemeDesigner, {})
+      }
+    ) }),
     /* @__PURE__ */ jsxRuntimeExports.jsx(GlobalLoading, { loading: themeLoading })
   ] });
 };
@@ -204408,4 +204697,4 @@ export {
   typescriptDefaults as t,
   useCustomizedMaterials as u
 };
-//# sourceMappingURL=index-525006cd.js.map
+//# sourceMappingURL=index-310e120c.js.map