feat: mock login

packages/app/src/components/workspace-setting/MembersPage.tsx

@@ -15,24 +15,21 @@ import { MoreVerticalIcon, EmailIcon, TrashIcon } from '@blocksuite/icons';
 import { useEffect, useState } from 'react';
 import { Button, IconButton } from '@/ui/button';
 import { InviteMembers } from '../invite-members/index';
-// import { Member, getDataCenter } from '@affine/datacenter';
-// import { Avatar } from '@mui/material';
 import { Menu, MenuItem } from '@/ui/menu';
 import { Empty } from '@/ui/empty';
 import {
   deleteMember,
   getMembers,
-  getUserInfo,
-  Login,
   User,
   Workspace,
 } from '@/hooks/mock-data/mock';
+import useTemporaryHelper from '@/hooks/use-temporary-helper';
 
 // import { useAppState } from '@/providers/app-state-provider';
 export const MembersPage = ({ workspace }: { workspace: Workspace }) => {
   const [isInviteModalShow, setIsInviteModalShow] = useState(false);
   const [members, setMembers] = useState<User[]>([]);
-  const [userInfo, setUserInfo] = useState<User>();
+  const { user, login } = useTemporaryHelper();
   // const refreshMembers = useCallback(() => {
   //   getDataCenter()
   //     .then(dc =>
@@ -49,15 +46,10 @@ export const MembersPage = ({ workspace }: { workspace: Workspace }) => {
   // }, [workspace.id]);
 
   useEffect(() => {
-    setUser();
     setMembersList();
     // refreshMembers();
   }, []);
 
-  const setUser = () => {
-    const user = getUserInfo();
-    user && setUserInfo(user);
-  };
   const setMembersList = () => {
     const members = getMembers(workspace.id);
     members && setMembers(members);
@@ -65,7 +57,7 @@ export const MembersPage = ({ workspace }: { workspace: Workspace }) => {
 
   return (
     <div>
-      {userInfo ? (
+      {user ? (
         <>
           <StyledMemberTitleContainer>
             <StyledMemberNameContainer>
@@ -184,8 +176,7 @@ export const MembersPage = ({ workspace }: { workspace: Workspace }) => {
           <div>
             <Button
               onClick={() => {
-                Login();
-                setUser();
+                login();
               }}
             >
               Enable AFFiNE Cloud

packages/app/src/components/workspace-setting/SyncPage.tsx

@@ -9,24 +9,18 @@ import { Button } from '@/ui/button';
 import { Menu, MenuItem } from '@/ui/menu';
 import {
   deleteMember,
-  getActiveWorkspace,
   updateWorkspaceMeta,
   Workspace,
 } from '@/hooks/mock-data/mock';
+import useTemporaryHelper from '@/hooks/use-temporary-helper';
 
 export const SyncPage = ({ workspace }: { workspace: Workspace }) => {
-  const [workspaceType, setWorkspaceType] = useState('local');
-  useEffect(() => {
-    setType();
-  });
-  const setType = () => {
-    const ACTIVEworkspace = getActiveWorkspace();
-    ACTIVEworkspace && setWorkspaceType(ACTIVEworkspace.type);
-  };
+  const { currentWorkspace, updateWorkspaceMeta } = useTemporaryHelper();
+
   return (
     <div>
       <StyledPublishContent>
-        {workspaceType === 'local' ? (
+        {currentWorkspace.type === 'local' ? (
           <>
             <StyledPublishExplanation>
               {workspace.name} is Local Workspace. All data is stored on the
@@ -40,7 +34,6 @@ export const SyncPage = ({ workspace }: { workspace: Workspace }) => {
                   updateWorkspaceMeta(workspace.id, {
                     type: 'cloud',
                   });
-                  setType();
                 }}
                 type="primary"
                 shape="circle"

packages/app/src/components/workspace-setting/general/general.tsx

@@ -6,7 +6,7 @@ import {
 } from './style';
 import { StyledSettingH2 } from '../style';
 
-import { useEffect, useState } from 'react';
+import { useState } from 'react';
 import { Button, TextButton } from '@/ui/button';
 import Input from '@/ui/input';
 import { getDataCenter } from '@affine/datacenter';
@@ -15,22 +15,13 @@ import { WorkspaceDelete } from './delete';
 import { debounce } from '@/utils';
 import { WorkspaceLeave } from './leave';
 import { Upload } from '@/components/file-upload';
-import {
-  getUserInfo,
-  updateWorkspaceMeta,
-  User,
-  Workspace,
-} from '@/hooks/mock-data/mock';
+import { updateWorkspaceMeta, Workspace } from '@/hooks/mock-data/mock';
 import { WorkspaceAvatar } from '@/components/workspace-avatar';
+import useTemporaryHelper from '@/hooks/use-temporary-helper';
 export const GeneralPage = ({ workspace }: { workspace: Workspace }) => {
-  const { currentWorkspace, refreshWorkspacesMeta } = useAppState();
-  useEffect(() => {
-    setWorkspaceName(workspace.name);
-    const user = getUserInfo();
-    setUserInfo(user);
-  }, []);
+  const { refreshWorkspacesMeta } = useAppState();
+  const { currentWorkspace } = useTemporaryHelper();
   const [showDelete, setShowDelete] = useState<boolean>(false);
-  const [userInfo, setUserInfo] = useState<User>();
   const [showLeave, setShowLeave] = useState<boolean>(false);
   const [uploading, setUploading] = useState<boolean>(false);
   const [workspaceName, setWorkspaceName] = useState<string>('');
@@ -61,18 +52,18 @@ export const GeneralPage = ({ workspace }: { workspace: Workspace }) => {
 
   const fileChange = async (file: File) => {
     setUploading(true);
-    const blob = new Blob([file], { type: file.type });
-    const blobId = await getDataCenter()
-      .then(dc => dc.apis.uploadBlob({ blob }))
-      .finally(() => {
-        setUploading(false);
-      });
-    if (blobId) {
-      currentWorkspace?.meta.setAvatar(blobId);
-      // workspaces[workspace.id]?.meta.setAvatar(blobId);
-      setUploading(false);
-      debouncedRefreshWorkspacesMeta();
-    }
+    // const blob = new Blob([file], { type: file.type });
+    // const blobId = await getDataCenter()
+    //   .then(dc => dc.apis.uploadBlob({ blob }))
+    //   .finally(() => {
+    //     setUploading(false);
+    //   });
+    // if (blobId) {
+    //   currentWorkspace?.meta.setAvatar(blobId);
+    //   // workspaces[workspace.id]?.meta.setAvatar(blobId);
+    //   setUploading(false);
+    //   debouncedRefreshWorkspacesMeta();
+    // }
   };
 
   return workspace ? (

packages/app/src/components/workspace-setting/workspace-setting.tsx

@@ -17,9 +17,10 @@ import {
 import { useEffect, useState } from 'react';
 import { GeneralPage } from './general';
 import { getActiveWorkspace } from '@/hooks/mock-data/mock';
-import MembersPage from './MembersPage';
-import PublishPage from './PublishPage';
-import SyncPage from './SyncPage';
+import { MembersPage } from './MembersPage';
+import { PublishPage } from './PublishPage';
+import { SyncPage } from './SyncPage';
+import useTemporaryHelper from '@/hooks/use-temporary-helper';
 
 enum ActiveTab {
   'general' = 'general',
@@ -114,7 +115,7 @@ export const WorkspaceSetting = ({
     setActiveTab(tab);
   };
 
-  const workspace = getActiveWorkspace();
+  const { currentWorkspace } = useTemporaryHelper();
   const handleClickClose = () => {
     onClose && onClose();
   };
@@ -142,14 +143,16 @@ export const WorkspaceSetting = ({
         ) : null}
         <StyledSettingContent>
           {activeTab === ActiveTab.general && (
-            <GeneralPage workspace={workspace} />
+            <GeneralPage workspace={currentWorkspace} />
           )}
-          {activeTab === ActiveTab.sync && <SyncPage workspace={workspace} />}
-          {activeTab === ActiveTab.members && workspace && (
-            <MembersPage workspace={workspace} />
+          {activeTab === ActiveTab.sync && (
+            <SyncPage workspace={currentWorkspace} />
+          )}
+          {activeTab === ActiveTab.members && currentWorkspace && (
+            <MembersPage workspace={currentWorkspace} />
           )}
           {activeTab === ActiveTab.publish && (
-            <PublishPage workspace={workspace} />
+            <PublishPage workspace={currentWorkspace} />
           )}
         </StyledSettingContent>
       </StyledSettingContainer>