@abtnode/ux 1.16.13-beta-90ded76f → 1.16.13-beta-2eb54cbc

package/lib/{insights → analytics}/runtime.js

@@ -150,7 +150,7 @@ function RuntimeInsight() {
         fontWeight: 'bold'
       },
       mb: 2,
-      children: t('insights.trend')
+      children: t('analytics.trend')
     }), blocklet.status === 'running' ? [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_runtimeInfo.default, {
         blocklet: blocklet,
@@ -160,7 +160,7 @@ function RuntimeInsight() {
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
       mt: 3,
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Datatable.default, {
-        title: t('insights.detail'),
+        title: t('analytics.detail'),
         className: "monitor-table",
         locale: locale,
         data: monitList,

package/lib/{insights → analytics}/traffic.js

@@ -4,6 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = TrafficInsights;
+exports.getDefaultRanges = void 0;
 var _react = require("react");
 var _dayjs = _interopRequireDefault(require("@abtnode/util/lib/dayjs"));
 var _nthArg = _interopRequireDefault(require("lodash/nthArg"));
@@ -16,13 +17,16 @@ var _CircularProgress = _interopRequireDefault(require("@mui/material/CircularPr
 var _Grid = _interopRequireDefault(require("@mui/material/Grid"));
 var _Typography = _interopRequireDefault(require("@mui/material/Typography"));
 var _Button = _interopRequireDefault(require("@mui/material/Button"));
+var _IconButton = _interopRequireDefault(require("@mui/material/IconButton"));
 var _Popover = _interopRequireDefault(require("@mui/material/Popover"));
+var _LaunchOutlined = _interopRequireDefault(require("@mui/icons-material/LaunchOutlined"));
 var _muiDaterangePicker = require("mui-daterange-picker");
 var _xDatePickers = require("@mui/x-date-pickers");
 var _AdapterDayjs = require("@mui/x-date-pickers/AdapterDayjs");
 var _LocalizationProvider = require("@mui/x-date-pickers/LocalizationProvider");
 var _context = require("@arcblock/ux/lib/Locale/context");
 var _constant = require("@abtnode/constant");
+var _dateFns = require("date-fns");
 var _util = require("../util");
 var _node = require("../contexts/node");
 var _chart = _interopRequireDefault(require("./chart"));
@@ -34,6 +38,44 @@ function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key i
 function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
 function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); } /* eslint-disable react/prop-types */ /* eslint-disable react-hooks/exhaustive-deps */
 const noop = (0, _nthArg.default)(0);
+const getDefaultRanges = (date, locale) => [{
+  label: 'This Week',
+  startDate: (0, _dateFns.startOfWeek)(date, {
+    locale
+  }),
+  endDate: (0, _dateFns.endOfWeek)(date, {
+    locale
+  })
+}, {
+  label: 'Last Week',
+  startDate: (0, _dateFns.startOfWeek)((0, _dateFns.addWeeks)(date, -1), {
+    locale
+  }),
+  endDate: (0, _dateFns.endOfWeek)((0, _dateFns.addWeeks)(date, -1), {
+    locale
+  })
+}, {
+  label: 'Last 7 Days',
+  startDate: (0, _dateFns.addWeeks)(date, -1),
+  endDate: date
+}, {
+  label: 'This Month',
+  startDate: (0, _dateFns.startOfMonth)(date),
+  endDate: (0, _dateFns.endOfMonth)(date)
+}, {
+  label: 'Last Month',
+  startDate: (0, _dateFns.startOfMonth)((0, _dateFns.addMonths)(date, -1)),
+  endDate: (0, _dateFns.endOfMonth)((0, _dateFns.addMonths)(date, -1))
+}, {
+  label: 'This Year',
+  startDate: (0, _dateFns.startOfYear)(date),
+  endDate: (0, _dateFns.endOfYear)(date)
+}, {
+  label: 'Last Year',
+  startDate: (0, _dateFns.startOfYear)((0, _dateFns.addYears)(date, -1)),
+  endDate: (0, _dateFns.endOfYear)((0, _dateFns.addYears)(date, -1))
+}];
+exports.getDefaultRanges = getDefaultRanges;
 function TrafficInsights(_ref) {
   let {
     client,
@@ -49,6 +91,7 @@ function TrafficInsights(_ref) {
     locale
   } = (0, _context.useLocaleContext)();
   const [anchorEl, setAnchorEl] = (0, _react.useState)(null);
+  const [loaded, setLoaded] = (0, _react.useState)(false);
   const [date, setDate] = (0, _react.useState)(maxDate);
   const [dateRange, setDateRange] = (0, _react.useState)({
     startDate: (0, _dayjs.default)().subtract(30, 'day').toDate(),
@@ -107,7 +150,7 @@ function TrafficInsights(_ref) {
   };
   const charts = Object.keys(metrics).map(key => ({
     id: "".concat(key, "_chart"),
-    title: t("insights.traffic.".concat(key)),
+    title: t("analytics.traffic.".concat(key)),
     current: list.length ? metrics[key](list[0][key]) : 0,
     data: list.map(v => ({
       date: v.date,
@@ -121,6 +164,18 @@ function TrafficInsights(_ref) {
 
   // eslint-disable-next-line no-nested-ternary
   const pathPrefix = inService ? _constant.WELLKNOWN_SERVICE_PATH_PREFIX : process.env.NODE_ENV === 'production' ? info.routing.adminPath : '';
+  const breakdownUrl = (0, _urlJoin.default)(window.location.origin, pathPrefix, "/api/analytics/traffic?date=".concat((0, _dayjs.default)(date).format('YYYY-MM-DD'), "&did=").concat(did));
+  const onRangeChange = range => {
+    setDateRange(range);
+    setAnchorEl(null);
+  };
+  const onDateChange = newDate => {
+    setDate(newDate.toDate());
+    setLoaded(false);
+  };
+  const onOpenBreakdown = () => {
+    window.open(breakdownUrl);
+  };
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
     children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_Typography.default, {
       component: "div",
@@ -132,7 +187,7 @@ function TrafficInsights(_ref) {
         fontWeight: 'bold'
       },
       mb: 2,
-      children: [t('insights.trend'), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Button.default, {
+      children: [t('analytics.trend'), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Button.default, {
         onClick: onTriggerClick,
         variant: "outlined",
         size: "small",
@@ -143,7 +198,7 @@ function TrafficInsights(_ref) {
       id: id,
       open: open,
       anchorEl: anchorEl,
-      onClose: onTriggerClick,
+      onClose: () => setAnchorEl(null),
       anchorOrigin: {
         vertical: 'bottom',
         horizontal: 'left'
@@ -152,7 +207,8 @@ function TrafficInsights(_ref) {
         open: true,
         toggle: onTriggerClick,
         maxDate: maxDate,
-        onChange: v => setDateRange(v)
+        definedRanges: getDefaultRanges(date),
+        onChange: onRangeChange
       })
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Grid.default, {
       container: true,
@@ -176,25 +232,34 @@ function TrafficInsights(_ref) {
       },
       mt: 4,
       mb: 1,
-      children: [t('insights.detail'), /*#__PURE__*/(0, _jsxRuntime.jsx)(_LocalizationProvider.LocalizationProvider, {
-        dateAdapter: _AdapterDayjs.AdapterDayjs,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_xDatePickers.DatePicker, {
-          disableFuture: true,
-          format: "ll",
-          value: (0, _dayjs.default)(date),
-          onChange: newValue => setDate(newValue.toDate()),
-          slotProps: {
-            textField: {
-              size: 'small'
+      children: [t('analytics.detail'), /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
+        children: [loaded && /*#__PURE__*/(0, _jsxRuntime.jsx)(_IconButton.default, {
+          onClick: onOpenBreakdown,
+          style: {
+            marginRight: 32
+          },
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_LaunchOutlined.default, {})
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_LocalizationProvider.LocalizationProvider, {
+          dateAdapter: _AdapterDayjs.AdapterDayjs,
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_xDatePickers.DatePicker, {
+            disableFuture: true,
+            format: "ll",
+            value: (0, _dayjs.default)(date),
+            onChange: onDateChange,
+            slotProps: {
+              textField: {
+                size: 'small'
+              }
             }
-          }
-        })
+          })
+        })]
       })]
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactIframe.default, {
-      url: (0, _urlJoin.default)(window.location.origin, pathPrefix, "/api/insights/traffic?date=".concat((0, _dayjs.default)(date).format('YYYY-MM-DD'), "&did=").concat(did)),
+      url: breakdownUrl,
       width: "100%",
       height: "100%",
       frameBorder: 0,
+      onLoad: () => setLoaded(true),
       styles: {
         border: 0,
         minHeight: '400vh'

package/lib/blocklet/runtime-info.js

@@ -8,8 +8,8 @@ var _styled = _interopRequireDefault(require("@emotion/styled"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _Typography = _interopRequireDefault(require("@mui/material/Typography"));
 var _Grid = _interopRequireDefault(require("@mui/material/Grid"));
-var _cpu = _interopRequireDefault(require("../insights/cpu"));
-var _memory = _interopRequireDefault(require("../insights/memory"));
+var _cpu = _interopRequireDefault(require("../analytics/cpu"));
+var _memory = _interopRequireDefault(require("../analytics/memory"));
 var _jsxRuntime = require("react/jsx-runtime");
 var _templateObject;
 const _excluded = ["blocklet", "cpuHistory", "memoryHistory"];

package/lib/hooks/blocklet.js

@@ -20,7 +20,7 @@ function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typ
 function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
 // eslint-disable-next-line import/prefer-default-export
 function useBlocklet(_ref) {
-  var _blocklet$site, _blocklet$site$domain, _blocklet$meta, _blocklet$meta2, _blocklet$meta3, _blocklet$meta4, _blocklet$meta5, _blocklet$meta6, _blocklet$meta7, _blocklet$meta8, _blocklet$meta9;
+  var _blocklet$site, _blocklet$site$domain, _blocklet$meta, _blocklet$meta2, _blocklet$meta3, _blocklet$meta4, _blocklet$meta5, _blocklet$meta6, _blocklet$meta7;
   let {
     did,
     client,
@@ -189,14 +189,31 @@ function useBlocklet(_ref) {
       [data.domain]: _objectSpread(_objectSpread({}, pre[data.domain]), data)
     }));
   }, [blocklet === null || blocklet === void 0 ? void 0 : (_blocklet$meta = blocklet.meta) === null || _blocklet$meta === void 0 ? void 0 : _blocklet$meta.did, !disableSubscription]);
-  useSubscription(_constant.BlockletEvents.statusChange, handleRefreshWithoutRuntime, [blocklet === null || blocklet === void 0 ? void 0 : (_blocklet$meta2 = blocklet.meta) === null || _blocklet$meta2 === void 0 ? void 0 : _blocklet$meta2.did, !disableSubscription]); // eslint-disable-line prettier/prettier
+  useSubscription(_constant.BlockletEvents.statusChange, data => {
+    var _data$meta3;
+    if ((data === null || data === void 0 ? void 0 : (_data$meta3 = data.meta) === null || _data$meta3 === void 0 ? void 0 : _data$meta3.did) === blocklet.meta.did) {
+      setBlocklet(oldBlocklet => {
+        const newBlocklet = _objectSpread({}, oldBlocklet);
+        newBlocklet.status = (0, _constant.fromBlockletStatus)(data.status);
+        (newBlocklet.children || []).forEach(x => {
+          const y = data.children.find(z => {
+            var _z$meta, _x$meta;
+            return ((_z$meta = z.meta) === null || _z$meta === void 0 ? void 0 : _z$meta.did) === ((_x$meta = x.meta) === null || _x$meta === void 0 ? void 0 : _x$meta.did);
+          });
+          if (y) {
+            x.status = (0, _constant.fromBlockletStatus)(y.status);
+          }
+        });
+        return newBlocklet;
+      });
+      handleRefreshWithoutRuntime(data);
+    }
+  }, [blocklet === null || blocklet === void 0 ? void 0 : (_blocklet$meta2 = blocklet.meta) === null || _blocklet$meta2 === void 0 ? void 0 : _blocklet$meta2.did, !disableSubscription]); // eslint-disable-line prettier/prettier
   useSubscription(_constant.BlockletEvents.storeChange, handleRefreshWithoutRuntime, [blocklet === null || blocklet === void 0 ? void 0 : (_blocklet$meta3 = blocklet.meta) === null || _blocklet$meta3 === void 0 ? void 0 : _blocklet$meta3.did, !disableSubscription]);
-  useSubscription(_constant.BlockletEvents.started, handleRefresh, [blocklet === null || blocklet === void 0 ? void 0 : (_blocklet$meta4 = blocklet.meta) === null || _blocklet$meta4 === void 0 ? void 0 : _blocklet$meta4.did, !disableSubscription]);
-  useSubscription(_constant.BlockletEvents.startFailed, handleRefresh, [blocklet === null || blocklet === void 0 ? void 0 : (_blocklet$meta5 = blocklet.meta) === null || _blocklet$meta5 === void 0 ? void 0 : _blocklet$meta5.did, !disableSubscription]);
-  useSubscription(_constant.BlockletEvents.installed, handleRefresh, [blocklet === null || blocklet === void 0 ? void 0 : (_blocklet$meta6 = blocklet.meta) === null || _blocklet$meta6 === void 0 ? void 0 : _blocklet$meta6.did, !disableSubscription]);
-  useSubscription(_constant.BlockletEvents.upgraded, handleRefresh, [blocklet === null || blocklet === void 0 ? void 0 : (_blocklet$meta7 = blocklet.meta) === null || _blocklet$meta7 === void 0 ? void 0 : _blocklet$meta7.did, !disableSubscription]);
-  useSubscription(_constant.BlockletEvents.downgraded, handleRefresh, [blocklet === null || blocklet === void 0 ? void 0 : (_blocklet$meta8 = blocklet.meta) === null || _blocklet$meta8 === void 0 ? void 0 : _blocklet$meta8.did, !disableSubscription]);
-  useSubscription(_constant.BlockletEvents.updated, handleRefresh, [blocklet === null || blocklet === void 0 ? void 0 : (_blocklet$meta9 = blocklet.meta) === null || _blocklet$meta9 === void 0 ? void 0 : _blocklet$meta9.did, !disableSubscription]);
+  useSubscription(_constant.BlockletEvents.installed, handleRefresh, [blocklet === null || blocklet === void 0 ? void 0 : (_blocklet$meta4 = blocklet.meta) === null || _blocklet$meta4 === void 0 ? void 0 : _blocklet$meta4.did, !disableSubscription]);
+  useSubscription(_constant.BlockletEvents.upgraded, handleRefresh, [blocklet === null || blocklet === void 0 ? void 0 : (_blocklet$meta5 = blocklet.meta) === null || _blocklet$meta5 === void 0 ? void 0 : _blocklet$meta5.did, !disableSubscription]);
+  useSubscription(_constant.BlockletEvents.downgraded, handleRefresh, [blocklet === null || blocklet === void 0 ? void 0 : (_blocklet$meta6 = blocklet.meta) === null || _blocklet$meta6 === void 0 ? void 0 : _blocklet$meta6.did, !disableSubscription]);
+  useSubscription(_constant.BlockletEvents.updated, handleRefresh, [blocklet === null || blocklet === void 0 ? void 0 : (_blocklet$meta7 = blocklet.meta) === null || _blocklet$meta7 === void 0 ? void 0 : _blocklet$meta7.did, !disableSubscription]);
   const data = blocklet ? (0, _merge.default)(blocklet, {
     site: {
       domainAliases: blocklet.site.domainAliases.map(x => {

package/lib/locales/en.js

@@ -202,8 +202,7 @@ module.exports = {
     members: 'Members',
     memory: 'Memory',
     meta: 'Meta Data',
-    monitor: 'Monitor',
-    insights: 'Insights',
+    analytics: 'Analytics',
     runtime: 'Runtime',
     traffic: 'Traffic',
     more: 'More',
@@ -694,7 +693,7 @@ module.exports = {
         verifying: 'Verifying Blocklet Server v{version}',
         rollback: 'Rollback Blocklet Server',
         complete: 'Upgrade complete!',
-        progress: 'Upgrading Blocklet Server to v{version}',
+        progress: 'Upgrading Blocklet Server {version}',
         check: 'Check for Updates',
         latest: 'You are running the latest version.'
       },
@@ -1465,7 +1464,7 @@ module.exports = {
     loading: 'Load subscription...',
     loadFailed: 'Failed to load subscription info, please retry!'
   },
-  insights: {
+  analytics: {
     trend: 'Trends',
     detail: 'Breakdown',
     traffic: {

package/lib/locales/zh.js

@@ -207,8 +207,7 @@ module.exports = {
     members: '成员',
     memory: '内存',
     meta: '元数据',
-    monitor: '监控',
-    insights: '洞见',
+    analytics: '统计分析',
     runtime: '运行监控',
     traffic: '流量分析',
     more: '更多',
@@ -694,7 +693,7 @@ module.exports = {
         verifying: '验证节点新版本 v{version}',
         rollback: '回滚此次升级',
         complete: '升级完成!',
-        progress: '正在升级节点到 v{version}',
+        progress: '正在升级节点 {version}',
         check: '检查更新',
         latest: '太棒了，你的节点已经是最新版！'
       },
@@ -1468,7 +1467,7 @@ module.exports = {
     loadFailed: '加载订阅信息失败，请重试!',
     loading: '加载订阅信息...'
   },
-  insights: {
+  analytics: {
     trend: '趋势',
     detail: '探究',
     traffic: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abtnode/ux",
-  "version": "1.16.13-beta-90ded76f",
+  "version": "1.16.13-beta-2eb54cbc",
   "description": "UX components shared across abtnode packages",
   "publishConfig": {
     "access": "public"
@@ -23,22 +23,22 @@
   "author": "linchen <linchen1987@foxmail.com> (http://github.com/linchen1987)",
   "license": "Apache-2.0",
   "dependencies": {
-    "@abtnode/auth": "1.16.13-beta-90ded76f",
-    "@abtnode/constant": "1.16.13-beta-90ded76f",
-    "@abtnode/util": "1.16.13-beta-90ded76f",
+    "@abtnode/auth": "1.16.13-beta-2eb54cbc",
+    "@abtnode/constant": "1.16.13-beta-2eb54cbc",
+    "@abtnode/util": "1.16.13-beta-2eb54cbc",
     "@ahooksjs/use-url-state": "^3.5.1",
     "@arcblock/did": "^1.18.84",
-    "@arcblock/did-connect": "^2.5.53",
+    "@arcblock/did-connect": "^2.5.54",
     "@arcblock/did-motif": "^1.1.12",
-    "@arcblock/icons": "^2.5.53",
-    "@arcblock/react-hooks": "^2.5.53",
-    "@arcblock/terminal": "^2.5.53",
-    "@arcblock/ux": "^2.5.53",
-    "@blocklet/constant": "1.16.13-beta-90ded76f",
+    "@arcblock/icons": "^2.5.54",
+    "@arcblock/react-hooks": "^2.5.54",
+    "@arcblock/terminal": "^2.5.54",
+    "@arcblock/ux": "^2.5.54",
+    "@blocklet/constant": "1.16.13-beta-2eb54cbc",
     "@blocklet/launcher-layout": "2.1.26",
     "@blocklet/list": "^0.12.4",
-    "@blocklet/meta": "1.16.13-beta-90ded76f",
-    "@blocklet/ui-react": "^2.5.53",
+    "@blocklet/meta": "1.16.13-beta-2eb54cbc",
+    "@blocklet/ui-react": "^2.5.54",
     "@emotion/react": "^11.10.4",
     "@emotion/styled": "^11.10.4",
     "@iconify/react": "^4.0.0",
@@ -53,6 +53,7 @@
     "ahooks": "^3.7.1",
     "axios": "^0.27.2",
     "classnames": "^2.3.2",
+    "date-fns": "^2.30.0",
     "dsbridge": "3.1.4",
     "file-saver": "^2.0.5",
     "filesize": "^6.4.0",
@@ -94,5 +95,5 @@
     "@babel/preset-react": "^7.18.6",
     "babel-plugin-inline-react-svg": "^1.1.2"
   },
-  "gitHead": "e6d4b88fe2cb45e00e5d745e1cd148dc76a019a4"
+  "gitHead": "7adf96c2eb31762d8eb14b8121fce9865d6a458c"
 }