Upgraded sample app

.eslintrc.js

@@ -0,0 +1,4 @@
+module.exports = {
+    root: true,
+    extends: ['@react-native-community', 'eslint-config-prettier'],
+};

.gitignore

@@ -1,5 +1,6 @@
-node_modules/**/*
-.expo/*
+node_modules/
+.expo/
+dist/
 npm-debug.*
 *.jks
 *.p8
@@ -8,12 +9,11 @@ npm-debug.*
 *.mobileprovision
 *.orig.*
 web-build/
-yarn.lock
 
 # macOS
 .DS_Store
 
-# @generated expo-cli sync-28e2ab0e9ece60556eaf932abe52d017ec33db50
+# @generated expo-cli sync-e7dcf75f4e856f7b6f3239b3f3a7dd614ee755a8
 # The following patterns were generated by expo-cli
 
 # OSX
@@ -39,7 +39,7 @@ DerivedData
 *.ipa
 *.xcuserstate
 project.xcworkspace
-Podfile.lock
+.xcode.env.local
 
 # Android/IntelliJ
 #
@@ -48,6 +48,7 @@ build/
 .gradle
 local.properties
 *.iml
+*.hprof
 
 # node.js
 #
@@ -61,25 +62,15 @@ buck-out/
 *.keystore
 !debug.keystore
 
-# fastlane
-#
-# It is recommended to not store the screenshots in the git repo. Instead, use fastlane to re-generate the
-# screenshots whenever they are needed.
-# For more information about the recommended setup visit:
-# https://docs.fastlane.tools/best-practices/source-control/
-
-*/fastlane/report.xml
-*/fastlane/Preview.html
-*/fastlane/screenshots
-
 # Bundle artifacts
 *.jsbundle
 
 # CocoaPods
 /ios/Pods/
 
 # Expo
