diff --git a/package.json b/package.json
index 4008180..cfe1aa2 100644
--- a/package.json
+++ b/package.json
@@ -62,6 +62,7 @@
     "react-hot-loader": "^4.13.0",
     "react-loader-spinner": "^4.0.0",
     "react-masonry-css": "^1.0.16",
+    "react-modal": "^3.15.1",
     "react-notification-system": "^0.4.0",
     "react-notification-system-redux": "^2.0.1",
     "react-redux": "^7.2.6",
diff --git a/src/client/components/ComicDetail/Tabs/ArchiveOperations.tsx b/src/client/components/ComicDetail/Tabs/ArchiveOperations.tsx
index 3610ae8..4c655d1 100644
--- a/src/client/components/ComicDetail/Tabs/ArchiveOperations.tsx
+++ b/src/client/components/ComicDetail/Tabs/ArchiveOperations.tsx
@@ -7,6 +7,8 @@ import SlidingPane from "react-sliding-pane";
 import { extractComicArchive } from "../../../actions/fileops.actions";
 import { analyzeImage } from "../../../actions/fileops.actions";
 import { Canvas } from "../../shared/Canvas";
+import ComicViewer from "react-comic-viewer";
+import Modal from "react-modal";
 
 export const ArchiveOperations = (props): ReactElement => {
   const { data } = props;
diff --git a/yarn.lock b/yarn.lock
index 54360ca..7132567 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -10928,6 +10928,16 @@ react-modal@^3.14.3:
     react-lifecycles-compat "^3.0.0"
     warning "^4.0.3"
 
+react-modal@^3.15.1:
+  version "3.15.1"
+  resolved "https://registry.yarnpkg.com/react-modal/-/react-modal-3.15.1.tgz#950ce67bfef80971182dd0ed38f2d9b1a681288b"
+  integrity sha512-duB9bxOaYg7Zt6TMFldIFxQRtSP+Dg3F1ZX3FXxSUn+3tZZ/9JCgeAQKDg7rhZSAqopq8TFRw3yIbnx77gyFTw==
+  dependencies:
+    exenv "^1.2.0"
+    prop-types "^15.7.2"
+    react-lifecycles-compat "^3.0.0"
+    warning "^4.0.3"
+
 react-notification-system-redux@^2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/react-notification-system-redux/-/react-notification-system-redux-2.0.1.tgz#e1f47e788d344fac9b5183402bb96c73033e5854"