iOS Catalog Improvements (#402)

* Show the settings button in the `ConfiguredPDFViewComponent` iOS example

* Add README file for the Catalog

* Fix issue where the `pageIndex` prop needed to be set before the document prop. The order should not be important.

* Update README

* Bump version number to 1.30.18

Author: radazzouz

ios/RCTPSPDFKit/RCTPSPDFKitView.h

@@ -22,6 +22,7 @@ NS_ASSUME_NONNULL_BEGIN
 @property (nonatomic, readonly) UIBarButtonItem *closeButton;
 @property (nonatomic) BOOL disableDefaultActionForTappedAnnotations;
 @property (nonatomic) BOOL disableAutomaticSaving;
+@property (nonatomic) PSPDFPageIndex pageIndex;
 @property (nonatomic, copy, nullable) NSString *annotationAuthorName;
 @property (nonatomic, copy) RCTBubblingEventBlock onCloseButtonPressed;
 @property (nonatomic, copy) RCTBubblingEventBlock onDocumentSaved;

ios/RCTPSPDFKit/RCTPSPDFKitViewManager.m

@@ -41,15 +41,24 @@ @implementation RCTPSPDFKitViewManager
   if (json) {
     view.pdfController.document = [RCTConvert PSPDFDocument:json];
     view.pdfController.document.delegate = (id<PSPDFDocumentDelegate>)view;
-    
-    // The author name may be set before the document exists. We set it again here when the document exists.
+
+    // The following properties need to be set after the document is set.
+    // We set them again here when we're certain the document exists.
     if (view.annotationAuthorName) {
       view.pdfController.document.defaultAnnotationUsername = view.annotationAuthorName;
     }
+
+    view.pdfController.pageIndex = view.pageIndex;
   }
 }
 
-RCT_REMAP_VIEW_PROPERTY(pageIndex, pdfController.pageIndex, NSUInteger)
+RCT_CUSTOM_VIEW_PROPERTY(pageIndex, PSPDFPageIndex, RCTPSPDFKitView) {
+  if (json) {
+    PSPDFPageIndex idx = [RCTConvert NSUInteger:json];
+    view.pageIndex = idx;
+    view.pdfController.pageIndex = idx;
+  }
+}
 
 RCT_CUSTOM_VIEW_PROPERTY(configuration, PSPDFConfiguration, RCTPSPDFKitView) {
   if (json) {
@@ -357,7 +366,7 @@ - (instancetype)initWithFontFamilyDescriptors:(NSArray *)fontFamilyDescriptors {
   // Override the default font family descriptors if custom font descriptors are specified.
   NSArray *customFontFamilyDescriptors = [self customFontFamilyDescriptors];
   if (customFontFamilyDescriptors.count) {
-      fontFamilyDescriptors = customFontFamilyDescriptors;
+    fontFamilyDescriptors = customFontFamilyDescriptors;
   }
   return [super initWithFontFamilyDescriptors:fontFamilyDescriptors];
 }

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-pspdfkit",
-  "version": "1.30.17",
+  "version": "1.30.18",
   "description": "A React Native module for the PSPDFKit library.",
   "keywords": [
     "react native",

package.json

@@ -312,6 +312,7 @@ class ConfiguredPDFViewComponent extends Component {
             useParentNavigationBar: false,
             allowToolbarTitleChange: false,
           }}
+          leftBarButtonItems={["settingsButtonItem"]}
           toolbarTitle={"Custom Title"}
           style={{ flex: 1, color: pspdfkitColor }}
         />

samples/Catalog/Catalog.ios.js

@@ -0,0 +1,53 @@
+## Catalog
+
+The project contains a large set of sample code, which illustrates how to set up and customize PSPDFKit for various use cases. You can run the Catalog app on Android and iOS.
+
+### Running the Catalog on Android
+
+#### Requirements
+
+- Android SDK
+- Android NDK
+- Android Build Tools 23.0.1 (React Native)
+- Android Build Tools 28.0.3 (PSPDFKit module)
+- Android Gradle plugin 3.4.1 or later.
+- PSPDFKit for Android 6.6.0 or later.
+- React Native 0.60.4.
+
+#### Getting Started
+
+1. Clone the repository. `git clone https://github.com/PSPDFKit/react-native.git`.
+2. Install dependencies: run `yarn install` from `samples/Catalog` directory. (Because of a [bug](https://github.com/yarnpkg/yarn/issues/2165) you may need to clean `yarn`'s cache with `yarn cache clean` before.)
+3. Update license key in `samples/Catalog/android/app/src/main/AndroidManifest.xml`:
+
+```xml
+   <application>
+      ...
+
+      <meta-data
+          android:name="pspdfkit_license_key"
+          android:value="YOUR_LICENSE_KEY_GOES_HERE"/>
+
+   </application>
+```
+
+4. Catalog app is now ready to launch. From `samples/Catalog` directory run `react-native run-android`.
+
+### Running the Catalog on iOS
+
+#### Requirements
+
+- The latest [Xcode](https://developer.apple.com/xcode/).
+- the latest version of PSPDFKit for iOS.
+- React Native 0.60.4.
+
+#### Getting Started
+
+1. Clone the repository: `git clone https://github.com/PSPDFKit/react-native.git`.
+2. Step into your newly cloned folder: `cd react-native` and create a new `PSPDFKit` directory: `mkdir PSPDFKit`.
+3. [Download the latest version of PSPDFKit for iOS](https://customers.pspdfkit.com/download/binary/ios/latest) and mount the DMG file.
+4. Copy `PSPDFKit.xcframework` and `PSPDFKitUI.xcframework` into the `PSPDFKit` directory.
+5. Install dependencies: `yarn install` in `samples/Catalog` directory. (Because of a [bug](https://github.com/yarnpkg/yarn/issues/2165) you may need to clean `yarn`'s cache with `yarn cache clean` before.)
+6. Run the app with `react-native-cli`: `react-native run-ios`
+
+**Note:** If you get an error about `config.h` not being found check out [this blog post](https://tuntunir.blogspot.com/2018/02/react-native-fatal-error-configh-file.html) for information on how to fix it.

samples/Catalog/README.md

@@ -1,6 +1,6 @@
 {
   "name": "Catalog",
-  "version": "1.30.17",
+  "version": "1.30.18",
   "private": true,
   "scripts": {
     "start": "react-native start",

samples/Catalog/package.json

@@ -5420,7 +5420,7 @@ react-native-permissions@^1.1.1:
   integrity sha512-t0Ujm177bagjUOSzhpmkSz+LqFW04HnY9TeZFavDCmV521fQvFz82aD+POXqWsAdsJVOK3umJYBNNqCjC3g0hQ==
 
 "react-native-pspdfkit@file:../..":
-  version "1.30.17"
+  version "1.30.18"
 
 react-native-qrcode-scanner@^1.2.1:
   version "1.2.1"

samples/Catalog/yarn.lock

@@ -1,6 +1,6 @@
 {
   "name": "NativeCatalog",
-  "version": "1.30.17",
+  "version": "1.30.18",
   "private": true,
   "scripts": {
     "android": "react-native run-android",

samples/NativeCatalog/package.json

@@ -5511,7 +5511,7 @@ react-native-gesture-handler@^1.3.0:
     prop-types "^15.7.2"
 
 "react-native-pspdfkit@file:../..":
-  version "1.30.17"
+  version "1.30.18"
 
 react-native-safe-area-view@^0.14.1:
   version "0.14.8"