@devops-flow/devops-flow-pipeline-detail 0.0.37

package/es/pages/dashboard/index.js

@@ -0,0 +1,280 @@
+import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
+import _regeneratorRuntime from "@babel/runtime/regenerator";
+import React, { useState, useEffect, useMemo } from 'react';
+import { getOrgUserInfo, experimentFunction } from "../../components/newbieTask/util";
+import DashboardNav from "../../components/dashboardNav";
+import DashboardMain from "../../components/dashboardMain";
+import NewbieTask from "../../components/newbieTask";
+import { compareDate, getLocalStorageCache, setLocalStorageCache, getFeature, getCookie, intervalEnterTime } from "../../utils";
+import { Provider } from "../../contexts/pipeline";
+import { Lead } from '@alife/devops-ui';
+import { Router } from '@reach/router';
+import { navigateWithContexPath } from "../../utils/route-utils";
+import dayjs from 'dayjs';
+import intl from "../../locale";
+import track from "../../utils/track";
+import Illustration from '@alife/yunxiao-illustration';
+import "./index.scss";
+import helpLink from "../../utils/helplink";
+import { updateTitle } from "../tbNavigationInit/detail";
+import { MachineGroupUpgradeContext } from "../../components/dashboardMain/components/machineGroupUpgrade/context";
+import { useAnnouncementEffect } from "./useAnnouncement";
+import { useAllowUpgradeState } from "./useAllowUpgradeState";
+import Survey from "./Survey";
+import { NewFeatureLead } from "./NewFeatureLead";
+var ProductDialog = Lead.ProductDialog,
+  NotifyCard = Lead.NotifyCard;
+var slides = [{
+  img: /*#__PURE__*/React.createElement(Illustration, {
+    type: "FlowWelcome4"
+  }),
+  text: intl.get({
+    id: 'rdc-tb-cd-assets.components.guidance.SelectATemplate',
+    defaultMessage: '选择模板'
+  }),
+  desc: intl.get({
+    id: 'rdc-tb-cd-assets.components.guidance.CoverScenariosATotalOf',
+    defaultMessage: '/* 覆盖7种场景，共计60+个专业模板 */'
+  })
+}, {
+  img: /*#__PURE__*/React.createElement(Illustration, {
+    type: "FlowWelcome3"
+  }),
+  text: intl.get({
+    id: 'rdc-tb-cd-assets.components.guidance.SelectACodeSource',
+    defaultMessage: '选择代码源'
+  }),
+  desc: intl.get({
+    id: 'rdc-tb-cd-assets.components.guidance.OrchestrationAndConfigurationAsYou',
+    defaultMessage: '/* 编排配置随心所欲 */'
+  })
+}, {
+  img: /*#__PURE__*/React.createElement(Illustration, {
+    type: "FlowWelcome2"
+  }),
+  text: intl.get({
+    id: 'rdc-tb-cd-assets.components.guidance.ConfigureTasks',
+    defaultMessage: '配置任务'
+  }),
+  desc: intl.get({
+    id: 'rdc-tb-cd-assets.components.guidance.SupportsMoreThanCommonCode',
+    defaultMessage: '/* 支持8种以上常用代码库 */'
+  })
+}, {
+  img: /*#__PURE__*/React.createElement(Illustration, {
+    type: "FlowWelcome1"
+  }),
+  text: intl.get({
+    id: 'rdc-tb-cd-assets.components.guidance.PublishedSuccessfully',
+    defaultMessage: '发布成功'
+  }),
+  desc: intl.get({
+    id: 'rdc-tb-cd-assets.components.guidance.TheRunningResultIsClear',
+    defaultMessage: '/* 运行结果清晰直观 */'
+  })
+}];
+var _ref = window.AK_GLOBAL || {},
+  _ref$neverCreatePipel = _ref.neverCreatePipeline,
+  neverCreatePipeline = _ref$neverCreatePipel === void 0 ? 'false' : _ref$neverCreatePipel,
+  currentUser = _ref.currentUser;
+var orgId = window.userInfos.orgId;
+var JOIN_ORG_TIME = 'join-org-time';
+var SESSION_LEAD_VISITED = "session-lead-visited/" + currentUser.workid;
+var NEW_USER_GUIDE_VISIBLE = "NEW_USER_GUIDE_VISIBLE/" + currentUser.workid;
+export var prefix = 'dashboard';
+export default (function () {
+  var _useState = useState(getLocalStorageCache(JOIN_ORG_TIME + "_" + orgId) || ''),
+    userJoinOrgTime = _useState[0],
+    setUserJoinOrgTime = _useState[1];
+  var _useState2 = useState(getFeature('app.welcome.dialog') && neverCreatePipeline === 'true' && !JSON.parse(getLocalStorageCache("isFirstVisitFlow_" + orgId, false) || 'false') && !location.pathname.includes('new')),
+    productDialogVisible = _useState2[0],
+    setProductDialogVisible = _useState2[1];
+
+  // 弹窗不要扎堆出
+  var productDialogVisibleInitial = useMemo(function () {
+    return productDialogVisible;
+  }, []);
+  var _useState3 = useState(false),
+    dockGoideVisible = _useState3[0],
+    setDockGoideVisible = _useState3[1];
+  var getDockGuideVisible = /*#__PURE__*/function () {
+    var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+      return _regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            setDockGoideVisible(false);
+          case 1:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee);
+    }));
+    return function getDockGuideVisible() {
+      return _ref2.apply(this, arguments);
+    };
+  }();
+  var _useState4 = useState(getFeature('nav.user.session') && getCookie(SESSION_LEAD_VISITED) !== 'false'),
+    sessionLeadVisible = _useState4[0],
+    setSessingLeadVisible = _useState4[1];
+  var getNewUserGuideVisibility = function getNewUserGuideVisibility() {
+    var visibleCache = getLocalStorageCache(NEW_USER_GUIDE_VISIBLE, false);
+    if (intervalEnterTime() <= 5 && !visibleCache) {
+      return true;
+    }
+    return false;
+  };
+  var _useState5 = useState(getNewUserGuideVisibility()),
+    newUserGuideVisible = _useState5[0],
+    setNewUserGuideVisible = _useState5[1];
+  var visitedDetailTime = getLocalStorageCache("visited_detail_time/" + orgId);
+  useEffect(function () {
+    if (!visitedDetailTime) return;
+    if (dockGoideVisible) {
+      window.TB_NAVIGATION.Dock.showDockGuide && window.TB_NAVIGATION.Dock.showDockGuide({
+        onOk: function onOk() {
+          setDockGoideVisible(false);
+          sessionLeadVisible && setSessingLeadVisible(true);
+        }
+      });
+    }
+  }, [visitedDetailTime, sessionLeadVisible, dockGoideVisible]);
+  useEffect(function () {
+    getDockGuideVisible();
+    if (productDialogVisible) {
+      sessionStorage.setItem('productDialogVisible', 'true');
+    }
+  }, []);
+  var upgardeWholeStatus = {
+    build: useAllowUpgradeState('build'),
+    deploy: useAllowUpgradeState('deploy')
+  };
+  useAnnouncementEffect(upgardeWholeStatus);
+  var request = /*#__PURE__*/function () {
+    var _ref3 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
+      var _yield$getOrgUserInfo, joinOrgTime;
+      return _regeneratorRuntime.wrap(function _callee2$(_context2) {
+        while (1) switch (_context2.prev = _context2.next) {
+          case 0:
+            _context2.next = 2;
+            return getOrgUserInfo();
+          case 2:
+            _yield$getOrgUserInfo = _context2.sent;
+            joinOrgTime = _yield$getOrgUserInfo.joinOrgTime;
+            setUserJoinOrgTime(joinOrgTime);
+            setLocalStorageCache(JOIN_ORG_TIME + "_" + orgId, joinOrgTime);
+          case 6:
+          case "end":
+            return _context2.stop();
+        }
+      }, _callee2);
+    }));
+    return function request() {
+      return _ref3.apply(this, arguments);
+    };
+  }();
+  useEffect(function () {
+    window.userInfos.env === 'aliyun' && !userJoinOrgTime && request();
+  }, [userJoinOrgTime]);
+  var renderNewbiTask = function renderNewbiTask() {
+    if (productDialogVisible) {
+      return null;
+    }
+    var experiment = experimentFunction();
+    if (!userJoinOrgTime && !experiment) {
+      return null;
+    }
+    var releaseTime = '2020-05-15';
+    var joinOrgTime = dayjs(userJoinOrgTime).format('YYYY-MM-DD');
+    if (compareDate(releaseTime, joinOrgTime) !== 'd2' && !experiment) {
+      return;
+    }
+    return /*#__PURE__*/React.createElement(NewbieTask, null);
+  };
+  var renderContent = function renderContent() {
+    return /*#__PURE__*/React.createElement(Provider, null, /*#__PURE__*/React.createElement(MachineGroupUpgradeContext.Provider, {
+      value: upgardeWholeStatus
+    }, /*#__PURE__*/React.createElement("div", {
+      className: prefix
+    }, /*#__PURE__*/React.createElement(Router, null, /*#__PURE__*/React.createElement(DashboardMain, {
+      path: "/*"
+    })), /*#__PURE__*/React.createElement(DashboardNav, null))));
+  };
+  var isPre = window.location.href.includes('pre');
+  var showNewbie = [true, 'true'].includes(getCookie('showNewbie'));
+  useEffect(function () {
+    updateTitle();
+  }, []);
+  var displayedProductDialog = sessionStorage.getItem('productDialogVisible') === 'true';
+  return /*#__PURE__*/React.createElement(React.Fragment, null, renderContent(), getFeature('app.newbie.task') && (!isPre || showNewbie) && renderNewbiTask(), productDialogVisible && /*#__PURE__*/React.createElement(ProductDialog, {
+    appName: "flow",
+    visible: true,
+    subTitle: intl.get({
+      id: 'rdc-tb-cd-assets.components.guidance.ItOnlyTakesMinutesFrom',
+      defaultMessage: '从代码到交付上线仅需5分钟'
+    }),
+    slides: slides,
+    onClose: function onClose() {
+      setProductDialogVisible(false);
+    },
+    buttons: [{
+      dance: true,
+      type: 'primary',
+      text: intl.get({
+        id: 'rdc-tb-cd-assets.components.guidance.CreateNow',
+        defaultMessage: '立即新建'
+      }),
+      onClick: function onClick() {
+        setProductDialogVisible(false);
+        var homePage = window.localStorage.getItem("homePage/flow/" + orgId) || '/my';
+        navigateWithContexPath(homePage + "/new");
+      }
+    }]
+  }), !productDialogVisibleInitial && !displayedProductDialog && getFeature('new.feature.push') && /*#__PURE__*/React.createElement(NewFeatureLead, null), helpLink('flow_language_special_scene') && newUserGuideVisible && /*#__PURE__*/React.createElement(NotifyCard, {
+    visible: newUserGuideVisible,
+    title: intl.get({
+      id: 'rdc-tb-cd-assets.pages.dashboard.questionnaire.Title',
+      defaultMessage: '手把手教你玩转 Flow'
+    }),
+    btns: [{
+      type: 'normal',
+      text: intl.get({
+        id: 'rdc-tb-cd-assets.pages.dashboard.questionnaire.Ignore',
+        defaultMessage: '忽略'
+      }),
+      onClick: function onClick() {
+        setNewUserGuideVisible(false);
+        setLocalStorageCache(NEW_USER_GUIDE_VISIBLE, false);
+        track({
+          action: 'ignore guide',
+          page: 'new user guide',
+          daysinceenterflow: intervalEnterTime()
+        });
+      }
+    }, {
+      type: 'primary',
+      text: intl.get({
+        id: 'rdc-tb-cd-assets.pages.dashboard.questionnaire.Feedback',
+        defaultMessage: '立即查看'
+      }),
+      onClick: function onClick() {
+        window.open(helpLink('flow_language_special_scene'));
+        setNewUserGuideVisible(false);
+        setLocalStorageCache(NEW_USER_GUIDE_VISIBLE, false);
+        track({
+          action: 'view guide',
+          page: 'new user guide',
+          daysinceenterflow: intervalEnterTime()
+        });
+      }
+    }],
+    onClose: function onClose() {
+      return setNewUserGuideVisible(false);
+    },
+    width: 350,
+    top: 90,
+    type: "lite"
+  }, /*#__PURE__*/React.createElement("div", null, intl.get({
+    id: 'rdc-tb-cd-assets.pages.dashboard.questionnaire.Description',
+    defaultMessage: '根据您的开发语言，查看对应教程，快速体验流水线构建并部署。'
+  }))), /*#__PURE__*/React.createElement(Survey, null));
+});

