Function MainLayout

src/pages/components/layout/MainLayout.tsx:164–545

({ children, className, pageName })

  className: string;
  pageName?: string;
}> = ({ children, className, pageName }) => {
  const [modal, contextHolder] = Modal.useModal();
  const { colorThemeState, updateColorTheme } = useAppContext();

  const importRef = useRef<RefTextAreaType>(null);
  const [importVisible, setImportVisible] = useState(false);
  const [showLanguage, setShowLanguage] = useState(false);
  const { t } = useTranslation();

  const showImportResult = (stat: TImportStat) => {
    if (!stat) return;
    modal.info!({
      title: t("script_import_result"),
      content: (
        <Space direction="vertical" style={{ width: "100%" }}>
          <div style={{ textAlign: "center" }}>
            <Space size="small" style={{ fontSize: 18 }}>
              <IconCheckCircle style={{ color: "green" }} />
              {stat.success}
              {""}
              <IconCloseCircle style={{ color: "red" }} />
              {stat.fail}
            </Space>
          </div>
          {stat.msg.length > 0 && (
            <>
              <b>{t("failure_info") + ":"}</b>
              {stat.msg}
            </>
          )}
        </Space>
      ),
    });
  };

  const importByUrlsLocal = async (urls: string[]): Promise<void> => {
    const stat = await importByUrls(urls);
    if (stat) showImportResult(stat);
  };

  // 处理 ZIP 文件的 Skill 安装
  const handleZipSkillInstall = async (file: File) => {
    const buffer = await file.arrayBuffer();
    // ArrayBuffer → base64（chrome.runtime 消息不支持直接传 ArrayBuffer）
    const bytes = new Uint8Array(buffer);
    let binary = "";
    for (let i = 0; i < bytes.length; i++) {
      binary += String.fromCharCode(bytes[i]);
    }
    const base64 = btoa(binary);
    const uuid = await agentClient.prepareSkillInstall(base64);
    window.open(`/src/install.html?skill=${uuid}`, "_blank");
  };

  const onDrop = (acceptedFiles: FileWithPath[]) => {
    // 本地的文件在当前页面处理，打开安装页面，将FileSystemFileHandle传递过去
    // 实现本地文件的监听
    const stat: TImportStat = { success: 0, fail: 0, msg: [] };