From 48a9b531c5b208a8a85219657a08dbd4a5b9dd57 Mon Sep 17 00:00:00 2001
From: Giuseppe Steduto <giuseppe@steduto.it>
Date: Fri, 19 May 2023 16:36:15 +0200
Subject: [PATCH] wf-details: add preview for PDF files

Closes #78.
---
 CHANGES.rst                                                 | 1 +
 .../src/pages/workflowDetails/components/WorkflowFiles.js   | 6 ++++++
 .../workflowDetails/components/WorkflowFiles.module.scss    | 5 +++++
 3 files changed, 12 insertions(+)

diff --git a/CHANGES.rst b/CHANGES.rst
index e2556b7e..5e7cd048 100644
--- a/CHANGES.rst
+++ b/CHANGES.rst
@@ -4,6 +4,7 @@ Changes
 Version 0.9.1 (UNRELEASED)
 --------------------------
 
+- Adds support for previewing PDF files in the workspace details page.
 - Changes the interactive session notification by adding a message stating that the session will be closed after a specified number of days inactivity.
 - Adds an extra button for login with custom third-party Keycloak SSO authentication services.
 - Changes the workflow-details page to make it possible to scroll through the list of workflow steps in the job logs section.
diff --git a/reana-ui/src/pages/workflowDetails/components/WorkflowFiles.js b/reana-ui/src/pages/workflowDetails/components/WorkflowFiles.js
index f2a0a341..2228aa5f 100644
--- a/reana-ui/src/pages/workflowDetails/components/WorkflowFiles.js
+++ b/reana-ui/src/pages/workflowDetails/components/WorkflowFiles.js
@@ -77,6 +77,12 @@ const PREVIEW_MIME_PREFIX_WHITELIST = {
     serverPreviewable: false,
     display: (content) => content,
   },
+  "application/pdf": {
+    serverPreviewable: true,
+    display: (content) => {
+      return <object data={content} className={styles["pdf-object"]} />;
+    },
+  },
 };
 
 export default function WorkflowFiles({ id }) {
diff --git a/reana-ui/src/pages/workflowDetails/components/WorkflowFiles.module.scss b/reana-ui/src/pages/workflowDetails/components/WorkflowFiles.module.scss
index fb797600..fb2cee0d 100644
--- a/reana-ui/src/pages/workflowDetails/components/WorkflowFiles.module.scss
+++ b/reana-ui/src/pages/workflowDetails/components/WorkflowFiles.module.scss
@@ -35,6 +35,11 @@
   align-items: center;
 }
 
+.pdf-object {
+  height: calc(80vh - 14em);
+  width: 100%;
+}
+
 :global(.ui.inline.loader.active).loader {
   margin-top: 1em;
 }