diff --git a/packages/frontend/component/src/components/member-components/join-failed-page.tsx b/packages/frontend/component/src/components/member-components/join-failed-page.tsx
index 7469262d80..f9ff41fb11 100644
--- a/packages/frontend/component/src/components/member-components/join-failed-page.tsx
+++ b/packages/frontend/component/src/components/member-components/join-failed-page.tsx
@@ -10,7 +10,7 @@ export const JoinFailedPage = ({
   inviteInfo,
   error,
 }: {
-  inviteInfo: GetInviteInfoQuery['getInviteInfo'];
+  inviteInfo?: GetInviteInfoQuery['getInviteInfo'];
   error?: any;
 }) => {
   const userFriendlyError = UserFriendlyError.fromAny(error);
@@ -27,8 +27,8 @@ export const JoinFailedPage = ({
                 1: (
                   <div className={styles.avatarWrapper}>
                     <Avatar
-                      url={`data:image/png;base64,${inviteInfo.workspace.avatar}`}
-                      name={inviteInfo.workspace.name}
+                      url={`data:image/png;base64,${inviteInfo?.workspace.avatar}`}
+                      name={inviteInfo?.workspace.name}
                       size={20}
                       colorfulFallback
                     />
@@ -37,7 +37,7 @@ export const JoinFailedPage = ({
                 2: <span className={styles.inviteName} />,
               }}
               values={{
-                workspaceName: inviteInfo.workspace.name,
+                workspaceName: inviteInfo?.workspace.name,
               }}
             />
             <div>{t['com.affine.fail-to-join-workspace.description-2']()}</div>
diff --git a/packages/frontend/component/src/components/member-components/request-to-join-page.tsx b/packages/frontend/component/src/components/member-components/request-to-join-page.tsx
index 354bbf928c..80ae649f26 100644
--- a/packages/frontend/component/src/components/member-components/request-to-join-page.tsx
+++ b/packages/frontend/component/src/components/member-components/request-to-join-page.tsx
@@ -16,7 +16,7 @@ export const RequestToJoinPage = ({
   onSignOut,
 }: {
   user: User | null;
-  inviteInfo: GetInviteInfoQuery['getInviteInfo'];
+  inviteInfo?: GetInviteInfoQuery['getInviteInfo'];
   requestToJoin: () => void;
   onSignOut: () => void;
 }) => {
@@ -28,23 +28,23 @@ export const RequestToJoinPage = ({
         <div className={styles.content}>
           <div className={styles.userWrapper}>
             <Avatar
-              url={inviteInfo.user.avatarUrl || ''}
-              name={inviteInfo.user.name}
+              url={inviteInfo?.user.avatarUrl || ''}
+              name={inviteInfo?.user.name}
               size={20}
             />
-            <span className={styles.inviteName}>{inviteInfo.user.name}</span>
+            <span className={styles.inviteName}>{inviteInfo?.user.name}</span>
           </div>
           <div>{t['invited you to join']()}</div>
           <div className={styles.userWrapper}>
             <Avatar
-              url={`data:image/png;base64,${inviteInfo.workspace.avatar}`}
-              name={inviteInfo.workspace.name}
+              url={`data:image/png;base64,${inviteInfo?.workspace.avatar}`}
+              name={inviteInfo?.workspace.name}
               size={20}
               style={{ marginLeft: 4 }}
               colorfulFallback
             />
             <span className={styles.inviteName}>
-              {inviteInfo.workspace.name}
+              {inviteInfo?.workspace.name}
             </span>
           </div>
         </div>
diff --git a/packages/frontend/core/src/desktop/pages/invite/index.tsx b/packages/frontend/core/src/desktop/pages/invite/index.tsx
index aaff12be12..ad1a9382e4 100644
--- a/packages/frontend/core/src/desktop/pages/invite/index.tsx
+++ b/packages/frontend/core/src/desktop/pages/invite/index.tsx
@@ -2,7 +2,6 @@ import { notify } from '@affine/component';
 import {
   AcceptInvitePage,
   ExpiredPage,
-  FailedToSendPage,
   JoinFailedPage,
   RequestToJoinPage,
   SentRequestPage,
@@ -35,6 +34,7 @@ const AcceptInvite = ({ inviteId: targetInviteId }: { inviteId: string }) => {
   const workspaces = useLiveData(workspacesService.list.workspaces$);
   const navigateHelper = useNavigateHelper();
   const [accepted, setAccepted] = useState(false);
+  const [requestToJoinLoading, setRequestToJoinLoading] = useState(false);
   const [acceptError, setAcceptError] = useState<UserFriendlyError | null>(
     null
   );
@@ -63,6 +63,7 @@ const AcceptInvite = ({ inviteId: targetInviteId }: { inviteId: string }) => {
   }, [accepted, inviteInfo?.workspace.id, openWorkspace, workspaces]);
 
   const requestToJoin = useAsyncCallback(async () => {
+    setRequestToJoinLoading(true);
     await invitationService
       .acceptInvite(targetInviteId)
       .then(() => {
@@ -77,17 +78,18 @@ const AcceptInvite = ({ inviteId: targetInviteId }: { inviteId: string }) => {
         setAcceptError(err);
         notify.error(err);
       });
+    setRequestToJoinLoading(false);
   }, [invitationService, openWorkspace, targetInviteId]);
 
   const onSignOut = useAsyncCallback(async () => {
     await authService.signOut();
   }, [authService]);
 
-  if (loading || inviteId !== targetInviteId) {
+  if ((loading && !requestToJoinLoading) || inviteId !== targetInviteId) {
     return null;
   }
 
-  if (!inviteInfo) {
+  if (!inviteInfo && !loading) {
     return <ExpiredPage onOpenAffine={onOpenAffine} />;
   }
 
@@ -98,7 +100,7 @@ const AcceptInvite = ({ inviteId: targetInviteId }: { inviteId: string }) => {
   }
 
   // for email invite
-  if (accepted && inviteInfo.status === WorkspaceMemberStatus.Accepted) {
+  if (accepted && inviteInfo?.status === WorkspaceMemberStatus.Accepted) {
     return (
       <AcceptInvitePage
         onOpenWorkspace={openWorkspace}
@@ -107,15 +109,12 @@ const AcceptInvite = ({ inviteId: targetInviteId }: { inviteId: string }) => {
     );
   }
 
-  if (inviteInfo.status === WorkspaceMemberStatus.UnderReview) {
-    return <SentRequestPage user={user} inviteInfo={inviteInfo} />;
-  }
-
   if (
-    inviteInfo.status === WorkspaceMemberStatus.NeedMoreSeatAndReview ||
-    inviteInfo.status === WorkspaceMemberStatus.NeedMoreSeat
+    inviteInfo?.status === WorkspaceMemberStatus.UnderReview ||
+    inviteInfo?.status === WorkspaceMemberStatus.NeedMoreSeatAndReview ||
+    inviteInfo?.status === WorkspaceMemberStatus.NeedMoreSeat
   ) {
-    return <FailedToSendPage user={user} inviteInfo={inviteInfo} />;
+    return <SentRequestPage user={user} inviteInfo={inviteInfo} />;
   }
 
   return (