@abtnode/ux 1.16.25-beta-e3dbef52 → 1.16.25-beta-be3a37f4

package/lib/team/members/actions.js

@@ -8,33 +8,66 @@ var _react = require("react");
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _MenuItem = _interopRequireDefault(require("@mui/material/MenuItem"));
 var _Add = _interopRequireDefault(require("@mui/icons-material/Add"));
+var _Logout = _interopRequireDefault(require("@mui/icons-material/Logout"));
 var _ListItemIcon = _interopRequireDefault(require("@mui/material/ListItemIcon"));
 var _ListItemText = _interopRequireDefault(require("@mui/material/ListItemText"));
 var _context = require("@arcblock/ux/lib/Locale/context");
 var _ForbidLoginIcon = _interopRequireDefault(require("@arcblock/icons/lib/ForbidLoginIcon"));
 var _AllowLoginIcon = _interopRequireDefault(require("@arcblock/icons/lib/AllowLoginIcon"));
 var _didUtils = require("@blocklet/meta/lib/did-utils");
+var _Dialog = require("@arcblock/ux/lib/Dialog");
+var _ahooks = require("ahooks");
+var _pAll = _interopRequireDefault(require("p-all"));
 var _team = require("../../contexts/team");
 var _actions = _interopRequireDefault(require("../../actions"));
 var _issuePassport = _interopRequireDefault(require("./issue-passport"));
 var _toggleUserApproval = _interopRequireDefault(require("./toggle-user-approval"));
+var _node = require("../../contexts/node");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function MemberActions(_ref) {
   let {
+    type,
     user,
-    onIssuePassport
+    onIssuePassport,
+    onRefresh
   } = _ref;
   const {
     teamDid,
     roles
   } = (0, _team.useTeamContext)();
+  const {
+    confirmHolder,
+    confirmApi
+  } = (0, _Dialog.useConfirm)();
   const {
     t
   } = (0, _react.useContext)(_context.LocaleContext);
   const [enablePassportIssuance, setEnablePassportIssuance] = (0, _react.useState)(false);
+  const {
+    api
+  } = (0, _node.useNodeContext)();
+  const logoutUser = (0, _ahooks.useMemoizedFn)(async () => {
+    const {
+      userSessions = []
+    } = user;
+    const list = userSessions.map(x => {
+      return () => api.logoutUser({
+        input: {
+          teamDid,
+          appPid: teamDid,
+          userDid: user.did,
+          visitorId: x.visitorId
+        }
+      });
+    });
+    await (0, _pAll.default)(list, {
+      concurrency: 3,
+      stopOnError: false
+    });
+  });
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_actions.default, {
+    children: [confirmHolder, /*#__PURE__*/(0, _jsxRuntime.jsx)(_actions.default, {
       "data-cy": "member-actions",
       actions: [{
         icon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Add.default, {
@@ -78,7 +111,27 @@ function MemberActions(_ref) {
             });
           }
         }, "toggle-approval");
-      }]
+      }, type === 'blocklet' && {
+        icon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Logout.default, {
+          fontSize: "small"
+        }),
+        text: t('team.member.forceLogout'),
+        onClick: e => {
+          e.stopPropagation();
+          confirmApi.open({
+            title: t('team.member.forceLogout'),
+            content: t('team.member.forceLogoutDescription'),
+            confirmButtonText: t('common.confirm'),
+            cancelButtonText: t('common.cancel'),
+            onClick: event => event.stopPropagation(),
+            onConfirm: async () => {
+              await logoutUser();
+              await confirmApi.close();
+              onRefresh();
+            }
+          });
+        }
+      }].filter(Boolean)
     }), enablePassportIssuance && /*#__PURE__*/(0, _jsxRuntime.jsx)(_issuePassport.default, {
       teamDid: teamDid,
       ownerDid: user.did,
@@ -93,9 +146,12 @@ function MemberActions(_ref) {
   });
 }
 MemberActions.propTypes = {
+  type: _propTypes.default.oneOf(['server', 'blocklet']).isRequired,
   user: _propTypes.default.object.isRequired,
-  onIssuePassport: _propTypes.default.func
+  onIssuePassport: _propTypes.default.func,
+  onRefresh: _propTypes.default.func
 };
 MemberActions.defaultProps = {
-  onIssuePassport: () => {}
+  onIssuePassport: () => {},
+  onRefresh: () => {}
 };

