├── .watchmanconfig
├── .gitattributes
├── .eslintignore
├── app.json
├── babel.config.js
├── src
├── assets
│ └── spiro.png
├── store
│ ├── actions.js
│ └── basicReducer.js
├── components
│ ├── PlusOneButton.js
│ ├── MinusOneButton.js
│ ├── Shapes.js
│ ├── LogoTitle.js
│ └── ImageGrid.js
├── navigators
│ ├── RootNav
│ │ └── config.js
│ ├── LoggedNav
│ │ └── config.js
│ ├── RMRTabNav
│ │ └── config.js
│ ├── SettingsTabNav
│ │ └── config.js
│ ├── SpottingTabNav
│ │ └── config.js
│ ├── HomeTabNav
│ │ └── config.js
│ ├── ChatTabNav
│ │ └── config.js
│ ├── ModalNav
│ │ └── config.js
│ └── TabNav
│ │ └── config.js
├── App.js
└── screens
│ ├── SignInScreen.js
│ ├── LoadingScreen.js
│ ├── RMRScreen.js
│ ├── ChatScreen.js
│ ├── SettingsScreen.js
│ ├── SpottingScreen.js
│ ├── HomeScreen.js
│ ├── ImageListScreen.js
│ ├── ImageDetailsScreen.js
│ └── DetailsScreen.js
├── android
├── app
│ ├── src
│ │ ├── main
│ │ │ ├── res
│ │ │ │ ├── values
│ │ │ │ │ ├── strings.xml
│ │ │ │ │ └── styles.xml
│ │ │ │ ├── mipmap-hdpi
│ │ │ │ │ ├── ic_launcher.png
│ │ │ │ │ └── ic_launcher_round.png
│ │ │ │ ├── mipmap-mdpi
│ │ │ │ │ ├── ic_launcher.png
│ │ │ │ │ └── ic_launcher_round.png
│ │ │ │ ├── mipmap-xhdpi
│ │ │ │ │ ├── ic_launcher.png
│ │ │ │ │ └── ic_launcher_round.png
│ │ │ │ ├── mipmap-xxhdpi
│ │ │ │ │ ├── ic_launcher.png
│ │ │ │ │ └── ic_launcher_round.png
│ │ │ │ └── mipmap-xxxhdpi
│ │ │ │ │ ├── ic_launcher.png
│ │ │ │ │ └── ic_launcher_round.png
│ │ │ ├── java
│ │ │ │ └── com
│ │ │ │ │ └── testnavigation
│ │ │ │ │ ├── MainActivity.java
│ │ │ │ │ └── MainApplication.java
│ │ │ └── AndroidManifest.xml
│ │ └── debug
│ │ │ └── AndroidManifest.xml
│ ├── proguard-rules.pro
│ ├── BUCK
│ └── build.gradle
├── gradle
│ └── wrapper
│ │ ├── gradle-wrapper.jar
│ │ └── gradle-wrapper.properties
├── keystores
│ ├── debug.keystore.properties
│ └── BUCK
├── settings.gradle
├── gradle.properties
├── build.gradle
├── gradlew.bat
└── gradlew
├── ios
├── testNavigation
│ ├── Images.xcassets
│ │ ├── Contents.json
│ │ └── AppIcon.appiconset
│ │ │ └── Contents.json
│ ├── AppDelegate.h
│ ├── main.m
│ ├── AppDelegate.m
│ ├── Info.plist
│ └── Base.lproj
│ │ └── LaunchScreen.xib
├── testNavigationTests
│ ├── Info.plist
│ └── testNavigationTests.m
├── testNavigation-tvOSTests
│ └── Info.plist
├── testNavigation-tvOS
│ └── Info.plist
└── testNavigation.xcodeproj
│ ├── xcshareddata
│ └── xcschemes
│ │ ├── testNavigation.xcscheme
│ │ └── testNavigation-tvOS.xcscheme
│ └── project.pbxproj
├── .buckconfig
├── index.js
├── metro.config.js
├── README.md
├── .gitignore
├── package.json
├── .eslintrc
└── .flowconfig
/.watchmanconfig:
--------------------------------------------------------------------------------
1 | {}
--------------------------------------------------------------------------------
/.gitattributes:
--------------------------------------------------------------------------------
1 | *.pbxproj -text
2 |
--------------------------------------------------------------------------------
/.eslintignore:
--------------------------------------------------------------------------------
1 | ios/*
2 | android/*
3 | node_modules/*
4 | package.json
5 |
--------------------------------------------------------------------------------
/app.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "testNavigation",
3 | "displayName": "testNavigation"
4 | }
--------------------------------------------------------------------------------
/babel.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | presets: ['module:metro-react-native-babel-preset'],
3 | }
4 |
--------------------------------------------------------------------------------
/src/assets/spiro.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/kelset/test-react-nav-with-screens/HEAD/src/assets/spiro.png
--------------------------------------------------------------------------------
/android/app/src/main/res/values/strings.xml:
--------------------------------------------------------------------------------
1 |
2 | testNavigation
3 |
4 |
--------------------------------------------------------------------------------
/ios/testNavigation/Images.xcassets/Contents.json:
--------------------------------------------------------------------------------
1 | {
2 | "info" : {
3 | "version" : 1,
4 | "author" : "xcode"
5 | }
6 | }
7 |
--------------------------------------------------------------------------------
/.buckconfig:
--------------------------------------------------------------------------------
1 |
2 | [android]
3 | target = Google Inc.:Google APIs:23
4 |
5 | [maven_repositories]
6 | central = https://repo1.maven.org/maven2
7 |
--------------------------------------------------------------------------------
/android/gradle/wrapper/gradle-wrapper.jar:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/kelset/test-react-nav-with-screens/HEAD/android/gradle/wrapper/gradle-wrapper.jar
--------------------------------------------------------------------------------
/android/keystores/debug.keystore.properties:
--------------------------------------------------------------------------------
1 | key.store=debug.keystore
2 | key.alias=androiddebugkey
3 | key.store.password=android
4 | key.alias.password=android
5 |
--------------------------------------------------------------------------------
/android/app/src/main/res/mipmap-hdpi/ic_launcher.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/kelset/test-react-nav-with-screens/HEAD/android/app/src/main/res/mipmap-hdpi/ic_launcher.png
--------------------------------------------------------------------------------
/android/app/src/main/res/mipmap-mdpi/ic_launcher.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/kelset/test-react-nav-with-screens/HEAD/android/app/src/main/res/mipmap-mdpi/ic_launcher.png
--------------------------------------------------------------------------------
/android/app/src/main/res/mipmap-xhdpi/ic_launcher.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/kelset/test-react-nav-with-screens/HEAD/android/app/src/main/res/mipmap-xhdpi/ic_launcher.png
--------------------------------------------------------------------------------
/android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/kelset/test-react-nav-with-screens/HEAD/android/app/src/main/res/mipmap-xxhdpi/ic_launcher.png
--------------------------------------------------------------------------------
/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/kelset/test-react-nav-with-screens/HEAD/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher.png
--------------------------------------------------------------------------------
/android/app/src/main/res/mipmap-hdpi/ic_launcher_round.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/kelset/test-react-nav-with-screens/HEAD/android/app/src/main/res/mipmap-hdpi/ic_launcher_round.png
--------------------------------------------------------------------------------
/android/app/src/main/res/mipmap-mdpi/ic_launcher_round.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/kelset/test-react-nav-with-screens/HEAD/android/app/src/main/res/mipmap-mdpi/ic_launcher_round.png
--------------------------------------------------------------------------------
/android/app/src/main/res/mipmap-xhdpi/ic_launcher_round.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/kelset/test-react-nav-with-screens/HEAD/android/app/src/main/res/mipmap-xhdpi/ic_launcher_round.png
--------------------------------------------------------------------------------
/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_round.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/kelset/test-react-nav-with-screens/HEAD/android/app/src/main/res/mipmap-xxhdpi/ic_launcher_round.png
--------------------------------------------------------------------------------
/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_round.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/kelset/test-react-nav-with-screens/HEAD/android/app/src/main/res/mipmap-xxxhdpi/ic_launcher_round.png
--------------------------------------------------------------------------------
/android/keystores/BUCK:
--------------------------------------------------------------------------------
1 | keystore(
2 | name = "debug",
3 | properties = "debug.keystore.properties",
4 | store = "debug.keystore",
5 | visibility = [
6 | "PUBLIC",
7 | ],
8 | )
9 |
--------------------------------------------------------------------------------
/index.js:
--------------------------------------------------------------------------------
1 | /** @format */
2 |
3 | import { AppRegistry } from 'react-native'
4 | import App from './src/App'
5 | import { name as appName } from './app.json'
6 |
7 | AppRegistry.registerComponent(appName, () => App)
8 |
--------------------------------------------------------------------------------
/android/app/src/main/res/values/styles.xml:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
7 |
8 |
9 |
--------------------------------------------------------------------------------
/android/gradle/wrapper/gradle-wrapper.properties:
--------------------------------------------------------------------------------
1 | distributionBase=GRADLE_USER_HOME
2 | distributionPath=wrapper/dists
3 | zipStoreBase=GRADLE_USER_HOME
4 | zipStorePath=wrapper/dists
5 | distributionUrl=https\://services.gradle.org/distributions/gradle-4.10.2-all.zip
6 |
--------------------------------------------------------------------------------
/src/store/actions.js:
--------------------------------------------------------------------------------
1 | export const increment = () => ({
2 | type: "INCREMENT",
3 | });
4 |
5 | export const decrement = () => ({
6 | type: "DECREMENT",
7 | });
8 |
9 | export const changeTitle = (title: string) => ({
10 | type: "CHANGE_TITLE",
11 | title,
12 | });
13 |
--------------------------------------------------------------------------------
/metro.config.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Metro configuration for React Native
3 | * https://github.com/facebook/react-native
4 | *
5 | * @format
6 | */
7 |
8 | module.exports = {
9 | transformer: {
10 | getTransformOptions: async () => ({
11 | transform: {
12 | experimentalImportSupport: false,
13 | inlineRequires: false,
14 | },
15 | }),
16 | },
17 | }
18 |
--------------------------------------------------------------------------------
/android/app/src/debug/AndroidManifest.xml:
--------------------------------------------------------------------------------
1 |
2 |
4 |
5 |
6 |
7 |
8 |
--------------------------------------------------------------------------------
/android/settings.gradle:
--------------------------------------------------------------------------------
1 | rootProject.name = 'testNavigation'
2 | include ':react-native-gesture-handler'
3 | project(':react-native-gesture-handler').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-gesture-handler/android')
4 | include ':react-native-screens'
5 | project(':react-native-screens').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-screens/android')
6 |
7 | include ':app'
8 |
--------------------------------------------------------------------------------
/ios/testNavigation/AppDelegate.h:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright (c) 2015-present, Facebook, Inc.
3 | *
4 | * This source code is licensed under the MIT license found in the
5 | * LICENSE file in the root directory of this source tree.
6 | */
7 |
8 | #import
9 | #import
10 |
11 | @interface AppDelegate : UIResponder
12 |
13 | @property(nonatomic, strong) UIWindow *window;
14 |
15 | @end
16 |
--------------------------------------------------------------------------------
/ios/testNavigation/main.m:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright (c) 2015-present, Facebook, Inc.
3 | *
4 | * This source code is licensed under the MIT license found in the
5 | * LICENSE file in the root directory of this source tree.
6 | */
7 |
8 | #import
9 |
10 | #import "AppDelegate.h"
11 |
12 | int main(int argc, char * argv[]) {
13 | @autoreleasepool {
14 | return UIApplicationMain(argc, argv, nil, NSStringFromClass([AppDelegate class]));
15 | }
16 | }
17 |
--------------------------------------------------------------------------------
/src/store/basicReducer.js:
--------------------------------------------------------------------------------
1 | const INITIAL_STATE = {
2 | value: 0,
3 | title: "",
4 | };
5 |
6 | export const basicReducer = (state = INITIAL_STATE, action) => {
7 | switch (action.type) {
8 | case "INCREMENT":
9 | return { value: state.value + 1 };
10 | case "DECREMENT":
11 | return { value: state.value - 1 };
12 | case "CHANGE_TITLE":
13 | return { ...state, title: action.title };
14 | default:
15 | return state;
16 | }
17 | };
18 |
--------------------------------------------------------------------------------
/android/app/src/main/java/com/testnavigation/MainActivity.java:
--------------------------------------------------------------------------------
1 | package com.testnavigation;
2 |
3 | import com.facebook.react.ReactFragmentActivity;
4 |
5 | public class MainActivity extends ReactFragmentActivity {
6 |
7 | /**
8 | * Returns the name of the main component registered from JavaScript.
9 | * This is used to schedule rendering of the component.
10 | */
11 | @Override
12 | protected String getMainComponentName() {
13 | return "testNavigation";
14 | }
15 | }
16 |
--------------------------------------------------------------------------------
/src/components/PlusOneButton.js:
--------------------------------------------------------------------------------
1 | import React from "react";
2 | import { connect } from "react-redux";
3 | import { Button } from "react-native";
4 |
5 | import { increment } from "../store/actions";
6 |
7 | export class PlusOneButtonBase extends React.Component {
8 | render() {
9 | return ;
10 | }
11 | }
12 |
13 | const mapDispatchToProps = (dispatch: Function) => ({
14 | increment: () => dispatch(increment()),
15 | });
16 |
17 | export const PlusOneButton = connect(
18 | null,
19 | mapDispatchToProps,
20 | )(PlusOneButtonBase);
21 |
--------------------------------------------------------------------------------
/src/components/MinusOneButton.js:
--------------------------------------------------------------------------------
1 | import React from "react";
2 | import { connect } from "react-redux";
3 | import { Button } from "react-native";
4 |
5 | import { decrement } from "../store/actions";
6 |
7 | export class MinusOneButtonBase extends React.Component {
8 | render() {
9 | return ;
10 | }
11 | }
12 |
13 | const mapDispatchToProps = (dispatch: Function) => ({
14 | decrement: () => dispatch(decrement()),
15 | });
16 |
17 | export const MinusOneButton = connect(
18 | null,
19 | mapDispatchToProps,
20 | )(MinusOneButtonBase);
21 |
--------------------------------------------------------------------------------
/src/navigators/RootNav/config.js:
--------------------------------------------------------------------------------
1 | import {
2 | createSwitchNavigator,
3 | createStackNavigator,
4 | createAppContainer,
5 | } from "react-navigation";
6 | import { LoggedNavigator } from "../LoggedNav/config";
7 | import { SignInScreen } from "../../screens/SignInScreen";
8 | import { LoadingScreen } from "../../screens/LoadingScreen";
9 |
10 | const AuthStack = createStackNavigator({ SignIn: SignInScreen });
11 |
12 | const SwitchNavigator = createSwitchNavigator(
13 | {
14 | Loading: LoadingScreen,
15 | App: LoggedNavigator,
16 | Auth: AuthStack,
17 | },
18 | {
19 | initialRouteName: "Loading",
20 | },
21 | );
22 |
23 | export const RootNavigator = createAppContainer(SwitchNavigator);
24 |
--------------------------------------------------------------------------------
/src/App.js:
--------------------------------------------------------------------------------
1 | import React from "react";
2 | import { createStore, combineReducers, applyMiddleware } from "redux";
3 | import { Provider } from "react-redux";
4 | import { useScreens } from "react-native-screens";
5 | import logger from "redux-logger";
6 |
7 | import { RootNavigator } from "./navigators/RootNav/config";
8 | import { basicReducer } from "./store/basicReducer";
9 |
10 | const reducer = combineReducers({ basicReducer });
11 | const store = createStore(reducer, applyMiddleware(logger));
12 |
13 | useScreens();
14 |
15 | export default class App extends React.Component {
16 | render() {
17 | return (
18 |
19 |
20 |
21 | );
22 | }
23 | }
24 |
--------------------------------------------------------------------------------
/android/app/proguard-rules.pro:
--------------------------------------------------------------------------------
1 | # Add project specific ProGuard rules here.
2 | # By default, the flags in this file are appended to flags specified
3 | # in /usr/local/Cellar/android-sdk/24.3.3/tools/proguard/proguard-android.txt
4 | # You can edit the include path and order by changing the proguardFiles
5 | # directive in build.gradle.
6 | #
7 | # For more details, see
8 | # http://developer.android.com/guide/developing/tools/proguard.html
9 |
10 | # Add any project specific keep options here:
11 |
12 | # If your project uses WebView with JS, uncomment the following
13 | # and specify the fully qualified class name to the JavaScript interface
14 | # class:
15 | #-keepclassmembers class fqcn.of.javascript.interface.for.webview {
16 | # public *;
17 | #}
18 |
--------------------------------------------------------------------------------
/src/components/Shapes.js:
--------------------------------------------------------------------------------
1 | import React from "react";
2 | import { View, StyleSheet } from "react-native";
3 |
4 | export const Circle = props => (
5 |
16 | );
17 |
18 | export const Shape = props => (
19 |
27 | );
28 |
29 | const styles = StyleSheet.create({
30 | circle: { justifyContent: "center", alignItems: "center" },
31 | });
32 |
--------------------------------------------------------------------------------
/src/screens/SignInScreen.js:
--------------------------------------------------------------------------------
1 | import React from "react";
2 | import { Button, AsyncStorage, StyleSheet, View } from "react-native";
3 |
4 | export class SignInScreen extends React.Component {
5 | static navigationOptions = {
6 | title: "Please sign in",
7 | };
8 |
9 | render() {
10 | return (
11 |
12 |
13 |
14 | );
15 | }
16 |
17 | _signInAsync = async () => {
18 | await AsyncStorage.setItem("userToken", "abc");
19 | this.props.navigation.navigate("App");
20 | };
21 | }
22 |
23 | const styles = StyleSheet.create({
24 | container: {
25 | flex: 1,
26 | justifyContent: "center",
27 | alignItems: "center",
28 | padding: 20,
29 | },
30 | });
31 |
--------------------------------------------------------------------------------
/ios/testNavigation/Images.xcassets/AppIcon.appiconset/Contents.json:
--------------------------------------------------------------------------------
1 | {
2 | "images" : [
3 | {
4 | "idiom" : "iphone",
5 | "size" : "29x29",
6 | "scale" : "2x"
7 | },
8 | {
9 | "idiom" : "iphone",
10 | "size" : "29x29",
11 | "scale" : "3x"
12 | },
13 | {
14 | "idiom" : "iphone",
15 | "size" : "40x40",
16 | "scale" : "2x"
17 | },
18 | {
19 | "idiom" : "iphone",
20 | "size" : "40x40",
21 | "scale" : "3x"
22 | },
23 | {
24 | "idiom" : "iphone",
25 | "size" : "60x60",
26 | "scale" : "2x"
27 | },
28 | {
29 | "idiom" : "iphone",
30 | "size" : "60x60",
31 | "scale" : "3x"
32 | }
33 | ],
34 | "info" : {
35 | "version" : 1,
36 | "author" : "xcode"
37 | }
38 | }
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | ## Test App for React Navigation and Screens
2 |
3 | This is a simple project for me to test:
4 |
5 | - [React Native 0.58.x](https://github.com/facebook/react-native/tree/0.58-stable) & future versions
6 | - [React Navigation 3.x](https://github.com/react-navigation/react-navigation)
7 | - [React Native Screens](https://github.com/kmagiera/react-native-screens)
8 | - [Fluid Transitions](https://github.com/fram-x/FluidTransitions).
9 |
10 | ### How to
11 |
12 | It should be fairly straightforward, just `git clone` the repo and `yarn`, before running `react-native run-android` or `react-native run-ios`.
13 |
14 | ### Contributing
15 |
16 | Feel free to mess around with it and LMK if you have any feedback using the issue section of the repo :)
17 |
18 | ### Reaching out
19 |
20 | My DMs are open over at [@kelset](https://twitter.com/Kelset) on twitter.
21 |
--------------------------------------------------------------------------------
/ios/testNavigationTests/Info.plist:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | CFBundleDevelopmentRegion
6 | en
7 | CFBundleExecutable
8 | $(EXECUTABLE_NAME)
9 | CFBundleIdentifier
10 | org.reactjs.native.example.$(PRODUCT_NAME:rfc1034identifier)
11 | CFBundleInfoDictionaryVersion
12 | 6.0
13 | CFBundleName
14 | $(PRODUCT_NAME)
15 | CFBundlePackageType
16 | BNDL
17 | CFBundleShortVersionString
18 | 1.0
19 | CFBundleSignature
20 | ????
21 | CFBundleVersion
22 | 1
23 |
24 |
25 |
--------------------------------------------------------------------------------
/ios/testNavigation-tvOSTests/Info.plist:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | CFBundleDevelopmentRegion
6 | en
7 | CFBundleExecutable
8 | $(EXECUTABLE_NAME)
9 | CFBundleIdentifier
10 | org.reactjs.native.example.$(PRODUCT_NAME:rfc1034identifier)
11 | CFBundleInfoDictionaryVersion
12 | 6.0
13 | CFBundleName
14 | $(PRODUCT_NAME)
15 | CFBundlePackageType
16 | BNDL
17 | CFBundleShortVersionString
18 | 1.0
19 | CFBundleSignature
20 | ????
21 | CFBundleVersion
22 | 1
23 |
24 |
25 |
--------------------------------------------------------------------------------
/src/navigators/LoggedNav/config.js:
--------------------------------------------------------------------------------
1 | import React from "react";
2 | import { Button } from "react-native";
3 |
4 | import { createStackNavigator } from "react-navigation";
5 |
6 | import { TabNavigatorScreen } from "../TabNav/config";
7 | import { ModalNavigator } from "../ModalNav/config";
8 |
9 | export const LoggedNavigator = createStackNavigator(
10 | {
11 | Main: {
12 | screen: TabNavigatorScreen,
13 | },
14 | MyModal: {
15 | screen: ModalNavigator,
16 | navigationOptions: ({ navigation }) => ({
17 | headerLeft: (
18 |