Merge pull request #891 from ente-io/album-header-change
Album header change
This commit is contained in:
commit
cbee1c442b
|
@ -0,0 +1,26 @@
|
|||
import { OverflowMenuOption } from 'components/OverflowMenu/option';
|
||||
import React from 'react';
|
||||
|
||||
import FileDownloadOutlinedIcon from '@mui/icons-material/FileDownloadOutlined';
|
||||
import constants from 'utils/strings/constants';
|
||||
import { CollectionActions } from '.';
|
||||
|
||||
interface Iprops {
|
||||
handleCollectionAction: (
|
||||
action: CollectionActions,
|
||||
loader?: boolean
|
||||
) => (...args: any[]) => Promise<void>;
|
||||
}
|
||||
|
||||
export function FavoritiesCollectionOption({ handleCollectionAction }: Iprops) {
|
||||
return (
|
||||
<OverflowMenuOption
|
||||
startIcon={<FileDownloadOutlinedIcon />}
|
||||
onClick={handleCollectionAction(
|
||||
CollectionActions.CONFIRM_DOWNLOAD,
|
||||
false
|
||||
)}>
|
||||
{constants.DOWNLOAD_COLLECTION}
|
||||
</OverflowMenuOption>
|
||||
);
|
||||
}
|
|
@ -24,16 +24,17 @@ export function QuickOptions({
|
|||
<FlexWrapper sx={{ gap: '16px' }}>
|
||||
{!(
|
||||
collectionSummaryType === CollectionSummaryType.trash ||
|
||||
collectionSummaryType === CollectionSummaryType.favorites
|
||||
collectionSummaryType === CollectionSummaryType.favorites ||
|
||||
collectionSummaryType === CollectionSummaryType.incomingShare
|
||||
) && (
|
||||
<Tooltip
|
||||
title={
|
||||
/*: collectionSummaryType ===
|
||||
CollectionSummaryType.incomingShare
|
||||
? constants.SHARING_DETAILS*/
|
||||
collectionSummaryType ===
|
||||
CollectionSummaryType.outgoingShare
|
||||
? constants.MODIFY_SHARING
|
||||
: collectionSummaryType ===
|
||||
CollectionSummaryType.incomingShare
|
||||
? constants.SHARING_DETAILS
|
||||
: constants.SHARE_COLLECTION
|
||||
}>
|
||||
<IconButton>
|
||||
|
@ -69,7 +70,7 @@ export function QuickOptions({
|
|||
<IconButton>
|
||||
<DeleteOutlinedIcon
|
||||
onClick={handleCollectionAction(
|
||||
CollectionActions.CONFIRM_DELETE,
|
||||
CollectionActions.CONFIRM_EMPTY_TRASH,
|
||||
false
|
||||
)}
|
||||
/>
|
||||
|
|
|
@ -18,6 +18,7 @@ import OverflowMenu from 'components/OverflowMenu/menu';
|
|||
import { CollectionSummaryType } from 'constants/collection';
|
||||
import { TrashCollectionOption } from './TrashCollectionOption';
|
||||
import { SharedCollectionOption } from './SharedCollectionOption';
|
||||
import { FavoritiesCollectionOption } from './FavoritiesCollectionOption';
|
||||
import { QuickOptions } from './QuickOptions';
|
||||
import MoreHoriz from '@mui/icons-material/MoreHoriz';
|
||||
import { HorizontalFlex } from 'components/Container';
|
||||
|
@ -239,32 +240,36 @@ const CollectionOptions = (props: CollectionOptionsProps) => {
|
|||
handleCollectionAction={handleCollectionAction}
|
||||
collectionSummaryType={collectionSummaryType}
|
||||
/>
|
||||
{!(collectionSummaryType === CollectionSummaryType.favorites) && (
|
||||
<OverflowMenu
|
||||
ariaControls={'collection-options'}
|
||||
triggerButtonIcon={<MoreHoriz />}
|
||||
triggerButtonProps={{
|
||||
sx: {
|
||||
background: (theme) => theme.palette.fill.dark,
|
||||
},
|
||||
}}>
|
||||
{collectionSummaryType === CollectionSummaryType.trash ? (
|
||||
<TrashCollectionOption
|
||||
handleCollectionAction={handleCollectionAction}
|
||||
/>
|
||||
) : collectionSummaryType ===
|
||||
CollectionSummaryType.incomingShare ? (
|
||||
<SharedCollectionOption
|
||||
handleCollectionAction={handleCollectionAction}
|
||||
/>
|
||||
) : (
|
||||
<AlbumCollectionOption
|
||||
IsArchived={IsArchived(activeCollection)}
|
||||
handleCollectionAction={handleCollectionAction}
|
||||
/>
|
||||
)}
|
||||
</OverflowMenu>
|
||||
)}
|
||||
|
||||
<OverflowMenu
|
||||
ariaControls={'collection-options'}
|
||||
triggerButtonIcon={<MoreHoriz />}
|
||||
triggerButtonProps={{
|
||||
sx: {
|
||||
background: (theme) => theme.palette.fill.dark,
|
||||
},
|
||||
}}>
|
||||
{collectionSummaryType === CollectionSummaryType.trash ? (
|
||||
<TrashCollectionOption
|
||||
handleCollectionAction={handleCollectionAction}
|
||||
/>
|
||||
) : collectionSummaryType ===
|
||||
CollectionSummaryType.favorites ? (
|
||||
<FavoritiesCollectionOption
|
||||
handleCollectionAction={handleCollectionAction}
|
||||
/>
|
||||
) : collectionSummaryType ===
|
||||
CollectionSummaryType.incomingShare ? (
|
||||
<SharedCollectionOption
|
||||
handleCollectionAction={handleCollectionAction}
|
||||
/>
|
||||
) : (
|
||||
<AlbumCollectionOption
|
||||
IsArchived={IsArchived(activeCollection)}
|
||||
handleCollectionAction={handleCollectionAction}
|
||||
/>
|
||||
)}
|
||||
</OverflowMenu>
|
||||
</HorizontalFlex>
|
||||
);
|
||||
};
|
||||
|
|
|
@ -20,6 +20,7 @@ const StyledMenu = styled(Menu)`
|
|||
& .MuiList-root {
|
||||
padding: 0;
|
||||
border: none;
|
||||
width: 220px;
|
||||
}
|
||||
`;
|
||||
|
||||
|
|
|
@ -50,8 +50,8 @@ import { User } from 'types/user';
|
|||
import {
|
||||
getNonHiddenCollections,
|
||||
isQuickLinkCollection,
|
||||
isSharedByMe,
|
||||
isSharedWithMe,
|
||||
isOutgoingShare,
|
||||
isIncomingShare,
|
||||
isSharedOnlyViaLink,
|
||||
} from 'utils/collection';
|
||||
import ComlinkCryptoWorker from 'utils/comlink/ComlinkCryptoWorker';
|
||||
|
@ -827,9 +827,9 @@ export function getCollectionSummaries(
|
|||
latestFile: collectionLatestFiles.get(collection.id),
|
||||
fileCount: collectionFilesCount.get(collection.id),
|
||||
updationTime: collection.updationTime,
|
||||
type: isSharedWithMe(collection, user)
|
||||
type: isIncomingShare(collection, user)
|
||||
? CollectionSummaryType.incomingShare
|
||||
: isSharedByMe(collection)
|
||||
: isOutgoingShare(collection)
|
||||
? CollectionSummaryType.outgoingShare
|
||||
: isSharedOnlyViaLink(collection)
|
||||
? CollectionSummaryType.sharedOnlyViaLink
|
||||
|
|
|
@ -232,20 +232,7 @@ const darkThemeOptions = createTheme({
|
|||
MuiSvgIcon: {
|
||||
styleOverrides: {
|
||||
root: ({ ownerState }) => {
|
||||
switch (ownerState.color) {
|
||||
case 'primary':
|
||||
return {
|
||||
color: '#ffffff',
|
||||
};
|
||||
case 'secondary':
|
||||
return {
|
||||
color: 'rgba(255,255,255,0.24)',
|
||||
};
|
||||
case 'disabled':
|
||||
return {
|
||||
color: 'rgba(255, 255, 255, 0.16)',
|
||||
};
|
||||
}
|
||||
return { ...setColor(ownerState) };
|
||||
},
|
||||
},
|
||||
},
|
||||
|
@ -253,21 +240,7 @@ const darkThemeOptions = createTheme({
|
|||
MuiIconButton: {
|
||||
styleOverrides: {
|
||||
root: ({ ownerState }) => {
|
||||
switch (ownerState.color) {
|
||||
case 'primary':
|
||||
return {
|
||||
color: '#ffffff',
|
||||
};
|
||||
case 'secondary':
|
||||
return {
|
||||
color: 'rgba(255,255,255,0.24)',
|
||||
};
|
||||
}
|
||||
if (ownerState.disabled) {
|
||||
return {
|
||||
color: 'rgba(255, 255, 255, 0.16)',
|
||||
};
|
||||
}
|
||||
return { ...setColor(ownerState), padding: '12px' };
|
||||
},
|
||||
},
|
||||
},
|
||||
|
@ -403,3 +376,19 @@ const darkThemeOptions = createTheme({
|
|||
});
|
||||
|
||||
export default darkThemeOptions;
|
||||
function setColor(ownerState) {
|
||||
switch (ownerState.color) {
|
||||
case 'primary':
|
||||
return {
|
||||
color: '#ffffff',
|
||||
};
|
||||
case 'secondary':
|
||||
return {
|
||||
color: 'rgba(255,255,255,0.24)',
|
||||
};
|
||||
case 'disabled':
|
||||
return {
|
||||
color: 'rgba(255, 255, 255, 0.16)',
|
||||
};
|
||||
}
|
||||
}
|
||||
|
|
|
@ -242,10 +242,10 @@ export const isCollectionHidden = (collection: Collection) =>
|
|||
export const isQuickLinkCollection = (collection: Collection) =>
|
||||
collection.magicMetadata?.data.subType === SUB_TYPE.QUICK_LINK_COLLECTION;
|
||||
|
||||
export function isSharedByMe(collection: Collection): boolean {
|
||||
export function isOutgoingShare(collection: Collection): boolean {
|
||||
return collection.sharees?.length > 0;
|
||||
}
|
||||
export function isSharedWithMe(collection: Collection, user: User) {
|
||||
export function isIncomingShare(collection: Collection, user: User) {
|
||||
return collection.owner.id !== user.id;
|
||||
}
|
||||
export function isSharedOnlyViaLink(collection: Collection) {
|
||||
|
|
Loading…
Reference in a new issue