updated to use the DownloadManager

src/components/PhotoSwipe/PhotoSwipe.tsx

@@ -10,6 +10,7 @@ import {
 } from 'services/collectionService';
 import { file } from 'services/fileService';
 import constants from 'utils/strings/constants';
+import DownloadManger from 'services/downloadManager';
 
 interface Iprops {
     isOpen: boolean;
@@ -123,10 +124,10 @@ function PhotoSwipe(props: Iprops) {
             setFavItemIds(favItemIds);
         }
     };
-    const downloadFile = (file) => {
+    const downloadFile = async (file) => {
         const a = document.createElement('a');
         a.style.display = 'none';
-        a.href = file.msrc;
+        a.href = await DownloadManger.getFile(file);
         a.download = file.metadata['title'];
         document.body.appendChild(a);
         a.click();

src/pages/gallery/components/PreviewCard.tsx

@@ -1,8 +1,9 @@
 import React, { useEffect, useState } from 'react';
-import { file, getPreview } from 'services/fileService';
+import { file } from 'services/fileService';
 import { getData, LS_KEYS } from 'utils/storage/localStorage';
 import styled from 'styled-components';
 import PlayCircleOutline from 'components/PlayCircleOutline';
+import DownloadManager from 'services/downloadManager';
 
 interface IProps {
     data: file;
@@ -48,7 +49,7 @@ export default function PreviewCard(props: IProps) {
         if (data && !data.msrc) {
             const main = async () => {
                 const token = getData(LS_KEYS.USER).token;
-                const url = await getPreview(token, data);
+                const url = await DownloadManager.getPreview(data);
                 setImgSrc(url);
                 data.msrc = url;
                 updateUrl(url);

src/pages/gallery/index.tsx

@@ -1,14 +1,7 @@
 import React, { useEffect, useState } from 'react';
 import { useRouter } from 'next/router';
-import Spinner from 'react-bootstrap/Spinner';
 import { getKey, SESSION_KEYS } from 'utils/storage/sessionStorage';
-import {
+import { file, syncData, localFiles } from 'services/fileService';
-    file,
-    getFile,
-    getPreview,
-    syncData,
-    localFiles,
-} from 'services/fileService';
 import { getData, LS_KEYS } from 'utils/storage/localStorage';
 import PreviewCard from './components/PreviewCard';
 import { getActualKey, getToken } from 'utils/common/key';
@@ -20,6 +13,7 @@ import { VariableSizeList as List } from 'react-window';
 import LoadingBar from 'react-top-loading-bar';
 import Collections from './components/Collections';
 import Upload from './components/Upload';
+import DownloadManager from '../../services/downloadManager';
 import {
     collection,
     syncCollections,
@@ -247,9 +241,8 @@ export default function Gallery(props) {
     };
 
     const getSlideData = async (instance: any, index: number, item: file) => {
-        const token = getData(LS_KEYS.USER).token;
         if (!item.msrc) {
-            const url = await getPreview(token, item);
+            const url = await DownloadManager.getPreview(item);
             updateUrl(item.dataIndex)(url);
             item.msrc = url;
             if (!item.src) {
@@ -266,7 +259,7 @@ export default function Gallery(props) {
         }
         if (!fetching[item.dataIndex]) {
             fetching[item.dataIndex] = true;
-            const url = await getFile(token, item);
+            const url = await DownloadManager.getFile(item);
             updateSrcUrl(item.dataIndex, url);
             if (item.metadata.fileType === FILE_TYPE.VIDEO) {
                 item.html = `

src/services/fileService.ts

@@ -154,58 +154,6 @@ export const getFiles = async (
         console.log('Get files failed' + e);
     }
 };
-export const getPreview = async (token: string, file: file) => {
-    try {
-        const cache = await caches.open('thumbs');
-        const cacheResp: Response = await cache.match(file.id.toString());
-        if (cacheResp) {
-            return URL.createObjectURL(await cacheResp.blob());
-        }
-        const resp = await HTTPService.get(
-            `${ENDPOINT}/files/preview/${file.id}`,
-            null,
-            { 'X-Auth-Token': token },
-            { responseType: 'arraybuffer' }
-        );
-        const worker = await new CryptoWorker();
-        const decrypted: any = await worker.decryptThumbnail(
-            new Uint8Array(resp.data),
-            await worker.fromB64(file.thumbnail.decryptionHeader),
-            file.key
-        );
-        try {
-            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);
-    }
-};
-
-export const getFile = async (token: string, file: file) => {
-    try {
-        const resp = await HTTPService.get(
-            `${ENDPOINT}/files/download/${file.id}`,
-            null,
-            { 'X-Auth-Token': token },
-            { responseType: 'arraybuffer' }
-        );
-        const worker = await new CryptoWorker();
-        const decrypted: any = await worker.decryptFile(
-            new Uint8Array(resp.data),
-            await worker.fromB64(file.file.decryptionHeader),
-            file.key
-        );
-        return URL.createObjectURL(new Blob([decrypted]));
-    } catch (e) {
-        console.log('get file failed ' + e);
-    }
-};
 
 const removeDeletedCollectionFiles = async (
     collections: collection[],