package/lib/team/members/index.js

@@ -9,13 +9,11 @@ var _styled = _interopRequireDefault(require("@emotion/styled"));
 var _isEmpty = _interopRequireDefault(require("lodash/isEmpty"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _classnames = _interopRequireDefault(require("classnames"));
-var _Dialog = _interopRequireDefault(require("@arcblock/ux/lib/Dialog"));
-var _Tooltip = _interopRequireDefault(require("@mui/material/Tooltip"));
-var _Box = _interopRequireDefault(require("@mui/material/Box"));
-var _FormControlLabel = _interopRequireDefault(require("@mui/material/FormControlLabel"));
-var _Checkbox = _interopRequireDefault(require("@mui/material/Checkbox"));
+var _material = require("@mui/material");
+var _Dialog = _interopRequireWildcard(require("@arcblock/ux/lib/Dialog"));
 var _Add = _interopRequireDefault(require("@mui/icons-material/Add"));
 var _Loop = _interopRequireDefault(require("@mui/icons-material/Loop"));
+var _ViewList = _interopRequireDefault(require("@mui/icons-material/ViewList"));
 var _Avatar = _interopRequireDefault(require("@arcblock/did-connect/lib/Avatar"));
 var _context = require("@arcblock/ux/lib/Locale/context");
 var _Button = _interopRequireDefault(require("@arcblock/ux/lib/Button"));
@@ -24,11 +22,12 @@ var _ExternalIssuerIcon = _interopRequireDefault(require("@arcblock/icons/lib/Ex
 var _createPassportSvg = require("@abtnode/auth/lib/util/create-passport-svg");
 var _Datatable = _interopRequireWildcard(require("@arcblock/ux/lib/Datatable"));
 var _RelativeTime = _interopRequireDefault(require("@arcblock/ux/lib/RelativeTime"));
+var _Toast = _interopRequireDefault(require("@arcblock/ux/lib/Toast"));
 var _constant = require("@abtnode/constant");
 var _constant2 = require("@blocklet/constant");
 var _useUrlState = _interopRequireDefault(require("@ahooksjs/use-url-state"));
 var _ahooks = require("ahooks");
-var _Toast = _interopRequireDefault(require("@arcblock/ux/lib/Toast"));
+var _uiReact = require("@blocklet/ui-react");
 var _tag = _interopRequireDefault(require("../../tag"));
 var _didAddress = _interopRequireDefault(require("../../did-address"));
 var _node = require("../../contexts/node");
@@ -91,9 +90,9 @@ function SimpleInfo(_ref) {
         }
       }), !user.approved && /*#__PURE__*/(0, _jsxRuntime.jsx)("did", {
         className: "badge-block"
-      }), user.isFromExternal && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tooltip.default, {
+      }), user.isFromExternal && /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Tooltip, {
         title: t('team.passport.externalPassport'),
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
           ml: 1,
           className: "icon",
           children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ExternalIssuerIcon.default, {})
@@ -117,10 +116,10 @@ function SimpleInfo(_ref) {
       })]
     })]
   });
-  return user.approved ? main : /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
+  return user.approved ? main : /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
     display: "flex",
     alignItems: "center",
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tooltip.default, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Tooltip, {
       title: t('team.member.forbidLoginDescription'),
       children: main
     })
@@ -134,6 +133,29 @@ function MemberList(_ref2) {
     type,
     createPassportSvg
   } = _ref2;
+  const {
+    confirmApi,
+    confirmHolder
+  } = (0, _Dialog.useConfirm)({
+    sx: {
+      '.MuiDialog-paper': {
+        borderRadius: 2,
+        maxWidth: 1000
+      },
+      '.ux-dialog_title': {
+        fontWeight: 600
+      },
+      '.ux-dialog_closeButton': {
+        p: 1
+      },
+      '.MuiDialogActions-root': {
+        display: {
+          xs: 'none',
+          md: 'flex'
+        }
+      }
+    }
+  });
   const {
     appIdList = []
   } = (0, _blocklet.useBlockletContext)();
