Merge pull request #271 from ente-io/master

release

src/components/pages/gallery/CollectionOptions.tsx

@@ -6,18 +6,20 @@ import {
     deleteCollection,
     renameCollection,
 } from 'services/collectionService';
-import { getSelectedCollection } from 'utils/collection';
+import { downloadCollection, getSelectedCollection } from 'utils/collection';
 import constants from 'utils/strings/constants';
 import { SetCollectionNamerAttributes } from './CollectionNamer';
 import LinkButton, { ButtonVariant, LinkButtonProps } from './LinkButton';
+import { sleep } from 'utils/common';
 
-interface Props {
+interface CollectionOptionsProps {
     syncWithRemote: () => Promise<void>;
     setCollectionNamerAttributes: SetCollectionNamerAttributes;
     collections: Collection[];
     selectedCollectionID: number;
     setDialogMessage: SetDialogMessage;
-    startLoadingBar: () => void;
+    startLoading: () => void;
+    finishLoading: () => void;
     showCollectionShareModal: () => void;
     redirectToAll: () => void;
 }
@@ -43,7 +45,7 @@ export const MenuItem = (props: { children: any }) => (
     </ListGroup.Item>
 );
 
-const CollectionOptions = (props: Props) => {
+const CollectionOptions = (props: CollectionOptionsProps) => {
     const collectionRename = async (
         selectedCollection: Collection,
         newName: string
@@ -62,7 +64,7 @@ const CollectionOptions = (props: Props) => {
                 props.collections
             )?.name,
             callback: (newName) => {
-                props.startLoadingBar();
+                props.startLoading();
                 collectionRename(
                     getSelectedCollection(
                         props.selectedCollectionID,
@@ -81,7 +83,7 @@ const CollectionOptions = (props: Props) => {
             proceed: {
                 text: constants.DELETE_COLLECTION,
                 action: () => {
-                    props.startLoadingBar();
+                    props.startLoading();
                     deleteCollection(
                         props.selectedCollectionID,
                         props.syncWithRemote,
@@ -97,6 +99,32 @@ const CollectionOptions = (props: Props) => {
         });
     };
 
+    const confirmDownloadCollection = () => {
+        props.setDialogMessage({
+            title: constants.CONFIRM_DOWNLOAD_COLLECTION,
+            content: constants.DOWNLOAD_COLLECTION_MESSAGE(),
+            staticBackdrop: true,
+            proceed: {
+                text: constants.DOWNLOAD,
+                action: downloadCollectionHelper,
+                variant: 'success',
+            },
+            close: {
+                text: constants.CANCEL,
+            },
+        });
+    };
+
+    const downloadCollectionHelper = async () => {
+        props.startLoading();
+        await downloadCollection(
+            props.selectedCollectionID,
+            props.setDialogMessage
+        );
+        await sleep(1000);
+        props.finishLoading();
+    };
+
     return (
         <Popover id="collection-options" style={{ borderRadius: '10px' }}>
             <Popover.Content style={{ padding: 0, border: 'none' }}>
@@ -111,6 +139,11 @@ const CollectionOptions = (props: Props) => {
                             {constants.SHARE}
                         </MenuLink>
                     </MenuItem>
+                    <MenuItem>
+                        <MenuLink onClick={confirmDownloadCollection}>
+                            {constants.DOWNLOAD}
+                        </MenuLink>
+                    </MenuItem>
                     <MenuItem>
                         <MenuLink
                             variant={ButtonVariant.danger}

src/components/pages/gallery/Collections.tsx

@@ -35,7 +35,8 @@ interface CollectionProps {
     setDialogMessage: SetDialogMessage;
     syncWithRemote: () => Promise<void>;
     setCollectionNamerAttributes: SetCollectionNamerAttributes;
-    startLoadingBar: () => void;
+    startLoading: () => void;
+    finishLoading: () => void;
     isInSearchMode: boolean;
     collectionFilesCount: Map<number, number>;
 }
@@ -169,7 +170,8 @@ export default function Collections(props: CollectionProps) {
         collections: props.collections,
         selectedCollectionID,
         setDialogMessage: props.setDialogMessage,
-        startLoadingBar: props.startLoadingBar,
+        startLoading: props.startLoading,
+        finishLoading: props.finishLoading,
         showCollectionShareModal: setCollectionShareModalView.bind(null, true),
         redirectToAll: setActiveCollection.bind(null, ALL_SECTION),
     });

src/pages/gallery/index.tsx

@@ -362,12 +362,17 @@ export default function Gallery() {
         setSelected({ count: 0, collectionID: 0 });
     };
 
+    const startLoading = () =>
+        !syncInProgress.current && loadingBar.current?.continuousStart();
+    const finishLoading = () =>
+        !syncInProgress.current && loadingBar.current.complete();
+
     if (!files) {
         return <div />;
     }
     const collectionOpsHelper =
         (ops: COLLECTION_OPS_TYPE) => async (collection: Collection) => {
-            loadingBar.current?.continuousStart();
+            startLoading();
             try {
                 await handleCollectionOps(
                     ops,
@@ -388,14 +393,14 @@ export default function Gallery() {
                 });
             } finally {
                 await syncWithRemote(false, true);
-                loadingBar.current.complete();
+                finishLoading();
             }
         };
 
     const changeFilesVisibilityHelper = async (
         visibility: VISIBILITY_STATE
     ) => {
-        loadingBar.current?.continuousStart();
+        startLoading();
         try {
             const updatedFiles = await changeFilesVisibility(
                 files,
@@ -424,7 +429,7 @@ export default function Gallery() {
             });
         } finally {
             await syncWithRemote(false, true);
-            loadingBar.current.complete();
+            finishLoading();
         }
     };
 
@@ -458,7 +463,7 @@ export default function Gallery() {
     };
 
     const deleteFileHelper = async (permanent?: boolean) => {
-        loadingBar.current?.continuousStart();
+        startLoading();
         try {
             const selectedFiles = getSelectedFiles(selected, files);
             if (permanent) {
@@ -489,7 +494,7 @@ export default function Gallery() {
             });
         } finally {
             await syncWithRemote(false, true);
-            loadingBar.current.complete();
+            finishLoading();
         }
     };
 
@@ -519,7 +524,7 @@ export default function Gallery() {
             close: { text: constants.CANCEL },
         });
     const emptyTrashHelper = async () => {
-        loadingBar.current?.continuousStart();
+        startLoading();
         try {
             await emptyTrash();
             if (selected.collectionID === TRASH_SECTION) {
@@ -536,7 +541,7 @@ export default function Gallery() {
             });
         } finally {
             await syncWithRemote(false, true);
-            loadingBar.current.complete();
+            finishLoading();
         }
     };
 
@@ -549,9 +554,9 @@ export default function Gallery() {
     const downloadHelper = async () => {
         const selectedFiles = getSelectedFiles(selected, files);
         clearSelection();
-        !syncInProgress.current && loadingBar.current?.continuousStart();
+        startLoading();
         await downloadFiles(selectedFiles);
-        !syncInProgress.current && loadingBar.current.complete();
+        finishLoading();
     };
 
     return (
@@ -609,7 +614,8 @@ export default function Gallery() {
                     syncWithRemote={syncWithRemote}
                     setDialogMessage={setDialogMessage}
                     setCollectionNamerAttributes={setCollectionNamerAttributes}
-                    startLoadingBar={loadingBar.current?.continuousStart}
+                    startLoading={startLoading}
+                    finishLoading={finishLoading}
                     collectionFilesCount={collectionFilesCount}
                 />
                 <CollectionNamer

src/utils/collection/index.ts

@@ -6,12 +6,15 @@ import {
     removeFromCollection,
     restoreToCollection,
 } from 'services/collectionService';
-import { getSelectedFiles } from 'utils/file';
+import { downloadFiles, getSelectedFiles } from 'utils/file';
-import { File } from 'services/fileService';
+import { File, getLocalFiles } from 'services/fileService';
 import { CustomError } from 'utils/common/errorUtil';
 import { SelectedState } from 'pages/gallery';
 import { User } from 'services/userService';
 import { getData, LS_KEYS } from 'utils/storage/localStorage';
+import { SetDialogMessage } from 'components/MessageDialog';
+import { logError } from 'utils/sentry';
+import constants from 'utils/strings/constants';
 
 export enum COLLECTION_OPS_TYPE {
     ADD,
@@ -83,3 +86,23 @@ export function isFavoriteCollection(
         return collection.type === CollectionType.favorites;
     }
 }
+
+export async function downloadCollection(
+    collectionID: number,
+    setDialogMessage: SetDialogMessage
+) {
+    try {
+        const allFiles = await getLocalFiles();
+        const collectionFiles = allFiles.filter(
+            (file) => file.collectionID === collectionID
+        );
+        await downloadFiles(collectionFiles);
+    } catch (e) {
+        logError(e, 'download collection failed ');
+        setDialogMessage({
+            title: constants.ERROR,
+            content: constants.DELETE_COLLECTION_FAILED,
+            close: { variant: 'danger' },
+        });
+    }
+}

src/utils/strings/englishConstants.tsx

@@ -382,6 +382,14 @@ const englishConstants = {
         `oops, you're already sharing this with ${email}`,
     SHARING_BAD_REQUEST_ERROR: 'sharing album not allowed',
     SHARING_DISABLED_FOR_FREE_ACCOUNTS: 'sharing is disabled for free accounts',
+    CONFIRM_DOWNLOAD_COLLECTION: 'download album',
+    DOWNLOAD_COLLECTION_MESSAGE: () => (
+        <>
+            <p>are you sure you want to download the complete album?</p>
+            <p>all files will be queued for download sequentially</p>
+        </>
+    ),
+    DOWNLOAD_COLLECTION_FAILED: 'album downloading failed, please try again',
     CREATE_ALBUM_FAILED: 'failed to create album , please try again',
     SEARCH_HINT: () => (
         <span>try searching for New York, April 14, Christmas...</span>