@@ -2,6 +2,7 @@ import { ActionIcon, CopyButton, List } from '@lobehub/ui';
2
2
import { Popconfirm } from 'antd' ;
3
3
import { RotateCw , Unlink } from 'lucide-react' ;
4
4
import { memo , useState } from 'react' ;
5
+ import { useTranslation } from 'react-i18next' ;
5
6
import { Flexbox } from 'react-layout-kit' ;
6
7
7
8
import { useOnlyFetchOnceSWR } from '@/libs/swr' ;
@@ -13,19 +14,24 @@ const { Item } = List;
13
14
14
15
export const SSOProvidersList = memo ( ( ) => {
15
16
const [ allowUnlink , setAllowUnlink ] = useState < boolean > ( false ) ;
17
+
16
18
const { data, isLoading, mutate } = useOnlyFetchOnceSWR ( 'profile-sso-providers' , async ( ) => {
17
19
const list = await userService . getUserSSOProviders ( ) ;
18
20
setAllowUnlink ( list ?. length > 1 ) ;
19
21
return list ;
20
22
} ) ;
23
+
21
24
const handleUnlinkSSO = async ( provider : string , providerAccountId : string ) => {
22
25
await userService . unlinkSSOProvider ( provider , providerAccountId ) ;
23
26
mutate ( ) ;
24
27
} ;
28
+
29
+ const { t } = useTranslation ( 'auth' ) ;
30
+
25
31
return isLoading ? (
26
32
< Flexbox align = { 'center' } gap = { 4 } horizontal >
27
33
< ActionIcon icon = { RotateCw } spin />
28
- { 'stats.modelsRank .loading'}
34
+ { t ( 'profile.sso .loading') }
29
35
</ Flexbox >
30
36
) : (
31
37
< Flexbox >
@@ -37,7 +43,7 @@ export const SSOProvidersList = memo(() => {
37
43
< Popconfirm
38
44
onConfirm = { ( ) => handleUnlinkSSO ( item . provider , item . providerAccountId ) }
39
45
placement = "topRight"
40
- title = "Are you sure to unlink this account?"
46
+ title = { t ( 'profile.sso.unlink' , { provider : item . provider } ) }
41
47
>
42
48
< ActionIcon disable = { ! allowUnlink } icon = { Unlink } size = { 'small' } />
43
49
</ Popconfirm >
0 commit comments