PLT-3642 Add PDF previewer (#3812)

* Added a PDF previewer

* PLT-3900 - Improving UI for the pdf max pages (#3800)

1 files changed, 24 insertions, 11 deletions

diff --git a/webapp/components/view_image.jsx b/webapp/components/view_image.jsx
index 7b827ac0e..c9f558725 100644
--- a/webapp/components/view_image.jsx
+++ b/webapp/components/view_image.jsx
@@ -1,23 +1,29 @@
 // Copyright (c) 2015 Mattermost, Inc. All Rights Reserved.
 // See License.txt for license information.
 
-import $ from 'jquery';
-import * as AsyncClient from 'utils/async_client.jsx';
-import * as GlobalActions from 'actions/global_actions.jsx';
-import * as Utils from 'utils/utils.jsx';
 import AudioVideoPreview from './audio_video_preview.jsx';
-import Constants from 'utils/constants.jsx';
 import CodePreview from './code_preview.jsx';
+import PDFPreview from './pdf_preview.jsx';
 import FileInfoPreview from './file_info_preview.jsx';
-import FileStore from 'stores/file_store.jsx';
 import ViewImagePopoverBar from './view_image_popover_bar.jsx';
-import loadingGif from 'images/load.gif';
 
-import {intlShape, injectIntl, defineMessages} from 'react-intl';
+import * as GlobalActions from 'actions/global_actions.jsx';
 
-import {Modal} from 'react-bootstrap';
+import FileStore from 'stores/file_store.jsx';
+
+import * as AsyncClient from 'utils/async_client.jsx';
+import * as Utils from 'utils/utils.jsx';
+
+import Constants from 'utils/constants.jsx';
 const KeyCodes = Constants.KeyCodes;
 
+import $ from 'jquery';
+import React from 'react';
+import {intlShape, injectIntl, defineMessages} from 'react-intl';
+import {Modal} from 'react-bootstrap';
+
+import loadingGif from 'images/load.gif';
+
 const holders = defineMessages({
     loading: {
         id: 'view_image.loading',
@@ -25,8 +31,6 @@ const holders = defineMessages({
     }
 });
 
-import React from 'react';
-
 class ViewImageModal extends React.Component {
     constructor(props) {
         super(props);
@@ -241,6 +245,15 @@ class ViewImageModal extends React.Component {
                         formatMessage={this.props.intl.formatMessage}
                     />
                 );
+            } else if (PDFPreview.support(filename)) {
+                content = (
+                    <PDFPreview
+                        filename={filename}
+                        fileUrl={fileUrl}
+                        fileInfo={fileInfo}
+                        formatMessage={this.props.intl.formatMessage}
+                    />
+                );
             } else if (CodePreview.support(filename)) {
                 content = (
                     <CodePreview