package/es/pages/dashboard/index.scss

@@ -0,0 +1,57 @@
+$prefix: dashboard;
+
+// @include block($prefix) {
+//   min-height: calc(100vh - 48px);
+//   margin-top: 48px;
+//   padding: {
+//     top: 30px;
+//     right: 40px;
+//     left: 40px;
+//   };
+//   overflow: hidden;
+//   padding-bottom: 0;
+//   transform: rotate(0);
+// }
+@media only screen and (min-width: 1500px) {
+  ##{$prefix}-announcement-content {
+    br.line-break {
+      display: none;
+    }
+  }
+}
+
+.session-time-lead {
+  color: var(--color-white, #fff) !important;
+  background: var(--color-brand1-6, #1b9aee) !important;
+
+  .driver-popover-description {
+    color: var(--color-white, #fff) !important;
+    line-height: 1.5 !important;
+  }
+
+  .driver-popover-tip.top {
+    border-bottom-color: var(--color-brand1-6, #1b9aee) !important;
+  }
+
+  .driver-close-btn {
+    color: var(--color-brand1-6, #1b9aee) !important;
+  }
+
+}
+
+#driver-highlighted-element-stage {
+  opacity: 0 !important;
+  background: transparent !important;
+}
+
+#driver-page-overlay {
+  display: none !important;
+}
+
+body.withAnnouncement .notify-card {
+  top: 96px !important;
+}
+
+#tb-navigation-announcement-content .next-message-content {
+  transform: none;
+}

package/es/pages/dashboard/lead.hack.scss

@@ -0,0 +1,13 @@
+.teamix-lead-changelog.teamix-lead-changelog {
+  height: 563px;
+  width: 800px;
+}
+
+.teamix-lead-changelog-noSideBar.teamix-lead-changelog-noSideBar {
+  // height: 300px;
+  padding: 29px 20px 16px;
+}
+
+.teamix-lead-changelog-picture-header {
+  height: 300px !important;
+}

package/es/pages/dashboard/types.d.ts

@@ -0,0 +1,10 @@
+import { IAllowUpgradeInfo, IUpgradeTaskStatus, PURPOSE } from 'src/components/dashboardMain/components/machineGroupUpgrade/type';
+export interface IUpgradeStatusItem {
+    allowUpgradeInfo: IAllowUpgradeInfo;
+    upgradeTaskStatus: IUpgradeTaskStatus;
+    _upgrading: boolean;
+    refresh: () => void;
+}
+export type IUpgradeWholeStatus = {
+    [key in PURPOSE]: IUpgradeStatusItem;
+};

package/es/pages/dashboard/types.js

@@ -0,0 +1 @@
+export {};

package/es/pages/dashboard/useAllowUpgradeState.d.ts

@@ -0,0 +1,3 @@
+import { PURPOSE } from 'src/components/dashboardMain/components/machineGroupUpgrade/type';
+import { IUpgradeStatusItem } from './types';
+export declare function useAllowUpgradeState(purpose: PURPOSE): IUpgradeStatusItem;

package/es/pages/dashboard/useAllowUpgradeState.js

@@ -0,0 +1,77 @@
+import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
+import _regeneratorRuntime from "@babel/runtime/regenerator";
+import { useCallback, useEffect, useState } from 'react';
+import exceed from "../../utils/apimap";
+export function useAllowUpgradeState(purpose) {
+  var _useState = useState(null),
+    upgradeInfo = _useState[0],
+    setUpgradeInfo = _useState[1];
+  var getUpgradeStatus = useCallback(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+    var resp;
+    return _regeneratorRuntime.wrap(function _callee$(_context) {
+      while (1) switch (_context.prev = _context.next) {
+        case 0:
+          _context.next = 2;
+          return exceed.fetch({
+            api: 'Machine.group.upgradeStatus',
+            params: {
+              purpose: purpose
+            },
+            data: {
+              purpose: purpose
+            }
+          });
+        case 2:
+          resp = _context.sent;
+          return _context.abrupt("return", resp.object);
+        case 4:
+        case "end":
+          return _context.stop();
+      }
+    }, _callee);
+  })), [purpose]);
+  var checkUpgradeInfo = useCallback(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
+    var _upgradeTaskStatus;
+    var resp, _allowUpgradeInfo, upgradeTaskStatus;
+    return _regeneratorRuntime.wrap(function _callee2$(_context2) {
+      while (1) switch (_context2.prev = _context2.next) {
+        case 0:
+          _context2.next = 2;
+          return exceed.fetch({
+            api: 'Machine.group.allowUpgrade',
+            params: {
+              purpose: purpose
+            },
+            data: {
+              purpose: purpose
+            }
+          });
+        case 2:
+          resp = _context2.sent;
+          _allowUpgradeInfo = resp.object;
+          if (!(_allowUpgradeInfo !== null && _allowUpgradeInfo !== void 0 && _allowUpgradeInfo.allowUpgrade && _allowUpgradeInfo !== null && _allowUpgradeInfo !== void 0 && _allowUpgradeInfo.showUpgrade)) {
+            _context2.next = 8;
+            break;
+          }
+          _context2.next = 7;
+          return getUpgradeStatus();
+        case 7:
+          upgradeTaskStatus = _context2.sent;
+        case 8:
+          setUpgradeInfo({
+            allowUpgradeInfo: _allowUpgradeInfo,
+            upgradeTaskStatus: upgradeTaskStatus,
+            _upgrading: [1, 2, 3].includes((_upgradeTaskStatus = upgradeTaskStatus) === null || _upgradeTaskStatus === void 0 ? void 0 : _upgradeTaskStatus.upgradeStatus),
+            refresh: checkUpgradeInfo
+          });
+        case 9:
+        case "end":
+          return _context2.stop();
+      }
+    }, _callee2);
+  })), [getUpgradeStatus, purpose]);
+  useEffect(function () {
+    checkUpgradeInfo();
+  }, [checkUpgradeInfo]);
+  return upgradeInfo;
+}

