From 72fab5db9276acde80154c49504fd239d6c304d5 Mon Sep 17 00:00:00 2001 From: Abhinav-grd Date: Sat, 6 Feb 2021 13:21:49 +0530 Subject: [PATCH 01/22] skip deleted collections --- src/services/collectionService.ts | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/services/collectionService.ts b/src/services/collectionService.ts index 2a06a8715..14a8713c3 100644 --- a/src/services/collectionService.ts +++ b/src/services/collectionService.ts @@ -119,7 +119,8 @@ export const fetchUpdatedCollections = async (token: string, key: string) => { }); let collections = []; for (const [_, collection] of latestCollectionsInstances) { - collections.push(collection); + if (!collection.isDeleted) + collections.push(collection); } await localForage.setItem('fav-collection', favCollection); await localForage.setItem('collections', collections); From 5c5a1619991b453a0d0745c080c4431a80cd8dce Mon Sep 17 00:00:00 2001 From: Abhinav-grd Date: Sat, 6 Feb 2021 13:24:36 +0530 Subject: [PATCH 02/22] remove files of deleted collections --- src/services/fileService.ts | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/src/services/fileService.ts b/src/services/fileService.ts index b9ae4263a..c55d8bfcb 100644 --- a/src/services/fileService.ts +++ b/src/services/fileService.ts @@ -78,7 +78,11 @@ export const fetchFiles = async ( let files = await localFiles(); const collectionUpdationTime = new Map(); let fetchedFiles = []; + let deletedCollection = new Set(); for (let collection of collections) { + if (collection.isDeleted) { + deletedCollection.add(collection.id); + } const files = await getFiles(collection, null, 100, token); fetchedFiles.push(...files); collectionUpdationTime.set(collection.id, files.length > 0 ? files.slice(-1)[0].updationTime.toString() : "0"); @@ -93,8 +97,9 @@ export const fetchFiles = async ( }); files = []; for (const [_, file] of latestFiles) { - if (!file.isDeleted) + if (!(file.isDeleted || deletedCollection.has(file.collectionID.toString()))) { files.push(file); + } } files = files.sort( (a, b) => b.metadata.creationTime - a.metadata.creationTime From 71af57409ae4dbe8dc9cb6fa2d0792dc88275f73 Mon Sep 17 00:00:00 2001 From: Abhinav-grd Date: Mon, 8 Feb 2021 13:03:46 +0530 Subject: [PATCH 03/22] change collection id type to number --- src/services/collectionService.ts | 7 ++++--- src/services/fileService.ts | 13 +++++++------ 2 files changed, 11 insertions(+), 9 deletions(-) diff --git a/src/services/collectionService.ts b/src/services/collectionService.ts index 14a8713c3..068682454 100644 --- a/src/services/collectionService.ts +++ b/src/services/collectionService.ts @@ -22,7 +22,7 @@ enum CollectionType { } export interface collection { - id: string; + id: number; owner: user; key?: string; name?: string; @@ -111,7 +111,7 @@ export const fetchUpdatedCollections = async (token: string, key: string) => { const favCollection = await localForage.getItem('fav-collection') as collection[] ?? updatedCollections.filter(collection => collection.type === CollectionType.favorites); const localCollections = await getLocalCollections(); const allCollectionsInstances = [...localCollections, ...updatedCollections]; - var latestCollectionsInstances = new Map(); + var latestCollectionsInstances = new Map(); allCollectionsInstances.forEach((collection) => { if (!latestCollectionsInstances.has(collection.id) || latestCollectionsInstances.get(collection.id).updationTime < collection.updationTime) { latestCollectionsInstances.set(collection.id, collection); @@ -119,8 +119,9 @@ export const fetchUpdatedCollections = async (token: string, key: string) => { }); let collections = []; for (const [_, collection] of latestCollectionsInstances) { - if (!collection.isDeleted) + if (!collection.isDeleted){ collections.push(collection); + } } await localForage.setItem('fav-collection', favCollection); await localForage.setItem('collections', collections); diff --git a/src/services/fileService.ts b/src/services/fileService.ts index c55d8bfcb..2bd1e0c25 100644 --- a/src/services/fileService.ts +++ b/src/services/fileService.ts @@ -76,16 +76,16 @@ export const fetchFiles = async ( collections: collection[] ) => { let files = await localFiles(); - const collectionUpdationTime = new Map(); + const collectionUpdationTime = new Map(); let fetchedFiles = []; - let deletedCollection = new Set(); + let deletedCollection = new Set(); for (let collection of collections) { if (collection.isDeleted) { deletedCollection.add(collection.id); } const files = await getFiles(collection, null, 100, token); fetchedFiles.push(...files); - collectionUpdationTime.set(collection.id, files.length > 0 ? files.slice(-1)[0].updationTime.toString() : "0"); + collectionUpdationTime.set(collection.id, files.length > 0 ? files.slice(-1)[0].updationTime : 0); } files.push(...fetchedFiles); var latestFiles = new Map(); @@ -97,9 +97,10 @@ export const fetchFiles = async ( }); files = []; for (const [_, file] of latestFiles) { - if (!(file.isDeleted || deletedCollection.has(file.collectionID.toString()))) { - files.push(file); + if (file.isDeleted || deletedCollection.has(file.collectionID)) { + continue; } + files.push(file); } files = files.sort( (a, b) => b.metadata.creationTime - a.metadata.creationTime @@ -129,7 +130,7 @@ export const getFiles = async (collection: collection, sinceTime: string, limit: let resp; do { resp = await HTTPService.get(`${ENDPOINT}/collections/diff`, { - collectionID: collection.id, + collectionID: collection.id.toString(), sinceTime: time, limit: limit.toString(), }, From dfad5dd8fa470d169ce464f8d4b89598dc022cdf Mon Sep 17 00:00:00 2001 From: Vishnu Mohandas Date: Mon, 8 Feb 2021 14:06:23 +0530 Subject: [PATCH 04/22] Skip fetching diff for a collection that has been deleted --- src/services/fileService.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/src/services/fileService.ts b/src/services/fileService.ts index 2bd1e0c25..93a4967f5 100644 --- a/src/services/fileService.ts +++ b/src/services/fileService.ts @@ -82,6 +82,7 @@ export const fetchFiles = async ( for (let collection of collections) { if (collection.isDeleted) { deletedCollection.add(collection.id); + continue; } const files = await getFiles(collection, null, 100, token); fetchedFiles.push(...files); From 99d547016eeb8ba684315af4eace90013e2dda66 Mon Sep 17 00:00:00 2001 From: Abhinav-grd Date: Mon, 8 Feb 2021 14:50:27 +0530 Subject: [PATCH 05/22] updated collection id type to number --- src/pages/gallery/components/Collections.tsx | 4 ++-- src/pages/gallery/index.tsx | 2 +- src/services/uploadService.ts | 2 +- 3 files changed, 4 insertions(+), 4 deletions(-) diff --git a/src/pages/gallery/components/Collections.tsx b/src/pages/gallery/components/Collections.tsx index f824ec2f5..b992f7570 100644 --- a/src/pages/gallery/components/Collections.tsx +++ b/src/pages/gallery/components/Collections.tsx @@ -5,7 +5,7 @@ import styled from 'styled-components'; interface CollectionProps { collections: collection[]; selected?: string; - selectCollection: (id?: string) => void; + selectCollection: (id?: number) => void; } const Container = styled.div` @@ -51,7 +51,7 @@ const Chip = styled.button<{ active: boolean }>` export default function Collections(props: CollectionProps) { const { selected, collections, selectCollection } = props; - const clickHandler = (id?: string) => () => selectCollection(id); + const clickHandler = (id?: number) => () => selectCollection(id); return diff --git a/src/pages/gallery/index.tsx b/src/pages/gallery/index.tsx index e8131ab08..509a5483a 100644 --- a/src/pages/gallery/index.tsx +++ b/src/pages/gallery/index.tsx @@ -276,7 +276,7 @@ export default function Gallery(props) { ); } - const selectCollection = (id?: string) => { + const selectCollection = (id?: number) => { const href = `/gallery?collection=${id || ''}`; router.push(href, undefined, { shallow: true }); }; diff --git a/src/services/uploadService.ts b/src/services/uploadService.ts index a69cdbacb..e36d8e4f8 100644 --- a/src/services/uploadService.ts +++ b/src/services/uploadService.ts @@ -49,7 +49,7 @@ interface objectKeys { } interface uploadFile extends objectKeys { - collectionID: string, + collectionID: number, encryptedKey: string; keyDecryptionNonce: string; metadata?: { From 7acf87d4b1eed4bd55cea38b815b691217525344 Mon Sep 17 00:00:00 2001 From: Abhinav-grd Date: Mon, 8 Feb 2021 16:07:59 +0530 Subject: [PATCH 06/22] updated collection update time after fetch call --- src/services/collectionService.ts | 19 +++++++++++++------ 1 file changed, 13 insertions(+), 6 deletions(-) diff --git a/src/services/collectionService.ts b/src/services/collectionService.ts index 068682454..11af75e75 100644 --- a/src/services/collectionService.ts +++ b/src/services/collectionService.ts @@ -105,11 +105,15 @@ export const getLocalCollections = async (): Promise => { const collections = await localForage.getItem('collections') as collection[] ?? []; return collections; } -export const fetchUpdatedCollections = async (token: string, key: string) => { - const collectionUpdateTime = await localForage.getItem('collection-update-time') as string; - const updatedCollections = await getCollections(token, collectionUpdateTime ?? '0', key) || []; - const favCollection = await localForage.getItem('fav-collection') as collection[] ?? updatedCollections.filter(collection => collection.type === CollectionType.favorites); +export const getLatestCollections = async (token: string, key: string) => { const localCollections = await getLocalCollections(); + const lastCollectionUpdateTime = await localForage.getItem('collection-update-time')??"0"; + const updatedCollections = await getCollections(token, lastCollectionUpdateTime, key) || []; + + if(updatedCollections.length==0){ + return {isUpdated:false,collections:localCollections}; + } + const favCollection = await localForage.getItem('fav-collection') as collection[] ?? updatedCollections.filter(collection => collection.type === CollectionType.favorites); const allCollectionsInstances = [...localCollections, ...updatedCollections]; var latestCollectionsInstances = new Map(); allCollectionsInstances.forEach((collection) => { @@ -117,15 +121,18 @@ export const fetchUpdatedCollections = async (token: string, key: string) => { latestCollectionsInstances.set(collection.id, collection); } }); - let collections = []; + + let collections = [],updationTime= await localForage.getItem('collection-update-time'); for (const [_, collection] of latestCollectionsInstances) { if (!collection.isDeleted){ collections.push(collection); + updationTime=Math.max(updationTime,collection.updationTime); } } await localForage.setItem('fav-collection', favCollection); + await localForage.setItem('collection-update-time',updationTime); await localForage.setItem('collections', collections); - return updatedCollections; + return {isUpdated:true,collections:collections}; }; export const getCollectionLatestFile = ( From cb49d98178c224c0c9ff851d976c7e616fb3ec8d Mon Sep 17 00:00:00 2001 From: Abhinav-grd Date: Mon, 8 Feb 2021 16:21:40 +0530 Subject: [PATCH 07/22] udpated with new get collection function --- src/pages/gallery/index.tsx | 9 ++++----- 1 file changed, 4 insertions(+), 5 deletions(-) diff --git a/src/pages/gallery/index.tsx b/src/pages/gallery/index.tsx index 509a5483a..679beb225 100644 --- a/src/pages/gallery/index.tsx +++ b/src/pages/gallery/index.tsx @@ -22,7 +22,7 @@ import Collections from './components/Collections'; import Upload from './components/Upload'; import { collection, - fetchUpdatedCollections, + getLatestCollections, collectionLatestFile, getCollectionLatestFile, getFavItemIds, @@ -142,12 +142,11 @@ export default function Gallery(props) { const syncWithRemote = async () => { const token = getToken(); const encryptionKey = await getActualKey(); - const updatedCollections = await fetchUpdatedCollections(token, encryptionKey); - const data = await fetchData(token, updatedCollections); - const collections = await getLocalCollections(); + const {isUpdated, collections} = await getLatestCollections(token, encryptionKey); + const data = await fetchData(token, collections); const collectionLatestFile = await getCollectionLatestFile(collections, data); const favItemIds = await getFavItemIds(data); - if (updatedCollections.length > 0) { + if (isUpdated) { setCollections(collections); setData(data); } From 4f32d07f80e4261efa10557c1743b73f42636055 Mon Sep 17 00:00:00 2001 From: Abhinav-grd Date: Mon, 8 Feb 2021 16:26:47 +0530 Subject: [PATCH 08/22] updated fetch files logic --- src/services/fileService.ts | 58 +++++++++++++++---------------------- 1 file changed, 23 insertions(+), 35 deletions(-) diff --git a/src/services/fileService.ts b/src/services/fileService.ts index 93a4967f5..238f9ffcb 100644 --- a/src/services/fileService.ts +++ b/src/services/fileService.ts @@ -76,45 +76,37 @@ export const fetchFiles = async ( collections: collection[] ) => { let files = await localFiles(); - const collectionUpdationTime = new Map(); - let fetchedFiles = []; let deletedCollection = new Set(); + const collectionsUpdateTime=await localForage.getItem('collection-update-time'); for (let collection of collections) { if (collection.isDeleted) { deletedCollection.add(collection.id); continue; } - const files = await getFiles(collection, null, 100, token); - fetchedFiles.push(...files); - collectionUpdationTime.set(collection.id, files.length > 0 ? files.slice(-1)[0].updationTime : 0); - } - files.push(...fetchedFiles); - var latestFiles = new Map(); - files.forEach((file) => { - let uid = `${file.collectionID}-${file.id}`; - if (!latestFiles.has(uid) || latestFiles.get(uid).updationTime < file.updationTime) { - latestFiles.set(uid, file); - } - }); - files = []; - for (const [_, file] of latestFiles) { - if (file.isDeleted || deletedCollection.has(file.collectionID)) { + const thisCollectionUpdateTime=await localForage.getItem(`${collection.id}-time`); + if(collectionsUpdateTime===thisCollectionUpdateTime) continue; + let fetchedFiles = await getFiles(collection, null, 100, token)??[]; + files.push(...fetchedFiles); + var latestVersionFiles = new Map(); + files.forEach((file) => { + if (!latestVersionFiles.has(file.id) || latestVersionFiles.get(file.id).updationTime < file.updationTime) { + latestVersionFiles.set(file.id, file); + } + }); + files = []; + for (const [_, file] of latestVersionFiles) { + if (file.isDeleted || deletedCollection.has(file.collectionID)) { + continue; + } + files.push(file); } - files.push(file); + files = files.sort( + (a, b) => b.metadata.creationTime - a.metadata.creationTime + ); + await localForage.setItem('files', files); + await localForage.setItem(`${collection.id}-time`, collectionsUpdateTime); } - files = files.sort( - (a, b) => b.metadata.creationTime - a.metadata.creationTime - ); - await localForage.setItem('files', files); - for (let [collectionID, updationTime] of collectionUpdationTime) { - await localForage.setItem(`${collectionID}-time`, updationTime); - } - let updationTime = await localForage.getItem('collection-update-time') as number; - for (let collection of collections) { - updationTime = Math.max(updationTime, collection.updationTime); - } - await localForage.setItem('collection-update-time', updationTime); return files; }; @@ -122,12 +114,8 @@ export const getFiles = async (collection: collection, sinceTime: string, limit: try { const worker = await new CryptoWorker(); let promises: Promise[] = []; - if (collection.isDeleted) { - // TODO: Remove files in this collection from localForage and cache - return; - } let time = - sinceTime || (await localForage.getItem(`${collection.id}-time`)) || "0"; + sinceTime || (await localForage.getItem(`${collection.id}-time`)) || "0"; let resp; do { resp = await HTTPService.get(`${ENDPOINT}/collections/diff`, { From dfc5138fe3f22c593ffdd7e3a4b0beb700b076a5 Mon Sep 17 00:00:00 2001 From: Abhinav-grd Date: Mon, 8 Feb 2021 16:31:05 +0530 Subject: [PATCH 09/22] added if braces --- src/services/fileService.ts | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/services/fileService.ts b/src/services/fileService.ts index 238f9ffcb..834c30a88 100644 --- a/src/services/fileService.ts +++ b/src/services/fileService.ts @@ -84,8 +84,9 @@ export const fetchFiles = async ( continue; } const thisCollectionUpdateTime=await localForage.getItem(`${collection.id}-time`); - if(collectionsUpdateTime===thisCollectionUpdateTime) + if(collectionsUpdateTime===thisCollectionUpdateTime){ continue; + } let fetchedFiles = await getFiles(collection, null, 100, token)??[]; files.push(...fetchedFiles); var latestVersionFiles = new Map(); From d6c21c671f3ea134f88898db79c2e4289290aee6 Mon Sep 17 00:00:00 2001 From: Abhinav-grd Date: Mon, 8 Feb 2021 16:32:16 +0530 Subject: [PATCH 10/22] fixed indentation --- src/services/fileService.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/services/fileService.ts b/src/services/fileService.ts index 834c30a88..309fae3d7 100644 --- a/src/services/fileService.ts +++ b/src/services/fileService.ts @@ -116,7 +116,7 @@ export const getFiles = async (collection: collection, sinceTime: string, limit: const worker = await new CryptoWorker(); let promises: Promise[] = []; let time = - sinceTime || (await localForage.getItem(`${collection.id}-time`)) || "0"; + sinceTime || (await localForage.getItem(`${collection.id}-time`)) || "0"; let resp; do { resp = await HTTPService.get(`${ENDPOINT}/collections/diff`, { From 8ba126c56ea82b0a362713d081111c123f755a8d Mon Sep 17 00:00:00 2001 From: Abhinav-grd Date: Mon, 8 Feb 2021 21:40:11 +0530 Subject: [PATCH 11/22] renamed getLatestCollections to syncCollections --- 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 11af75e75..d1258d394 100644 --- a/src/services/collectionService.ts +++ b/src/services/collectionService.ts @@ -105,13 +105,13 @@ export const getLocalCollections = async (): Promise => { const collections = await localForage.getItem('collections') as collection[] ?? []; return collections; } -export const getLatestCollections = async (token: string, key: string) => { +export const syncCollections = async (token: string, key: string) => { const localCollections = await getLocalCollections(); const lastCollectionUpdateTime = await localForage.getItem('collection-update-time')??"0"; const updatedCollections = await getCollections(token, lastCollectionUpdateTime, key) || []; if(updatedCollections.length==0){ - return {isUpdated:false,collections:localCollections}; + return localCollections; } const favCollection = await localForage.getItem('fav-collection') as collection[] ?? updatedCollections.filter(collection => collection.type === CollectionType.favorites); const allCollectionsInstances = [...localCollections, ...updatedCollections]; @@ -132,7 +132,7 @@ export const getLatestCollections = async (token: string, key: string) => { await localForage.setItem('fav-collection', favCollection); await localForage.setItem('collection-update-time',updationTime); await localForage.setItem('collections', collections); - return {isUpdated:true,collections:collections}; + return collections; }; export const getCollectionLatestFile = ( From 95d50cc3c3c92c44f0ce14e64557a022e198016a Mon Sep 17 00:00:00 2001 From: Abhinav-grd Date: Mon, 8 Feb 2021 21:45:21 +0530 Subject: [PATCH 12/22] updated the function calls --- src/pages/gallery/index.tsx | 146 ++++++++++++++++++++++++------------ 1 file changed, 98 insertions(+), 48 deletions(-) diff --git a/src/pages/gallery/index.tsx b/src/pages/gallery/index.tsx index 679beb225..8ed08ecde 100644 --- a/src/pages/gallery/index.tsx +++ b/src/pages/gallery/index.tsx @@ -6,7 +6,7 @@ import { file, getFile, getPreview, - fetchData, + syncData, localFiles, } from 'services/fileService'; import { getData, LS_KEYS } from 'utils/storage/localStorage'; @@ -17,16 +17,16 @@ import PhotoSwipe from 'components/PhotoSwipe/PhotoSwipe'; import { Options } from 'photoswipe'; import AutoSizer from 'react-virtualized-auto-sizer'; import { VariableSizeList as List } from 'react-window'; -import LoadingBar from 'react-top-loading-bar' +import LoadingBar from 'react-top-loading-bar'; import Collections from './components/Collections'; import Upload from './components/Upload'; import { collection, - getLatestCollections, + syncCollections, collectionLatestFile, getCollectionLatestFile, getFavItemIds, - getLocalCollections + getLocalCollections, } from 'services/collectionService'; import constants from 'utils/strings/constants'; @@ -37,7 +37,7 @@ enum ITEM_TYPE { export enum FILE_TYPE { IMAGE, VIDEO, - OTHERS + OTHERS, } interface TimeStampListItem { @@ -75,9 +75,9 @@ const DeadCenter = styled.div` flex-direction: column; `; -const ListContainer = styled.div<{columns: number}>` +const ListContainer = styled.div<{ columns: number }>` display: grid; - grid-template-columns: repeat(${props => props.columns}, 1fr); + grid-template-columns: repeat(${(props) => props.columns}, 1fr); grid-column-gap: 8px; padding: 0 8px; max-width: 100%; @@ -117,7 +117,7 @@ export default function Gallery(props) { const fetching: { [k: number]: boolean } = {}; const [sinceTime, setSinceTime] = useState(0); - const [progress, setProgress] = useState(0) + const [progress, setProgress] = useState(0); useEffect(() => { const key = getKey(SESSION_KEYS.ENCRYPTION_KEY); @@ -142,19 +142,22 @@ export default function Gallery(props) { const syncWithRemote = async () => { const token = getToken(); const encryptionKey = await getActualKey(); - const {isUpdated, collections} = await getLatestCollections(token, encryptionKey); - const data = await fetchData(token, collections); - const collectionLatestFile = await getCollectionLatestFile(collections, data); + const collections = await syncCollections(token, encryptionKey); + const { data, isUpdated } = await syncData(token, collections); + const collectionLatestFile = await getCollectionLatestFile( + collections, + data + ); const favItemIds = await getFavItemIds(data); + setCollections(collections); if (isUpdated) { - setCollections(collections); setData(data); } setCollectionLatestFile(collectionLatestFile); setFavItemIds(favItemIds); - setSinceTime((new Date()).getTime()); + setSinceTime(new Date().getTime()); props.setUploadButtonView(true); - } + }; const updateUrl = (index: number) => (url: string) => { data[index] = { @@ -163,7 +166,10 @@ export default function Gallery(props) { w: window.innerWidth, h: window.innerHeight, }; - if (data[index].metadata.fileType === FILE_TYPE.VIDEO && !data[index].html) { + if ( + data[index].metadata.fileType === FILE_TYPE.VIDEO && + !data[index].html + ) { data[index].html = `
@@ -174,7 +180,10 @@ export default function Gallery(props) { `; delete data[index].src; } - if (data[index].metadata.fileType === FILE_TYPE.IMAGE && !data[index].src) { + if ( + data[index].metadata.fileType === FILE_TYPE.IMAGE && + !data[index].src + ) { data[index].src = url; } setData(data); @@ -241,7 +250,10 @@ export default function Gallery(props) { // ignore } } - if ((!item.src || item.src === item.msrc) && !fetching[item.dataIndex]) { + if ( + (!item.src || item.src === item.msrc) && + !fetching[item.dataIndex] + ) { fetching[item.dataIndex] = true; const url = await getFile(token, item); updateSrcUrl(item.dataIndex, url); @@ -269,8 +281,8 @@ export default function Gallery(props) { if (!data || loading) { return ( -
- +
+
); } @@ -311,7 +323,7 @@ export default function Gallery(props) { return ( <> setProgress(0)} /> @@ -326,7 +338,6 @@ export default function Gallery(props) { showUploadModal={props.showUploadModal} collectionLatestFile={collectionLatestFile} refetchData={syncWithRemote} - /> {filteredData.length ? ( @@ -349,20 +360,28 @@ export default function Gallery(props) { filteredData.forEach((item, index) => { if ( !isSameDay( - new Date(item.metadata.creationTime / 1000), + new Date( + item.metadata.creationTime / 1000 + ), new Date(currentDate) ) ) { - currentDate = item.metadata.creationTime / 1000; - const dateTimeFormat = new Intl.DateTimeFormat('en-IN', { - weekday: 'short', - year: 'numeric', - month: 'long', - day: 'numeric', - }); + currentDate = + item.metadata.creationTime / 1000; + const dateTimeFormat = new Intl.DateTimeFormat( + 'en-IN', + { + weekday: 'short', + year: 'numeric', + month: 'long', + day: 'numeric', + } + ); timeStampList.push({ itemType: ITEM_TYPE.TIME, - date: dateTimeFormat.format(currentDate), + date: dateTimeFormat.format( + currentDate + ), }); timeStampList.push({ itemType: ITEM_TYPE.TILE, @@ -372,7 +391,9 @@ export default function Gallery(props) { listItemIndex = 1; } else { if (listItemIndex < columns) { - timeStampList[timeStampList.length - 1].items.push(item); + timeStampList[ + timeStampList.length - 1 + ].items.push(item); listItemIndex++; } else { listItemIndex = 1; @@ -388,7 +409,8 @@ export default function Gallery(props) { return ( - timeStampList[index].itemType === ITEM_TYPE.TIME + timeStampList[index].itemType === + ITEM_TYPE.TIME ? 45 : 200 } @@ -398,18 +420,46 @@ export default function Gallery(props) { key={`${router.query.collection}-${columns}-${sinceTime}`} > {({ index, style }) => { - return ( - - { - timeStampList[index].itemType === ITEM_TYPE.TIME - ? {timeStampList[index].date} - : timeStampList[index].items.map((item, idx) =>{ - return getThumbnail(filteredData, timeStampList[index].itemStartIndex + idx); - }) - } - - ); + return ( + + + {timeStampList[index] + .itemType === + ITEM_TYPE.TIME ? ( + + { + timeStampList[ + index + ].date + } + + ) : ( + timeStampList[ + index + ].items.map( + (item, idx) => { + return getThumbnail( + filteredData, + timeStampList[ + index + ] + .itemStartIndex + + idx + ); + } + ) + )} + + + ); }} ); @@ -426,10 +476,10 @@ export default function Gallery(props) { /> ) : ( - -
{constants.NOTHING_HERE}
- - )} + +
{constants.NOTHING_HERE}
+ + )} ); } From 5250b97891d19ca38360ef4890702a407a9dafe4 Mon Sep 17 00:00:00 2001 From: Abhinav-grd Date: Mon, 8 Feb 2021 21:47:17 +0530 Subject: [PATCH 13/22] updated removing deleted collection file logic --- src/services/fileService.ts | 124 +++++++++++++++++++++--------------- 1 file changed, 72 insertions(+), 52 deletions(-) diff --git a/src/services/fileService.ts b/src/services/fileService.ts index 309fae3d7..5a09a7033 100644 --- a/src/services/fileService.ts +++ b/src/services/fileService.ts @@ -29,7 +29,6 @@ export interface user { email: string; } - export interface file { id: number; collectionID: number; @@ -49,55 +48,53 @@ export interface file { updationTime: number; } +export const syncData = async (token, collections) => { + const { files: resp, isUpdated } = await syncFiles(token, collections); - -export const fetchData = async (token, collections) => { - const resp = await fetchFiles( - token, - collections - ); - - return ( - resp.map((item) => ({ + return { + data: resp.map((item) => ({ ...item, w: window.innerWidth, h: window.innerHeight, - })) - ); -} + })), + isUpdated, + }; +}; export const localFiles = async () => { let files: Array = (await localForage.getItem('files')) || []; return files; -} +}; -export const fetchFiles = async ( - token: string, - collections: collection[] -) => { +export const syncFiles = async (token: string, collections: collection[]) => { let files = await localFiles(); - let deletedCollection = new Set(); - const collectionsUpdateTime=await localForage.getItem('collection-update-time'); + let isUpdated = false; + await removeDeletedCollectionFiles(collections); + const collectionsUpdateTime = await localForage.getItem( + 'collection-update-time' + ); for (let collection of collections) { - if (collection.isDeleted) { - deletedCollection.add(collection.id); + const lastSyncTime = await localForage.getItem( + `${collection.id}-time` + ); + if (collectionsUpdateTime === lastSyncTime) { continue; } - const thisCollectionUpdateTime=await localForage.getItem(`${collection.id}-time`); - if(collectionsUpdateTime===thisCollectionUpdateTime){ - continue; - } - let fetchedFiles = await getFiles(collection, null, 100, token)??[]; + isUpdated = true; + let fetchedFiles = (await getFiles(collection, null, 100, token)) ?? []; files.push(...fetchedFiles); var latestVersionFiles = new Map(); files.forEach((file) => { - if (!latestVersionFiles.has(file.id) || latestVersionFiles.get(file.id).updationTime < file.updationTime) { + if ( + !latestVersionFiles.has(file.id) || + latestVersionFiles.get(file.id).updationTime < file.updationTime + ) { latestVersionFiles.set(file.id, file); } }); files = []; for (const [_, file] of latestVersionFiles) { - if (file.isDeleted || deletedCollection.has(file.collectionID)) { + if (file.isDeleted) { continue; } files.push(file); @@ -106,31 +103,43 @@ export const fetchFiles = async ( (a, b) => b.metadata.creationTime - a.metadata.creationTime ); await localForage.setItem('files', files); - await localForage.setItem(`${collection.id}-time`, collectionsUpdateTime); + await localForage.setItem( + `${collection.id}-time`, + collectionsUpdateTime + ); } - return files; + return { files, isUpdated }; }; -export const getFiles = async (collection: collection, sinceTime: string, limit: number, token: string): Promise => { +export const getFiles = async ( + collection: collection, + sinceTime: string, + limit: number, + token: string +): Promise => { try { const worker = await new CryptoWorker(); let promises: Promise[] = []; let time = - sinceTime || (await localForage.getItem(`${collection.id}-time`)) || "0"; + sinceTime || + (await localForage.getItem(`${collection.id}-time`)) || + '0'; let resp; do { - resp = await HTTPService.get(`${ENDPOINT}/collections/diff`, { - collectionID: collection.id.toString(), - sinceTime: time, - limit: limit.toString(), - }, + resp = await HTTPService.get( + `${ENDPOINT}/collections/diff`, { - 'X-Auth-Token': token - }); - promises.push(...resp.data.diff.map( - async (file: file) => { + collectionID: collection.id.toString(), + sinceTime: time, + limit: limit.toString(), + }, + { + 'X-Auth-Token': token, + } + ); + promises.push( + ...resp.data.diff.map(async (file: file) => { if (!file.isDeleted) { - file.key = await worker.decryptB64( file.encryptedKey, file.keyDecryptionNonce, @@ -139,8 +148,8 @@ export const getFiles = async (collection: collection, sinceTime: string, limit: file.metadata = await worker.decryptMetadata(file); } return file; - } - )); + }) + ); if (resp.data.diff.length) { time = resp.data.diff.slice(-1)[0].updationTime.toString(); @@ -148,9 +157,9 @@ export const getFiles = async (collection: collection, sinceTime: string, limit: } while (resp.data.diff.length === limit); return await Promise.all(promises); } catch (e) { - console.log("Get files failed" + e); + console.log('Get files failed' + e); } -} +}; export const getPreview = async (token: string, file: file) => { try { const cache = await caches.open('thumbs'); @@ -171,13 +180,16 @@ export const getPreview = async (token: string, file: file) => { file.key ); try { - await cache.put(file.id.toString(), new Response(new Blob([decrypted]))); + await cache.put( + file.id.toString(), + new Response(new Blob([decrypted])) + ); } catch (e) { // TODO: handle storage full exception. } return URL.createObjectURL(new Blob([decrypted])); } catch (e) { - console.log("get preview Failed" + e); + console.log('get preview Failed' + e); } }; @@ -196,9 +208,17 @@ export const getFile = async (token: string, file: file) => { file.key ); return URL.createObjectURL(new Blob([decrypted])); - } - catch (e) { - console.log("get file failed " + e); + } catch (e) { + console.log('get file failed ' + e); } }; +const removeDeletedCollectionFiles = async (collections: collection[]) => { + const syncedCollectionIds = new Set(); + for (let collection of collections) { + syncedCollectionIds.add(collection.id); + } + let files = await localFiles(); + files = files.filter((file) => syncedCollectionIds.has(file.collectionID)); + await localForage.setItem('files', files); +}; From bf6dc99c5c6be87b85fe0dd3967d0fb4c1a4c809 Mon Sep 17 00:00:00 2001 From: Abhinav-grd Date: Mon, 8 Feb 2021 22:32:28 +0530 Subject: [PATCH 14/22] made requested changes to collectionService --- src/services/collectionService.ts | 294 +++++++++++++++++++----------- 1 file changed, 191 insertions(+), 103 deletions(-) diff --git a/src/services/collectionService.ts b/src/services/collectionService.ts index d1258d394..2982a5868 100644 --- a/src/services/collectionService.ts +++ b/src/services/collectionService.ts @@ -1,26 +1,28 @@ -import { getEndpoint } from "utils/common/apiUtil"; -import { getData, LS_KEYS } from "utils/storage/localStorage"; -import { file, user, getFiles } from "./fileService"; +import { getEndpoint } from 'utils/common/apiUtil'; +import { getData, LS_KEYS } from 'utils/storage/localStorage'; +import { file, user, getFiles } from './fileService'; import localForage from 'localforage'; -import HTTPService from "./HTTPService"; +import HTTPService from './HTTPService'; import * as Comlink from 'comlink'; -import { keyEncryptionResult } from "./uploadService"; -import { getActualKey, getToken } from "utils/common/key"; - +import { keyEncryptionResult } from './uploadService'; +import { getActualKey, getToken } from 'utils/common/key'; const CryptoWorker: any = typeof window !== 'undefined' && Comlink.wrap(new Worker('worker/crypto.worker.js', { type: 'module' })); const ENDPOINT = getEndpoint(); - enum CollectionType { - folder = "folder", - favorites = "favorites", - album = "album", + folder = 'folder', + favorites = 'favorites', + album = 'album', } +const COLLECTION_UPDATION_TIME = 'collection-updation-time'; +const FAV_COLLECTION = 'fav-collection'; +const COLLECTIONS = 'collections'; + export interface collection { id: number; owner: user; @@ -29,7 +31,7 @@ export interface collection { encryptedName?: string; nameDecryptionNonce?: string; type: string; - attributes: collectionAttributes + attributes: collectionAttributes; sharees: user[]; updationTime: number; encryptedKey: string; @@ -39,16 +41,18 @@ export interface collection { interface collectionAttributes { encryptedPath?: string; - pathDecryptionNonce?: string -}; + pathDecryptionNonce?: string; +} export interface collectionLatestFile { - collection: collection + collection: collection; file: file; } - -const getCollectionSecrets = async (collection: collection, masterKey: string) => { +const getCollectionSecrets = async ( + collection: collection, + masterKey: string +) => { const worker = await new CryptoWorker(); const userID = getData(LS_KEYS.USER).id; let decryptedKey: string; @@ -58,7 +62,6 @@ const getCollectionSecrets = async (collection: collection, masterKey: string) = collection.keyDecryptionNonce, masterKey ); - } else { const keyAttributes = getData(LS_KEYS.KEY_ATTRIBUTES); const secretKey = await worker.decryptB64( @@ -72,10 +75,13 @@ const getCollectionSecrets = async (collection: collection, masterKey: string) = secretKey ); } - collection.name = collection.name || await worker.decryptString( - collection.encryptedName, - collection.nameDecryptionNonce, - decryptedKey); + collection.name = + collection.name || + (await worker.decryptString( + collection.encryptedName, + collection.nameDecryptionNonce, + decryptedKey + )); return { ...collection, key: decryptedKey, @@ -88,50 +94,66 @@ const getCollections = async ( key: string ): Promise => { try { - const resp = await HTTPService.get(`${ENDPOINT}/collections`, { - sinceTime: sinceTime, - }, { 'X-Auth-Token': token, }); + const resp = await HTTPService.get( + `${ENDPOINT}/collections`, + { + sinceTime: sinceTime, + }, + { 'X-Auth-Token': token } + ); const promises: Promise[] = resp.data.collections.map( (collection: collection) => getCollectionSecrets(collection, key) ); return await Promise.all(promises); - } - catch (e) { - console.log("getCollections failed- " + e); + } catch (e) { + console.log('getCollections failed- ' + e); } }; export const getLocalCollections = async (): Promise => { - const collections = await localForage.getItem('collections') as collection[] ?? []; + const collections = + ((await localForage.getItem(COLLECTIONS)) as collection[]) ?? []; return collections; -} +}; + export const syncCollections = async (token: string, key: string) => { const localCollections = await getLocalCollections(); - const lastCollectionUpdateTime = await localForage.getItem('collection-update-time')??"0"; - const updatedCollections = await getCollections(token, lastCollectionUpdateTime, key) || []; - - if(updatedCollections.length==0){ + const lastCollectionUpdationTime = + (await localForage.getItem(COLLECTION_UPDATION_TIME)) ?? '0'; + const updatedCollections = + (await getCollections(token, lastCollectionUpdationTime, key)) || []; + + if (updatedCollections.length == 0) { return localCollections; } - const favCollection = await localForage.getItem('fav-collection') as collection[] ?? updatedCollections.filter(collection => collection.type === CollectionType.favorites); - const allCollectionsInstances = [...localCollections, ...updatedCollections]; + setLocalFavoriteCollection(updatedCollections); + const allCollectionsInstances = [ + ...localCollections, + ...updatedCollections, + ]; var latestCollectionsInstances = new Map(); allCollectionsInstances.forEach((collection) => { - if (!latestCollectionsInstances.has(collection.id) || latestCollectionsInstances.get(collection.id).updationTime < collection.updationTime) { + if ( + !latestCollectionsInstances.has(collection.id) || + latestCollectionsInstances.get(collection.id).updationTime < + collection.updationTime + ) { latestCollectionsInstances.set(collection.id, collection); } }); - let collections = [],updationTime= await localForage.getItem('collection-update-time'); + let collections = [], + updationTime = await localForage.getItem( + COLLECTION_UPDATION_TIME + ); for (const [_, collection] of latestCollectionsInstances) { - if (!collection.isDeleted){ + if (!collection.isDeleted) { collections.push(collection); - updationTime=Math.max(updationTime,collection.updationTime); + updationTime = Math.max(updationTime, collection.updationTime); } } - await localForage.setItem('fav-collection', favCollection); - await localForage.setItem('collection-update-time',updationTime); - await localForage.setItem('collections', collections); + await localForage.setItem(COLLECTION_UPDATION_TIME, updationTime); + await localForage.setItem(COLLECTIONS, collections); return collections; }; @@ -142,40 +164,61 @@ export const getCollectionLatestFile = ( const latestFile = new Map(); const collectionMap = new Map(); - collections.forEach(collection => collectionMap.set(Number(collection.id), collection)); - files.forEach(file => { + collections.forEach((collection) => + collectionMap.set(Number(collection.id), collection) + ); + files.forEach((file) => { if (!latestFile.has(file.collectionID)) { - latestFile.set(file.collectionID, file) + latestFile.set(file.collectionID, file); } }); let allCollectionLatestFile: collectionLatestFile[] = []; for (const [collectionID, file] of latestFile) { - allCollectionLatestFile.push({ collection: collectionMap.get(collectionID), file }); + allCollectionLatestFile.push({ + collection: collectionMap.get(collectionID), + file, + }); } return allCollectionLatestFile; -} +}; export const getFavItemIds = async (files: file[]): Promise> => { + let favCollection = await localForage.getItem(FAV_COLLECTION); + if (!favCollection) return new Set(); - let favCollection: collection = (await localForage.getItem('fav-collection'))[0]; - if (!favCollection) - return new Set(); - - return new Set(files.filter(file => file.collectionID === Number(favCollection.id)).map((file): number => file.id)); -} + return new Set( + files + .filter((file) => file.collectionID === Number(favCollection.id)) + .map((file): number => file.id) + ); +}; export const createAlbum = async (albumName: string) => { return AddCollection(albumName, CollectionType.album); -} +}; - -export const AddCollection = async (collectionName: string, type: CollectionType) => { +export const AddCollection = async ( + collectionName: string, + type: CollectionType +) => { const worker = await new CryptoWorker(); const encryptionKey = await getActualKey(); const token = getToken(); const collectionKey: string = await worker.generateMasterKey(); - const { encryptedData: encryptedKey, nonce: keyDecryptionNonce }: keyEncryptionResult = await worker.encryptToB64(collectionKey, encryptionKey); - const { encryptedData: encryptedName, nonce: nameDecryptionNonce }: keyEncryptionResult = await worker.encryptToB64(collectionName, collectionKey); + const { + encryptedData: encryptedKey, + nonce: keyDecryptionNonce, + }: keyEncryptionResult = await worker.encryptToB64( + collectionKey, + encryptionKey + ); + const { + encryptedData: encryptedName, + nonce: nameDecryptionNonce, + }: keyEncryptionResult = await worker.encryptToB64( + collectionName, + collectionKey + ); const newCollection: collection = { id: null, owner: null, @@ -187,76 +230,121 @@ export const AddCollection = async (collectionName: string, type: CollectionType attributes: {}, sharees: null, updationTime: null, - isDeleted: false + isDeleted: false, }; - let createdCollection: collection = await createCollection(newCollection, token); - createdCollection = await getCollectionSecrets(createdCollection, encryptionKey); + let createdCollection: collection = await createCollection( + newCollection, + token + ); + createdCollection = await getCollectionSecrets( + createdCollection, + encryptionKey + ); return createdCollection; -} +}; -const createCollection = async (collectionData: collection, token: string): Promise => { +const createCollection = async ( + collectionData: collection, + token: string +): Promise => { try { - const response = await HTTPService.post(`${ENDPOINT}/collections`, collectionData, null, { 'X-Auth-Token': token }); + const response = await HTTPService.post( + `${ENDPOINT}/collections`, + collectionData, + null, + { 'X-Auth-Token': token } + ); return response.data.collection; } catch (e) { - console.log("create Collection failed " + e); + console.log('create Collection failed ' + e); } -} +}; export const addToFavorites = async (file: file) => { - let favCollection: collection = (await localForage.getItem('fav-collection'))[0]; + let favCollection: collection = await localForage.getItem( + FAV_COLLECTION + ); if (!favCollection) { - favCollection = await AddCollection("Favorites", CollectionType.favorites); - await localForage.setItem('fav-collection', favCollection); + favCollection = await AddCollection( + 'Favorites', + CollectionType.favorites + ); + await localForage.setItem(FAV_COLLECTION, favCollection); } - await addtoCollection(favCollection, [file]) -} + await addtoCollection(favCollection, [file]); +}; export const removeFromFavorites = async (file: file) => { - let favCollection: collection = (await localForage.getItem('fav-collection'))[0]; - await removeFromCollection(favCollection, [file]) -} + let favCollection: collection = await localForage.getItem(FAV_COLLECTION); + await removeFromCollection(favCollection, [file]); +}; const addtoCollection = async (collection: collection, files: file[]) => { try { const params = new Object(); const worker = await new CryptoWorker(); const token = getToken(); - params["collectionID"] = collection.id; - await Promise.all(files.map(async file => { - file.collectionID = Number(collection.id); - const newEncryptedKey: keyEncryptionResult = 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 + params['collectionID'] = collection.id; + await Promise.all( + files.map(async (file) => { + file.collectionID = Number(collection.id); + const newEncryptedKey: keyEncryptionResult = 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; }) - return file; - })); - await HTTPService.post(`${ENDPOINT}/collections/add-files`, params, null, { 'X-Auth-Token': token }); + ); + await HTTPService.post( + `${ENDPOINT}/collections/add-files`, + params, + null, + { 'X-Auth-Token': token } + ); } catch (e) { - console.log("Add to collection Failed " + e); + console.log('Add to collection Failed ' + e); } -} +}; const removeFromCollection = async (collection: collection, files: file[]) => { try { const params = new Object(); const token = getToken(); - params["collectionID"] = collection.id; - await Promise.all(files.map(async file => { - if (params["fileIDs"] == undefined) { - params["fileIDs"] = []; - } - params["fileIDs"].push(file.id); - })); - await HTTPService.post(`${ENDPOINT}/collections/remove-files`, params, null, { 'X-Auth-Token': token }); + params['collectionID'] = collection.id; + await Promise.all( + files.map(async (file) => { + if (params['fileIDs'] == undefined) { + params['fileIDs'] = []; + } + params['fileIDs'].push(file.id); + }) + ); + await HTTPService.post( + `${ENDPOINT}/collections/remove-files`, + params, + null, + { 'X-Auth-Token': token } + ); } catch (e) { - console.log("remove from collection failed " + e); + console.log('remove from collection failed ' + e); } -} +}; +const setLocalFavoriteCollection = async (collections: collection[]) => { + const localFavCollection = await localForage.getItem(FAV_COLLECTION); + if (localFavCollection) return; + const favCollection = collections.filter( + (collection) => collection.type == CollectionType.favorites + ); + if (favCollection.length > 0) + await localForage.setItem(FAV_COLLECTION, favCollection[0]); +}; From e131ecd74562b6e32f2bb2fafd36e3f8fd9a0f9e Mon Sep 17 00:00:00 2001 From: Abhinav-grd Date: Mon, 8 Feb 2021 22:37:17 +0530 Subject: [PATCH 15/22] passed file to removeDeletedCollectionFiles and corrected compare with collection.updationTime --- src/services/fileService.ts | 24 ++++++++++++------------ 1 file changed, 12 insertions(+), 12 deletions(-) diff --git a/src/services/fileService.ts b/src/services/fileService.ts index 5a09a7033..dfde48a79 100644 --- a/src/services/fileService.ts +++ b/src/services/fileService.ts @@ -69,19 +69,17 @@ export const localFiles = async () => { export const syncFiles = async (token: string, collections: collection[]) => { let files = await localFiles(); let isUpdated = false; - await removeDeletedCollectionFiles(collections); - const collectionsUpdateTime = await localForage.getItem( - 'collection-update-time' - ); + await removeDeletedCollectionFiles(collections, files); for (let collection of collections) { - const lastSyncTime = await localForage.getItem( - `${collection.id}-time` - ); - if (collectionsUpdateTime === lastSyncTime) { + const lastSyncTime = + (await localForage.getItem(`${collection.id}-time`)) ?? 0; + if (collection.updationTime === lastSyncTime) { continue; } isUpdated = true; - let fetchedFiles = (await getFiles(collection, null, 100, token)) ?? []; + let fetchedFiles = + (await getFiles(collection, lastSyncTime.toString(), 100, token)) ?? + []; files.push(...fetchedFiles); var latestVersionFiles = new Map(); files.forEach((file) => { @@ -105,7 +103,7 @@ export const syncFiles = async (token: string, collections: collection[]) => { await localForage.setItem('files', files); await localForage.setItem( `${collection.id}-time`, - collectionsUpdateTime + collection.updationTime ); } return { files, isUpdated }; @@ -213,12 +211,14 @@ export const getFile = async (token: string, file: file) => { } }; -const removeDeletedCollectionFiles = async (collections: collection[]) => { +const removeDeletedCollectionFiles = async ( + collections: collection[], + files: file[] +) => { const syncedCollectionIds = new Set(); for (let collection of collections) { syncedCollectionIds.add(collection.id); } - let files = await localFiles(); files = files.filter((file) => syncedCollectionIds.has(file.collectionID)); await localForage.setItem('files', files); }; From e8ae13221eb2a1e6b091aa52c3d69fb516d94995 Mon Sep 17 00:00:00 2001 From: Abhinav-grd Date: Tue, 9 Feb 2021 10:37:46 +0530 Subject: [PATCH 16/22] more corrections --- src/services/collectionService.ts | 17 +++++++++++------ src/services/fileService.ts | 15 +++++++-------- 2 files changed, 18 insertions(+), 14 deletions(-) diff --git a/src/services/collectionService.ts b/src/services/collectionService.ts index 2982a5868..f4219c117 100644 --- a/src/services/collectionService.ts +++ b/src/services/collectionService.ts @@ -165,7 +165,7 @@ export const getCollectionLatestFile = ( const collectionMap = new Map(); collections.forEach((collection) => - collectionMap.set(Number(collection.id), collection) + collectionMap.set(collection.id, collection) ); files.forEach((file) => { if (!latestFile.has(file.collectionID)) { @@ -188,7 +188,7 @@ export const getFavItemIds = async (files: file[]): Promise> => { return new Set( files - .filter((file) => file.collectionID === Number(favCollection.id)) + .filter((file) => file.collectionID === favCollection.id) .map((file): number => file.id) ); }; @@ -275,7 +275,9 @@ export const addToFavorites = async (file: file) => { }; export const removeFromFavorites = async (file: file) => { - let favCollection: collection = await localForage.getItem(FAV_COLLECTION); + let favCollection: collection = await localForage.getItem( + FAV_COLLECTION + ); await removeFromCollection(favCollection, [file]); }; @@ -287,7 +289,7 @@ const addtoCollection = async (collection: collection, files: file[]) => { params['collectionID'] = collection.id; await Promise.all( files.map(async (file) => { - file.collectionID = Number(collection.id); + file.collectionID = collection.id; const newEncryptedKey: keyEncryptionResult = await worker.encryptToB64( file.key, collection.key @@ -341,10 +343,13 @@ const removeFromCollection = async (collection: collection, files: file[]) => { const setLocalFavoriteCollection = async (collections: collection[]) => { const localFavCollection = await localForage.getItem(FAV_COLLECTION); - if (localFavCollection) return; + if (localFavCollection) { + return; + } const favCollection = collections.filter( (collection) => collection.type == CollectionType.favorites ); - if (favCollection.length > 0) + if (favCollection.length > 0) { await localForage.setItem(FAV_COLLECTION, favCollection[0]); + } }; diff --git a/src/services/fileService.ts b/src/services/fileService.ts index dfde48a79..eb2d0739a 100644 --- a/src/services/fileService.ts +++ b/src/services/fileService.ts @@ -69,7 +69,7 @@ export const localFiles = async () => { export const syncFiles = async (token: string, collections: collection[]) => { let files = await localFiles(); let isUpdated = false; - await removeDeletedCollectionFiles(collections, files); + files = await removeDeletedCollectionFiles(collections, files); for (let collection of collections) { const lastSyncTime = (await localForage.getItem(`${collection.id}-time`)) ?? 0; @@ -78,8 +78,7 @@ export const syncFiles = async (token: string, collections: collection[]) => { } isUpdated = true; let fetchedFiles = - (await getFiles(collection, lastSyncTime.toString(), 100, token)) ?? - []; + (await getFiles(collection, lastSyncTime, 100, token)) ?? []; files.push(...fetchedFiles); var latestVersionFiles = new Map(); files.forEach((file) => { @@ -111,7 +110,7 @@ export const syncFiles = async (token: string, collections: collection[]) => { export const getFiles = async ( collection: collection, - sinceTime: string, + sinceTime: number, limit: number, token: string ): Promise => { @@ -120,15 +119,15 @@ export const getFiles = async ( let promises: Promise[] = []; let time = sinceTime || - (await localForage.getItem(`${collection.id}-time`)) || - '0'; + (await localForage.getItem(`${collection.id}-time`)) || + 0; let resp; do { resp = await HTTPService.get( `${ENDPOINT}/collections/diff`, { collectionID: collection.id.toString(), - sinceTime: time, + sinceTime: time.toString(), limit: limit.toString(), }, { @@ -220,5 +219,5 @@ const removeDeletedCollectionFiles = async ( syncedCollectionIds.add(collection.id); } files = files.filter((file) => syncedCollectionIds.has(file.collectionID)); - await localForage.setItem('files', files); + return files; }; From f6c8102fec7dd8679b87bc1ab1eb1596950d4e44 Mon Sep 17 00:00:00 2001 From: Abhinav-grd Date: Tue, 9 Feb 2021 11:12:23 +0530 Subject: [PATCH 17/22] declare variable with type instead of typecasting --- src/services/collectionService.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/services/collectionService.ts b/src/services/collectionService.ts index f4219c117..b0f48cd84 100644 --- a/src/services/collectionService.ts +++ b/src/services/collectionService.ts @@ -111,8 +111,8 @@ const getCollections = async ( }; export const getLocalCollections = async (): Promise => { - const collections = - ((await localForage.getItem(COLLECTIONS)) as collection[]) ?? []; + const collections: collection[] = + (await localForage.getItem(COLLECTIONS)) ?? []; return collections; }; From 21297e6e73ee6dbee50b90d8a40f7851b3a8980b Mon Sep 17 00:00:00 2001 From: Abhinav-grd Date: Tue, 9 Feb 2021 11:13:05 +0530 Subject: [PATCH 18/22] use constants for fileDb name --- src/services/fileService.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/services/fileService.ts b/src/services/fileService.ts index eb2d0739a..c3e1c47af 100644 --- a/src/services/fileService.ts +++ b/src/services/fileService.ts @@ -16,6 +16,8 @@ localForage.config({ storeName: 'files', }); +const FILES = 'files'; + export interface fileAttribute { encryptedData: Uint8Array | string; decryptionHeader: string; @@ -62,7 +64,7 @@ export const syncData = async (token, collections) => { }; export const localFiles = async () => { - let files: Array = (await localForage.getItem('files')) || []; + let files: Array = (await localForage.getItem(FILES)) || []; return files; }; From a4a3ad2e40a007f0c6f6e03394752a74546cdca2 Mon Sep 17 00:00:00 2001 From: Abhinav-grd Date: Tue, 9 Feb 2021 11:34:19 +0530 Subject: [PATCH 19/22] renamed collectionLatestfile to collectionAndItsLatestFile --- .../gallery/components/CollectionDropZone.tsx | 4 ++-- .../gallery/components/CollectionSelector.tsx | 7 +++--- .../gallery/components/CreateCollection.tsx | 6 ++--- src/pages/gallery/index.tsx | 24 ++++++++++++------- src/services/collectionService.ts | 12 +++++----- src/services/uploadService.ts | 6 ++--- 6 files changed, 32 insertions(+), 27 deletions(-) diff --git a/src/pages/gallery/components/CollectionDropZone.tsx b/src/pages/gallery/components/CollectionDropZone.tsx index 12f4501c0..6d466506d 100644 --- a/src/pages/gallery/components/CollectionDropZone.tsx +++ b/src/pages/gallery/components/CollectionDropZone.tsx @@ -9,7 +9,7 @@ function CollectionDropZone({ closeModal, showModal, refetchData, - collectionLatestFile, + collectionAndItsLatestFile, setProgressView, progressBarProps @@ -21,7 +21,7 @@ function CollectionDropZone({ progressBarProps.setPercentComplete(0); setProgressView(true); - await UploadService.uploadFiles(acceptedFiles, collectionLatestFile, token, progressBarProps); + await UploadService.uploadFiles(acceptedFiles, collectionAndItsLatestFile, token, progressBarProps); refetchData(); setProgressView(false); } diff --git a/src/pages/gallery/components/CollectionSelector.tsx b/src/pages/gallery/components/CollectionSelector.tsx index cde34ace8..2d5727020 100644 --- a/src/pages/gallery/components/CollectionSelector.tsx +++ b/src/pages/gallery/components/CollectionSelector.tsx @@ -10,17 +10,16 @@ function CollectionSelector(props) { uploadModalView, closeUploadModal, showUploadModal, - collectionLatestFile, + collectionAndItsLatestFile, ...rest } = props; - - const CollectionIcons = collectionLatestFile?.map((item) => ( + const CollectionIcons = collectionAndItsLatestFile?.map((item) => ( { }} forcedEnable /> diff --git a/src/pages/gallery/components/CreateCollection.tsx b/src/pages/gallery/components/CreateCollection.tsx index 38fd96197..027edc5d7 100644 --- a/src/pages/gallery/components/CreateCollection.tsx +++ b/src/pages/gallery/components/CreateCollection.tsx @@ -2,7 +2,7 @@ import React, { useEffect, useState } from 'react'; import { Button, Form, Modal } from 'react-bootstrap'; import { createAlbum } from 'services/collectionService'; import UploadService from 'services/uploadService'; -import { collectionLatestFile } from 'services/collectionService' +import { CollectionAndItsLatestFile } from 'services/collectionService' import { getToken } from 'utils/common/key'; export default function CreateCollection(props) { @@ -35,12 +35,12 @@ export default function CreateCollection(props) { const collection = await createAlbum(albumName); - const collectionLatestFile: collectionLatestFile = { collection, file: null } + const collectionAndItsLatestFile: CollectionAndItsLatestFile = { collection, file: null } progressBarProps.setPercentComplete(0); setProgressView(true); - await UploadService.uploadFiles(acceptedFiles, collectionLatestFile, token, progressBarProps); + await UploadService.uploadFiles(acceptedFiles, collectionAndItsLatestFile, token, progressBarProps); refetchData(); setProgressView(false); } diff --git a/src/pages/gallery/index.tsx b/src/pages/gallery/index.tsx index 94491205b..4d1845b1c 100644 --- a/src/pages/gallery/index.tsx +++ b/src/pages/gallery/index.tsx @@ -23,14 +23,14 @@ import Upload from './components/Upload'; import { collection, syncCollections, - collectionLatestFile, - getCollectionLatestFile, + CollectionAndItsLatestFile, + getCollectionAndItsLatestFile, getFavItemIds, getLocalCollections, } from 'services/collectionService'; import constants from 'utils/strings/constants'; -const DATE_CONTAINER_HEIGHT = 30; +const DATE_CONTAINER_HEIGHT = 45; const IMAGE_CONTAINER_HEIGHT = 200; const NO_OF_PAGES = 2; @@ -108,9 +108,10 @@ export default function Gallery(props) { const router = useRouter(); const [loading, setLoading] = useState(false); const [collections, setCollections] = useState([]); - const [collectionLatestFile, setCollectionLatestFile] = useState< - collectionLatestFile[] - >([]); + const [ + collectionAndItsLatestFile, + setCollectionAndItsLatestFile, + ] = useState([]); const [data, setData] = useState(); const [favItemIds, setFavItemIds] = useState>(); const [open, setOpen] = useState(false); @@ -132,8 +133,13 @@ export default function Gallery(props) { setLoading(true); const data = await localFiles(); const collections = await getLocalCollections(); + const collectionAndItsLatestFile = await getCollectionAndItsLatestFile( + collections, + data + ); setData(data); setCollections(collections); + setCollectionAndItsLatestFile(collectionAndItsLatestFile); setLoading(false); setProgress(80); await syncWithRemote(); @@ -148,7 +154,7 @@ export default function Gallery(props) { const encryptionKey = await getActualKey(); const collections = await syncCollections(token, encryptionKey); const { data, isUpdated } = await syncData(token, collections); - const collectionLatestFile = await getCollectionLatestFile( + const collectionAndItsLatestFile = await getCollectionAndItsLatestFile( collections, data ); @@ -157,7 +163,7 @@ export default function Gallery(props) { if (isUpdated) { setData(data); } - setCollectionLatestFile(collectionLatestFile); + setCollectionAndItsLatestFile(collectionAndItsLatestFile); setFavItemIds(favItemIds); setSinceTime(new Date().getTime()); props.setUploadButtonView(true); @@ -340,7 +346,7 @@ export default function Gallery(props) { uploadModalView={props.uploadModalView} closeUploadModal={props.closeUploadModal} showUploadModal={props.showUploadModal} - collectionLatestFile={collectionLatestFile} + collectionAndItsLatestFile={collectionAndItsLatestFile} refetchData={syncWithRemote} /> {filteredData.length ? ( diff --git a/src/services/collectionService.ts b/src/services/collectionService.ts index b0f48cd84..36073a58d 100644 --- a/src/services/collectionService.ts +++ b/src/services/collectionService.ts @@ -44,7 +44,7 @@ interface collectionAttributes { pathDecryptionNonce?: string; } -export interface collectionLatestFile { +export interface CollectionAndItsLatestFile { collection: collection; file: file; } @@ -157,10 +157,10 @@ export const syncCollections = async (token: string, key: string) => { return collections; }; -export const getCollectionLatestFile = ( +export const getCollectionAndItsLatestFile = ( collections: collection[], files: file[] -): collectionLatestFile[] => { +): CollectionAndItsLatestFile[] => { const latestFile = new Map(); const collectionMap = new Map(); @@ -172,14 +172,14 @@ export const getCollectionLatestFile = ( latestFile.set(file.collectionID, file); } }); - let allCollectionLatestFile: collectionLatestFile[] = []; + let allCollectionAndItsLatestFile: CollectionAndItsLatestFile[] = []; for (const [collectionID, file] of latestFile) { - allCollectionLatestFile.push({ + allCollectionAndItsLatestFile.push({ collection: collectionMap.get(collectionID), file, }); } - return allCollectionLatestFile; + return allCollectionAndItsLatestFile; }; export const getFavItemIds = async (files: file[]): Promise> => { diff --git a/src/services/uploadService.ts b/src/services/uploadService.ts index e36d8e4f8..9dca22850 100644 --- a/src/services/uploadService.ts +++ b/src/services/uploadService.ts @@ -3,7 +3,7 @@ import HTTPService from './HTTPService'; import * as Comlink from 'comlink'; import EXIF from "exif-js"; import { fileAttribute } from './fileService'; -import { collection, collectionLatestFile } from "./collectionService" +import { collection, CollectionAndItsLatestFile } from "./collectionService" import { FILE_TYPE } from 'pages/gallery'; const CryptoWorker: any = typeof window !== 'undefined' && @@ -80,7 +80,7 @@ class UploadService { private totalFilesCount: number private metadataMap: Map; - public async uploadFiles(recievedFiles: File[], collectionLatestFile: collectionLatestFile, token: string, progressBarProps) { + public async uploadFiles(recievedFiles: File[], collectionAndItsLatestFile: CollectionAndItsLatestFile, token: string, progressBarProps) { try { const worker = await new CryptoWorker(); this.stepsCompleted = 0; @@ -107,7 +107,7 @@ class UploadService { while (actualFiles.length > 0) { var promises = []; for (var i = 0; i < 5 && actualFiles.length > 0; i++) - promises.push(this.uploadHelper(progressBarProps, actualFiles.pop(), collectionLatestFile.collection, token)); + promises.push(this.uploadHelper(progressBarProps, actualFiles.pop(), collectionAndItsLatestFile.collection, token)); uploadFilesWithoutMetaData.push(...await Promise.all(promises)); } From 6b8fc327e134ade8b0e362a9596a7c95f7904aed Mon Sep 17 00:00:00 2001 From: Abhinav-grd Date: Tue, 9 Feb 2021 11:43:33 +0530 Subject: [PATCH 20/22] removed console logs --- src/components/PhotoSwipe/PhotoSwipe.tsx | 3 --- src/services/uploadService.ts | 1 - src/utils/common/apiUtil.ts | 1 - 3 files changed, 5 deletions(-) diff --git a/src/components/PhotoSwipe/PhotoSwipe.tsx b/src/components/PhotoSwipe/PhotoSwipe.tsx index 8e7f3546f..2f211d3f3 100644 --- a/src/components/PhotoSwipe/PhotoSwipe.tsx +++ b/src/components/PhotoSwipe/PhotoSwipe.tsx @@ -51,7 +51,6 @@ function PhotoSwipe(props: Iprops) { }, [isOpen]); function updateFavButton() { - console.log(this.currItem.id, props.favItemIds) setIsFav(isInFav(this?.currItem)); } @@ -113,14 +112,12 @@ function PhotoSwipe(props: Iprops) { if (!isInFav(file)) { favItemIds.add(file.id); await addToFavorites(file); - console.log("added to Favorites"); setIsFav(true); setFavItemIds(favItemIds); } else { favItemIds.delete(file.id); await removeFromFavorites(file) - console.log("removed from Favorites"); setIsFav(false); setFavItemIds(favItemIds); diff --git a/src/services/uploadService.ts b/src/services/uploadService.ts index 9dca22850..07799b04c 100644 --- a/src/services/uploadService.ts +++ b/src/services/uploadService.ts @@ -364,7 +364,6 @@ class UploadService { resolve(blob); }), 'image/jpeg', 0.4 }); - console.log(URL.createObjectURL(thumbnailBlob)); const thumbnail = this.getUint8ArrayView(thumbnailBlob); return thumbnail; } catch (e) { diff --git a/src/utils/common/apiUtil.ts b/src/utils/common/apiUtil.ts index c1da535d5..d9da1e289 100644 --- a/src/utils/common/apiUtil.ts +++ b/src/utils/common/apiUtil.ts @@ -1,5 +1,4 @@ export const getEndpoint = () => { const endPoint = process.env.NEXT_PUBLIC_ENTE_ENDPOINT ?? "https://api.ente.io"; - console.log(endPoint); return endPoint; } From 21f2a7a4df02e36125386a2a299907edcd3ac943 Mon Sep 17 00:00:00 2001 From: Abhinav-grd Date: Tue, 9 Feb 2021 11:44:00 +0530 Subject: [PATCH 21/22] added setting favItemIds state on intial load --- src/pages/gallery/index.tsx | 3 +++ 1 file changed, 3 insertions(+) diff --git a/src/pages/gallery/index.tsx b/src/pages/gallery/index.tsx index 4d1845b1c..3dbdd9440 100644 --- a/src/pages/gallery/index.tsx +++ b/src/pages/gallery/index.tsx @@ -140,6 +140,9 @@ export default function Gallery(props) { setData(data); setCollections(collections); setCollectionAndItsLatestFile(collectionAndItsLatestFile); + const favItemIds = await getFavItemIds(data); + setFavItemIds(favItemIds); + setLoading(false); setProgress(80); await syncWithRemote(); From 22bb37c58f707de642de85dfcbdc1057b51f58fc Mon Sep 17 00:00:00 2001 From: Abhinav-grd Date: Tue, 9 Feb 2021 11:48:46 +0530 Subject: [PATCH 22/22] corrected casing --- src/services/collectionService.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/services/collectionService.ts b/src/services/collectionService.ts index 36073a58d..6b608605d 100644 --- a/src/services/collectionService.ts +++ b/src/services/collectionService.ts @@ -271,7 +271,7 @@ export const addToFavorites = async (file: file) => { ); await localForage.setItem(FAV_COLLECTION, favCollection); } - await addtoCollection(favCollection, [file]); + await addToCollection(favCollection, [file]); }; export const removeFromFavorites = async (file: file) => { @@ -281,7 +281,7 @@ export const removeFromFavorites = async (file: file) => { await removeFromCollection(favCollection, [file]); }; -const addtoCollection = async (collection: collection, files: file[]) => { +const addToCollection = async (collection: collection, files: file[]) => { try { const params = new Object(); const worker = await new CryptoWorker();