feat: Add Download Manager (pause, stop, delete) (#1339)

2 files changed, 61 insertions, 0 deletions

diff --git a/src/containers/download-manager/DownloadManagerScreen.tsx b/src/containers/download-manager/DownloadManagerScreen.tsx
new file mode 100644
index 000000000..5d395a180
--- /dev/null
+++ b/src/containers/download-manager/DownloadManagerScreen.tsx
@@ -0,0 +1,15 @@
+import { Component, ReactElement } from 'react';
+import ErrorBoundary from '../../components/util/ErrorBoundary';
+import DownloadManager from '../../components/downloadManager/DownloadManagerDashboard';
+
+class DownloadManagerScreen extends Component {
+  render(): ReactElement {
+    return (
+      <ErrorBoundary>
+        <DownloadManager {...this.props} />
+      </ErrorBoundary>
+    );
+  }
+}
+
+export default DownloadManagerScreen;
diff --git a/src/containers/download-manager/DownloadManagerWindow.tsx b/src/containers/download-manager/DownloadManagerWindow.tsx
new file mode 100644
index 000000000..e13e51774
--- /dev/null
+++ b/src/containers/download-manager/DownloadManagerWindow.tsx
@@ -0,0 +1,46 @@
+import { inject, observer } from 'mobx-react';
+import { Component, ReactPortal } from 'react';
+import ReactDOM from 'react-dom';
+import { Outlet } from 'react-router-dom';
+
+import { StoresProps } from '../../@types/ferdium-components.types';
+import Layout from '../../components/downloadManager/DownloadManagerLayout';
+import ErrorBoundary from '../../components/util/ErrorBoundary';
+
+interface IProps {}
+
+@inject('stores', 'actions')
+@observer
+class DownloadManagerContainer extends Component<IProps> {
+  portalRoot: any;
+
+  el: HTMLDivElement;
+
+  constructor(props: StoresProps) {
+    super(props);
+
+    this.portalRoot = document.querySelector('#portalContainer');
+    this.el = document.createElement('div');
+  }
+
+  componentDidMount(): void {
+    this.portalRoot.append(this.el);
+  }
+
+  componentWillUnmount(): void {
+    this.el.remove();
+  }
+
+  render(): ReactPortal {
+    return ReactDOM.createPortal(
+      <ErrorBoundary>
+        <Layout>
+          <Outlet />
+        </Layout>
+      </ErrorBoundary>,
+      this.el,
+    );
+  }
+}
+
+export default DownloadManagerContainer;