@abtnode/ux 1.16.29 → 1.16.30-beta-00e8bdd1

package/lib/blocklet/component/environment.js

@@ -49,6 +49,16 @@ const isCustom = (env, blocklet, ancestors = []) => {
   }
   return env.custom;
 };
+const isValidKey = key => {
+  if ([BLOCKLET_CONFIGURABLE_KEY.BLOCKLET_CLUSTER_SIZE].includes(key)) {
+    return true;
+  }
+  if (key.startsWith('BLOCKLET_') || key.startsWith('COMPONENT_')) {
+    return false;
+  }
+  return true;
+};
+const isCustomKey = key => [BLOCKLET_CONFIGURABLE_KEY.BLOCKLET_CLUSTER_SIZE].includes(key) === false;
 export default function ComponentEnvironment({
   blocklet,
   ancestors
@@ -74,11 +84,11 @@ export default function ComponentEnvironment({
       Toast.error(t('blocklet.config.environment.keyValueRequired'));
       return;
     }
-    if (data.key.startsWith('BLOCKLET_') || data.key.startsWith('COMPONENT_')) {
+    if (isValidKey(data.key) === false) {
       Toast.error(t('blocklet.config.environment.invalidKey'));
       return;
     }
-    data.custom = true;
+    data.custom = isCustomKey(data.key);
     try {
       const result = await node.api.configBlocklet({
         input: {
@@ -97,7 +107,7 @@ export default function ComponentEnvironment({
       Toast.error(t('blocklet.config.environment.keyValueRequired'));
       return;
     }
-    if (newData.key.startsWith('BLOCKLET_') && !BLOCKLET_CONFIGURABLE_KEY[newData.key]) {
+    if (isValidKey(newData.key) === false) {
       Toast.error(t('blocklet.config.environment.invalidKey'));
       return;
     }
@@ -119,7 +129,7 @@ export default function ComponentEnvironment({
       }
       configs.push({
         key: oldData.key,
-        custom: true
+        custom: isCustomKey(newData.key)
       });
     }
     try {
@@ -149,7 +159,7 @@ export default function ComponentEnvironment({
           did: dids,
           configs: [{
             key: data.key,
-            custom: true
+            custom: isCustomKey(data.key)
           }]
         }
       });
@@ -160,7 +170,7 @@ export default function ComponentEnvironment({
   };
 
   // configs
-  const componentConfigs = (blocklet.configs || []).filter(x => !BLOCKLET_CONFIGURABLE_KEY[x.key]);
+  const componentConfigs = (blocklet.configs || []).filter(x => !BLOCKLET_CONFIGURABLE_KEY[x.key] || [BLOCKLET_CONFIGURABLE_KEY.BLOCKLET_CLUSTER_SIZE].includes(x.key));
   const sharedConfigObj = getSharedConfigObj(ancestors[0], blocklet);
   const missingRequiredConfigs = getComponentMissingConfigs(blocklet, ancestors[0]);
   const configs = componentConfigs.map(x => ({

package/lib/blocklet/configuration.js

@@ -1,7 +1,6 @@
 import React, { useState, useContext } from 'react';
 import styled from '@emotion/styled';
 import PropTypes from 'prop-types';
-import get from 'lodash/get';
 import isEqual from 'lodash/isEqual';
 import Box from '@mui/material/Box';
 import Switch from '@mui/material/Switch';
@@ -9,14 +8,13 @@ import Divider from '@mui/material/Divider';
 import { LocaleContext } from '@arcblock/ux/lib/Locale/context';
 import Button from '@arcblock/ux/lib/Button';
 import LoopIcon from '@mui/icons-material/Loop';
-import { EVENTS } from '@abtnode/constant';
 import { BLOCKLET_CONFIGURABLE_KEY, BLOCKLET_TENANT_MODES, SUPPORTED_LANGUAGES } from '@blocklet/constant';
 import { getWhoCanAccess } from '@blocklet/meta/lib/util';
 import Toast from '@arcblock/ux/lib/Toast';
 import FormTextInput from '../form/form-text-input';
 import FormAutocompleteInput from '../form/form-autocomplete-input';
 import { useNodeContext } from '../contexts/node';
-import { isInstalling, isValidClusterSize, BlockletAdminRoles } from '../util';
+import { isInstalling, BlockletAdminRoles } from '../util';
 import { enableDebug } from '../util/mode';
 import Permission, { withPermission } from '../permission';
 import ClearCache from '../clear-cache';
@@ -41,15 +39,11 @@ function BlockletEnvironment({
     api,
     inService,
     prefix,
-    getSessionInHeader,
-    ws: {
-      useSubscription
-    }
+    getSessionInHeader
   } = useNodeContext();
   const {
     t
   } = useContext(LocaleContext);
-  const [cpuCores, setCpuCores] = useState('');
   const [loading, setLoading] = useState('');
   const [showTransferOwner, setShowTransferOwner] = useState(false);
   const whoCanAccess = getWhoCanAccess(blocklet);
@@ -68,12 +62,6 @@ function BlockletEnvironment({
   const {
     site
   } = blocklet;
-  const clusterMode = get(blocklet.meta, 'capabilities.clusterMode', false);
-  useSubscription(EVENTS.NODE_RUNTIME_INFO, res => {
-    if (clusterMode) {
-      setCpuCores(get(res, 'cpu.physicalCores', ''));
-    }
-  });
   if (isInstalling(blocklet.status)) {
     return null;
   }
@@ -108,16 +96,6 @@ function BlockletEnvironment({
     description: t('blocklet.config.copyrightYear'),
     value: copyrightYear ? copyrightYear.value : ''
   }];
-  if (clusterMode) {
-    const exist = blocklet.configs.find(x => x.key === BLOCKLET_CONFIGURABLE_KEY.BLOCKLET_CLUSTER_SIZE);
-    const value = exist ? exist.value : cpuCores;
-    configurableEnvs.push({
-      key: BLOCKLET_CONFIGURABLE_KEY.BLOCKLET_CLUSTER_SIZE,
-      description: t('blocklet.config.clusterSize'),
-      value,
-      cpuCores
-    });
-  }
   const onPublicToStoreChange = async e => {
     if (loading) {
       return;
@@ -143,16 +121,6 @@ function BlockletEnvironment({
     }
   };
   const onSubmitConfig = async (key, value) => {
-    if (key === BLOCKLET_CONFIGURABLE_KEY.BLOCKLET_CLUSTER_SIZE) {
-      const errMessage = isValidClusterSize({
-        value,
-        cpuCores
-      });
-      if (errMessage) {
-        Toast.error(errMessage);
-        return;
-      }
-    }
     const params = [{
       key,
       value

package/lib/blocklet/disk-info.js

@@ -1,74 +1,85 @@
 /* eslint-disable react/jsx-one-expression-per-line */
-import { useContext } from 'react';
+import { useContext, useEffect } from 'react';
 import styled from '@emotion/styled';
-import PropTypes from 'prop-types';
+import CircularProgress from '@mui/material/CircularProgress';
 import Typography from '@mui/material/Typography';
 import Link from '@mui/material/Link';
 import InfoRow from '@arcblock/ux/lib/InfoRow';
 import { LocaleContext } from '@arcblock/ux/lib/Locale/context';
+import { useBlockletContext } from '../contexts/blocklet';
 import { filesize } from '../util';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export default function BlockletDiskInfo({
-  blocklet,
   ...rest
 }) {
   const {
     t
   } = useContext(LocaleContext);
-  if (!blocklet.diskInfo) {
-    return /*#__PURE__*/_jsx(Typography, {
-      children: t('blocklet.diskInfo.empty')
+  const {
+    blocklet,
+    loadingDiskInfo,
+    actions
+  } = useBlockletContext();
+  useEffect(() => {
+    actions.refreshBlocklet({
+      showError: false,
+      attachDiskInfo: true
+    });
+  }, []); // eslint-disable-line
+
+  if (blocklet.diskInfo) {
+    const renderDiskInfo = (dir, size, handler) => /*#__PURE__*/_jsxs(Typography, {
+      children: [handler ?
+      /*#__PURE__*/
+      /* eslint-disable-next-line no-script-url, jsx-a11y/anchor-is-valid */
+      _jsx(Link, {
+        style: {
+          cursor: 'pointer'
+        },
+        onClick: handler,
+        underline: "hover",
+        children: dir
+      }) : dir, ' ', /*#__PURE__*/_jsx("strong", {
+        children: size ? filesize(size) : 'empty'
+      })]
+    });
+    const env = blocklet.environments.reduce((acc, x) => {
+      acc[x.key] = x.value;
+      return acc;
+    }, {});
+    const rows = [{
+      key: 'appDir',
+      name: t('blocklet.diskInfo.appDir'),
+      value: renderDiskInfo(env.BLOCKLET_APP_DIR, blocklet.diskInfo.app)
+    }, {
+      key: 'dataDir',
+      name: t('blocklet.diskInfo.dataDir'),
+      value: renderDiskInfo(env.BLOCKLET_DATA_DIR, blocklet.diskInfo.data)
+    }, {
+      key: 'logDir',
+      name: t('blocklet.diskInfo.logDir'),
+      value: renderDiskInfo(env.BLOCKLET_LOG_DIR, blocklet.diskInfo.log)
+    }, {
+      key: 'cacheDir',
+      name: t('blocklet.diskInfo.cacheDir'),
+      value: renderDiskInfo(env.BLOCKLET_CACHE_DIR, blocklet.diskInfo.cache)
+    }];
+    return /*#__PURE__*/_jsx(Div, {
+      component: "div",
+      ...rest,
+      children: rows.map(row => /*#__PURE__*/_jsx(InfoRow, {
+        valueComponent: "div",
+        nameWidth: 120,
+        name: row.name,
+        children: row.value
+      }, row.key))
     });
   }
-  const renderDiskInfo = (dir, size, handler) => /*#__PURE__*/_jsxs(Typography, {
-    children: [handler ?
-    /*#__PURE__*/
-    /* eslint-disable-next-line no-script-url, jsx-a11y/anchor-is-valid */
-    _jsx(Link, {
-      style: {
-        cursor: 'pointer'
-      },
-      onClick: handler,
-      underline: "hover",
-      children: dir
-    }) : dir, ' ', /*#__PURE__*/_jsx("strong", {
-      children: size ? filesize(size) : 'empty'
-    })]
-  });
-  const env = blocklet.environments.reduce((acc, x) => {
-    acc[x.key] = x.value;
-    return acc;
-  }, {});
-  const rows = [{
-    key: 'appDir',
-    name: t('blocklet.diskInfo.appDir'),
-    value: renderDiskInfo(env.BLOCKLET_APP_DIR, blocklet.diskInfo.app)
-  }, {
-    key: 'dataDir',
-    name: t('blocklet.diskInfo.dataDir'),
-    value: renderDiskInfo(env.BLOCKLET_DATA_DIR, blocklet.diskInfo.data)
-  }, {
-    key: 'logDir',
-    name: t('blocklet.diskInfo.logDir'),
-    value: renderDiskInfo(env.BLOCKLET_LOG_DIR, blocklet.diskInfo.log)
-  }, {
-    key: 'cacheDir',
-    name: t('blocklet.diskInfo.cacheDir'),
-    value: renderDiskInfo(env.BLOCKLET_CACHE_DIR, blocklet.diskInfo.cache)
-  }];
-  return /*#__PURE__*/_jsx(Div, {
-    component: "div",
-    ...rest,
-    children: rows.map(row => /*#__PURE__*/_jsx(InfoRow, {
-      valueComponent: "div",
-      nameWidth: 120,
-      name: row.name,
-      children: row.value
-    }, row.key))
+  if (loadingDiskInfo) {
+    return /*#__PURE__*/_jsx(CircularProgress, {});
+  }
+  return /*#__PURE__*/_jsx(Typography, {
+    children: t('blocklet.diskInfo.empty')
   });
 }
-BlockletDiskInfo.propTypes = {
-  blocklet: PropTypes.object.isRequired
-};
-BlockletDiskInfo.defaultProps = {};
 const Div = styled(Typography)``;

package/lib/blocklet/storage/connected.js

@@ -104,9 +104,7 @@ function Connected() {
       fontWeight: "bold",
       mb: 2,
       children: t('common.dataStorage')
-    }), /*#__PURE__*/_jsx(DiskInfo, {
-      blocklet: blocklet
-    })]
+    }), /*#__PURE__*/_jsx(DiskInfo, {})]
   });
 }
 export default Connected;

package/lib/blocklet/storage/disconnect.js

@@ -198,7 +198,6 @@ EmptySpacesNFT.defaultProps = {
   xmlns: "http://www.w3.org/2000/svg",
   xmlnsXlink: "http://www.w3.org/1999/xlink"
 };
-import { useBlockletContext } from '../../contexts/blocklet';
 import ConnectTo from './connect-to';
 import DiskInfo from '../disk-info';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
@@ -206,9 +205,6 @@ function Disconnect() {
   const {
     t
   } = useLocaleContext();
-  const {
-    blocklet
-  } = useBlockletContext();
   return /*#__PURE__*/_jsxs(Box, {
     children: [/*#__PURE__*/_jsxs(Box, {
       minHeight: "40vh",
@@ -232,9 +228,7 @@ function Disconnect() {
       fontWeight: "bold",
       mb: 2,
       children: t('common.dataStorage')
-    }), /*#__PURE__*/_jsx(DiskInfo, {
-      blocklet: blocklet
-    })]
+    }), /*#__PURE__*/_jsx(DiskInfo, {})]
   });
 }
 Disconnect.propTypes = {};

package/lib/hooks/blocklet.js

@@ -56,6 +56,7 @@ export function useBlocklet({
   const [error, setError] = useState(null);
   const [loading, setLoading] = useState(false);
   const [loadingRuntimeInfo, setLoadingRuntimeInfo] = useState(false);
+  const [loadingDiskInfo, setLoadingDiskInfo] = useState(true);
   const [blocklet, setBlocklet] = useState();
   const [runtimeHistory, setRuntimeHistory] = useState({
     cpu: [],
@@ -69,8 +70,12 @@ export function useBlocklet({
     domainsAccessibility,
     recommendedDomain
   } = useDomainsAccessibility(domains);
-  const refreshRuntimeInfo = async () => {
-    setLoadingRuntimeInfo(true);
+  const refreshRuntimeInfo = async (attachDiskInfo = false) => {
+    if (attachDiskInfo) {
+      setLoadingDiskInfo(true);
+    } else {
+      setLoadingRuntimeInfo(true);
+    }
     try {
       const {
         blocklet: data
@@ -78,6 +83,7 @@ export function useBlocklet({
         input: {
           did,
           attachRuntimeInfo: true,
+          attachDiskInfo,
           getOptionalComponents
         }
       });
@@ -89,7 +95,11 @@ export function useBlocklet({
     } catch (err) {
       Toast.error(err.message);
     } finally {
-      setLoadingRuntimeInfo(false);
+      if (attachDiskInfo) {
+        setLoadingDiskInfo(false);
+      } else {
+        setLoadingRuntimeInfo(false);
+      }
     }
   };
   const getRuntimeHistory = async () => {
@@ -118,7 +128,8 @@ export function useBlocklet({
   };
   const refreshBlocklet = async ({
     showError = true,
-    attachRuntimeInfo = true
+    attachRuntimeInfo = true,
+    attachDiskInfo = false
   } = {}) => {
     if (loading) {
       return;
@@ -145,7 +156,7 @@ export function useBlocklet({
         });
         setLoading(false);
         if (attachRuntimeInfo) {
-          refreshRuntimeInfo();
+          refreshRuntimeInfo(attachDiskInfo);
           getRuntimeHistory();
         }
       } else {
@@ -303,6 +314,7 @@ export function useBlocklet({
   return {
     loading,
     loadingRuntimeInfo,
+    loadingDiskInfo,
     error,
     blocklet: data,
     runtimeHistory,

package/lib/locales/ar.js

@@ -1274,7 +1274,8 @@ export default {
       },
       activeUserSessions: 'جلسات المستخدم النشطة',
       forceLogout: 'تسجيل الخروج القسري',
-      forceLogoutDescription: 'هل تؤكد تسجيل خروج هذا المستخدم؟'
+      forceLogoutDescription: 'هل تؤكد تسجيل خروج هذا المستخدم؟',
+      openProfile: 'عرض الصفحة الشخصية'
     },
     transferNode: {
       name: 'تحويل الملكية',

package/lib/locales/de.js

@@ -1274,7 +1274,8 @@ export default {
       },
       activeUserSessions: 'Aktive Benutzersitzungen',
       forceLogout: 'Erzwungenes Abmelden',
-      forceLogoutDescription: 'Bestätigen Sie die erzwungene Abmeldung dieses Benutzers?'
+      forceLogoutDescription: 'Bestätigen Sie die erzwungene Abmeldung dieses Benutzers?',
+      openProfile: 'Profil anzeigen'
     },
     transferNode: {
       name: 'Änderung des Eigentums',

package/lib/locales/en.js

@@ -1228,6 +1228,7 @@ export default {
       passports: 'Passports',
       lastLogin: 'Last Login',
       lastLoginIp: 'Last Login IP',
+      openProfile: 'View Profile',
       source: 'Register Source',
       source_derived: 'Derived from oauth',
       source_wallet: 'DID Wallet',

package/lib/locales/es.js

@@ -1274,7 +1274,8 @@ export default {
       },
       activeUserSessions: 'Sesiones de usuario activas',
       forceLogout: 'Cerrar sesión forzada',
-      forceLogoutDescription: '¿Confirmar para forzar el cierre de sesión de este usuario?'
+      forceLogoutDescription: '¿Confirmar para forzar el cierre de sesión de este usuario?',
+      openProfile: 'Ver Perfil'
     },
     transferNode: {
       name: 'Transferir propiedad',

package/lib/locales/fr.js

@@ -1274,7 +1274,8 @@ export default {
       },
       activeUserSessions: "Sessions d'utilisateurs actives",
       forceLogout: 'Déconnexion forcée',
-      forceLogoutDescription: 'Confirmez-vous la déconnexion forcée de cet utilisateur?'
+      forceLogoutDescription: 'Confirmez-vous la déconnexion forcée de cet utilisateur?',
+      openProfile: 'Voir le profil'
     },
     transferNode: {
       name: 'Transfert de propriété',

package/lib/locales/hi.js

@@ -1274,7 +1274,8 @@ export default {
       },
       activeUserSessions: 'सक्रिय उपयोगकर्ता सत्र',
       forceLogout: 'बाहर करें बल',
-      forceLogoutDescription: 'क्या आप इस उपयोगकर्ता को बाहर करने के लिए पुष्टि करें?'
+      forceLogoutDescription: 'क्या आप इस उपयोगकर्ता को बाहर करने के लिए पुष्टि करें?',
+      openProfile: 'प्रोफ़ाइल देखें'
     },
     transferNode: {
       name: 'स्वामित्व स्थानांतरण',

package/lib/locales/id.js

@@ -1274,7 +1274,8 @@ export default {
       },
       activeUserSessions: 'Sesi Pengguna Aktif',
       forceLogout: 'Keluar paksa',
-      forceLogoutDescription: 'Konfirmasi untuk logout paksa pengguna ini?'
+      forceLogoutDescription: 'Konfirmasi untuk logout paksa pengguna ini?',
+      openProfile: 'Lihat Profil'
     },
     transferNode: {
       name: 'Pindahkan Kepemilikan',

package/lib/locales/ja.js

@@ -1274,7 +1274,8 @@ export default {
       },
       activeUserSessions: 'アクティブユーザーセッション',
       forceLogout: '強制ログアウト',
-      forceLogoutDescription: 'このユーザーを強制的にログアウトしますか？'
+      forceLogoutDescription: 'このユーザーを強制的にログアウトしますか？',
+      openProfile: 'プロフィールを表示'
     },
     transferNode: {
       name: '権限の移譲',

package/lib/locales/ko.js

@@ -1274,7 +1274,8 @@ export default {
       },
       activeUserSessions: '활성 사용자 세션',
       forceLogout: '강제 로그아웃',
-      forceLogoutDescription: '이 사용자를 강제로 로그아웃하시겠습니까?'
+      forceLogoutDescription: '이 사용자를 강제로 로그아웃하시겠습니까?',
+      openProfile: '프로필 보기'
     },
     transferNode: {
       name: '소유권 이전',

package/lib/locales/pt.js

@@ -1274,7 +1274,8 @@ export default {
       },
       activeUserSessions: 'Sessões de Usuários Ativos',
       forceLogout: 'Logout forçado',
-      forceLogoutDescription: 'Confirmar o logout forçado deste usuário?'
+      forceLogoutDescription: 'Confirmar o logout forçado deste usuário?',
+      openProfile: 'Ver perfil'
     },
     transferNode: {
       name: 'Transferir Propriedade',

package/lib/locales/ru.js

@@ -1274,7 +1274,8 @@ export default {
       },
       activeUserSessions: 'Активные пользовательские сессии',
       forceLogout: 'Принудительный выход',
-      forceLogoutDescription: 'Подтвердить выход из системы этого пользователя?'
+      forceLogoutDescription: 'Подтвердить выход из системы этого пользователя?',
+      openProfile: 'Просмотр профиля'
     },
     transferNode: {
       name: 'Передача собственности',

package/lib/locales/th.js

@@ -1274,7 +1274,8 @@ export default {
       },
       activeUserSessions: 'เซสชันผู้ใช้ที่ใช้งานอยู่',
       forceLogout: 'ออกจากระบบบังคับ',
-      forceLogoutDescription: 'ยืนยันให้ออกจากระบบผู้ใช้นี้หรือไม่?'
+      forceLogoutDescription: 'ยืนยันให้ออกจากระบบผู้ใช้นี้หรือไม่?',
+      openProfile: 'ดูโปรไฟล์'
     },
     transferNode: {
       name: 'โอนสิทธิ์การเป็นเจ้าของ',

package/lib/locales/vi.js

@@ -1274,7 +1274,8 @@ export default {
       },
       activeUserSessions: 'Phiên người dùng hoạt động',
       forceLogout: 'Đăng xuất bắt buộc',
-      forceLogoutDescription: 'Xác nhận đăng xuất buộc người dùng này?'
+      forceLogoutDescription: 'Xác nhận đăng xuất buộc người dùng này?',
+      openProfile: 'Xem hồ sơ'
     },
     transferNode: {
       name: 'Chuyển quyền sở hữu',

package/lib/locales/zh-tw.js

@@ -1274,7 +1274,8 @@ export default {
       },
       activeUserSessions: '活躍用戶會話',
       forceLogout: '強制登出',
-      forceLogoutDescription: '確認是否強制登出此使用者？'
+      forceLogoutDescription: '確認是否強制登出此使用者？',
+      openProfile: '檢視個人檔案'
     },
     transferNode: {
       name: '轉讓所有權',

package/lib/locales/zh.js

@@ -1274,7 +1274,8 @@ export default {
       },
       activeUserSessions: '活跃用户会话',
       forceLogout: '强制注销',
-      forceLogoutDescription: '确认是否强制退出此用户？'
+      forceLogoutDescription: '确认是否强制退出此用户？',
+      openProfile: '查看个人资料'
     },
     transferNode: {
       name: '转移所有者',

package/lib/team/members/invite-member.js

@@ -1,5 +1,5 @@
 import PropTypes from 'prop-types';
-import { Alert, Box, CircularProgress, DialogContentText, MenuItem, Select, TextField, InputLabel, FormControl } from '@mui/material';
+import { Alert, Box, CircularProgress, DialogContentText, MenuItem, Select, TextField, InputLabel, FormControl, Typography } from '@mui/material';
 import { useReactive } from 'ahooks';
 import Dialog from '@arcblock/ux/lib/Dialog';
 import { useLocaleContext } from '@arcblock/ux/lib/Locale/context';
@@ -139,8 +139,21 @@ export default function InviteMember({
           children: roles.filter(d => d.name !== 'owner').map(r => /*#__PURE__*/_jsx(MenuItem, {
             value: r.name,
             "data-cy": `invite-member-select-option-${r.name}`,
-            children: /*#__PURE__*/_jsx("span", {
-              children: r.title || r.name
+            children: /*#__PURE__*/_jsxs(Box, {
+              sx: {
+                display: 'flex',
+                flexDirection: 'column'
+              },
+              children: [/*#__PURE__*/_jsx(Typography, {
+                variant: "subtitle1",
+                children: r.title || r.name
+              }), /*#__PURE__*/_jsx(Typography, {
+                variant: "caption",
+                sx: {
+                  opacity: 0.7
+                },
+                children: r.description
+              })]
             })
           }, r.name))
         })]

package/lib/team/members/issue-passport.js

@@ -11,6 +11,7 @@ import FormControl from '@mui/material/FormControl';
 import { useLocaleContext } from '@arcblock/ux/lib/Locale/context';
 import Button from '@arcblock/ux/lib/Button';
 import Alert from '@mui/material/Alert';
+import { Box } from '@mui/material';
 import { useNodeContext } from '../../contexts/node';
 import { formatError } from '../../util';
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
@@ -57,6 +58,7 @@ export default function IssuePassport({
       setLoading(false);
     }
   };
+  console.error('--debug--', roles);
   return /*#__PURE__*/_jsxs(Dialog, {
     title: t('team.passport.issue'),
     fullWidth: true,
@@ -118,8 +120,21 @@ export default function IssuePassport({
             children: roles.filter(d => showOwnerPassport || d.name !== 'owner').map(r => /*#__PURE__*/_jsx(MenuItem, {
               value: r.name,
               "data-cy": `issue-passport-select-option-${r.name}`,
-              children: /*#__PURE__*/_jsx("span", {
-                children: r.title || r.name
+              children: /*#__PURE__*/_jsxs(Box, {
+                sx: {
+                  display: 'flex',
+                  flexDirection: 'column'
+                },
+                children: [/*#__PURE__*/_jsx(Typography, {
+                  variant: "subtitle1",
+                  children: r.title || r.name
+                }), /*#__PURE__*/_jsx(Typography, {
+                  variant: "caption",
+                  sx: {
+                    opacity: 0.7
+                  },
+                  children: r.description
+                })]
               })
             }, r.name))
           })]

package/lib/team/members/member.js

@@ -1,5 +1,5 @@
 /* eslint-disable react/no-unstable-nested-components */
-import { useEffect } from 'react';
+import { useEffect, useState } from 'react';
 import PropTypes from 'prop-types';
 import styled from '@emotion/styled';
 import Toast from '@arcblock/ux/lib/Toast';
@@ -14,8 +14,10 @@ import ForbidLoginIcon from '@arcblock/icons/lib/ForbidLoginIcon';
 import AllowLoginIcon from '@arcblock/icons/lib/AllowLoginIcon';
 import { getTextColor } from '@abtnode/auth/lib/util/create-passport-svg';
 import { useReactive } from 'ahooks';
+import { Icon } from '@iconify/react';
 import { USER_TYPE } from '@abtnode/constant';
 import { LOGIN_PROVIDER, PROVIDER_NAME, TeamEvents } from '@blocklet/constant';
+import { Button } from '@mui/material';
 import Tag from '../../tag';
 import DidAddress from '../../did-address';
 import Permission from '../../permission';
@@ -26,6 +28,7 @@ import PassportIssuances from './passport-issuances';
 import Passports from './passports';
 import ToggleUserApproval from './toggle-user-approval';
 import { parseAvatar } from './util';
+import blockletSdk from '../../util/sdk';
 import UserConnections from './connections';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 function LinkUser({
@@ -75,6 +78,7 @@ export default function Member({
     issuances: null,
     tab: initTab || defaultTab
   });
+  const [profileUrl, setProfileUrl] = useState('');
   const getData = async (_teamDid, _userDid) => {
     try {
       const res = await api.doBatchQuery({
@@ -126,6 +130,12 @@ export default function Member({
     }
   }, [pageState.issuances]); // eslint-disable-line
 
+  useEffect(() => {
+    blockletSdk.user.getProfileUrl({
+      did: pageState.user?.did,
+      locale
+    }).then(setProfileUrl);
+  }, [pageState.user?.did, locale]);
   const handleChangeUser = async changedUser => {
     await getData(teamDid, changedUser.did);
     pageState.tab = defaultTab;
@@ -298,29 +308,55 @@ export default function Member({
         children: /*#__PURE__*/_jsx(Spinner, {})
       }), pageState.user && /*#__PURE__*/_jsxs("div", {
         children: [/*#__PURE__*/_jsxs(Box, {
-          display: "flex",
-          alignItems: "center",
-          className: "info",
-          children: [/*#__PURE__*/_jsx(Avatar, {
-            src: pageState.user.avatar,
-            style: {
-              width: 48,
-              height: 48,
-              backgroundColor: 'transparent',
-              marginRight: 16
-            }
-          }), /*#__PURE__*/_jsxs(Box, {
-            children: [/*#__PURE__*/_jsx(Box, {
-              className: "name",
-              children: pageState.user.fullName
-            }), /*#__PURE__*/_jsx(Box, {
-              className: "did",
-              mt: 1,
-              children: /*#__PURE__*/_jsx(DidAddress, {
-                did: pageState.user.did,
-                showQrcode: true
-              })
+          sx: {
+            display: 'flex',
+            flexDirection: 'row',
+            alignItems: 'center',
+            justifyContent: 'space-between'
+          },
+          children: [/*#__PURE__*/_jsxs(Box, {
+            display: "flex",
+            alignItems: "center",
+            className: "info",
+            children: [/*#__PURE__*/_jsx(Avatar, {
+              src: pageState.user.avatar,
+              style: {
+                width: 48,
+                height: 48,
+                backgroundColor: 'transparent',
+                marginRight: 16
+              }
+            }), /*#__PURE__*/_jsxs(Box, {
+              children: [/*#__PURE__*/_jsx(Box, {
+                className: "name",
+                children: pageState.user.fullName
+              }), /*#__PURE__*/_jsx(Box, {
+                className: "did",
+                mt: 1,
+                children: /*#__PURE__*/_jsx(DidAddress, {
+                  compact: true,
+                  responsive: false,
+                  did: pageState.user.did,
+                  showQrcode: true
+                })
+              })]
             })]
+          }), !!inService && /*#__PURE__*/_jsx("a", {
+            href: profileUrl,
+            target: "_blank",
+            rel: "noreferrer",
+            children: /*#__PURE__*/_jsxs(Button, {
+              variant: "contained",
+              color: "primary",
+              "data-cy": "issue-passport",
+              children: [/*#__PURE__*/_jsx(Icon, {
+                icon: "majesticons:open-line",
+                style: {
+                  fontSize: 16,
+                  marginRight: 4
+                }
+              }), t('team.member.openProfile')]
+            })
           })]
         }), /*#__PURE__*/_jsx(Box, {
           mx: 3,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abtnode/ux",
-  "version": "1.16.29",
+  "version": "1.16.30-beta-00e8bdd1",
   "description": "UX components shared across abtnode packages",
   "publishConfig": {
     "access": "public"
@@ -25,24 +25,24 @@
   "author": "linchen <linchen1987@foxmail.com> (http://github.com/linchen1987)",
   "license": "Apache-2.0",
   "dependencies": {
-    "@abtnode/auth": "1.16.29",
-    "@abtnode/constant": "1.16.29",
-    "@abtnode/util": "1.16.29",
+    "@abtnode/auth": "1.16.30-beta-00e8bdd1",
+    "@abtnode/constant": "1.16.30-beta-00e8bdd1",
+    "@abtnode/util": "1.16.30-beta-00e8bdd1",
     "@ahooksjs/use-url-state": "^3.5.1",
     "@arcblock/did": "^1.18.128",
-    "@arcblock/did-connect": "^2.10.12",
+    "@arcblock/did-connect": "^2.10.13",
     "@arcblock/did-motif": "^1.1.13",
-    "@arcblock/icons": "^2.10.12",
-    "@arcblock/nft-display": "2.10.12",
-    "@arcblock/react-hooks": "^2.10.12",
-    "@arcblock/terminal": "^2.10.12",
-    "@arcblock/ux": "^2.10.12",
-    "@blocklet/constant": "1.16.29",
-    "@blocklet/js-sdk": "1.16.29",
-    "@blocklet/launcher-layout": "2.3.38",
-    "@blocklet/list": "^0.13.13",
-    "@blocklet/meta": "1.16.29",
-    "@blocklet/ui-react": "^2.10.12",
+    "@arcblock/icons": "^2.10.13",
+    "@arcblock/nft-display": "2.10.13",
+    "@arcblock/react-hooks": "^2.10.13",
+    "@arcblock/terminal": "^2.10.13",
+    "@arcblock/ux": "^2.10.13",
+    "@blocklet/constant": "1.16.30-beta-00e8bdd1",
+    "@blocklet/js-sdk": "1.16.30-beta-00e8bdd1",
+    "@blocklet/launcher-layout": "2.3.39",
+    "@blocklet/list": "^0.13.14",
+    "@blocklet/meta": "1.16.30-beta-00e8bdd1",
+    "@blocklet/ui-react": "^2.10.13",
     "@blocklet/uploader": "0.1.20",
     "@emotion/react": "^11.10.4",
     "@emotion/styled": "^11.10.4",
@@ -108,5 +108,5 @@
     "jest": "^29.7.0",
     "jest-environment-jsdom": "^29.7.0"
   },
-  "gitHead": "6c49cffcab4fd0dffc6bed261a5eddf733280ae7"
+  "gitHead": "e165c7e64a2900b4c390b7435c0bb71abbf9b625"
 }