-.expo/*
+.expo/
 web-build/
+dist/
 
-# @end expo-cli
+# @end expo-cli

.prettierrc.js

@@ -0,0 +1,7 @@
+module.exports = {
+  bracketSpacing: false,
+  jsxBracketSameLine: true,
+  singleQuote: true,
+  trailingComma: 'all',
+  arrowParens: 'avoid',
+};

App.tsx

@@ -1,87 +1,60 @@
-import React, { Component } from "react";
-import { Platform, View, PermissionsAndroid } from "react-native";
-const { RNPdftron } = require("@pdftron/react-native-pdf");
-import HomeScreen from "./src/HomeScreen";
-import DocumentViewer from "./src/DocumentViewer";
-import { NavigationContainer, RouteProp } from "@react-navigation/native";
-import {
-  createStackNavigator,
-  StackNavigationProp,
-} from "@react-navigation/stack";
+import 'react-native-gesture-handler';
 
-type AppStates = {
-  permissionGranted: boolean;
-};
+import React from 'react';
+import {NavigationContainer} from '@react-navigation/native';
+import {createStackNavigator} from '@react-navigation/stack';
+import {SafeAreaProvider} from 'react-native-safe-area-context';
 
-const MainStack = createStackNavigator();
+import * as FileSystem from 'expo-file-system';
 
-type MainStackParamList = {
-  HomeScreen: undefined;
-  DocumentViewer: { document: string };
-};
+import Browser from './components/Browser';
+import PDFViewer from './components/PDFViewer';
 
-export type HomeScreenProps = {
-  navigation: StackNavigationProp<MainStackParamList, "HomeScreen">;
-};
+if (typeof Intl === 'undefined') {
+  require('intl');
+  require('intl/locale-data/jsonp/en');
+}
 
-export type DocumentViewerProps = {
-  route: RouteProp<MainStackParamList, "DocumentViewer">;
-  navigation: StackNavigationProp<MainStackParamList, "DocumentViewer">;
+type StackParams = {
+  Browser: {currDir: string; path: string};
+  PDFViewer: {currDir: string; path: string};
+  MiscFileViewer: {currDir: string; path: string};
 };
 
-export default class App extends Component<{}, AppStates> {
-  constructor(props: {}) {
-    super(props);
-
-    this.state = {
-      permissionGranted: Platform.OS === "ios",
-    };
-
-    RNPdftron.initialize("");
-  }
-
-  componentDidMount() {
-    if (Platform.OS === "android") {
-      this.requestStoragePermission();
-    }
-  }
-
-  async requestStoragePermission() {
-    try {
-      const granted = await PermissionsAndroid.request(
-        PermissionsAndroid.PERMISSIONS.WRITE_EXTERNAL_STORAGE
-      );
-      if (granted === PermissionsAndroid.RESULTS.GRANTED) {
-        this.setState({
-          permissionGranted: true,
-        });
-        console.log("Storage permission granted");
-      } else {
-        this.setState({
-          permissionGranted: false,
-        });
-        console.log("Storage permission denied");
-      }
-    } catch (err) {
-      console.warn(err);
-    }
-  }
-
-  render() {
-    if (this.state.permissionGranted) {
-      return (
-        <NavigationContainer>
-          <MainStack.Navigator mode="card" headerMode="none">
-            <MainStack.Screen name="HomeScreen" component={HomeScreen} />
-            <MainStack.Screen
-              name="DocumentViewer"
-              component={DocumentViewer}
-            />
-          </MainStack.Navigator>
-        </NavigationContainer>
-      );
-    } else {
-      return <View></View>;
-    }
-  }
+const Stack = createStackNavigator<StackParams>();
+
+export default function App() {
+  const root: string = FileSystem.documentDirectory || '';
+  const path = root.endsWith('/') ? root.substring(0, root.length - 1) : root;
+
+  return (
+    <SafeAreaProvider>
+      <NavigationContainer>
+        <Stack.Navigator
+          initialRouteName="Browser"
+          screenOptions={{
+            headerShown: false,
+          }}>
+          <Stack.Screen
+            name="Browser"
+            component={Browser}
+            initialParams={{
+              path: path,
+              currDir: 'Browser',
+            }}
+            options={({route}) => ({
+              title: route?.params?.currDir || 'Browser',
+            })}
+          />
+          <Stack.Screen
+            name="PDFViewer"
+            component={PDFViewer}
+            options={({route}) => ({
+              title: route?.params?.currDir || 'PDFViewer',
+            })}
+          />
+        </Stack.Navigator>
+      </NavigationContainer>
+    </SafeAreaProvider>
+  );
 }

README.md

@@ -8,42 +8,12 @@ React Native sample project that integrates a document viewer using [PDFTron Rea
 :--:|:--:
 <img alt='demo-android' src='assets/gifs/android.gif' height="600" /> | <img alt='demo-android' src='assets/gifs/ios.gif' height="600" />
 
-## Step
+## Usage
 
-1. Create a `local.properties` file inside the android folder with your Android SDK location, for example:
-
-```
-sdk.dir=/Users/<user-name>/Library/Android/sdk
-```
-
-2. Run (this will also run `pod install` for iOS automatically):
-
-```
-yarn install
-```
-
-
-## Run
-
-```
-yarn start
-```
-
-### Android
-
-```
-yarn android
-```
-
-### iOS
-
-```
-yarn iOS
-```
-
-## Upgrade
-
-For updating react-native projects, please check out [here](https://reactnative.dev/docs/upgrading).
+1. Install dependencies by running `yarn install`. This will also run `pod install` for iOS automatically.
+2. Build and run the app by running:
+   - iOS: `yarn ios` 
+   - Android: `yarn android`
 
 ## License
 See [License](./LICENSE)

android/.gitignore

@@ -0,0 +1,21 @@
+# OSX
+#
+.DS_Store
+
+# Android/IntelliJ
+#
+build/
+.idea
+.gradle
+local.properties
+*.iml
+*.hprof
+
+# BUCK
+buck-out/
+\.buckd/
+*.keystore
+!debug.keystore
+
+# Bundle artifacts
+*.jsbundle