{"size": 3396, "ext": "js", "max_stars_repo_path": "_/Chapter 04/ch4/tip7/RealmApp/index.ios.js", "max_stars_repo_name": "paullewallencom/react-978-1-7889-9192-6", "max_stars_repo_stars_event_min_datetime": "2017-01-04T01:55:37.000Z", "max_stars_repo_stars_event_max_datetime": "2022-01-04T22:23:38.000Z", "max_issues_repo_path": "_/Chapter 04/ch4/tip7/RealmApp/index.ios.js", "max_issues_repo_name": "paullewallencom/react-978-1-7889-9192-6", "max_issues_repo_issues_event_min_datetime": "2017-12-11T14:25:46.000Z", "max_issues_repo_issues_event_max_datetime": "2020-12-16T14:50:38.000Z", "max_forks_repo_path": "_/Chapter 04/ch4/tip7/RealmApp/index.ios.js", "max_forks_repo_name": "paullewallencom/react-978-1-7889-9192-6", "max_forks_repo_forks_event_min_datetime": "2016-12-19T05:05:44.000Z", "max_forks_repo_forks_event_max_datetime": "2021-04-06T04:56:28.000Z"}
{"max_stars_count": 97, "max_issues_count": 2, "max_forks_count": 44, "avg_line_length": 22.9459459459, "max_line_length": 86, "alphanum_fraction": 0.5435806832}
/**
 * Sample React Native App
 * https://github.com/facebook/react-native
 * @flow
 */

import React, { Component } from 'react';
import {
  AppRegistry,
  StyleSheet,
  Text,
  View
} from 'react-native';
import Realm from 'realm';
import Button from 'react-native-button';

class RealmApp extends Component {
  realm : undefined

  componentWillMount() {
    const realm = this.realm = new Realm({
      schema : [
        {
          name : 'User',
          properties : {
            firstName : 'string',
            lastName : 'string',
            email : 'string'
          }
        }
      ]
    });

    this.setState({users:realm.objects('User')});
  }

  getRandomUser() {
    return fetch('https://randomuser.me/api/').then((response)=>response.json());
  }

  createUser = () => {
    const realm = this.realm;

    this.getRandomUser().then((response) => {
      const user = response.results[0];
      const userName = user.name;
      realm.write(() => {
        realm.create('User', {
          firstName : userName.first,
          lastName  : userName.last,
          email     : user.email
        });
        this.setState({users:realm.objects('User')});
      });
    });
  }

  updateUser = () => {
    const realm = this.realm;
    const users = realm.objects('User');

    realm.write(() => {
      if(users.length) {
        let firstUser = users.slice(0,1)[0];
        firstUser.firstName = 'Bob';
        firstUser.lastName = 'Cookbook';
        firstUser.email = 'react.native@cookbook.com';
        this.setState(users);  
      }
    });
  }

  deleteUsers = () => {
    const realm = this.realm;
    realm.write(() => {
      realm.deleteAll();
      this.setState({users:realm.objects('User')});
    });
  }

  render() {
    const realm = this.realm;
    return (
      <View style={styles.container}>
        <Text style={styles.welcome}>
          Welcome to Realm DB Test!
        </Text>
        <View style={styles.container}>
           <Button
            containerStyle={styles.buttonContainer}
            style={styles.buttonStyle}
            onPress={this.createUser}>
            Add User
          </Button>
           <Button
            containerStyle={styles.buttonContainer}
            style={styles.buttonStyle}
            onPress={this.updateUser}>
            Update First User
          </Button>
           <Button
            containerStyle={styles.buttonContainer}
            style={styles.buttonStyle}
            onPress={this.deleteUsers}>
            Remove All Users
          </Button>
        </View> 
        <View style={styles.container}>
        <Text style={styles.welcome}>Users:</Text>
        {this.state.users.map((user, idx) => {
          return <Text key={idx}>{user.firstName} {user.lastName} {user.email}</Text>;
        })}
        </View>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#F5FCFF',
  },
  welcome: {
    fontSize: 20,
    textAlign: 'center',
    margin: 10,
    paddingTop: 25
  },
  buttonContainer: {
    width: 200,
    padding: 10,
    margin: 5,
    height: 40,
    overflow: 'hidden',
    borderRadius: 4,
    backgroundColor: '#FF5722'
  },
  buttonStyle: {
    fontSize: 16,
    color: 'white'
  }
});

AppRegistry.registerComponent('RealmApp', () => RealmApp);
