diff --git a/client/web/src/plugin/common/index.ts b/client/web/src/plugin/common/index.ts index 35ec2854..42ca1a38 100644 --- a/client/web/src/plugin/common/index.ts +++ b/client/web/src/plugin/common/index.ts @@ -24,7 +24,7 @@ export { getGlobalState, useGlobalSocketEvent, } from '@/utils/global-state-helper'; -export { getJWTUserInfo } from '@/utils/jwt-helper'; +export { setUserJWT, getJWTUserInfo } from '@/utils/jwt-helper'; export { dataUrlToFile } from '@/utils/file-helper'; export { urlSearchStringify, @@ -67,6 +67,7 @@ export { showMessageTime, joinArray, useConverseMessageContext, + loginWithToken, } from 'tailchat-shared'; export { navigate } from '@/components/AppRouterApi'; diff --git a/server/plugins/com.msgbyte.fim/web/plugins/com.msgbyte.fim/src/FimAction.tsx b/server/plugins/com.msgbyte.fim/web/plugins/com.msgbyte.fim/src/FimAction.tsx index 87ecf76f..38bb5f03 100644 --- a/server/plugins/com.msgbyte.fim/web/plugins/com.msgbyte.fim/src/FimAction.tsx +++ b/server/plugins/com.msgbyte.fim/web/plugins/com.msgbyte.fim/src/FimAction.tsx @@ -1,7 +1,14 @@ -import React from 'react'; -import { useAsync } from '@capital/common'; +import React, { useEffect, useRef } from 'react'; +import { + useAsync, + showToasts, + useNavigate, + loginWithToken, + setUserJWT, +} from '@capital/common'; import { Divider, Image, Tooltip } from '@capital/component'; import { request } from './request'; +import { Translate } from './translate'; export const FimAction: React.FC = React.memo(() => { const { loading, value: strategies } = useAsync(async () => { @@ -9,6 +16,37 @@ export const FimAction: React.FC = React.memo(() => { return strategies; }, []); + const newWin = useRef(); + const navigate = useNavigate(); + + useEffect(() => { + const fn = (event: MessageEvent) => { + if (newWin.current && event.source === newWin.current) { + newWin.current.close(); + + const payload = event.data; + + if (payload.type === 'exist') { + showToasts(Translate.accountExistedTip, 'warning'); + } else if (payload.type === 'token') { + const token = payload.token; + setUserJWT(token) + .then(loginWithToken(token)) + .then(() => { + navigate('/main'); + }) + .catch(() => { + showToasts(Translate.loginFailed, 'error'); + }); + } + } + }; + window.addEventListener('message', fn); + + return () => { + window.removeEventListener('message', fn); + }; + }, []); if (loading) { return null; @@ -17,7 +55,7 @@ export const FimAction: React.FC = React.memo(() => { if (Array.isArray(strategies) && strategies.length > 0) { return (
- + {Translate.fimLogin}
{strategies.map((s) => ( @@ -36,9 +74,7 @@ export const FimAction: React.FC = React.memo(() => { ); const win = window.open(url, 'square', 'frame=true'); - win.addEventListener('message', (...args) => { - console.log(...args); - }); + newWin.current = win; } }} /> diff --git a/server/plugins/com.msgbyte.fim/web/plugins/com.msgbyte.fim/src/translate.ts b/server/plugins/com.msgbyte.fim/web/plugins/com.msgbyte.fim/src/translate.ts new file mode 100644 index 00000000..7c6f1761 --- /dev/null +++ b/server/plugins/com.msgbyte.fim/web/plugins/com.msgbyte.fim/src/translate.ts @@ -0,0 +1,16 @@ +import { localTrans } from '@capital/common'; + +export const Translate = { + fimLogin: localTrans({ + 'zh-CN': '第三方登录', + 'en-US': 'Third party login', + }), + loginFailed: localTrans({ + 'zh-CN': '登录失败', + 'en-US': 'Login Failed', + }), + accountExistedTip: localTrans({ + 'zh-CN': '账号已存在,你应该在登录后绑定账号', + 'en-US': 'Account Existed, You should bind provider account after login', + }), +};