package/es/pages/dashboard/useAnnouncement.d.ts

@@ -0,0 +1,2 @@
+import { IUpgradeWholeStatus } from './types';
+export declare function useAnnouncementEffect(upgradeStates: IUpgradeWholeStatus): void;

package/es/pages/dashboard/useAnnouncement.js

@@ -0,0 +1,125 @@
+import React, { useEffect } from 'react';
+import {
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+
+removeLocalStorageCache, setLocalStorageCache, getFeature } from "../../utils";
+import { helpLinkIfAvailable } from "../../utils/helplink";
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+import { prefix } from '.';
+import { navigateWithContexPath } from "../../utils/route-utils";
+import { Button } from '@teamix/ui';
+import intl from "../../locale";
+var FLOW_ANNOUNCEMENT_BUILD_GROUP_UPGRADE = 'FLOW_ANNOUNCEMENT_BUILD_GROUP_UPGRADE';
+var FLOW_ANNOUNCEMENT_DEPLOY_GROUP_UPGRADE = 'FLOW_ANNOUNCEMENT_DEPLOY_GROUP_UPGRADE';
+function setAnnouncement(lsKey, content) {
+  var _window$TB_NAVIGATION, _window$TB_NAVIGATION2;
+  (_window$TB_NAVIGATION = window.TB_NAVIGATION) === null || _window$TB_NAVIGATION === void 0 ? void 0 : (_window$TB_NAVIGATION2 = _window$TB_NAVIGATION.Announcement) === null || _window$TB_NAVIGATION2 === void 0 ? void 0 : _window$TB_NAVIGATION2.register({
+    componentType: 'banner',
+    title: /*#__PURE__*/React.createElement("div", {
+      id: prefix + "-announcement-content"
+    }, content),
+    onClose: function onClose() {
+      var _window$TB_NAVIGATION3, _window$TB_NAVIGATION4;
+      (_window$TB_NAVIGATION3 = window.TB_NAVIGATION) === null || _window$TB_NAVIGATION3 === void 0 ? void 0 : (_window$TB_NAVIGATION4 = _window$TB_NAVIGATION3.Announcement) === null || _window$TB_NAVIGATION4 === void 0 ? void 0 : _window$TB_NAVIGATION4.unregister();
+      setLocalStorageCache(lsKey, true);
+    }
+  });
+}
+
+/** 站点公告写在这里 */
+function setCommonAnnouncementIfNeeded() {
+  // const COMMON_ANNOUNCEMENT_LS_KEY = 'xxx'; // 公告ls的key
+  // const userClosed = getLocalStorageCache(COMMON_ANNOUNCEMENT_LS_KEY);
+  // if (!userClosed && ENV === 'aliyun') {
+  //   setAnnouncement(COMMON_ANNOUNCEMENT_LS_KEY, <>公告</>);
+  //   return true;
+  // }
+
+  return false;
+}
+function setRunnerUpgradeAnnouncementIfNeeded(upgradeStates) {
+  var _upgradeStates$build$, _upgradeStates$build$2, _upgradeStates$deploy, _upgradeStates$deploy2;
+  var buildUpgradeable = ((_upgradeStates$build$ = upgradeStates.build.allowUpgradeInfo) === null || _upgradeStates$build$ === void 0 ? void 0 : _upgradeStates$build$.allowUpgrade) && ((_upgradeStates$build$2 = upgradeStates.build.allowUpgradeInfo) === null || _upgradeStates$build$2 === void 0 ? void 0 : _upgradeStates$build$2.showUpgrade);
+  var deployUpgradeable = ((_upgradeStates$deploy = upgradeStates.deploy.allowUpgradeInfo) === null || _upgradeStates$deploy === void 0 ? void 0 : _upgradeStates$deploy.allowUpgrade) && ((_upgradeStates$deploy2 = upgradeStates.deploy.allowUpgradeInfo) === null || _upgradeStates$deploy2 === void 0 ? void 0 : _upgradeStates$deploy2.showUpgrade);
+  var permissions = window.AK_GLOBAL.currentUser.permissions;
+  var canDoBuildUpgrade = permissions.includes('tb.role.buildGroup.admin');
+  var 能看到构建集群设置页面 = canDoBuildUpgrade || permissions.includes('tb.role.buildGroup.create');
+  var canDoDeployUpgrade = permissions.includes('tb.role.deployGroup.admin');
+  var 能看到主机组设置页面 = canDoDeployUpgrade || permissions.includes('tb.role.deployGroup.create');
+  if (buildUpgradeable && 能看到构建集群设置页面) {
+    setAnnouncement(FLOW_ANNOUNCEMENT_BUILD_GROUP_UPGRADE, /*#__PURE__*/React.createElement(React.Fragment, null, intl.get({
+      id: 'rdc-tb-cd-assets.pages.dashboard.useAnnouncement.CloudBasedPrivateBuildCluster',
+      defaultMessage: '云效私有构建集群优化升级，全新支持构建集群负载均衡和日志观测，'
+    }), getFeature('buildGroup.windows') && intl.get({
+      id: 'rdc-tb-cd-assets.pages.dashboard.useAnnouncement.NewSupportForWindowsBuild',
+      defaultMessage: '全新支持Windows构建，'
+    }), intl.get({
+      id: 'rdc-tb-cd-assets.pages.dashboard.useAnnouncement.Go',
+      defaultMessage: '前往'
+    }), ' ', /*#__PURE__*/React.createElement(Button, {
+      text: true,
+      type: "primary",
+      onClick: function onClick() {
+        navigateWithContexPath("/setting/build" + (canDoBuildUpgrade ? '?showDetail=true' : ''));
+      }
+    }, intl.get({
+      id: 'rdc-tb-cd-assets.pages.dashboard.useAnnouncement.UpgradeRunner',
+      defaultMessage: '升级Runner'
+    })), ' ', intl.get({
+      id: 'rdc-tb-cd-assets.pages.dashboard.useAnnouncement.AfterUse',
+      defaultMessage: '后使用'
+    }), ' ', helpLinkIfAvailable('runner_upgrade_guide', function (renderATag) {
+      return /*#__PURE__*/React.createElement(React.Fragment, null, "\xA0", renderATag(intl.get({
+        id: 'rdc-tb-cd-assets.pages.dashboard.useAnnouncement.LearnMore',
+        defaultMessage: '了解更多'
+      })));
+    })));
+  } else if (deployUpgradeable && 能看到主机组设置页面) {
+    setAnnouncement(FLOW_ANNOUNCEMENT_DEPLOY_GROUP_UPGRADE, /*#__PURE__*/React.createElement(React.Fragment, null, intl.get({
+      id: 'rdc-tb-cd-assets.pages.dashboard.useAnnouncement.CloudEffectHostGroupManagement',
+      defaultMessage: '云效主机组管理优化升级，全新支持 ARM 主机部署，前往'
+    }), ' ', /*#__PURE__*/React.createElement(Button, {
+      text: true,
+      type: "primary",
+      onClick: function onClick() {
+        navigateWithContexPath("/setting/deploy" + (canDoDeployUpgrade ? '?showDetail=true' : ''));
+      }
+    }, intl.get({
+      id: 'rdc-tb-cd-assets.pages.dashboard.useAnnouncement.UpgradeRunner',
+      defaultMessage: '升级Runner'
+    })), ' ', intl.get({
+      id: 'rdc-tb-cd-assets.pages.dashboard.useAnnouncement.AfterUse',
+      defaultMessage: '后使用'
+    }), ' ', helpLinkIfAvailable('deploy_runner_upgrade_guide', function (renderATag) {
+      return /*#__PURE__*/React.createElement(React.Fragment, null, "\xA0", renderATag(intl.get({
+        id: 'rdc-tb-cd-assets.pages.dashboard.useAnnouncement.LearnMore',
+        defaultMessage: '了解更多'
+      })));
+    })));
+  }
+}
+export function useAnnouncementEffect(upgradeStates) {
+  useEffect(function () {
+    if (!upgradeStates.build || !upgradeStates.deploy) {
+      // 等待加载完成
+      return;
+    }
+    var localStorageKeys曾经用过现已废弃的 = ['FLOWCLI_ANNOUNCEMENT', 'FLOW_ANNOUNCEMENT_STORAGE_TIME'];
+    localStorageKeys曾经用过现已废弃的.forEach(function (key) {
+      removeLocalStorageCache(key);
+    });
+
+    // 分两种：常规站点公告，和各企业runner升级公告。常规公告优先
+
+    var showingCommonAnnouncement = setCommonAnnouncementIfNeeded();
+    if (showingCommonAnnouncement) {
+      // 不展示runner升级公告
+    } else {
+      setRunnerUpgradeAnnouncementIfNeeded(upgradeStates);
+    }
+    return function () {
+      var _window$TB_NAVIGATION5, _window$TB_NAVIGATION6;
+      return (_window$TB_NAVIGATION5 = window.TB_NAVIGATION) === null || _window$TB_NAVIGATION5 === void 0 ? void 0 : (_window$TB_NAVIGATION6 = _window$TB_NAVIGATION5.Announcement) === null || _window$TB_NAVIGATION6 === void 0 ? void 0 : _window$TB_NAVIGATION6.unregister();
+    };
+  }, [upgradeStates]);
+}

