@arcblock/ux 2.10.34 → 2.10.35

Sign up to get free protection for your applications and to get access to all the features.
@@ -4,6 +4,7 @@ import upperFirst from 'lodash/upperFirst';
4
4
  import { Box } from '@mui/material';
5
5
  import { useLocaleContext } from '@arcblock/ux/lib/Locale/context';
6
6
  import RevokeIcon from '@arcblock/icons/lib/RevokeIcon';
7
+ import NFTDisplay from '../NFTDisplay';
7
8
  export default function Passport({
8
9
  passport,
9
10
  user,
@@ -24,13 +25,26 @@ export default function Passport({
24
25
  alignItems: 'center',
25
26
  ...rest?.sx
26
27
  },
27
- children: [/*#__PURE__*/_jsx(Box, {
28
+ children: [!!passport.display && /*#__PURE__*/_jsx(Box, {
29
+ className: "passport-item__display",
30
+ sx: {
31
+ width
32
+ },
33
+ children: /*#__PURE__*/_jsx(NFTDisplay, {
34
+ address: passport.id,
35
+ data: passport.display,
36
+ imageFilter: typeof width === 'number' ? {
37
+ imageFilter: 'resize',
38
+ w: width
39
+ } : null
40
+ })
41
+ }), !passport.display && /*#__PURE__*/_jsx(Box, {
28
42
  className: "passport-item__display"
29
43
  // eslint-disable-next-line react/no-danger
30
44
  ,
31
45
  dangerouslySetInnerHTML: {
32
46
  __html: createPassportSvg({
33
- title: passport.scope === 'passport' ? passport.title : passport.name,
47
+ title: passport.scope === 'kyc' ? passport.name : passport.title,
34
48
  issuer: passport.issuer && passport.issuer.name,
35
49
  issuerDid: passport.issuer && passport.issuer.id,
36
50
  ownerName: user.fullName,
@@ -39,6 +53,7 @@ export default function Passport({
39
53
  revoked: passport.revoked,
40
54
  scope: passport.scope,
41
55
  role: passport.role,
56
+ display: passport.display,
42
57
  preferredColor: color,
43
58
  width
44
59
  })
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@arcblock/ux",
3
- "version": "2.10.34",
3
+ "version": "2.10.35",
4
4
  "description": "Common used react components for arcblock products",
5
5
  "keywords": [
6
6
  "react",
@@ -48,8 +48,8 @@
48
48
  "copyfiles": "^2.4.1",
49
49
  "eslint-plugin-react-hooks": "^4.6.0",
50
50
  "glob": "^10.3.3",
51
- "jest": "^28.1.3",
52
- "jest-environment-jsdom": "^29.5.0",
51
+ "jest": "^29.7.0",
52
+ "jest-environment-jsdom": "^29.7.0",
53
53
  "moment-timezone": "^0.5.37",
54
54
  "typescript": "^5.5.4"
55
55
  },
@@ -61,12 +61,12 @@
61
61
  "react": ">=18.2.0",
62
62
  "react-router-dom": ">=6.22.3"
63
63
  },
64
- "gitHead": "5de9c1542fd4b69ebe65efef3a7745cef72d6695",
64
+ "gitHead": "f9b94c550f326b354ae2850e03e28947c5cdb0d1",
65
65
  "dependencies": {
66
66
  "@arcblock/did-motif": "^1.1.13",
67
- "@arcblock/icons": "^2.10.34",
68
- "@arcblock/nft-display": "^2.10.34",
69
- "@arcblock/react-hooks": "^2.10.34",
67
+ "@arcblock/icons": "^2.10.35",
68
+ "@arcblock/nft-display": "^2.10.35",
69
+ "@arcblock/react-hooks": "^2.10.35",
70
70
  "@babel/plugin-syntax-dynamic-import": "^7.8.3",
71
71
  "@fontsource/inter": "^5.0.16",
72
72
  "@fontsource/ubuntu-mono": "^5.0.18",
@@ -4,6 +4,8 @@ import { Box } from '@mui/material';
4
4
  import { useLocaleContext } from '@arcblock/ux/lib/Locale/context';
5
5
  import RevokeIcon from '@arcblock/icons/lib/RevokeIcon';
6
6
 
7
+ import NFTDisplay from '../NFTDisplay';
8
+
7
9
  export default function Passport({ passport, user, color, width, icon, children, createPassportSvg, ...rest }) {
8
10
  const { t } = useLocaleContext();
9
11
  return (
@@ -14,25 +16,37 @@ export default function Passport({ passport, user, color, width, icon, children,
14
16
  alignItems: 'center',
15
17
  ...rest?.sx,
16
18
  }}>
17
- <Box
18
- className="passport-item__display"
19
- // eslint-disable-next-line react/no-danger
20
- dangerouslySetInnerHTML={{
21
- __html: createPassportSvg({
22
- title: passport.scope === 'passport' ? passport.title : passport.name,
23
- issuer: passport.issuer && passport.issuer.name,
24
- issuerDid: passport.issuer && passport.issuer.id,
25
- ownerName: user.fullName,
26
- ownerDid: user.did,
27
- ownerAvatarUrl: user.avatar,
28
- revoked: passport.revoked,
29
- scope: passport.scope,
30
- role: passport.role,
31
- preferredColor: color,
32
- width,
33
- }),
34
- }}
35
- />
19
+ {!!passport.display && (
20
+ <Box className="passport-item__display" sx={{ width }}>
21
+ <NFTDisplay
22
+ address={passport.id}
23
+ data={passport.display}
24
+ imageFilter={typeof width === 'number' ? { imageFilter: 'resize', w: width } : null}
25
+ />
26
+ </Box>
27
+ )}
28
+ {!passport.display && (
29
+ <Box
30
+ className="passport-item__display"
31
+ // eslint-disable-next-line react/no-danger
32
+ dangerouslySetInnerHTML={{
33
+ __html: createPassportSvg({
34
+ title: passport.scope === 'kyc' ? passport.name : passport.title,
35
+ issuer: passport.issuer && passport.issuer.name,
36
+ issuerDid: passport.issuer && passport.issuer.id,
37
+ ownerName: user.fullName,
38
+ ownerDid: user.did,
39
+ ownerAvatarUrl: user.avatar,
40
+ revoked: passport.revoked,
41
+ scope: passport.scope,
42
+ role: passport.role,
43
+ display: passport.display,
44
+ preferredColor: color,
45
+ width,
46
+ }),
47
+ }}
48
+ />
49
+ )}
36
50
  <Box
37
51
  className="passport-item__body"
38
52
  sx={{