Here's a sample react native code from my app.

Result.js

import React, { Component, StyleSheet, View } from 'react-native';
import Text from '../components/Text';
import Icon from '../components/Icon';
import Button from '../components/Button';
import AdMobBanner from '../components/AdMobBanner';
import Analytics from 'react-native-google-analytics-bridge';
import { openUrl, wikiUrl, mapsUrl } from '../utils/urls';
import { connect } from 'react-redux';
import { nextLevel, getRegion } from '../actions';
import { PRIMARY_DARKER } from '../utils/colors';
import { showInterstitialAd } from '../utils/ads';

const styles = StyleSheet.create({
  base: {
    flex: 1,
    backgroundColor: PRIMARY_DARKER
  },
  body: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    padding: 5
  },
  margin: {
    margin: 5
  },
  learnContainer: {
    flexDirection: 'row',
    alignSelf: 'stretch'
  },
  divider: {
    margin: 5,
    alignSelf: 'stretch',
    borderBottomWidth: 1,
    borderBottomColor: 'rgba(0,0,0,0.1)'
  }
});

class Result extends Component {
  componentDidMount() {
    const { city } = this.props;

    Analytics.trackScreenView('Result');
    city && Analytics.trackEvent('city', city.get('name'));
  }

  componentDidUpdate() {
    const { city, isSolved, navigator } = this.props;

    if (!city) {
      navigator.popToTop();
    } else if (!isSolved) {
      navigator.pop();
    }
  }

  render() {
    const { city, isSolved, nextLevel } = this.props;

    if (!city || !isSolved) return null;

    const name = city.get('name');
    const link = city.get('wiki') || name;

    return (
      <View style={styles.base}>
        <View style={styles.body}>
          <Icon name="ios-checkmark-outline" large />
          <Text style={styles.margin} thick center>
            Correct!{'\n'}
            You earn 1 <Icon name="cash" />!
          </Text>
          <View style={styles.divider} />
          <Text style={styles.margin} center>Learn more about {name}</Text>
          <View style={styles.learnContainer}>
            <Button flex
              track={`wiki:${name}`}
              style={styles.margin}
              onPress={() => openUrl(wikiUrl(link))}
            >
              <Text>
                <Icon name="ios-book-outline" /> Wiki
              </Text>
            </Button>
            <Button flex
              track={`maps:${name}`}
              style={styles.margin}
              onPress={() => openUrl(mapsUrl(link))}
            >
              <Text>
                <Icon name="ios-world-outline" /> Maps
              </Text>
            </Button>
          </View>
          <View style={styles.divider} />
          <Button stretch
            style={styles.margin}
            onPress={() => {
              showInterstitialAd();
              nextLevel();
            }}
          >
            <Text thick>Next <Icon name="ios-arrow-thin-right" /></Text>
          </Button>
        </View>
        <AdMobBanner />
      </View>
    );
  }
}

function mapStateToProps(state) {
  const { levelKey } = getRegion();
  const currentLevel = state.get(levelKey);

  if (!currentLevel) return {};

  return {
    city: currentLevel.get('city'),
    isSolved: currentLevel.get('isSolved')
  };
}

export default connect(
  mapStateToProps,
  { nextLevel }
)(Result);