@@ -206,7 +228,8 @@ function MemberList(_ref2) {
   });
   const getUsers = () => {
     const query = {
-      includeTags: true
+      includeTags: true,
+      includeUserSessions: type === 'blocklet'
     };
     if (search.hideBlocked) {
       query.approved = true;
@@ -263,6 +286,21 @@ function MemberList(_ref2) {
   useSubscription(_constant2.TeamEvents.userUpdated, handleUserChange, [search]);
   useSubscription(_constant2.TeamEvents.userAdded, handleUserChange, [search]);
   const isInvitationEnabled = enablePassportIssuance;
+  const openUserSessions = (0, _ahooks.useMemoizedFn)(user => {
+    confirmApi.open({
+      title: 'User Sessions',
+      content: /*#__PURE__*/(0, _jsxRuntime.jsx)(_uiReact.UserSessions, {
+        user: user,
+        showAction: false,
+        showUser: false
+      }),
+      onConfirm() {
+        confirmApi.close();
+      },
+      confirmButtonText: t('common.close'),
+      showCancelButton: false
+    });
+  });
   const columns = [{
     label: t('common.name'),
     name: 'fullName',
@@ -328,6 +366,33 @@ function MemberList(_ref2) {
         return providerName;
       }
     }
+  }, type === 'blocklet' && {
+    label: t('team.member.activeUserSessions'),
+    name: 'userSessions',
+    options: {
+      customBodyRenderLite: rowIndex => {
+        var _user$userSessions, _user$userSessions2, _user$userSessions3;
+        const user = users[rowIndex];
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.IconButton, {
+          onClick: e => {
+            e.stopPropagation();
+            openUserSessions(user);
+          },
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Badge, {
+            badgeContent: user === null || user === void 0 ? void 0 : (_user$userSessions = user.userSessions) === null || _user$userSessions === void 0 ? void 0 : _user$userSessions.length,
+            color: (user === null || user === void 0 ? void 0 : (_user$userSessions2 = user.userSessions) === null || _user$userSessions2 === void 0 ? void 0 : _user$userSessions2.length) > 0 ? 'primary' : 'default',
+            sx: (user === null || user === void 0 ? void 0 : (_user$userSessions3 = user.userSessions) === null || _user$userSessions3 === void 0 ? void 0 : _user$userSessions3.length) > 0 ? {} : {
+              '.MuiBadge-badge': {
+                backgroundColor: 'grey',
+                color: 'white'
+              }
+            },
+            showZero: true,
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ViewList.default, {})
+          })
+        });
+      }
+    }
   }, {
     label: t('common.actions'),
     name: '',
@@ -341,15 +406,19 @@ function MemberList(_ref2) {
           permission: inService ? '' : 'mutate_team',
           role: inService ? _util.BlockletAdminRoles : [],
           children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_actions.default, {
+            type: type,
             user: x,
             onIssuePassport: () => setMemberDialog(_objectSpread(_objectSpread({}, x), {}, {
               initTab: 'issuances'
-            }))
+            })),
+            onRefresh: () => handleUserChange({
+              teamDid
+            })
           })
         });
       }
     }
-  }];
+  }].filter(Boolean);
   const customButtons = [];
   if (isInvitationEnabled) {
     customButtons.push( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Button.default, {
@@ -453,18 +522,22 @@ function MemberList(_ref2) {
       }));
     }
   };
