From 68a81c2f7705fa02f042b9a0946961aea623adb5 Mon Sep 17 00:00:00 2001 From: abhinav-grd Date: Mon, 20 Sep 2021 11:51:31 +0530 Subject: [PATCH 01/14] added moveToCollection API --- src/services/collectionService.ts | 97 +++++++++++++++++++++++-------- 1 file changed, 74 insertions(+), 23 deletions(-) diff --git a/src/services/collectionService.ts b/src/services/collectionService.ts index 1bb5c8562..5f1787e24 100644 --- a/src/services/collectionService.ts +++ b/src/services/collectionService.ts @@ -41,6 +41,23 @@ export interface Collection { isDeleted: boolean; } +interface EncryptedFileKey { + id: number; + encryptedKey: string; + keyDecryptionNonce: string; +} + +interface AddToCollectionRequest { + collectionID: number; + files: EncryptedFileKey[]; +} + +interface MoveToCollectionRequest { + fromCollectionID: number; + toCollectionID: number; + files: EncryptedFileKey[]; +} + interface collectionAttributes { encryptedPath?: string; pathDecryptionNonce?: string; @@ -344,39 +361,73 @@ export const addToCollection = async ( files: File[] ) => { try { - const params = {}; - const worker = await new CryptoWorker(); const token = getToken(); - params['collectionID'] = collection.id; - await Promise.all( - files.map(async (file) => { - file.collectionID = collection.id; - const newEncryptedKey: B64EncryptionResult = - await worker.encryptToB64(file.key, collection.key); - file.encryptedKey = newEncryptedKey.encryptedData; - file.keyDecryptionNonce = newEncryptedKey.nonce; - if (params['files'] === undefined) { - params['files'] = []; - } - params['files'].push({ - id: file.id, - encryptedKey: file.encryptedKey, - keyDecryptionNonce: file.keyDecryptionNonce, - }); - return file; - }) - ); + const fileKeysEncryptedWithNewCollection = + await encryptWithNewCollectionKey(collection, files); + + const requestBody: AddToCollectionRequest = { + collectionID: collection.id, + files: fileKeysEncryptedWithNewCollection, + }; await HTTPService.post( `${ENDPOINT}/collections/add-files`, - params, + requestBody, null, - { 'X-Auth-Token': token } + { + 'X-Auth-Token': token, + } ); } catch (e) { logError(e, 'Add to collection Failed '); throw e; } }; +export const moveToCollection = async ( + oldCollection: Collection, + newCollection: Collection, + files: File[] +) => { + const token = getToken(); + const fileKeysEncryptedWithNewCollection = + await encryptWithNewCollectionKey(newCollection, files); + + const requestBody: MoveToCollectionRequest = { + fromCollectionID: oldCollection.id, + toCollectionID: newCollection.id, + files: fileKeysEncryptedWithNewCollection, + }; + await HTTPService.post( + `${ENDPOINT}/collections/add-files`, + requestBody, + null, + { + 'X-Auth-Token': token, + } + ); +}; + +const encryptWithNewCollectionKey = async ( + newCollection: Collection, + files: File[] +): Promise => { + const fileKeysEncryptedWithNewCollection: EncryptedFileKey[] = []; + const worker = await new CryptoWorker(); + for (const file of files) { + const newEncryptedKey: B64EncryptionResult = await worker.encryptToB64( + file.key, + newCollection.key + ); + file.encryptedKey = newEncryptedKey.encryptedData; + file.keyDecryptionNonce = newEncryptedKey.nonce; + + fileKeysEncryptedWithNewCollection.push({ + id: file.id, + encryptedKey: file.encryptedKey, + keyDecryptionNonce: file.keyDecryptionNonce, + }); + } + return fileKeysEncryptedWithNewCollection; +}; const removeFromCollection = async (collection: Collection, files: File[]) => { try { const params = {}; From 8c8a8dd1ce8ae227a47e5f6d2bac9ca9dfb70d8a Mon Sep 17 00:00:00 2001 From: abhinav-grd Date: Mon, 20 Sep 2021 17:01:04 +0530 Subject: [PATCH 02/14] added move icon --- src/components/icons/MoveIcon.tsx | 19 +++++++++++++++++++ 1 file changed, 19 insertions(+) create mode 100644 src/components/icons/MoveIcon.tsx diff --git a/src/components/icons/MoveIcon.tsx b/src/components/icons/MoveIcon.tsx new file mode 100644 index 000000000..a6de6cb81 --- /dev/null +++ b/src/components/icons/MoveIcon.tsx @@ -0,0 +1,19 @@ +import React from 'react'; + +export default function MoveIcon(props) { + return ( + + + + ); +} + +MoveIcon.defaultProps = { + height: 20, + width: 20, + viewBox: '0 0 24 24', +}; From 0d8af74e4af949418bd795d63f155b5843261eff Mon Sep 17 00:00:00 2001 From: abhinav-grd Date: Mon, 20 Sep 2021 17:01:44 +0530 Subject: [PATCH 03/14] added moveButton on Selection bar --- .../pages/gallery/SelectedFileOptions.tsx | 14 ++++++++++++++ src/utils/strings/englishConstants.tsx | 1 + 2 files changed, 15 insertions(+) diff --git a/src/components/pages/gallery/SelectedFileOptions.tsx b/src/components/pages/gallery/SelectedFileOptions.tsx index 40f5f5c45..f234bd311 100644 --- a/src/components/pages/gallery/SelectedFileOptions.tsx +++ b/src/components/pages/gallery/SelectedFileOptions.tsx @@ -8,9 +8,11 @@ import CrossIcon from 'components/icons/CrossIcon'; import AddIcon from 'components/icons/AddIcon'; import { IconButton } from 'components/Container'; import constants from 'utils/strings/constants'; +import MoveIcon from 'components/icons/MoveIcon'; interface Props { addToCollectionHelper: (collectionName, collection) => void; + moveToCollectionHelper: (collectionName, collection) => void; showCreateCollectionModal: () => void; setDialogMessage: SetDialogMessage; setCollectionSelectorAttributes: SetCollectionSelectorAttributes; @@ -35,6 +37,7 @@ const SelectionContainer = styled.div` const SelectedFileOptions = ({ addToCollectionHelper, + moveToCollectionHelper, showCreateCollectionModal, setDialogMessage, setCollectionSelectorAttributes, @@ -62,6 +65,14 @@ const SelectedFileOptions = ({ close: { text: constants.CANCEL }, }); + const moveToCollection = () => { + setCollectionSelectorAttributes({ + callback: (collection) => moveToCollectionHelper(null, collection), + showNextModal: showCreateCollectionModal, + title: constants.MOVE_TO_COLLECTION, + }); + }; + return ( @@ -72,6 +83,9 @@ const SelectedFileOptions = ({ {count} {constants.SELECTED} + + + diff --git a/src/utils/strings/englishConstants.tsx b/src/utils/strings/englishConstants.tsx index 725d2eab3..8dce165e8 100644 --- a/src/utils/strings/englishConstants.tsx +++ b/src/utils/strings/englishConstants.tsx @@ -542,6 +542,7 @@ const englishConstants = { TOO_LARGE_INFO: 'these files were not uploaded as they exceed the maximum size limit for your storage plan', UPLOAD_TO_COLLECTION: 'upload to album', + MOVE_TO_COLLECTION: 'move to collection', }; export default englishConstants; From dd2b7a50ca137c68b017480ebce8d3c686874700 Mon Sep 17 00:00:00 2001 From: abhinav-grd Date: Mon, 20 Sep 2021 17:05:36 +0530 Subject: [PATCH 04/14] updates addToCollection util to handle move --- src/pages/gallery/index.tsx | 36 +++++++++++++++++++++++++++++++++-- src/utils/collection/index.ts | 27 +++++++++++++++++++++++--- src/utils/common/errorUtil.ts | 1 + 3 files changed, 59 insertions(+), 5 deletions(-) diff --git a/src/pages/gallery/index.tsx b/src/pages/gallery/index.tsx index 25ccc190a..0afa9d9c3 100644 --- a/src/pages/gallery/index.tsx +++ b/src/pages/gallery/index.tsx @@ -45,7 +45,6 @@ import EnteSpinner from 'components/EnteSpinner'; import { LoadingOverlay } from 'components/LoadingOverlay'; import PhotoFrame from 'components/PhotoFrame'; import { getSelectedFileIds, sortFilesIntoCollections } from 'utils/file'; -import { addFilesToCollection } from 'utils/collection'; import SearchBar, { DateValue } from 'components/SearchBar'; import { Bbox } from 'services/searchService'; import SelectedFileOptions from 'components/pages/gallery/SelectedFileOptions'; @@ -63,6 +62,10 @@ import Collections from 'components/pages/gallery/Collections'; import { AppContext } from 'pages/_app'; import { CustomError, ServerErrorCodes } from 'utils/common/errorUtil'; import { PAGES } from 'types'; +import { + copyOrMoveFromCollection, + COLLECTION_OPS_TYPE, +} from 'utils/collection'; export const DeadCenter = styled.div` flex: 1; @@ -295,7 +298,35 @@ export default function Gallery() { ) => { loadingBar.current?.continuousStart(); try { - await addFilesToCollection( + await copyOrMoveFromCollection( + COLLECTION_OPS_TYPE.ADD, + setCollectionSelectorView, + selected, + files, + clearSelection, + syncWithRemote, + setActiveCollection, + collectionName, + collection + ); + } catch (e) { + setDialogMessage({ + title: constants.ERROR, + staticBackdrop: true, + close: { variant: 'danger' }, + content: constants.UNKNOWN_ERROR, + }); + } + }; + + const moveToCollectionHelper = async ( + collectionName: string, + collection: Collection + ) => { + loadingBar.current?.continuousStart(); + try { + await copyOrMoveFromCollection( + COLLECTION_OPS_TYPE.MOVE, setCollectionSelectorView, selected, files, @@ -488,6 +519,7 @@ export default function Gallery() { selected.collectionID === activeCollection && ( void, - selected: any, + selected: SelectedState, files: File[], clearSelection: () => void, syncWithRemote: () => Promise, @@ -28,7 +36,20 @@ export async function addFilesToCollection( collection = existingCollection; } const selectedFiles = getSelectedFiles(selected, files); - await addToCollection(collection, selectedFiles); + switch (type) { + case COLLECTION_OPS_TYPE.ADD: + await addToCollection(collection, selectedFiles); + break; + case COLLECTION_OPS_TYPE.MOVE: + await moveToCollection( + selected.collectionID, + collection, + selectedFiles + ); + break; + default: + throw Error(CustomError.INVALID_COLLECTION_OPERATION); + } clearSelection(); await syncWithRemote(); setActiveCollection(collection.id); diff --git a/src/utils/common/errorUtil.ts b/src/utils/common/errorUtil.ts index 26630e709..9bca94c37 100644 --- a/src/utils/common/errorUtil.ts +++ b/src/utils/common/errorUtil.ts @@ -26,6 +26,7 @@ export enum CustomError { TYPE_DETECTION_FAILED = 'type detection failed', SIGNUP_FAILED = 'signup failed', FAV_COLLECTION_MISSING = 'favorite collection missing', + INVALID_COLLECTION_OPERATION = 'invalid collection operation', } function parseUploadError(error: AxiosResponse) { From 93c3cf81218753096b5fd3c8419123647edfe5e6 Mon Sep 17 00:00:00 2001 From: abhinav-grd Date: Mon, 20 Sep 2021 17:07:08 +0530 Subject: [PATCH 05/14] update moveToCollection API --- src/services/collectionService.ts | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/services/collectionService.ts b/src/services/collectionService.ts index 5f1787e24..f636981db 100644 --- a/src/services/collectionService.ts +++ b/src/services/collectionService.ts @@ -383,7 +383,7 @@ export const addToCollection = async ( } }; export const moveToCollection = async ( - oldCollection: Collection, + oldCollectionID: number, newCollection: Collection, files: File[] ) => { @@ -392,12 +392,12 @@ export const moveToCollection = async ( await encryptWithNewCollectionKey(newCollection, files); const requestBody: MoveToCollectionRequest = { - fromCollectionID: oldCollection.id, + fromCollectionID: oldCollectionID, toCollectionID: newCollection.id, files: fileKeysEncryptedWithNewCollection, }; await HTTPService.post( - `${ENDPOINT}/collections/add-files`, + `${ENDPOINT}/collections/move-files`, requestBody, null, { From b90fc6409b0fe8c09c49d6870e50799c8019f9fc Mon Sep 17 00:00:00 2001 From: abhinav-grd Date: Mon, 20 Sep 2021 17:57:24 +0530 Subject: [PATCH 06/14] added error handling for move to collection fail --- src/services/collectionService.ts | 37 ++++++++++++++++++------------- 1 file changed, 21 insertions(+), 16 deletions(-) diff --git a/src/services/collectionService.ts b/src/services/collectionService.ts index f636981db..fd5fdfcb2 100644 --- a/src/services/collectionService.ts +++ b/src/services/collectionService.ts @@ -387,23 +387,28 @@ export const moveToCollection = async ( newCollection: Collection, files: File[] ) => { - const token = getToken(); - const fileKeysEncryptedWithNewCollection = - await encryptWithNewCollectionKey(newCollection, files); + try { + const token = getToken(); + const fileKeysEncryptedWithNewCollection = + await encryptWithNewCollectionKey(newCollection, files); - const requestBody: MoveToCollectionRequest = { - fromCollectionID: oldCollectionID, - toCollectionID: newCollection.id, - files: fileKeysEncryptedWithNewCollection, - }; - await HTTPService.post( - `${ENDPOINT}/collections/move-files`, - requestBody, - null, - { - 'X-Auth-Token': token, - } - ); + const requestBody: MoveToCollectionRequest = { + fromCollectionID: oldCollectionID, + toCollectionID: newCollection.id, + files: fileKeysEncryptedWithNewCollection, + }; + await HTTPService.post( + `${ENDPOINT}/collections/move-files`, + requestBody, + null, + { + 'X-Auth-Token': token, + } + ); + } catch (e) { + logError(e, 'move to collection Failed '); + throw e; + } }; const encryptWithNewCollectionKey = async ( From e610005a85228875ad6328b9f083fc4a7032470c Mon Sep 17 00:00:00 2001 From: abhinav-grd Date: Mon, 20 Sep 2021 18:21:40 +0530 Subject: [PATCH 07/14] updated showCreateCollection to create and move files if collection ops move selected --- .../pages/gallery/SelectedFileOptions.tsx | 7 +-- src/pages/gallery/index.tsx | 44 +++++++++++++++---- 2 files changed, 40 insertions(+), 11 deletions(-) diff --git a/src/components/pages/gallery/SelectedFileOptions.tsx b/src/components/pages/gallery/SelectedFileOptions.tsx index f234bd311..f633851f1 100644 --- a/src/components/pages/gallery/SelectedFileOptions.tsx +++ b/src/components/pages/gallery/SelectedFileOptions.tsx @@ -9,11 +9,12 @@ import AddIcon from 'components/icons/AddIcon'; import { IconButton } from 'components/Container'; import constants from 'utils/strings/constants'; import MoveIcon from 'components/icons/MoveIcon'; +import { COLLECTION_OPS_TYPE } from 'utils/collection'; interface Props { addToCollectionHelper: (collectionName, collection) => void; moveToCollectionHelper: (collectionName, collection) => void; - showCreateCollectionModal: () => void; + showCreateCollectionModal: (opsType: COLLECTION_OPS_TYPE) => () => void; setDialogMessage: SetDialogMessage; setCollectionSelectorAttributes: SetCollectionSelectorAttributes; deleteFileHelper: () => void; @@ -48,7 +49,7 @@ const SelectedFileOptions = ({ const addToCollection = () => setCollectionSelectorAttributes({ callback: (collection) => addToCollectionHelper(null, collection), - showNextModal: showCreateCollectionModal, + showNextModal: showCreateCollectionModal(COLLECTION_OPS_TYPE.ADD), title: constants.ADD_TO_COLLECTION, }); @@ -68,7 +69,7 @@ const SelectedFileOptions = ({ const moveToCollection = () => { setCollectionSelectorAttributes({ callback: (collection) => moveToCollectionHelper(null, collection), - showNextModal: showCreateCollectionModal, + showNextModal: showCreateCollectionModal(COLLECTION_OPS_TYPE.MOVE), title: constants.MOVE_TO_COLLECTION, }); }; diff --git a/src/pages/gallery/index.tsx b/src/pages/gallery/index.tsx index 0afa9d9c3..15c7130c9 100644 --- a/src/pages/gallery/index.tsx +++ b/src/pages/gallery/index.tsx @@ -66,6 +66,7 @@ import { copyOrMoveFromCollection, COLLECTION_OPS_TYPE, } from 'utils/collection'; +import { logError } from 'utils/sentry'; export const DeadCenter = styled.div` flex: 1; @@ -346,14 +347,41 @@ export default function Gallery() { } }; - const showCreateCollectionModal = () => - setCollectionNamerAttributes({ - title: constants.CREATE_COLLECTION, - buttonText: constants.CREATE, - autoFilledName: '', - callback: (collectionName) => - addToCollectionHelper(collectionName, null), - }); + const showCreateCollectionModal = (opsType: COLLECTION_OPS_TYPE) => { + try { + let callback = null; + switch (opsType) { + case COLLECTION_OPS_TYPE.ADD: + callback = (collectionName: string) => + addToCollectionHelper(collectionName, null); + break; + case COLLECTION_OPS_TYPE.MOVE: + callback = (collectionName: string) => + moveToCollectionHelper(collectionName, null); + break; + default: + throw Error(CustomError.INVALID_COLLECTION_OPERATION); + } + return () => + setCollectionNamerAttributes({ + title: constants.CREATE_COLLECTION, + buttonText: constants.CREATE, + autoFilledName: '', + callback, + }); + } catch (e) { + logError( + e, + 'showCreateCollectionModal called with incorrect attributes' + ); + setDialogMessage({ + title: constants.ERROR, + staticBackdrop: true, + close: { variant: 'danger' }, + content: constants.UNKNOWN_ERROR, + }); + } + }; const deleteFileHelper = async () => { loadingBar.current?.continuousStart(); From 27baf3523c335621845ebf35af4f6b3e8ed99e81 Mon Sep 17 00:00:00 2001 From: abhinav-grd Date: Mon, 20 Sep 2021 18:44:05 +0530 Subject: [PATCH 08/14] dont show move option in all --- src/components/pages/gallery/SelectedFileOptions.tsx | 10 +++++++--- src/pages/gallery/index.tsx | 1 + 2 files changed, 8 insertions(+), 3 deletions(-) diff --git a/src/components/pages/gallery/SelectedFileOptions.tsx b/src/components/pages/gallery/SelectedFileOptions.tsx index f633851f1..cbbf3bb21 100644 --- a/src/components/pages/gallery/SelectedFileOptions.tsx +++ b/src/components/pages/gallery/SelectedFileOptions.tsx @@ -20,6 +20,7 @@ interface Props { deleteFileHelper: () => void; count: number; clearSelection: () => void; + activeCollection: number; } const SelectionBar = styled(Navbar)` @@ -45,6 +46,7 @@ const SelectedFileOptions = ({ deleteFileHelper, count, clearSelection, + activeCollection, }: Props) => { const addToCollection = () => setCollectionSelectorAttributes({ @@ -84,9 +86,11 @@ const SelectedFileOptions = ({ {count} {constants.SELECTED} - - - + {activeCollection !== 0 && ( + + + + )} diff --git a/src/pages/gallery/index.tsx b/src/pages/gallery/index.tsx index 15c7130c9..508a1c149 100644 --- a/src/pages/gallery/index.tsx +++ b/src/pages/gallery/index.tsx @@ -558,6 +558,7 @@ export default function Gallery() { deleteFileHelper={deleteFileHelper} count={selected.count} clearSelection={clearSelection} + activeCollection={activeCollection} /> )} From 641053a02598c72da23b746b5011c84e712bf6ca Mon Sep 17 00:00:00 2001 From: abhinav-grd Date: Mon, 20 Sep 2021 18:54:26 +0530 Subject: [PATCH 09/14] hide collection from which file are moved from collection selector view --- .../pages/gallery/CollectionSelector.tsx | 24 +++++++++++++++---- .../pages/gallery/SelectedFileOptions.tsx | 2 ++ 2 files changed, 21 insertions(+), 5 deletions(-) diff --git a/src/components/pages/gallery/CollectionSelector.tsx b/src/components/pages/gallery/CollectionSelector.tsx index bd30a6956..58b21b87f 100644 --- a/src/components/pages/gallery/CollectionSelector.tsx +++ b/src/components/pages/gallery/CollectionSelector.tsx @@ -1,4 +1,4 @@ -import React from 'react'; +import React, { useEffect } from 'react'; import { Card, Modal } from 'react-bootstrap'; import styled from 'styled-components'; import { @@ -23,6 +23,7 @@ export interface CollectionSelectorAttributes { callback: (collection: Collection) => void; showNextModal: () => void; title: string; + fromCollection?: number; } export type SetCollectionSelectorAttributes = React.Dispatch< React.SetStateAction @@ -45,11 +46,25 @@ function CollectionSelector({ collectionsAndTheirLatestFile, ...props }: Props) { + useEffect(() => { + if (!attributes) { + return; + } + const collectionOtherThanFrom = collectionsAndTheirLatestFile?.filter( + (item) => !(item.collection.id === attributes.fromCollection) + ); + if (collectionOtherThanFrom.length === 0) { + props.onHide(); + attributes.showNextModal(); + } + }, [props.show]); + if (!attributes) { return ; } - const CollectionIcons: JSX.Element[] = collectionsAndTheirLatestFile?.map( - (item) => ( + const CollectionIcons: JSX.Element[] = collectionsAndTheirLatestFile + ?.filter((item) => !(item.collection.id === attributes.fromCollection)) + .map((item) => ( { @@ -67,8 +82,7 @@ function CollectionSelector({ - ) - ); + )); return ( addToCollectionHelper(null, collection), showNextModal: showCreateCollectionModal(COLLECTION_OPS_TYPE.ADD), title: constants.ADD_TO_COLLECTION, + fromCollection: activeCollection, }); const deleteHandler = () => @@ -73,6 +74,7 @@ const SelectedFileOptions = ({ callback: (collection) => moveToCollectionHelper(null, collection), showNextModal: showCreateCollectionModal(COLLECTION_OPS_TYPE.MOVE), title: constants.MOVE_TO_COLLECTION, + fromCollection: activeCollection, }); }; From cfb3f048e449c96b93d64f97b5422016ac0f5a20 Mon Sep 17 00:00:00 2001 From: abhinav-grd Date: Mon, 20 Sep 2021 18:57:46 +0530 Subject: [PATCH 10/14] rename variable --- src/components/pages/gallery/CollectionSelector.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/pages/gallery/CollectionSelector.tsx b/src/components/pages/gallery/CollectionSelector.tsx index 58b21b87f..77ae684c4 100644 --- a/src/components/pages/gallery/CollectionSelector.tsx +++ b/src/components/pages/gallery/CollectionSelector.tsx @@ -50,10 +50,10 @@ function CollectionSelector({ if (!attributes) { return; } - const collectionOtherThanFrom = collectionsAndTheirLatestFile?.filter( + const collectionsOtherThanFrom = collectionsAndTheirLatestFile?.filter( (item) => !(item.collection.id === attributes.fromCollection) ); - if (collectionOtherThanFrom.length === 0) { + if (collectionsOtherThanFrom.length === 0) { props.onHide(); attributes.showNextModal(); } From 6c597570d16432ac7479a9d20dd8d28065a9a3f2 Mon Sep 17 00:00:00 2001 From: abhinav-grd Date: Mon, 20 Sep 2021 21:08:14 +0530 Subject: [PATCH 11/14] better remove fromCollection --- src/components/FullScreenDropZone.tsx | 4 -- .../pages/gallery/CollectionSelector.tsx | 47 ++++++++++--------- 2 files changed, 25 insertions(+), 26 deletions(-) diff --git a/src/components/FullScreenDropZone.tsx b/src/components/FullScreenDropZone.tsx index 09d936b90..58d0102df 100644 --- a/src/components/FullScreenDropZone.tsx +++ b/src/components/FullScreenDropZone.tsx @@ -58,10 +58,6 @@ export default function FullScreenDropZone(props: Props) { { - e.preventDefault(); - props.showCollectionSelector(); - }, })}> {isDragActive && ( diff --git a/src/components/pages/gallery/CollectionSelector.tsx b/src/components/pages/gallery/CollectionSelector.tsx index 77ae684c4..f115814ac 100644 --- a/src/components/pages/gallery/CollectionSelector.tsx +++ b/src/components/pages/gallery/CollectionSelector.tsx @@ -1,4 +1,4 @@ -import React, { useEffect } from 'react'; +import React, { useEffect, useState } from 'react'; import { Card, Modal } from 'react-bootstrap'; import styled from 'styled-components'; import { @@ -46,6 +46,9 @@ function CollectionSelector({ collectionsAndTheirLatestFile, ...props }: Props) { + const [collectionToShow, setCollectionToShow] = useState< + CollectionAndItsLatestFile[] + >([]); useEffect(() => { if (!attributes) { return; @@ -56,33 +59,33 @@ function CollectionSelector({ if (collectionsOtherThanFrom.length === 0) { props.onHide(); attributes.showNextModal(); + } else { + setCollectionToShow(collectionsOtherThanFrom); } }, [props.show]); if (!attributes) { return ; } - const CollectionIcons: JSX.Element[] = collectionsAndTheirLatestFile - ?.filter((item) => !(item.collection.id === attributes.fromCollection)) - .map((item) => ( - { - attributes.callback(item.collection); - props.onHide(); - }}> - - {}} - forcedEnable - /> - - {item.collection.name} - - - - )); + const CollectionIcons: JSX.Element[] = collectionToShow?.map((item) => ( + { + attributes.callback(item.collection); + props.onHide(); + }}> + + {}} + forcedEnable + /> + + {item.collection.name} + + + + )); return ( Date: Tue, 21 Sep 2021 11:37:03 +0530 Subject: [PATCH 12/14] remove unneccesary showCollectionSelector prop --- src/components/FullScreenDropZone.tsx | 1 - src/pages/gallery/index.tsx | 6 +----- 2 files changed, 1 insertion(+), 6 deletions(-) diff --git a/src/components/FullScreenDropZone.tsx b/src/components/FullScreenDropZone.tsx index 58d0102df..82b44364f 100644 --- a/src/components/FullScreenDropZone.tsx +++ b/src/components/FullScreenDropZone.tsx @@ -39,7 +39,6 @@ const Overlay = styled.div` type Props = React.PropsWithChildren<{ getRootProps: any; getInputProps: any; - showCollectionSelector; }>; export default function FullScreenDropZone(props: Props) { diff --git a/src/pages/gallery/index.tsx b/src/pages/gallery/index.tsx index 508a1c149..a20dc80c9 100644 --- a/src/pages/gallery/index.tsx +++ b/src/pages/gallery/index.tsx @@ -427,11 +427,7 @@ export default function Gallery() { + getInputProps={getInputProps}> {loading && ( From 0bb82c189e32a47419949485afef751dade5c37e Mon Sep 17 00:00:00 2001 From: abhinav-grd Date: Tue, 21 Sep 2021 17:52:31 +0530 Subject: [PATCH 13/14] better variable names --- src/services/collectionService.ts | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/src/services/collectionService.ts b/src/services/collectionService.ts index fd5fdfcb2..570786302 100644 --- a/src/services/collectionService.ts +++ b/src/services/collectionService.ts @@ -383,18 +383,18 @@ export const addToCollection = async ( } }; export const moveToCollection = async ( - oldCollectionID: number, - newCollection: Collection, + fromCollectionID: number, + toCollection: Collection, files: File[] ) => { try { const token = getToken(); const fileKeysEncryptedWithNewCollection = - await encryptWithNewCollectionKey(newCollection, files); + await encryptWithNewCollectionKey(toCollection, files); const requestBody: MoveToCollectionRequest = { - fromCollectionID: oldCollectionID, - toCollectionID: newCollection.id, + fromCollectionID: fromCollectionID, + toCollectionID: toCollection.id, files: fileKeysEncryptedWithNewCollection, }; await HTTPService.post( From 1a8c4dcf23e518a3f614e3a52e6dc03b30bfd0b5 Mon Sep 17 00:00:00 2001 From: abhinav-grd Date: Wed, 22 Sep 2021 10:18:33 +0530 Subject: [PATCH 14/14] makes move icon thinner --- src/components/icons/MoveIcon.tsx | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/src/components/icons/MoveIcon.tsx b/src/components/icons/MoveIcon.tsx index a6de6cb81..66338bd21 100644 --- a/src/components/icons/MoveIcon.tsx +++ b/src/components/icons/MoveIcon.tsx @@ -7,13 +7,17 @@ export default function MoveIcon(props) { height={props.height} viewBox={props.viewBox} width={props.width}> - + ); } MoveIcon.defaultProps = { - height: 20, - width: 20, + height: 24, + width: 24, viewBox: '0 0 24 24', };