Initial commit

Author: auser

android/app/build.gradle

@@ -126,6 +126,7 @@ android {
 }
 
 dependencies {
+ compile project(':react-native-firestack')
  compile fileTree(dir: "libs", include: ["*.jar"])
  compile "com.android.support:appcompat-v7:23.0.1"
  compile "com.facebook.react:react-native:+" // From node_modules

android/app/src/main/java/com/firestackapp/MainApplication.java

@@ -4,6 +4,7 @@
 import android.util.Log;
 
 import com.facebook.react.ReactApplication;
+import io.fullstack.firestack.FirestackPackage;
 import com.facebook.react.ReactInstanceManager;
 import com.facebook.react.ReactNativeHost;
 import com.facebook.react.ReactPackage;
@@ -23,7 +24,8 @@ protected boolean getUseDeveloperSupport() {
  @Override
  protected List<ReactPackage> getPackages() {
  return Arrays.<ReactPackage>asList(
- new MainReactPackage()
+ new MainReactPackage(),
+ new FirestackPackage(getApplicationContext())
  );
  }
  };

android/app/src/main/res/values/strings.xml

@@ -1,3 +1,4 @@
 <resources>
+
  <string name="app_name">FirestackApp</string>
 </resources>

android/settings.gradle

@@ -1,3 +1,5 @@
 rootProject.name = 'FirestackApp'
 
 include ':app'
+include ':react-native-firestack'
+project(':react-native-firestack').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-firestack/android')

app/app.js

@@ -1,63 +1,20 @@
-import React, { Component } from 'react';
-import {
- Text,
- View,
- NavigationExperimental
-} from 'react-native';
+'use strict';
 
-const {
- CardStack: NavigationCardStack,
- Header: NavigationHeader,
-} = NavigationExperimental;
+import React from 'react'
+import { AppRegistry, Text, View } from 'react-native';
+import App from './containers/App';
 
+import {Provider} from 'react-redux';
+import {configureStore} from './redux/configureStore';
 
-import ExampleList from './views/ExampleList'
+const {firestack, store, actions} = configureStore();
 
-import styles from './styles/app';
-
-export class FirestackApp extends Component {
- render() {
- return (
- <NavigationCardStack
- navigationState={this.state.stack}
- style={styles.container}
- renderHeader={this._renderHeader}
- renderScene={this._renderScene}
- onNavigateBack={this._handleBack}
- />
- );
- }
-
- _renderHeader(props: NavigationSceneRendererProps): ReactElement<any> {
- return (
- <NavigationHeader
- {...props}
- onNavigateBack={this._handleBack}
- renderTitleComponent={this._renderTitleComponent}
- />
- );
- }
-
- _renderTitleComponent(props: NavigationSceneRendererProps): ReactElement<any> {
- return (
- <NavigationHeader.Title>
- Firestack Example App
- </NavigationHeader.Title>
- );
- }
-
- _renderScene(props: NavigationSceneRendererProps): ?ReactElement<any> {
- const state = props.scene.route;
- if (state.key === 'AppList') {
- return (
- <ExampleList
- onNavigate={this._handleAction}
- list={UIExplorerList}
- style={styles.exampleContainer}
- {...state}
- />
- );
- }
+const wrapper = (props) => {
+ return (
+ <Provider store={store}>
+ <App actions={actions} firestack={firestack} />
+ </Provider>
+ )
 }
 
-export default FirestackApp
+export default wrapper;

app/components/Navigation/Header.js

@@ -0,0 +1,37 @@
+import React, { PropTypes as T } from 'react'
+
+import {
+ StyleSheet,
+ View,
+ Text,
+ NavigationExperimental
+} from 'react-native'
+
+const {
+ Header: NavigationHeader
+} = NavigationExperimental;
+
+import colors from '../../styles/colors'
+
+export class Header extends React.Component {
+ render() {
+ return (
+ <NavigationHeader
+ {...this.props}
+ style={styles.header}
+ onNavigateBack={this._onBack.bind(this)} />
+ )
+ }
+
+ _onBack() {
+ // on back
+ }
+}
+
+const styles = StyleSheet.create({
+ header: {
+ backgroundColor: colors.white
+ }
+})
+
+export default Header;

app/components/Navigation/Navigator.js

@@ -0,0 +1,143 @@
+import React, { PropTypes as T } from 'react'
+
+import {
+ StyleSheet,
+ View,
+ Text,
+ NavigationExperimental,
+ Easing,
+ Dimensions
+} from 'react-native'
+
+const {
+ Header: NavigationHeader,
+ Transitioner: NavigationTransitioner,
+ CardStack: NavigationCardStack
+} = NavigationExperimental;
+
+const { width, height } = Dimensions.get('window');
+
+import routes from '../../routes';
+import appStyles from '../../styles/app'
+import Header from './Header'
+
+export class FirestackNavigator extends React.Component {
+ static propTypes: {
+ navigationState: NavigationPropTypes.navigationState.isRequired,
+ navigate: PropTypes.func.isRequired,
+ };
+
+ _render(props) {
+ const {scene} = props;
+ return (
+ <View style={appStyles.container} key={scene.key}>
+ {this._renderHeader(props)}
+ {props.scenes
+ .map(scene => this._renderScene({ ...props, scene }))}
+ </View>
+ );
+ }
+
+ _renderScene(sceneProps) {
+ const {scene} = sceneProps;
+ const {route} = scene;
+ const definedRoute = this._lookupRoute(route);
+
+ let Component = definedRoute.Component;
+ if (!Component) {
+ Component = (
+ <View style={styles.scene} key={sceneProps.scene.key}>
+ <Text>Render scene</Text>
+ </View>
+ )
+ }
+
+ return React.createElement(Component, {
+ ...this.props,
+ ...sceneProps,
+ key: scene.key,
+ route: definedRoute
+ });
+ }
+
+ _renderHeader(sceneProps) {
+ const {actions, navigationState} = this.props;
+ const {scene} = sceneProps;
+ let route = this._lookupRoute(scene.route);
+
+ if (!route.noHeader) {
+ // Route not implemented yet, use a default header
+ if (!route.Component && navigationState.index > 0) {
+ const title = route.key
+ route = Object.assign({}, routes.default, {title, actions});
+ }
+
+ route.actions = actions
+ const {headerStyle} = route;
+ let headerProps = Object.assign({}, sceneProps, {
+ route,
+ style: headerStyle || {}
+ });
+
+ const {title, titleComponent} = route;
+ if (title || titleComponent) {
+ headerProps.renderTitleComponent = (props) => {
+ return titleComponent ?
+ titleComponent({...props, actions}) : (<NavigationHeader.Title>{title}</NavigationHeader.Title>);
+ }
+ }
+
+ const {leftComponent, rightComponent} = route;
+ headerProps.renderLeftComponent = leftComponent ?
+ leftComponent.bind(null, actions) : () => (<View />)
+ headerProps.renderRightComponent = rightComponent ?
+ rightComponent.bind(null, actions) : () => (<View />)
+
+ return (<Header {...headerProps} />)
+ }
+ }
+
+ _lookupRoute(routeObject) {
+ const key = routeObject.key || 'default';
+ return routes[key];
+ }
+
+ _configureTransition() {
+ const easing = Easing.inOut(Easing.ease);
+ return {easing, duration: 200}
+ }
+
+ render() {
+ const {navigationState} = this.props;
+ return (
+ <NavigationTransitioner
+ navigationState={navigationState}
+ render={(transitionProps) => this._render(transitionProps)}
+ configureTransition={this._configureTransition}
+ />
+ )
+ }
+}
+
+const styles = StyleSheet.create({
+ container: {
+ },
+ scene: {
+ backgroundColor: '#E9E9EF',
+ bottom: 0,
+ flex: 1,
+ left: 0,
+ position: 'absolute',
+ right: 0,
+ shadowColor: 'black',
+ shadowOffset: {width: 0, height: 0},
+ shadowOpacity: 0.4,
+ shadowRadius: 10,
+ top: 0,
+ },
+ scrollView: {
+ flex: 1,
+ },
+})
+
+export default FirestackNavigator

app/containers/App.js

@@ -0,0 +1,40 @@
+import React, { PropTypes as T } from 'react';
+import {connect} from 'react-redux';
+
+import {
+ StyleSheet,
+ View,
+ Text,
+ NavigationExperimental
+} from 'react-native'
+
+import FirestackNavigator from '../components/Navigation/Navigator'
+
+export class App extends React.Component {
+
+ _navigate({type}) {
+ console.log('_navigate called with type', type);
+ }
+
+ render() {
+ const {navigationState} = this.props;
+ return (
+ <FirestackNavigator
+ {...this.props}
+ navigationState={navigationState}
+ navigate={this._navigate.bind(this)} />
+ )
+ }
+}
+
+const styles = StyleSheet.create({
+ container: {
+ flex: 1
+ }
+})
+
+export default connect(state => {
+ return {
+ navigationState: state.navigation
+ }
+})(App);

app/redux/configureStore.js

@@ -0,0 +1,37 @@
+import { applyMiddleware, combineReducers, createStore } from 'redux'
+import { bindActionCreators } from 'redux'
+import thunk from 'redux-thunk'
+
+import Firestack from 'react-native-firestack'
+import env from '../../config/environment'
+
+import * as currentUser from './modules/currentUser'
+import * as navigation from './modules/navigation'
+
+export const configureStore = (initialState = {}) => {
+ const middleware = applyMiddleware(thunk);
+
+ const firestack = new Firestack(env.firestack)
+
+ const rootReducer = combineReducers({
+ user: currentUser.reducer,
+ navigation: navigation.reducer,
+ firestack: (state) => firestack
+ });
+
+ const store = createStore(
+ rootReducer,
+ initialState,
+ middleware);
+
+ firestack.setStore(store);
+
+ const dispatch = store.dispatch;
+ const actions = {
+ currentUser: bindActionCreators(currentUser.actions, dispatch)
+ }
+
+ return {store,actions}
+}
+
+export default configureStore

app/redux/modules/currentUser.js

@@ -0,0 +1,9 @@
+export const CONSTANTS = {
+}
+
+export const reducer = (state = {}, action) => {
+ return state;
+}
+
+export const actions = {
+}