feat: Download Manager

package.json

@@ -36,9 +36,10 @@
     "@bugsnag/js": "^7.3.5",
     "@emotion/core": "^10.0.35",
     "@emotion/styled": "^10.0.27",
-    "@rocket.chat/fuselage": "^0.15.1",
-    "@rocket.chat/fuselage-hooks": "^0.15.1",
-    "@rocket.chat/icons": "^0.15.1",
+    "@rocket.chat/css-in-js": "^0.17.2",
+    "@rocket.chat/fuselage": "^0.17.2",
+    "@rocket.chat/fuselage-hooks": "^0.17.2",
+    "@rocket.chat/icons": "^0.17.2",
     "abort-controller": "^3.0.0",
     "electron-store": "^6.0.0",
     "electron-updater": "^4.3.5",
@@ -71,7 +72,6 @@
     "@rollup/plugin-replace": "^2.3.3",
     "@rollup/plugin-typescript": "^6.0.0",
     "@types/electron-devtools-installer": "^2.2.0",
-    "@types/i18next-node-fs-backend": "^2.1.0",
     "@types/jest": "^26.0.14",
     "@types/meteor": "^1.4.49",
     "@types/node": "^12",
@@ -86,7 +86,7 @@
     "@typescript-eslint/parser": "^4.2.0",
     "babel-eslint": "^10.1.0",
     "builtin-modules": "^3.1.0",
-    "chokidar": "^3.4.2",
+    "chokidar": "^3.4.3",
     "conventional-changelog-cli": "^2.1.0",
     "convert-svg-to-png": "^0.5.0",
     "electron": "^10.0.1",
@@ -97,7 +97,7 @@
     "eslint-plugin-import": "^2.22.0",
     "eslint-plugin-react": "^7.21.1",
     "eslint-plugin-react-hooks": "^4.1.0",
-    "jest": "^26.4.2",
+    "jest": "^26.6.3",
     "jimp": "^0.16.1",
     "npm-run-all": "^4.1.5",
     "puppeteer": "^5.5.0",
@@ -108,6 +108,9 @@
     "typescript": "^4.0.3",
     "xvfb-maybe": "^0.2.1"
   },
+  "optionalDependencies": {
+    "fsevents": "2.2.1"
+  },
   "engines": {
     "node": ">=12.8.x"
   },

src/app/actions.ts

@@ -1,11 +1,10 @@
+import { downloads } from '../downloads/reducers/downloads';
 import {
   externalProtocols,
   trustedCertificates,
 } from '../navigation/reducers';
-import {
-  currentServerUrl,
-  servers,
-} from '../servers/reducers';
+import { servers } from '../servers/reducers';
+import { currentView } from '../ui/reducers/currentView';
 import { isMenuBarEnabled } from '../ui/reducers/isMenuBarEnabled';
 import { isShowWindowOnUnreadChangedEnabled } from '../ui/reducers/isShowWindowOnUnreadChangedEnabled';
 import { isSideBarEnabled } from '../ui/reducers/isSideBarEnabled';
