Merge pull request #5775 from eVoloshchak/eVoloshchak-safariZoom

Use pdf container width instead of windows width to calculate page width

Author: AndrewGable

src/components/PDFView/index.js

@@ -1,6 +1,6 @@
 import React, {PureComponent} from 'react';
 import PropTypes from 'prop-types';
-import {View} from 'react-native';
+import {View, Dimensions} from 'react-native';
 import {Document, Page} from 'react-pdf/dist/esm/entry.webpack';
 import styles from '../../styles/styles';
 import withWindowDimensions, {windowDimensionsPropTypes} from '../withWindowDimensions';
@@ -28,6 +28,7 @@ class PDFView extends PureComponent {
         super(props);
         this.state = {
             numPages: null,
+            windowWidth: Dimensions.get('window').width,
         };
         this.onDocumentLoadSuccess = this.onDocumentLoadSuccess.bind(this);
     }
@@ -43,15 +44,16 @@ class PDFView extends PureComponent {
     }
 
     render() {
-        const {isSmallScreenWidth, windowWidth} = this.props;
-        const pdfContainerWidth = windowWidth - 100;
+        const {isSmallScreenWidth} = this.props;
+        const pdfContainerWidth = this.state.windowWidth - 100;
         const pageWidthOnLargeScreen = (pdfContainerWidth <= variables.pdfPageMaxWidth)
             ? pdfContainerWidth : variables.pdfPageMaxWidth;
-        const pageWidth = isSmallScreenWidth ? windowWidth - 30 : pageWidthOnLargeScreen;
+        const pageWidth = isSmallScreenWidth ? this.state.windowWidth - 30 : pageWidthOnLargeScreen;
 
         return (
             <View
                 style={[styles.PDFView, this.props.style]}
+                onLayout={event => this.setState({windowWidth: event.nativeEvent.layout.width})}
             >
                 <Document
                     loading={<FullScreenLoadingIndicator />}