@blocklet/ui-react 2.13.34 → 2.13.36
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,15 +1,16 @@
|
|
|
1
1
|
import { UserSession } from '@blocklet/js-sdk';
|
|
2
2
|
import { User } from '../../@types';
|
|
3
|
-
export default function UserSessions({ user, showAction, showUser, getUserSessions, }: {
|
|
3
|
+
export default function UserSessions({ user, showAction, showUser, getUserSessions, showOffline, }: {
|
|
4
4
|
readonly user: User & {
|
|
5
5
|
userSessions?: any[];
|
|
6
6
|
};
|
|
7
7
|
readonly showAction?: boolean;
|
|
8
8
|
readonly showUser?: boolean;
|
|
9
|
+
readonly showOffline?: boolean;
|
|
9
10
|
readonly getUserSessions: (params: {
|
|
10
11
|
page: number;
|
|
11
12
|
pageSize: number;
|
|
12
|
-
status?: 'online' | 'expired';
|
|
13
|
+
status?: 'online' | 'expired' | 'offline';
|
|
13
14
|
}) => Promise<{
|
|
14
15
|
paging: {
|
|
15
16
|
total: number;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
2
2
|
import Datatable from "@arcblock/ux/lib/Datatable";
|
|
3
|
-
import { useCreation, useMemoizedFn, useReactive, useRequest } from "ahooks";
|
|
3
|
+
import { useCreation, useMemoizedFn, useMount, useReactive, useRequest } from "ahooks";
|
|
4
4
|
import { translate } from "@arcblock/ux/lib/Locale/util";
|
|
5
5
|
import { useLocaleContext } from "@arcblock/ux/lib/Locale/context";
|
|
6
6
|
import RelativeTime from "@arcblock/ux/lib/RelativeTime";
|
|
@@ -79,7 +79,8 @@ export default function UserSessions({
|
|
|
79
79
|
user,
|
|
80
80
|
showAction = true,
|
|
81
81
|
showUser = true,
|
|
82
|
-
getUserSessions
|
|
82
|
+
getUserSessions,
|
|
83
|
+
showOffline = false
|
|
83
84
|
}) {
|
|
84
85
|
const filterParams = useReactive({
|
|
85
86
|
status: "online",
|
|
@@ -88,7 +89,8 @@ export default function UserSessions({
|
|
|
88
89
|
});
|
|
89
90
|
const userSessionsCountMap = useReactive({
|
|
90
91
|
online: 0,
|
|
91
|
-
expired: 0
|
|
92
|
+
expired: 0,
|
|
93
|
+
offline: 0
|
|
92
94
|
});
|
|
93
95
|
const currentVisitorId = getVisitorId();
|
|
94
96
|
const { locale } = useLocaleContext();
|
|
@@ -111,14 +113,19 @@ export default function UserSessions({
|
|
|
111
113
|
list: result?.list || []
|
|
112
114
|
};
|
|
113
115
|
});
|
|
114
|
-
|
|
115
|
-
const
|
|
116
|
+
useMount(async () => {
|
|
117
|
+
const expiredResult = await getUserSessions({
|
|
116
118
|
page: 1,
|
|
117
119
|
pageSize: 1,
|
|
118
120
|
status: "expired"
|
|
119
121
|
});
|
|
120
|
-
userSessionsCountMap.expired =
|
|
121
|
-
|
|
122
|
+
userSessionsCountMap.expired = expiredResult?.paging?.total || 0;
|
|
123
|
+
const offlineResult = await getUserSessions({
|
|
124
|
+
page: 1,
|
|
125
|
+
pageSize: 1,
|
|
126
|
+
status: "offline"
|
|
127
|
+
});
|
|
128
|
+
userSessionsCountMap.offline = offlineResult?.paging?.total || 0;
|
|
122
129
|
});
|
|
123
130
|
const pageState = useRequest(getData, {
|
|
124
131
|
refreshDeps: [filterParams.status, filterParams.page, filterParams.pageSize]
|
|
@@ -148,7 +155,6 @@ export default function UserSessions({
|
|
|
148
155
|
onConfirm: async () => {
|
|
149
156
|
await client.user.logout({
|
|
150
157
|
visitorId,
|
|
151
|
-
// @ts-expect-error js-sdk 1.16.43 中会包含这个参数
|
|
152
158
|
includeFederated: true
|
|
153
159
|
});
|
|
154
160
|
pageState.refresh();
|
|
@@ -173,7 +179,6 @@ export default function UserSessions({
|
|
|
173
179
|
await client.user.logout({
|
|
174
180
|
status: filterParams.status,
|
|
175
181
|
visitorId: currentVisitorId,
|
|
176
|
-
// @ts-expect-error js-sdk 1.16.43 中会包含这个参数
|
|
177
182
|
includeFederated: true
|
|
178
183
|
});
|
|
179
184
|
pageState.refresh();
|
|
@@ -277,7 +282,7 @@ export default function UserSessions({
|
|
|
277
282
|
}
|
|
278
283
|
}
|
|
279
284
|
},
|
|
280
|
-
{
|
|
285
|
+
!showOffline && {
|
|
281
286
|
label: t("updatedAt"),
|
|
282
287
|
name: "updatedAt",
|
|
283
288
|
options: {
|
|
@@ -421,7 +426,22 @@ export default function UserSessions({
|
|
|
421
426
|
] })
|
|
422
427
|
] })
|
|
423
428
|
}
|
|
424
|
-
)
|
|
429
|
+
),
|
|
430
|
+
showOffline ? /* @__PURE__ */ jsx(
|
|
431
|
+
FormControlLabel,
|
|
432
|
+
{
|
|
433
|
+
value: "offline",
|
|
434
|
+
control: /* @__PURE__ */ jsx(Radio, { size: "small", sx: { lineHeight: 1, fontSize: 0 }, checked: filterParams.status === "offline" }),
|
|
435
|
+
label: /* @__PURE__ */ jsxs(Typography, { sx: { display: "flex", alignItems: "center" }, children: [
|
|
436
|
+
t("offline"),
|
|
437
|
+
/* @__PURE__ */ jsxs(Typography, { component: "span", sx: { ml: 0.5, color: "text.secondary" }, children: [
|
|
438
|
+
"(",
|
|
439
|
+
userSessionsCountMap.offline,
|
|
440
|
+
")"
|
|
441
|
+
] })
|
|
442
|
+
] })
|
|
443
|
+
}
|
|
444
|
+
) : null
|
|
425
445
|
]
|
|
426
446
|
}
|
|
427
447
|
),
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@blocklet/ui-react",
|
|
3
|
-
"version": "2.13.
|
|
3
|
+
"version": "2.13.36",
|
|
4
4
|
"description": "Some useful front-end web components that can be used in Blocklets.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"react",
|
|
@@ -34,11 +34,11 @@
|
|
|
34
34
|
"dependencies": {
|
|
35
35
|
"@abtnode/constant": "^1.16.43",
|
|
36
36
|
"@abtnode/util": "^1.16.43",
|
|
37
|
-
"@arcblock/bridge": "^2.13.
|
|
38
|
-
"@arcblock/react-hooks": "^2.13.
|
|
39
|
-
"@arcblock/ws": "^1.20.
|
|
37
|
+
"@arcblock/bridge": "^2.13.36",
|
|
38
|
+
"@arcblock/react-hooks": "^2.13.36",
|
|
39
|
+
"@arcblock/ws": "^1.20.10",
|
|
40
40
|
"@blocklet/constant": "^1.16.43",
|
|
41
|
-
"@blocklet/did-space-react": "^1.0.
|
|
41
|
+
"@blocklet/did-space-react": "^1.0.53",
|
|
42
42
|
"@iconify-icons/logos": "^1.2.36",
|
|
43
43
|
"@iconify-icons/material-symbols": "^1.2.58",
|
|
44
44
|
"@iconify-icons/tabler": "^1.2.95",
|
|
@@ -94,5 +94,5 @@
|
|
|
94
94
|
"jest": "^29.7.0",
|
|
95
95
|
"unbuild": "^2.0.0"
|
|
96
96
|
},
|
|
97
|
-
"gitHead": "
|
|
97
|
+
"gitHead": "9df953c70b6808afe748ea91d58bb1b3e7acc066"
|
|
98
98
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/* eslint-disable no-nested-ternary */
|
|
2
2
|
/* eslint-disable react/no-unstable-nested-components */
|
|
3
3
|
import Datatable from '@arcblock/ux/lib/Datatable';
|
|
4
|
-
import { useCreation, useMemoizedFn, useReactive, useRequest } from 'ahooks';
|
|
4
|
+
import { useCreation, useMemoizedFn, useMount, useReactive, useRequest } from 'ahooks';
|
|
5
5
|
import { translate } from '@arcblock/ux/lib/Locale/util';
|
|
6
6
|
import { useLocaleContext } from '@arcblock/ux/lib/Locale/context';
|
|
7
7
|
import RelativeTime from '@arcblock/ux/lib/RelativeTime';
|
|
@@ -101,13 +101,19 @@ export default function UserSessions({
|
|
|
101
101
|
showAction = true,
|
|
102
102
|
showUser = true,
|
|
103
103
|
getUserSessions,
|
|
104
|
+
showOffline = false,
|
|
104
105
|
}: {
|
|
105
106
|
readonly user: User & {
|
|
106
107
|
userSessions?: any[];
|
|
107
108
|
};
|
|
108
109
|
readonly showAction?: boolean;
|
|
109
110
|
readonly showUser?: boolean;
|
|
110
|
-
readonly
|
|
111
|
+
readonly showOffline?: boolean;
|
|
112
|
+
readonly getUserSessions: (params: {
|
|
113
|
+
page: number;
|
|
114
|
+
pageSize: number;
|
|
115
|
+
status?: 'online' | 'expired' | 'offline';
|
|
116
|
+
}) => Promise<{
|
|
111
117
|
paging: {
|
|
112
118
|
total: number;
|
|
113
119
|
};
|
|
@@ -122,6 +128,7 @@ export default function UserSessions({
|
|
|
122
128
|
const userSessionsCountMap = useReactive({
|
|
123
129
|
online: 0,
|
|
124
130
|
expired: 0,
|
|
131
|
+
offline: 0,
|
|
125
132
|
});
|
|
126
133
|
const currentVisitorId = getVisitorId();
|
|
127
134
|
const { locale } = useLocaleContext();
|
|
@@ -135,7 +142,7 @@ export default function UserSessions({
|
|
|
135
142
|
const result = await getUserSessions({
|
|
136
143
|
page: filterParams.page,
|
|
137
144
|
pageSize: filterParams.pageSize,
|
|
138
|
-
status: filterParams.status as 'online' | 'expired',
|
|
145
|
+
status: filterParams.status as 'online' | 'expired' | 'offline',
|
|
139
146
|
});
|
|
140
147
|
|
|
141
148
|
const total = result?.paging?.total || 0;
|
|
@@ -147,14 +154,20 @@ export default function UserSessions({
|
|
|
147
154
|
};
|
|
148
155
|
});
|
|
149
156
|
|
|
150
|
-
|
|
151
|
-
const
|
|
157
|
+
useMount(async () => {
|
|
158
|
+
const expiredResult = await getUserSessions({
|
|
152
159
|
page: 1,
|
|
153
160
|
pageSize: 1,
|
|
154
161
|
status: 'expired',
|
|
155
162
|
});
|
|
156
|
-
userSessionsCountMap.expired =
|
|
157
|
-
|
|
163
|
+
userSessionsCountMap.expired = expiredResult?.paging?.total || 0;
|
|
164
|
+
|
|
165
|
+
const offlineResult = await getUserSessions({
|
|
166
|
+
page: 1,
|
|
167
|
+
pageSize: 1,
|
|
168
|
+
status: 'offline',
|
|
169
|
+
});
|
|
170
|
+
userSessionsCountMap.offline = offlineResult?.paging?.total || 0;
|
|
158
171
|
});
|
|
159
172
|
|
|
160
173
|
const pageState = useRequest(getData, {
|
|
@@ -190,7 +203,6 @@ export default function UserSessions({
|
|
|
190
203
|
onConfirm: async () => {
|
|
191
204
|
await client.user.logout({
|
|
192
205
|
visitorId,
|
|
193
|
-
// @ts-expect-error js-sdk 1.16.43 中会包含这个参数
|
|
194
206
|
includeFederated: true,
|
|
195
207
|
});
|
|
196
208
|
pageState.refresh();
|
|
@@ -215,7 +227,6 @@ export default function UserSessions({
|
|
|
215
227
|
await client.user.logout({
|
|
216
228
|
status: filterParams.status,
|
|
217
229
|
visitorId: currentVisitorId as string,
|
|
218
|
-
// @ts-expect-error js-sdk 1.16.43 中会包含这个参数
|
|
219
230
|
includeFederated: true,
|
|
220
231
|
});
|
|
221
232
|
pageState.refresh();
|
|
@@ -331,7 +342,7 @@ export default function UserSessions({
|
|
|
331
342
|
},
|
|
332
343
|
},
|
|
333
344
|
},
|
|
334
|
-
{
|
|
345
|
+
!showOffline && {
|
|
335
346
|
label: t('updatedAt'),
|
|
336
347
|
name: 'updatedAt',
|
|
337
348
|
options: {
|
|
@@ -484,6 +495,22 @@ export default function UserSessions({
|
|
|
484
495
|
</Typography>
|
|
485
496
|
}
|
|
486
497
|
/>
|
|
498
|
+
{showOffline ? (
|
|
499
|
+
<FormControlLabel
|
|
500
|
+
value="offline"
|
|
501
|
+
control={
|
|
502
|
+
<Radio size="small" sx={{ lineHeight: 1, fontSize: 0 }} checked={filterParams.status === 'offline'} />
|
|
503
|
+
}
|
|
504
|
+
label={
|
|
505
|
+
<Typography sx={{ display: 'flex', alignItems: 'center' }}>
|
|
506
|
+
{t('offline')}
|
|
507
|
+
<Typography component="span" sx={{ ml: 0.5, color: 'text.secondary' }}>
|
|
508
|
+
({userSessionsCountMap.offline})
|
|
509
|
+
</Typography>
|
|
510
|
+
</Typography>
|
|
511
|
+
}
|
|
512
|
+
/>
|
|
513
|
+
) : null}
|
|
487
514
|
</RadioGroup>
|
|
488
515
|
}
|
|
489
516
|
onChange={(state) => {
|