+  const datatableRef = (0, _react.useRef)(null);
   const tableOptions = {
     sort: false,
     download: false,
     filter: false,
     print: false,
     expandableRowsOnClick: true,
-    onRowClick(e, _ref4) {
+    onRowClick(row, _ref4, e) {
+      var _datatableRef$current;
       let {
         dataIndex
       } = _ref4;
-      const x = users[dataIndex];
-      setMemberDialog(x);
+      if ((_datatableRef$current = datatableRef.current) !== null && _datatableRef$current !== void 0 && _datatableRef$current.contains(e.target)) {
+        const x = users[dataIndex];
+        setMemberDialog(x);
+      }
     },
     page: search.page - 1,
     rowsPerPage: search.pageSize,
@@ -472,7 +545,7 @@ function MemberList(_ref2) {
     searchDebounceTime: 600
   };
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Div, {
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
+    children: [confirmHolder, /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
       className: "main",
       display: "flex",
       sx: {
@@ -497,6 +570,7 @@ function MemberList(_ref2) {
           }, x.name))
         })
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        ref: datatableRef,
         className: "right",
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Datatable.default, {
           className: "main-table",
@@ -506,8 +580,8 @@ function MemberList(_ref2) {
           durableKeys: ['page', 'rowsPerPage'],
           title: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
             className: "table-toolbar-left",
-            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_FormControlLabel.default, {
-              control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Checkbox.default, {
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
+              control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Checkbox, {
                 sx: {
                   display: 'flex !important'
                 },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abtnode/ux",
-  "version": "1.16.25-beta-e3dbef52",
+  "version": "1.16.25-beta-be3a37f4",
   "description": "UX components shared across abtnode packages",
   "publishConfig": {
     "access": "public"
@@ -28,23 +28,23 @@
   "author": "linchen <linchen1987@foxmail.com> (http://github.com/linchen1987)",
   "license": "Apache-2.0",
   "dependencies": {
-    "@abtnode/auth": "1.16.25-beta-e3dbef52",
-    "@abtnode/constant": "1.16.25-beta-e3dbef52",
-    "@abtnode/util": "1.16.25-beta-e3dbef52",
+    "@abtnode/auth": "1.16.25-beta-be3a37f4",
+    "@abtnode/constant": "1.16.25-beta-be3a37f4",
+    "@abtnode/util": "1.16.25-beta-be3a37f4",
     "@ahooksjs/use-url-state": "^3.5.1",
     "@arcblock/did": "^1.18.113",
-    "@arcblock/did-connect": "^2.9.51",
+    "@arcblock/did-connect": "^2.9.54",
     "@arcblock/did-motif": "^1.1.13",
-    "@arcblock/icons": "^2.9.51",
-    "@arcblock/nft-display": "2.9.51",
-    "@arcblock/react-hooks": "^2.9.51",
-    "@arcblock/terminal": "^2.9.51",
-    "@arcblock/ux": "^2.9.51",
-    "@blocklet/constant": "1.16.25-beta-e3dbef52",
+    "@arcblock/icons": "^2.9.54",
+    "@arcblock/nft-display": "2.9.54",
+    "@arcblock/react-hooks": "^2.9.54",
+    "@arcblock/terminal": "^2.9.54",
+    "@arcblock/ux": "^2.9.54",
+    "@blocklet/constant": "1.16.25-beta-be3a37f4",
     "@blocklet/launcher-layout": "2.2.54",
     "@blocklet/list": "^0.12.76",
-    "@blocklet/meta": "1.16.25-beta-e3dbef52",
-    "@blocklet/ui-react": "^2.9.51",
+    "@blocklet/meta": "1.16.25-beta-be3a37f4",
+    "@blocklet/ui-react": "^2.9.54",
     "@blocklet/uploader": "^0.0.74",
     "@emotion/react": "^11.10.4",
     "@emotion/styled": "^11.10.4",
@@ -74,6 +74,7 @@
     "ms": "^2.1.3",
     "mui-daterange-picker": "^1.0.5",
     "notistack": "^2.0.8",
+    "p-all": "^5.0.0",
     "p-wait-for": "^4.1.0",
     "pretty-ms-i18n": "^1.0.3",
     "prop-types": "^15.8.1",
@@ -106,7 +107,7 @@
     "jest": "^29.7.0",
     "jest-environment-jsdom": "^29.7.0"
   },
-  "gitHead": "a740380dd98d1677f7da1233d753f28ea50f77ce",
+  "gitHead": "cd99ea556cdd402ecc12e017d79f13e8e8bb83c7",
   "exports": {
     ".": {
       "import": "./es/index.js",