Merge pull request #2 from jacogr/master

Update

Author: qalqi

App.js

@@ -6,70 +6,52 @@
  * @flow
  */
 
-import React, { Fragment } from 'react';
-import {
-  SafeAreaView,
-  StyleSheet,
-  ScrollView,
-  View,
-  Text,
-  StatusBar,
-} from 'react-native';
+import React, { useEffect, useState, Fragment } from 'react';
+import { StyleSheet, View, Text } from 'react-native';
+import { Colors } from 'react-native/Libraries/NewAppScreen';
 
-import {
-  Header,
-  LearnMoreLinks,
-  Colors,
-  DebugInstructions,
-  ReloadInstructions,
-} from 'react-native/Libraries/NewAppScreen';
+import { Keyring } from '@polkadot/keyring';
+import { mnemonicGenerate, cryptoWaitReady } from '@polkadot/util-crypto';
 
-const phrase = 'hello';
+const App = () => {
+  const [info, setInfo] = useState({});
 
-//Commet out this <----------
-//const { bip39Generate } = require('@polkadot/wasm-crypto');
-//phrase = bip39Generate()
+  useEffect(() => {
+    cryptoWaitReady().then(() => {
+      try {
+        const keyring = new Keyring({ type: 'sr25519' });
+        const phrase = mnemonicGenerate(12);
+        const { address, type } = keyring.createFromUri(phrase);
+
+        setInfo({ address, phrase, type });
+      } catch (error) {
+        console.error(error.message)
+      }
+    });
+  }, []);
 
-const App = () => {
   return (
     <Fragment>
-      <StatusBar barStyle="dark-content" />
-      <SafeAreaView>
-        <ScrollView
-          contentInsetAdjustmentBehavior="automatic"
-          style={styles.scrollView}>
-          <Header />
-
-          <View style={styles.body}>
-            <View style={styles.sectionContainer}>
-              <Text style={styles.sectionTitle}>Step One</Text>
-              <Text style={styles.sectionDescription}>
-                Edit <Text style={styles.highlight}>App.js</Text> to change this
-                screen and then come back to see your edits.
-              </Text>
-            </View>
-            <View style={styles.sectionContainer}>
-              <Text style={styles.sectionTitle}>See Your Changes---> {phrase}</Text>
-              <Text style={styles.sectionDescription}>
-                <ReloadInstructions />
-              </Text>
-            </View>
-            <View style={styles.sectionContainer}>
-              <Text style={styles.sectionTitle}>Debug</Text>
-              <Text style={styles.sectionDescription}>
-                <DebugInstructions />
-              </Text>
-            </View>
-            <View style={styles.sectionContainer}>
-              <Text style={styles.sectionTitle}>Learn More</Text>
-              <Text style={styles.sectionDescription}>
-                Read the docs to discover what to do next:
-              </Text>
-            </View>
-            <LearnMoreLinks />
-          </View>
-        </ScrollView>
-      </SafeAreaView>
+      <View style={styles.body}>
+        <View style={styles.sectionContainer}>
+          <Text style={styles.sectionTitle}>phrase</Text>
+          <Text style={styles.sectionDescription}>
+            {info.phrase || '<unknown>'}
+          </Text>
+        </View>
+        <View style={styles.sectionContainer}>
+          <Text style={styles.sectionTitle}>address</Text>
+          <Text style={styles.sectionDescription}>
+            {info.address || '<unknown>'}
+          </Text>
+        </View>
+        <View style={styles.sectionContainer}>
+          <Text style={styles.sectionTitle}>type</Text>
+          <Text style={styles.sectionDescription}>
+            {info.type || '<unknown>'}
+          </Text>
+        </View>
+      </View>
     </Fragment>
   );
 };

README.md

@@ -1,29 +1,35 @@
-### Setup
+## RN + @polkadot/keyring
 
-```
-npm install
-react-native link
-cd ios &&  pod install && cd ..
-```
+Adapted from [qalqi/AwesomeProject](https://github.com/qalqi/AwesomeProject)
+
+![screenshots](output.png)
+
+### Setup & running
+
+Assuming MacOS and yarn, initialize the project with -
 
-### Run metro bundler
 ```
-npm start
+yarn
+react-native link
+cd ios && pod install && cd ..
 ```
 
-### Run in iOS simulator (Mac only in new Tab)
+Run the metro bundler with additional memory options since the asm.js deps are big -
 
 ```
-npm run ios
+NODE_OPTIONS=--max_old_space_size=8192 yarn start
 ```
 
-### To Change react native code open App.js and Press CMD+R to refresh in simulator
+Be aware that this takes a significant time for the first clean build. Make a coffee, drink a beer, go for a walk or play with the dog while it is building.
 
+In a new tab, start the emulator, in this case running iOS -
 
-### Clean metro builder (On new install)
 ```
-npm run clean:perfect
+yarn ios
 ```
 
+If (at some point) you need to clean all the caches, i.e. your dog needs some attention and you need an excuse to walk away on the next build, you can run -
 
-
+```
+yarn clean:perfect
+```