From 7e30f5112bcd301a44491cbc7c6da577fca5ce0d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Micha=C5=82=20Kuklis?= <michal.kuklis@gmail.com>
Date: Thu, 20 Aug 2020 21:27:36 -0400
Subject: [PATCH] UIREQ-508: Add feedback after print button is clicked (#626)

* UIREQ-508: Add feedback after print button is clicked
---
 CHANGELOG.md                              |  1 +
 package.json                              |  2 +-
 src/components/PrintButton/PrintButton.js |  4 ++++
 src/routes/RequestsRoute.js               | 13 ++++++++++++-
 translations/ui-requests/en.json          |  3 ++-
 5 files changed, 20 insertions(+), 3 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 5730b701..221a0e3f 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -10,6 +10,7 @@
 
 * Add loading indicator when service point is switched. Fixes UIREQ-508.
 * Improve performance issues with preview for print pick slips. Fixes UIREQ-507.
+* Add feedback after print button is clicked. Fixes UIREQ-508.
 * Escape values passed to `react-to-print`. Fixes UIREQ-510.
 
 ## [3.0.4](https://github.com/folio-org/ui-requests/tree/v3.0.4) (2020-07-15)
diff --git a/package.json b/package.json
index 65628f0c..4aca0a45 100644
--- a/package.json
+++ b/package.json
@@ -178,7 +178,7 @@
     "react-fast-compare": "^3.2.0",
     "react-hot-loader": "^4.3.12",
     "react-router-prop-types": "^1.0.4",
-    "react-to-print": "^2.3.2",
+    "react-to-print": "^2.9.0",
     "redux-form": "^7.0.3"
   },
   "peerDependencies": {
diff --git a/src/components/PrintButton/PrintButton.js b/src/components/PrintButton/PrintButton.js
index c7f31b37..4f533b3f 100644
--- a/src/components/PrintButton/PrintButton.js
+++ b/src/components/PrintButton/PrintButton.js
@@ -13,12 +13,14 @@ class PrintButton extends React.Component {
     children: PropTypes.node.isRequired,
     onAfterPrint: PropTypes.func,
     onBeforePrint: PropTypes.func,
+    onBeforeGetContent: PropTypes.func,
     contentRef: PropTypes.object,
   };
 
   static defaultProps = {
     onAfterPrint: noop,
     onBeforePrint: noop,
+    onBeforeGetContent: noop,
   };
 
   getContent = () => {
@@ -40,6 +42,7 @@ class PrintButton extends React.Component {
     const {
       onAfterPrint,
       onBeforePrint,
+      onBeforeGetContent,
     } = this.props;
 
     return (
@@ -49,6 +52,7 @@ class PrintButton extends React.Component {
         trigger={this.renderTriggerButton}
         onAfterPrint={onAfterPrint}
         onBeforePrint={onBeforePrint}
+        onBeforeGetContent={onBeforeGetContent}
       />
     );
   }
diff --git a/src/routes/RequestsRoute.js b/src/routes/RequestsRoute.js
index 6ca1c582..895a53f8 100644
--- a/src/routes/RequestsRoute.js
+++ b/src/routes/RequestsRoute.js
@@ -16,6 +16,7 @@ import {
   AppIcon,
   stripesConnect,
   IfPermission,
+  CalloutContext,
 } from '@folio/stripes/core';
 import {
   Button,
@@ -81,6 +82,8 @@ const urls = {
 };
 
 class RequestsRoute extends React.Component {
+  static contextType = CalloutContext;
+
   static manifest = {
     addressTypes: {
       type: 'okapi',
@@ -769,7 +772,15 @@ class RequestsRoute extends React.Component {
                 disabled={pickSlipsEmpty}
                 template={printTemplate}
                 contentRef={this.printContentRef}
-                onBeforePrint={onToggle}
+                onBeforeGetContent={
+                  () => new Promise(resolve => {
+                    this.context.sendCallout({ message: <FormattedMessage id="ui-requests.printInProgress" /> });
+                    onToggle();
+                    // without the timeout the printing process starts right away
+                    // and the callout and onToggle above are blocked
+                    setTimeout(() => resolve(), 1000);
+                  })
+                }
               >
                 <FormattedMessage
                   id="ui-requests.printPickSlips"
diff --git a/translations/ui-requests/en.json b/translations/ui-requests/en.json
index 95302834..f1580016 100644
--- a/translations/ui-requests/en.json
+++ b/translations/ui-requests/en.json
@@ -188,5 +188,6 @@
   "permission.view": "Requests: View",
   "permission.create": "Requests: View, create",
   "permission.edit": "Requests: View, edit, cancel",
-  "pickSlipsLoading": "Pick slips are loading, please wait"
+  "pickSlipsLoading": "Pick slips are loading, please wait",
+  "printInProgress": "Print options loading in progress. It might take a few seconds, please be patient."
 }