Ft vil 384/fix pdf

server/__tests__/fileUpload.test.ts

@@ -13,6 +13,27 @@ beforeAll(() => {
 });
 beforeEach(() => {});
 afterAll(() => {
+  const pathToFiles = 'server/fileUpload/images/1/';
+  fs.readdir(pathToFiles, (err, files) => {
+    if (err) {
+      console.error(err);
+    }
+    if (files) {
+      for (const file of files) {
+        fs.unlink(path.join(pathToFiles, file), (err) => {
+          if (err) {
+            console.error(err);
+          }
+        });
+      }
+    }
+    fs.rmdir(pathToFiles, (err) => {
+      if (err) {
+        console.error(err);
+      }
+    });
+  });
+
   return appDataSource.destroy();
 });
 

src/components/activities/content/editors/DocumentEditor/PdfDisplay.tsx

@@ -1,12 +1,34 @@
-import React from 'react';
+import React, { useState } from 'react';
 import { Document, Page, pdfjs } from 'react-pdf';
 
-pdfjs.GlobalWorkerOptions.workerSrc = `//cdnjs.cloudflare.com/ajax/libs/pdf.js/${pdfjs.version}/pdf.worker.js`;
+import 'react-pdf/dist/esm/Page/TextLayer.css';
+import 'react-pdf/dist/esm/Page/AnnotationLayer.css';
+
+pdfjs.GlobalWorkerOptions.workerSrc = `//unpkg.com/pdfjs-dist@${pdfjs.version}/build/pdf.worker.min.js`;
+
+const options = {
+  cMapUrl: `https://unpkg.com/pdfjs-dist@${pdfjs.version}/cmaps/`,
+};
 
 export default function PdfDisplay({ url }: { url: string }) {
+  const [numPages, setNumPages] = useState<number>(1);
+  function onDocumentLoadSuccess({ numPages }: { numPages: number }): void {
+    setNumPages(numPages);
+  }
+
   return (
-    <Document file={url}>
-      <Page width={380} renderTextLayer={true} renderAnnotationLayer={true} renderMode={'svg'} pageNumber={1} />
+    <Document options={options} file={url} onLoadSuccess={onDocumentLoadSuccess}>
+      {Array.from(Array(numPages).keys()).map((v) => (
+        <div
+          key={v}
+          style={{
+            marginTop: 10,
+            marginBottom: 10,
+          }}
+        >
+          <Page width={380} pageNumber={v + 1} />
+        </div>
+      ))}
     </Document>
   );
 }

src/styles/base.scss

@@ -217,3 +217,7 @@ main {
     left: 10vw;
   }
 }
+
+.linkAnnotation {
+  opacity: 0;
+}