diff --git a/packages/common/infra/src/livedata/index.ts b/packages/common/infra/src/livedata/index.ts index 9e3690af8f..26560a3234 100644 --- a/packages/common/infra/src/livedata/index.ts +++ b/packages/common/infra/src/livedata/index.ts @@ -10,4 +10,4 @@ export { onStart, smartRetry, } from './ops'; -export { useEnsureLiveData, useLiveData } from './react'; +export { useLiveData } from './react'; diff --git a/packages/common/infra/src/livedata/react.ts b/packages/common/infra/src/livedata/react.ts index ca775752e5..9456724d42 100644 --- a/packages/common/infra/src/livedata/react.ts +++ b/packages/common/infra/src/livedata/react.ts @@ -1,4 +1,3 @@ -import { use } from 'foxact/use'; import { useSyncExternalStore } from 'react'; import type { LiveData } from './livedata'; @@ -36,33 +35,3 @@ export function useLiveData | null | undefined>( : nullGetSnapshot ); } - -/** - * subscribe LiveData and return the value. If the value is nullish, will suspends until the value is not nullish. - */ -export function useEnsureLiveData(liveData$: LiveData): NonNullable { - const data = useLiveData(liveData$); - - if (data === null || data === undefined) { - return use( - new Promise>((resolve, reject) => { - const subscription = liveData$.subscribe({ - next(value) { - if (value !== null && value !== undefined) { - resolve(value as NonNullable); - subscription.unsubscribe(); - } - }, - error(err) { - reject(err); - }, - complete() { - reject(new Error('Unexpected completion')); - }, - }); - }) - ); - } - - return data as NonNullable; -} diff --git a/packages/frontend/core/src/desktop/dialogs/setting/account-setting/index.tsx b/packages/frontend/core/src/desktop/dialogs/setting/account-setting/index.tsx index 3a89875c70..ee82fe9755 100644 --- a/packages/frontend/core/src/desktop/dialogs/setting/account-setting/index.tsx +++ b/packages/frontend/core/src/desktop/dialogs/setting/account-setting/index.tsx @@ -14,12 +14,7 @@ import { SubscriptionPlan } from '@affine/graphql'; import { useI18n } from '@affine/i18n'; import { track } from '@affine/track'; import { ArrowRightSmallIcon, CameraIcon } from '@blocksuite/icons/rc'; -import { - useEnsureLiveData, - useLiveData, - useService, - useServices, -} from '@toeverything/infra'; +import { useLiveData, useService, useServices } from '@toeverything/infra'; import { useCallback, useEffect, useState } from 'react'; import { AuthService, ServerService } from '../../../../modules/cloud'; @@ -31,7 +26,7 @@ import * as styles from './style.css'; export const UserAvatar = () => { const t = useI18n(); const session = useService(AuthService).session; - const account = useEnsureLiveData(session.account$); + const account = useLiveData(session.account$); const handleUpdateUserAvatar = useAsyncCallback( async (file: File) => { @@ -63,10 +58,10 @@ export const UserAvatar = () => { > } - onRemove={account.avatar ? handleRemoveUserAvatar : undefined} + onRemove={account?.avatar ? handleRemoveUserAvatar : undefined} avatarTooltipOptions={{ content: t['Click to replace photo']() }} removeTooltipOptions={{ content: t['Remove photo']() }} data-testid="user-setting-avatar" @@ -81,10 +76,10 @@ export const UserAvatar = () => { export const AvatarAndName = () => { const t = useI18n(); const session = useService(AuthService).session; - const account = useEnsureLiveData(session.account$); - const [input, setInput] = useState(account.label); + const account = useLiveData(session.account$); + const [input, setInput] = useState(account?.label ?? ''); - const allowUpdate = !!input && input !== account.label; + const allowUpdate = !!input && input !== account?.label; const handleUpdateUserName = useAsyncCallback(async () => { if (account === null) { return; @@ -188,10 +183,13 @@ export const AccountSetting = ({ useEffect(() => { session.revalidate(); }, [session]); - const account = useEnsureLiveData(session.account$); + const account = useLiveData(session.account$); const openSignOutModal = useSignOut(); const onChangeEmail = useCallback(() => { + if (!account) { + return; + } globalDialogService.open('verify-email', { server: serverService.server.baseUrl, changeEmail: !!account.info?.emailVerified, @@ -204,6 +202,10 @@ export const AccountSetting = ({ }); }, [globalDialogService, serverService.server.baseUrl]); + if (!account) { + return null; + } + return ( <> { @@ -54,6 +50,10 @@ export const MemberList = ({ [membersService] ); + if (!account) { + return null; + } + return (
{pageMembers === undefined ? ( diff --git a/packages/frontend/core/src/mobile/dialogs/setting/user-profile/index.tsx b/packages/frontend/core/src/mobile/dialogs/setting/user-profile/index.tsx index 3a6337c3e5..579a32b93a 100644 --- a/packages/frontend/core/src/mobile/dialogs/setting/user-profile/index.tsx +++ b/packages/frontend/core/src/mobile/dialogs/setting/user-profile/index.tsx @@ -3,11 +3,7 @@ import { useSignOut } from '@affine/core/components/hooks/affine/use-sign-out'; import { AuthService } from '@affine/core/modules/cloud'; import { GlobalDialogService } from '@affine/core/modules/dialogs'; import { ArrowRightSmallIcon } from '@blocksuite/icons/rc'; -import { - useEnsureLiveData, - useLiveData, - useService, -} from '@toeverything/infra'; +import { useLiveData, useService } from '@toeverything/infra'; import { type ReactNode } from 'react'; import { UserPlanTag } from '../../../components'; @@ -52,7 +48,7 @@ const BaseLayout = ({ const AuthorizedUserProfile = () => { const session = useService(AuthService).session; - const account = useEnsureLiveData(session.account$); + const account = useLiveData(session.account$); const confirmSignOut = useSignOut(); return ( @@ -61,14 +57,14 @@ const AuthorizedUserProfile = () => { } - caption={{account.email}} + caption={{account?.email}} title={
- {account.label} + {account?.label}
}