From da1d00d9bf73d4d4692b728f40b2643b80f99019 Mon Sep 17 00:00:00 2001 From: Qi <474021214@qq.com> Date: Fri, 24 Feb 2023 17:16:21 +0800 Subject: [PATCH] fix: stay loading when refresh token fail (#1194) --- .../message-center-handler/index.tsx | 31 +++++++++++++------ packages/data-center/src/message/code.ts | 4 +++ .../src/provider/affine/apis/google.ts | 24 +++++++++++--- .../src/provider/affine/apis/request-error.ts | 9 ++++++ .../src/provider/affine/apis/workspace.ts | 10 +----- 5 files changed, 54 insertions(+), 24 deletions(-) create mode 100644 packages/data-center/src/provider/affine/apis/request-error.ts diff --git a/apps/web/src/components/message-center-handler/index.tsx b/apps/web/src/components/message-center-handler/index.tsx index 0339e2d30..46d935b53 100644 --- a/apps/web/src/components/message-center-handler/index.tsx +++ b/apps/web/src/components/message-center-handler/index.tsx @@ -1,11 +1,22 @@ import { toast } from '@affine/component'; -import { MessageCenter } from '@affine/datacenter'; +import { DataCenter, MessageCenter } from '@affine/datacenter'; import { AffineProvider } from '@affine/datacenter'; +import { DebugLogger } from '@affine/debug'; import { useRouter } from 'next/router'; import { ReactNode, useCallback, useEffect } from 'react'; import { useGlobalState } from '@/store/app'; +const logger = new DebugLogger('messageCenter'); + +const clearAuth = (dataCenter: DataCenter, providerName: string) => { + const affineProvider = dataCenter.providers.find(p => p.id === providerName); + if (affineProvider && affineProvider instanceof AffineProvider) { + affineProvider.apis.auth.clear(); + } else { + logger.error('cannot find affine provider, please fix this ASAP'); + } +}; export function MessageCenterHandler({ children }: { children?: ReactNode }) { const router = useRouter(); const dataCenter = useGlobalState(useCallback(store => store.dataCenter, [])); @@ -19,14 +30,7 @@ export function MessageCenterHandler({ children }: { children?: ReactNode }) { // todo: error toast style toast('You have no permission to access this workspace'); // todo(himself65): remove dynamic lookup - const affineProvider = dataCenter.providers.find( - p => p.id === 'affine' - ); - if (affineProvider && affineProvider instanceof AffineProvider) { - affineProvider.apis.auth.clear(); - } else { - console.error('cannot find affine provider, please fix this ASAP'); - } + clearAuth(dataCenter, 'affine'); // the status of the app right now is unknown, and it won't help if we let // the app continue and let the user auth the app. // that's why so we need to reload the page for now. @@ -36,9 +40,16 @@ export function MessageCenterHandler({ children }: { children?: ReactNode }) { await router.push('/'); router.reload(); } + + if (message.code === MessageCenter.messageCode.refreshTokenError) { + toast('Automatic login fail, please login self later'); + clearAuth(dataCenter, 'affine'); + await router.push('/'); + router.reload(); + } }); } - }, [dataCenter?.providers, router]); + }, [dataCenter, router]); return <>{children}; } diff --git a/packages/data-center/src/message/code.ts b/packages/data-center/src/message/code.ts index d7df92696..8f4b9f4b7 100644 --- a/packages/data-center/src/message/code.ts +++ b/packages/data-center/src/message/code.ts @@ -13,6 +13,7 @@ export enum MessageCode { getBlobFailed, leaveWorkspaceFailed, downloadWorkspaceFailed, + refreshTokenError, } export const messages = { @@ -58,4 +59,7 @@ export const messages = { [MessageCode.downloadWorkspaceFailed]: { message: 'Download workspace failed', }, + [MessageCode.refreshTokenError]: { + message: 'Refresh token failed', + }, }; diff --git a/packages/data-center/src/provider/affine/apis/google.ts b/packages/data-center/src/provider/affine/apis/google.ts index 46ff367d3..c99d9b48e 100644 --- a/packages/data-center/src/provider/affine/apis/google.ts +++ b/packages/data-center/src/provider/affine/apis/google.ts @@ -11,7 +11,9 @@ import { import { decode } from 'js-base64'; import { KyInstance } from 'ky/distribution/types/ky'; +import { MessageCenter } from '../../../message'; import { storage } from '../storage'; +import { RequestError } from './request-error'; export interface AccessTokenMessage { created_at: number; @@ -38,6 +40,9 @@ type LoginResponse = { // TODO: organize storage keys in a better way const AFFINE_LOGIN_STORAGE_KEY = 'affine:login'; +const messageCenter = MessageCenter.getInstance(); +const sendMessage = messageCenter.getMessageSender('affine'); +const { messageCode } = MessageCenter; /** * Use refresh token to get a new access token (JWT) @@ -98,9 +103,17 @@ export class GoogleAuth { } async initToken(token: string) { - const res = await this._doLogin({ token, type: 'Google' }); - this.setLogin(res); - return this._user; + try { + const res = await this._doLogin({ + token, + type: 'Google', + }); + this.setLogin(res); + return this._user; + } catch (error) { + sendMessage(messageCode.loginError); + throw new RequestError('Login failed', error); + } } async refreshToken(refreshToken?: string) { @@ -117,8 +130,9 @@ export class GoogleAuth { this.setLogin(res); } return true; - } catch { - this._logger.warn('Failed to refresh token'); + } catch (error) { + sendMessage(messageCode.refreshTokenError); + throw new RequestError('Refresh token failed', error); } finally { // clear on settled this._padding = undefined; diff --git a/packages/data-center/src/provider/affine/apis/request-error.ts b/packages/data-center/src/provider/affine/apis/request-error.ts new file mode 100644 index 000000000..9ab8e401a --- /dev/null +++ b/packages/data-center/src/provider/affine/apis/request-error.ts @@ -0,0 +1,9 @@ +export class RequestError extends Error { + constructor(message: string, cause: unknown | null = null) { + super(message); + this.name = 'RequestError'; + this.cause = cause; + } +} + +export default RequestError; diff --git a/packages/data-center/src/provider/affine/apis/workspace.ts b/packages/data-center/src/provider/affine/apis/workspace.ts index f156e1263..4900b38da 100644 --- a/packages/data-center/src/provider/affine/apis/workspace.ts +++ b/packages/data-center/src/provider/affine/apis/workspace.ts @@ -3,22 +3,14 @@ import { KyInstance } from 'ky/distribution/types/ky'; import { MessageCenter } from '../../../message'; import { createBlocksuiteWorkspace as _createBlocksuiteWorkspace } from '../../../utils'; import { GoogleAuth } from './google'; +import RequestError from './request-error'; import type { User } from './user'; - const messageCenter = MessageCenter.getInstance(); const sendMessage = messageCenter.getMessageSender('affine'); const { messageCode } = MessageCenter; -class RequestError extends Error { - constructor(message: string, cause: unknown | null = null) { - super(message); - this.name = 'RequestError'; - this.cause = cause; - } -} - export interface GetWorkspaceDetailParams { id: string; }