luulam/AFFiNE
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

fix:member init

Browse Source
This commit is contained in:
DiamondThree
2023-01-05 19:30:16 +08:00
parent c6d6a09abf
commit e3c1e6a5da
1 changed files with 140 additions and 107 deletions
Download Patch File Download Diff File Expand all files Collapse all files

247
packages/app/src/components/workspace-setting/workspace-setting.tsx
View File

@@ -46,6 +46,7 @@ import { GeneralPage } from './general';
import { import {
getActiveWorkspace, getActiveWorkspace,
getUserInfo, getUserInfo,
Login,
setWorkspacePublish, setWorkspacePublish,
User, User,
Workspace, Workspace,
@@ -179,119 +180,151 @@ const MembersPage = ({ workspace }: { workspace: Workspace }) => {
// }, [workspace.id]); // }, [workspace.id]);
useEffect(() => { useEffect(() => {
const user = getUserInfo(); setUser();
user && setUserInfo(user);
// refreshMembers(); // refreshMembers();
}, []); }, []);
const setUser = () => {
const user = getUserInfo();
user && setUserInfo(user);
};
return ( return (
<div> <div>
<StyledMemberTitleContainer> {userInfo ? (
<StyledMemberNameContainer> <>
Users({members.length}) <StyledMemberTitleContainer>
</StyledMemberNameContainer> <StyledMemberNameContainer>
<StyledMemberRoleContainer>Access level</StyledMemberRoleContainer> Users({members.length})
</StyledMemberTitleContainer> </StyledMemberNameContainer>
<StyledMemberListContainer> <StyledMemberRoleContainer>Access level</StyledMemberRoleContainer>
{members.length === 0 && ( </StyledMemberTitleContainer>
<Empty width={648} sx={{ marginTop: '60px' }} height={300}></Empty> <StyledMemberListContainer>
)} {members.length === 0 && (
{members.length ? ( <Empty
members.map(member => { width={648}
return ( sx={{ marginTop: '60px' }}
<StyledMemberListItem key={member.id}> height={300}
<StyledMemberNameContainer> ></Empty>
{member.user.type === 'Registered' ? ( )}
<Avatar src={member.user.avatar_url}></Avatar> {members.length ? (
) : ( members.map(member => {
<StyledMemberAvatar alt="member avatar"> return (
<EmailIcon></EmailIcon> <StyledMemberListItem key={member.id}>
</StyledMemberAvatar> <StyledMemberNameContainer>
)} {member.user.type === 'Registered' ? (
<Avatar src={member.user.avatar_url}></Avatar>
) : (
<StyledMemberAvatar alt="member avatar">
<EmailIcon></EmailIcon>
</StyledMemberAvatar>
)}
<StyledMemberInfo> <StyledMemberInfo>
{member.user.type === 'Registered' ? ( {member.user.type === 'Registered' ? (
<StyledMemberName>{member.user.name}</StyledMemberName> <StyledMemberName>
) : ( {member.user.name}
<></> </StyledMemberName>
)} ) : (
<StyledMemberEmail>{member.user.email}</StyledMemberEmail> <></>
</StyledMemberInfo> )}
</StyledMemberNameContainer> <StyledMemberEmail>
<StyledMemberRoleContainer> {member.user.email}
{member.accepted </StyledMemberEmail>
? member.type !== 99 </StyledMemberInfo>
? 'Member' </StyledMemberNameContainer>
: 'Workspace Owner' <StyledMemberRoleContainer>
: 'Pending'} {member.accepted
</StyledMemberRoleContainer> ? member.type !== 99
<StyledMoreVerticalButton> ? 'Member'
<Menu : 'Workspace Owner'
content={ : 'Pending'}
<> </StyledMemberRoleContainer>
<MenuItem <StyledMoreVerticalButton>
onClick={() => { <Menu
// confirm({ content={
// title: 'Delete Member?', <>
// content: `will delete member`, <MenuItem
// confirmText: 'Delete', onClick={() => {
// confirmType: 'danger', // confirm({
// }).then(confirm => { // title: 'Delete Member?',
getDataCenter() // content: `will delete member`,
.then(dc => // confirmText: 'Delete',
dc.apis.removeMember({ // confirmType: 'danger',
permissionId: member.id, // }).then(confirm => {
}) getDataCenter()
) .then(dc =>
.then(() => { dc.apis.removeMember({
// console.log('data: ', data); permissionId: member.id,
toast('Moved to Trash'); })
// refreshMembers(); )
}); .then(() => {
// }); // console.log('data: ', data);
}} toast('Moved to Trash');
icon={<TrashIcon />} // refreshMembers();
> });
Delete // });
</MenuItem> }}
</> icon={<TrashIcon />}
} >
placement="bottom-end" Delete
disablePortal={true} </MenuItem>
> </>
<IconButton> }
<MoreVerticalIcon /> placement="bottom-end"
</IconButton> disablePortal={true}
</Menu> >
</StyledMoreVerticalButton> <IconButton>
</StyledMemberListItem> <MoreVerticalIcon />
); </IconButton>
}) </Menu>
) : ( </StyledMoreVerticalButton>
<></> </StyledMemberListItem>
)} );
</StyledMemberListContainer> })
<StyledMemberButtonContainer> ) : (
<Button <></>
onClick={() => { )}
setIsInviteModalShow(true); </StyledMemberListContainer>
}} <StyledMemberButtonContainer>
type="primary" <Button
shape="circle" onClick={() => {
> setIsInviteModalShow(true);
Invite Members }}
</Button> type="primary"
<InviteMembers shape="circle"
onClose={() => { >
setIsInviteModalShow(false); Invite Members
}} </Button>
onInviteSuccess={() => { <InviteMembers
// refreshMembers(); onClose={() => {
}} setIsInviteModalShow(false);
workspaceId={workspace.id} }}
open={isInviteModalShow} onInviteSuccess={() => {
></InviteMembers> // refreshMembers();
</StyledMemberButtonContainer> }}
workspaceId={workspace.id}
open={isInviteModalShow}
></InviteMembers>
</StyledMemberButtonContainer>
</>
) : (
<>
<div>
Collaborating with other members requires AFFiNE Cloud service.
</div>
<div>
<Button
onClick={() => {
Login();
setUser();
}}
>
Enable AFFiNE Cloud
</Button>
</div>
</>
)}
</div> </div>
); );
}; };