Added download support, and validations for print and download

Author: Omar Flores Grimontt

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@omarefg/react-file-preview",
-  "version": "0.1.15",
+  "version": "0.1.17",
   "description": "Component to render and preview some kind of documents",
   "main": "lib/index.js",
   "private": false,

src/components/Pdf.jsx

@@ -6,7 +6,7 @@ import { ErrorBoundary } from './ErrorBoundary'
 import { PdfMenu } from './PdfMenu'
 import { INCREASE_PERCENTAGE } from '../utils'
 
-export const Pdf = ({ path, ErrorComponent, onError, showPdfMenu, style, onPrint }) => {
+export const Pdf = ({ path, ErrorComponent, onError, showPdfMenu, style, onPrint, allowPrint, allowDownload, onDownload }) => {
     const {
         state,
         container,
@@ -39,6 +39,10 @@ export const Pdf = ({ path, ErrorComponent, onError, showPdfMenu, style, onPrint
                             print={print}
                             page={page}
                             onPrint={onPrint}
+                            pdf={pdf}
+                            allowDownload={allowDownload}
+                            allowPrint={allowPrint}
+                            onDownload={onDownload}
                         />
                     )}
                     {!pdf && (

src/components/PdfMenu.jsx

@@ -7,6 +7,7 @@ import {
     faChevronLeft,
     faChevronRight,
     faPrint,
+    faDownload,
 } from '@fortawesome/free-solid-svg-icons'
 
 import styles from '../styles/PdfMenu.module.scss'
@@ -21,8 +22,14 @@ export const PdfMenu = props => {
         print,
         page,
         onPrint,
+        pdf,
+        allowPrint,
+        allowDownload,
+        onDownload,
     } = props
 
+    const printHandler = () => (onPrint ? onPrint(pdf) : print())
+
     return (
         <div className={styles['buttons-container']}>
             <button
@@ -71,14 +78,26 @@ export const PdfMenu = props => {
             >
                 <FontAwesomeIcon icon={faChevronRight}/>
             </button>
-            <button
-                onClick={onPrint || print}
-                type='button'
-                className={styles.button}
-                title='Print'
-            >
-                <FontAwesomeIcon icon={faPrint}/>
-            </button>
+            {allowPrint && (
+                <button
+                    onClick={printHandler}
+                    type='button'
+                    className={styles.button}
+                    title='Print'
+                >
+                    <FontAwesomeIcon icon={faPrint}/>
+                </button>
+            )}
+            {allowDownload && (
+                <button
+                    onClick={onDownload}
+                    type='button'
+                    className={styles.button}
+                    title='Download'
+                >
+                    <FontAwesomeIcon icon={faDownload}/>
+                </button>
+            )}
         </div>
     )
 }

src/components/Viewer.jsx

@@ -26,6 +26,9 @@ export const Viewer = props => {
         onPrint,
         isLoading,
         supportXlsx,
+        allowDownload,
+        allowPrint,
+        onDownload,
     } = props
 
     if (isLoading) {
@@ -101,6 +104,9 @@ export const Viewer = props => {
                 showPdfMenu={showPdfMenu}
                 style={style}
                 onPrint={onPrint}
+                allowDownload={allowDownload}
+                allowPrint={allowPrint}
+                onDownload={onDownload}
             />
         )
     }
@@ -167,6 +173,9 @@ Viewer.propTypes = {
     className: string,
     isLoading: bool,
     supportXlsx: bool,
+    allowPrint: bool,
+    allowDownload: bool,
+    onDownload: func,
 }
 
 Viewer.defaultProps = {
@@ -182,4 +191,7 @@ Viewer.defaultProps = {
     className: null,
     isLoading: false,
     supportXlsx: false,
+    allowPrint: false,
+    allowDownload: false,
+    onDownload: null,
 }