package/es/pages/detail/appstack-wrap.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import 'utils/embedMark';
+import 'components/common/teambition/index.scss';
+import 'components/common/at-design.scss';
+import './appstack.scss';
+export default function (props: any): JSX.Element;
+export declare function mount(ModuleComponent: any, targetNode: any, props: any): void;
+export declare function unmount(targetNode: any): void;

package/es/pages/detail/appstack-wrap.js

@@ -0,0 +1,79 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
+var _excluded = ["type", "isBuildStatusBarHidden", "noBuildPadding", "basepath", "mountEffect"];
+/* eslint-disable import/first */
+// eslint-disable-next-line no-undef
+__webpack_public_path__ = window.flowCdnPath;
+import "../../utils/embedMark";
+import React, { useEffect, useMemo } from 'react';
+import ReactDOM from 'react-dom';
+import { Router, navigate } from '@reach/router';
+import Detail from "./index";
+import Build from "../../components/detailMain/build";
+import "../../components/common/teambition/index.scss";
+import "../../components/common/at-design.scss";
+import "./appstack.scss";
+import { joinWSRoom, disconnectSocket } from "../../socket";
+import { ConfigProvider } from '@teamix/ui';
+import { appStackGetLocale } from "../../utils";
+export default function (props) {
+  var _props$type = props.type,
+    type = _props$type === void 0 ? 'detail' : _props$type,
+    isBuildStatusBarHidden = props.isBuildStatusBarHidden,
+    noBuildPadding = props.noBuildPadding,
+    basepath = props.basepath,
+    _props$mountEffect = props.mountEffect,
+    mountEffect = _props$mountEffect === void 0 ? function () {
+      return undefined;
+    } : _props$mountEffect,
+    restProps = _objectWithoutPropertiesLoose(props, _excluded);
+  useMemo(function () {
+    if (type === 'detail') {
+      // 嵌入appstack 的路由变化，在globalHistory 里不会更新。做一次空的 navigate，里面会 getLocation()。
+      navigate(undefined, {
+        replace: true
+      });
+    }
+  }, []);
+  useEffect(mountEffect, []);
+  useEffect(function () {
+    joinWSRoom();
+    return disconnectSocket;
+  }, []);
+
+  // type="build" 只返回单次Build，不带路由
+  if (type === 'build') {
+    return /*#__PURE__*/React.createElement(ConfigProvider, {
+      locale: appStackGetLocale()
+    }, /*#__PURE__*/React.createElement(Build, _extends({
+      isStatusBarHidden: isBuildStatusBarHidden,
+      noPadding: noBuildPadding
+    }, restProps)));
+  }
+  return /*#__PURE__*/React.createElement(ConfigProvider, {
+    locale: appStackGetLocale()
+  }, /*#__PURE__*/React.createElement(Router, {
+    basepath: basepath
+  }, /*#__PURE__*/React.createElement(Detail, _extends({
+    path: "/*"
+  }, restProps, {
+    onBuildNumberChange: function onBuildNumberChange() {
+      var _console;
+      for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+        args[_key] = arguments[_key];
+      }
+      (_console = console).log.apply(_console, ['Appstack: onBuildNumberChange '].concat(args));
+      return props.onBuildNumberChange.apply(props, args);
+    }
+  }))));
+}
+
+// 声明 mount 生命周期
+export function mount(ModuleComponent, targetNode, props) {
+  ReactDOM.render(/*#__PURE__*/React.createElement(ModuleComponent, props), targetNode);
+}
+
+// 声明 unmount 生命周期
+export function unmount(targetNode) {
+  ReactDOM.unmountComponentAtNode(targetNode);
+}

package/es/pages/detail/appstack.scss

@@ -0,0 +1,4 @@
+.pipe-histories-container.pipe-histories-container.pipe-histories-container {
+  height: calc(100vh - 152px) !important;
+  max-height: calc(100vh - 152px) !important;
+}