add viewers and collabs in participants List
This commit is contained in:
parent
26c3198111
commit
b67c2b399e
|
@ -9,24 +9,18 @@ import { EnteMenuItem } from 'components/Menu/EnteMenuItem';
|
|||
// import AvatarCollectionShare from '../AvatarCollectionShare';
|
||||
// import ChevronRightIcon from '@mui/icons-material/ChevronRight';
|
||||
import MenuItemDivider from 'components/Menu/MenuItemDivider';
|
||||
import ManageAddCollab from './MangeAddCollab';
|
||||
|
||||
interface Iprops {
|
||||
collection: Collection;
|
||||
onRootClose: () => void;
|
||||
}
|
||||
|
||||
export function CollaboratorParticipants({ collection }: Iprops) {
|
||||
export function CollaboratorParticipants({ collection, onRootClose }: Iprops) {
|
||||
if (!collection.sharees?.length) {
|
||||
return <></>;
|
||||
}
|
||||
|
||||
const shareExpireOption = [
|
||||
'Never',
|
||||
'1 day',
|
||||
'1 week',
|
||||
'1 month',
|
||||
'1 year',
|
||||
'Custom',
|
||||
];
|
||||
const [collaborators, setCollaborators] = useState([]);
|
||||
|
||||
useEffect(() => {
|
||||
|
@ -51,11 +45,15 @@ export function CollaboratorParticipants({ collection }: Iprops) {
|
|||
onClick={() => console.log('clicked')}
|
||||
label={item}
|
||||
/>
|
||||
{index !== shareExpireOption.length - 1 && (
|
||||
{index !== collaborators.length - 1 && (
|
||||
<MenuItemDivider />
|
||||
)}
|
||||
</>
|
||||
))}
|
||||
<ManageAddCollab
|
||||
collection={collection}
|
||||
onRootClose={onRootClose}
|
||||
/>
|
||||
</MenuItemGroup>
|
||||
</Box>
|
||||
);
|
||||
|
|
|
@ -9,9 +9,10 @@ import { CollaboratorParticipants } from './CollaboratorParticipants';
|
|||
|
||||
interface Iprops {
|
||||
collection: Collection;
|
||||
onRootClose: () => void;
|
||||
}
|
||||
|
||||
export function ManageParticipantsList({ collection }: Iprops) {
|
||||
export function ManageParticipantsList({ collection, onRootClose }: Iprops) {
|
||||
if (!collection.sharees?.length) {
|
||||
return <></>;
|
||||
}
|
||||
|
@ -20,8 +21,11 @@ export function ManageParticipantsList({ collection }: Iprops) {
|
|||
<Box mb={3}>
|
||||
<OwnerParticipant collection={collection}></OwnerParticipant>
|
||||
<CollaboratorParticipants
|
||||
collection={collection}></CollaboratorParticipants>
|
||||
<ViewerParticipants collection={collection}></ViewerParticipants>
|
||||
collection={collection}
|
||||
onRootClose={onRootClose}></CollaboratorParticipants>
|
||||
<ViewerParticipants
|
||||
collection={collection}
|
||||
onRootClose={onRootClose}></ViewerParticipants>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
|
|
@ -28,7 +28,7 @@ export default function ManageAddCollab({ collection, onRootClose }: Iprops) {
|
|||
<EnteMenuItem
|
||||
startIcon={<AddIcon />}
|
||||
onClick={openManageShare}
|
||||
label={t('Add Collaborator')}
|
||||
label={t('Add Collaborators')}
|
||||
/>
|
||||
</MenuItemGroup>
|
||||
</Stack>
|
||||
|
|
|
@ -7,12 +7,14 @@ import { EnteMenuItem } from 'components/Menu/EnteMenuItem';
|
|||
import MenuItemDivider from 'components/Menu/MenuItemDivider';
|
||||
import MenuSectionTitle from 'components/Menu/MenuSectionTitle';
|
||||
import AvatarCollectionShare from '../AvatarCollectionShare';
|
||||
import ManageAddViewer from './ManageAddViewer';
|
||||
|
||||
interface Iprops {
|
||||
collection: Collection;
|
||||
onRootClose: () => void;
|
||||
}
|
||||
|
||||
export function ViewerParticipants({ collection }: Iprops) {
|
||||
export function ViewerParticipants({ collection, onRootClose }: Iprops) {
|
||||
if (!collection.sharees?.length) {
|
||||
return <></>;
|
||||
}
|
||||
|
@ -30,18 +32,28 @@ export function ViewerParticipants({ collection }: Iprops) {
|
|||
<Box mb={3}>
|
||||
<MenuSectionTitle title={t('Viewers')} />
|
||||
<MenuItemGroup>
|
||||
{Viewers.map((item, index) => (
|
||||
<>
|
||||
<EnteMenuItem
|
||||
fontWeight="normal"
|
||||
key={item}
|
||||
onClick={() => console.log('clicked')}
|
||||
label={item}
|
||||
startIcon={<AvatarCollectionShare email={item} />}
|
||||
/>
|
||||
{index !== Viewers.length - 1 && <MenuItemDivider />}
|
||||
</>
|
||||
))}
|
||||
<>
|
||||
{Viewers.map((item, index) => (
|
||||
<>
|
||||
<EnteMenuItem
|
||||
fontWeight="normal"
|
||||
key={item}
|
||||
onClick={() => console.log('clicked')}
|
||||
label={item}
|
||||
startIcon={
|
||||
<AvatarCollectionShare email={item} />
|
||||
}
|
||||
/>
|
||||
{index !== Viewers.length - 1 && (
|
||||
<MenuItemDivider />
|
||||
)}
|
||||
</>
|
||||
))}
|
||||
<ManageAddViewer
|
||||
collection={collection}
|
||||
onRootClose={onRootClose}
|
||||
/>
|
||||
</>
|
||||
</MenuItemGroup>
|
||||
</Box>
|
||||
);
|
||||
|
|
Loading…
Reference in a new issue