diff --git a/packages/app/src/components/workspace-modal/WorkspaceCard.tsx b/packages/app/src/components/workspace-modal/WorkspaceCard.tsx
index fd6a12f7f..7c062d357 100644
--- a/packages/app/src/components/workspace-modal/WorkspaceCard.tsx
+++ b/packages/app/src/components/workspace-modal/WorkspaceCard.tsx
@@ -12,6 +12,33 @@ import { StyleWorkspaceInfo, StyleWorkspaceTitle, StyledCard } from './styles';
 import { useTranslation } from '@affine/i18n';
 import { FlexWrapper } from '@/ui/layout';
 
+const WorkspaceType = ({ workspaceData }: { workspaceData: WorkspaceUnit }) => {
+  const { user } = useAppState();
+  const { t } = useTranslation();
+  const isOwner = user?.id === workspaceData.owner?.id;
+
+  if (workspaceData.provider === 'local') {
+    return (
+      <p>
+        <LocalIcon />
+        {t('Local Workspace')}
+      </p>
+    );
+  }
+
+  return isOwner ? (
+    <p>
+      <CloudIcon />
+      {t('Cloud Workspace')}
+    </p>
+  ) : (
+    <p>
+      <UsersIcon fontSize={20} color={'#FF646B'} />
+      {t('Joined Workspace')}
+    </p>
+  );
+};
+
 export const WorkspaceCard = ({
   workspaceData,
   onClick,
@@ -19,8 +46,9 @@ export const WorkspaceCard = ({
   workspaceData: WorkspaceUnit;
   onClick: (data: WorkspaceUnit) => void;
 }) => {
-  const { currentWorkspace, isOwner } = useAppState();
+  const { currentWorkspace, user } = useAppState();
   const { t } = useTranslation();
+  const isOwner = user?.id === workspaceData.owner?.id;
   return (
     <StyledCard
       data-testid="workspace-card"
@@ -37,24 +65,7 @@ export const WorkspaceCard = ({
         <StyleWorkspaceTitle>
           {workspaceData.name || 'AFFiNE'}
         </StyleWorkspaceTitle>
-        {isOwner ? (
-          workspaceData.provider === 'local' ? (
-            <p>
-              <LocalIcon />
-              {t('Local Workspace')}
-            </p>
-          ) : (
-            <p>
-              <CloudIcon />
-              {t('Cloud Workspace')}
-            </p>
-          )
-        ) : (
-          <p>
-            <UsersIcon fontSize={20} color={'#FF646B'} />
-            {t('Joined Workspace')}
-          </p>
-        )}
+        <WorkspaceType workspaceData={workspaceData} />
         {workspaceData.provider === 'local' && (
           <p>
             <OfflineIcon />