@@ -28,8 +27,9 @@ export type AppActionTypeToPayloadMap = {
   [APP_PATH_SET]: string;
   [APP_VERSION_SET]: string;
   [APP_SETTINGS_LOADED]: {
-    currentServerUrl: ReturnType<typeof currentServerUrl>;
+    currentView: ReturnType<typeof currentView>;
     doCheckForUpdatesOnStartup: ReturnType<typeof doCheckForUpdatesOnStartup>;
+    downloads: ReturnType<typeof downloads>;
     externalProtocols: ReturnType<typeof externalProtocols>;
     isEachUpdatesSettingConfigurable: ReturnType<typeof isEachUpdatesSettingConfigurable>;
     isMenuBarEnabled: ReturnType<typeof isMenuBarEnabled>;

src/app/main/persistence.ts

@@ -5,7 +5,17 @@ import { selectPersistableValues } from '../selectors';
 
 type PersistableValues = ReturnType<typeof selectPersistableValues>;
 
-const migrations = {};
+const migrations = {
+  '>=3.1.0': (store: ElectronStore<PersistableValues & { currentServerUrl: string }>) => {
+    if (!store.has('currentServerUrl')) {
+      return;
+    }
+
+    const currentServerUrl = store.get('currentServerUrl');
+    store.set('currentView', currentServerUrl ? { url: currentServerUrl } : 'add-new-server');
+    store.delete('currentServerUrl');
+  },
+};
 
 let electronStore: ElectronStore<PersistableValues>;
 

src/app/selectors.ts

@@ -5,8 +5,9 @@ import { RootState } from '../store/rootReducer';
 import { APP_SETTINGS_LOADED } from './actions';
 
 export const selectPersistableValues = createStructuredSelector<Partial<RootState>, ActionOf<typeof APP_SETTINGS_LOADED>['payload']>({
-  currentServerUrl: ({ currentServerUrl }) => currentServerUrl,
+  currentView: ({ currentView }) => currentView,
   doCheckForUpdatesOnStartup: ({ doCheckForUpdatesOnStartup }) => doCheckForUpdatesOnStartup,
+  downloads: ({ downloads }) => downloads,
   isMenuBarEnabled: ({ isMenuBarEnabled }) => isMenuBarEnabled,
   isShowWindowOnUnreadChangedEnabled: ({ isShowWindowOnUnreadChangedEnabled }) => isShowWindowOnUnreadChangedEnabled,
   isSideBarEnabled: ({ isSideBarEnabled }) => isSideBarEnabled,

src/downloads/actions.ts

@@ -0,0 +1,13 @@
+import { Download } from './common';
+
+export const DOWNLOAD_CREATED = 'downloads/created';
+export const DOWNLOAD_REMOVED = 'dowloads/removed';
+export const DOWNLOADS_CLEARED = 'downloads/cleared';
+export const DOWNLOAD_UPDATED = 'downloads/updated';
+
+export type DownloadsActionTypeToPayloadMap = {
+  [DOWNLOAD_CREATED]: Download;
+  [DOWNLOAD_UPDATED]: Pick<Download, 'itemId'> & Partial<Download>;
+  [DOWNLOAD_REMOVED]: Download['itemId'];
+  [DOWNLOADS_CLEARED]: void;
+}

src/downloads/common.ts

@@ -0,0 +1,23 @@
+import { Server } from '../servers/common';
+
+export const DownloadStatus = {
+  ALL: 'All',
+  PAUSED: 'Paused',
+  CANCELLED: 'Cancelled',
+} as const;
+
+export type Download = {
+  itemId: number;
+  state: 'progressing' | 'paused' | 'completed' | 'cancelled' | 'interrupted';
+  status: typeof DownloadStatus[keyof typeof DownloadStatus];
+  fileName: string;
+  receivedBytes: number;
+  totalBytes: number;
+  startTime: number;
+  endTime: number | undefined;
+  url: string;
+  serverUrl: Server['url'];
+  serverTitle: Server['title'];
+  savePath: string;
+  mimeType: string;
+};

src/downloads/main.ts

@@ -0,0 +1,186 @@
+import path from 'path';
+
+import { clipboard, DownloadItem, Event, shell, WebContents, webContents } from 'electron';
+
+import { handle } from '../ipc/main';
+import { dispatch, select } from '../store';
+import {
+  DOWNLOAD_CREATED,
+  DOWNLOAD_REMOVED,
+  DOWNLOAD_UPDATED,
+} from './actions';
+import { Download, DownloadStatus } from './common';
+
+const items = new Map<Download['itemId'], DownloadItem>();
+
+export const handleWillDownloadEvent = async (_event: Event, item: DownloadItem, serverWebContents: WebContents): Promise<void> => {
+  const itemId = Date.now();
+
+  items.set(itemId, item);
+
+  const fileName = item.getFilename();
+
+  const extension = path.extname(fileName)?.slice(1).toLowerCase();
+
+  if (extension) {
+    item.setSaveDialogOptions({
+      filters: [
+        {
+          name: `*.${ extension }`,
+          extensions: [extension],
+        },
+        {
+          name: '*.*',
+          extensions: ['*'],
+        },
+      ],
+    });
+  }
+
+  const server = select(({ servers }) => servers.find((server) => server.webContentsId === serverWebContents.id));
+
+  dispatch({
+    type: DOWNLOAD_CREATED,
+    payload: {
+      itemId,
+      state: item.isPaused() ? 'paused' : item.getState(),
+      status: item.isPaused() ? DownloadStatus.PAUSED : DownloadStatus.ALL,
+      fileName: item.getFilename(),
+      receivedBytes: item.getReceivedBytes(),
+      totalBytes: item.getTotalBytes(),
+      startTime: item.getStartTime() * 1000,
+      endTime: undefined,
+      url: item.getURL(),
+      serverUrl: server?.url,
+      serverTitle: server?.title,
+      mimeType: item.getMimeType(),
+      savePath: item.getSavePath(),
+    },
+  });
+
+  item.on('updated', () => {
+    dispatch({
+      type: DOWNLOAD_UPDATED,
+      payload: {
+        itemId,
+        state: item.isPaused() ? 'paused' : item.getState(),
+        status: item.isPaused() ? DownloadStatus.PAUSED : DownloadStatus.ALL,
+        fileName: item.getFilename(),
+        receivedBytes: item.getReceivedBytes(),
+        totalBytes: item.getTotalBytes(),
+        startTime: item.getStartTime() * 1000,
+        endTime: Date.now(),
+        url: item.getURL(),
+        mimeType: item.getMimeType(),
+        savePath: item.getSavePath(),
+      },
+    });
+  });
+
+  item.on('done', () => {
+    dispatch({
+      type: DOWNLOAD_UPDATED,
+      payload: {
+        itemId,
+        state: item.isPaused() ? 'paused' : item.getState(),
+        status: item.getState() === 'cancelled' ? DownloadStatus.CANCELLED : DownloadStatus.ALL,
+        fileName: item.getFilename(),
+        receivedBytes: item.getReceivedBytes(),
+        totalBytes: item.getTotalBytes(),
+        startTime: item.getStartTime() * 1000,
+        endTime: Date.now(),
+        url: item.getURL(),
+        mimeType: item.getMimeType(),
+        savePath: item.getSavePath(),
+      },
+    });
+
+    items.delete(itemId);
+  });
+};
+
+export const setupDownloads = (): void => {
+  handle('downloads/show-in-folder', async (_webContents, itemId) => {
+    const download = select(({ downloads }) => downloads[itemId]);
+
+    if (!download) {
+      return;
+    }
+
+    shell.showItemInFolder(download.savePath);
+  });
+
+  handle('downloads/copy-link', async (_webContent, itemId) => {
+    const download = select(({ downloads }) => downloads[itemId]);
+
+    if (!download) {
+      return;
+    }
+
+    clipboard.write({ text: download.url });
+  });
+
+  handle('downloads/pause', async (_webContent, itemId) => {
+    if (!items.has(itemId)) {
+      return;
+    }
+
+    const item = items.get(itemId);
+
+    if (item.isPaused()) {
+      return;
+    }
+
+    item.pause();
+  });
+
+  handle('downloads/resume', async (_webContent, itemId) => {
+    if (!items.has(itemId)) {
+      return;
+    }
+
+    const item = items.get(itemId);
+
+    if (!item.canResume()) {
+      return;
+    }
+
+    item.resume();
+  });
+
+  handle('downloads/cancel', async (_webContent, itemId) => {
+    if (!items.has(itemId)) {
+      return;
+    }
+
+    const item = items.get(itemId);
+    item.cancel();
+  });
+
+  handle('downloads/retry', async (_webContent, itemId) => {
+    const { url, webContentsId } = select(({ downloads, servers }) => {
+      const { url, serverUrl } = downloads[itemId];
+      const { webContentsId } = servers.find((server) => server.url === serverUrl);
+      return { url, webContentsId };
+    });
+
+    dispatch({
+      type: DOWNLOAD_REMOVED,
+      payload: itemId,
+    });
+
+    webContents.fromId(webContentsId).downloadURL(url);
+  });
+
+  handle('downloads/remove', async (_webContent, itemId) => {
+    if (items.has(itemId)) {
+      const item = items.get(itemId);
+      item.cancel();
+    }
+
+    dispatch({
+      type: DOWNLOAD_REMOVED,
+      payload: itemId,
+    });
+  });
+};

src/downloads/reducers/downloads.ts

@@ -0,0 +1,56 @@
+import { APP_SETTINGS_LOADED } from '../../app/actions';
+import { ActionOf } from '../../store/actions';
+import {
+  DOWNLOADS_CLEARED,
+  DOWNLOAD_CREATED,
+  DOWNLOAD_REMOVED,
+  DOWNLOAD_UPDATED,
+} from '../actions';
+import { Download } from '../common';
+
+type DownloadsAction = (
+  ActionOf<typeof APP_SETTINGS_LOADED>
+  | ActionOf<typeof DOWNLOAD_CREATED>
+  | ActionOf<typeof DOWNLOAD_UPDATED>
+  | ActionOf<typeof DOWNLOADS_CLEARED>
+  | ActionOf<typeof DOWNLOAD_REMOVED>
+);
+
+export const downloads = (
+  state: Record<Download['itemId'], Download> = {},
+  action: DownloadsAction,
+): Record<Download['itemId'], Download> => {
+  switch (action.type) {
+    case APP_SETTINGS_LOADED:
+      return action.payload.downloads ?? {};
+
+    case DOWNLOAD_CREATED: {
+      const download = action.payload;
+      return {
+        ...state,
+        [download.itemId]: download,
+      };
+    }
+
+    case DOWNLOAD_UPDATED: {
+      const newState = { ...state };
+      newState[action.payload.itemId] = {
+        ...newState[action.payload.itemId],
+        ...action.payload,
+      };
+      return newState;
+    }
+
+    case DOWNLOAD_REMOVED: {
+      const newState = { ...state };
+      delete newState[action.payload];
+      return newState;
+    }
+
+    case DOWNLOADS_CLEARED:
+      return {};
+
+    default:
+      return state;
+  }
+};