Merged with master

android/app/build.gradle

@@ -137,11 +137,11 @@ android {
 }
 
 dependencies {
+    compile project(':react-native-fast-image')
     compile project(':realm')
     compile project(':react-native-vector-icons')
     compile project(':react-native-restart')
     compile project(':react-native-linear-gradient')
-    compile project(':react-native-fast-image')
     implementation fileTree(dir: "libs", include: ["*.jar"])
     implementation "com.android.support:appcompat-v7:${rootProject.ext.supportLibVersion}"
     implementation "com.facebook.react:react-native:+"  // From node_modules

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

@@ -3,11 +3,11 @@ package com.esteem;
 import android.app.Application;
 
 import com.facebook.react.ReactApplication;
+import com.dylanvann.fastimage.FastImageViewPackage;
 import io.realm.react.RealmReactPackage;
 import com.oblador.vectoricons.VectorIconsPackage;
 import com.avishayil.rnrestart.ReactNativeRestartPackage;
 import com.BV.LinearGradient.LinearGradientPackage;
-import com.dylanvann.fastimage.FastImageViewPackage;
 import com.facebook.react.ReactNativeHost;
 import com.facebook.react.ReactPackage;
 import com.facebook.react.shell.MainReactPackage;
@@ -28,11 +28,11 @@ public class MainApplication extends Application implements ReactApplication {
     protected List<ReactPackage> getPackages() {
       return Arrays.<ReactPackage>asList(
           new MainReactPackage(),
+            new FastImageViewPackage(),
             new RealmReactPackage(),
             new VectorIconsPackage(),
             new ReactNativeRestartPackage(),
-            new LinearGradientPackage(),
+            new LinearGradientPackage()
-            new FastImageViewPackage()
       );
     }
 

android/settings.gradle

@@ -1,4 +1,6 @@
 rootProject.name = 'esteem'
+include ':react-native-fast-image'
+project(':react-native-fast-image').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-fast-image/android')
 include ':realm'
 project(':realm').projectDir = new File(rootProject.projectDir, '../node_modules/realm/android')
 include ':react-native-vector-icons'
@@ -7,7 +9,5 @@ include ':react-native-restart'
 project(':react-native-restart').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-restart/android')
 include ':react-native-linear-gradient'
 project(':react-native-linear-gradient').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-linear-gradient/android')
-include ':react-native-fast-image'
-project(':react-native-fast-image').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-fast-image/android')
 
 include ':app'

ios/eSteem.xcodeproj/project.pbxproj

@@ -47,7 +47,6 @@
 		64D2BA75D6054D5B89967502 /* Roboto.ttf in Resources */ = {isa = PBXBuildFile; fileRef = C308EE3EEC7A48BD919DDFF2 /* Roboto.ttf */; };
 		75A37827C6324BFEA60CC6DA /* EvilIcons.ttf in Resources */ = {isa = PBXBuildFile; fileRef = F084E460D2B1450B9827AB33 /* EvilIcons.ttf */; };
 		832341BD1AAA6AB300B99B32 /* libRCTText.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 832341B51AAA6A8300B99B32 /* libRCTText.a */; };
-		85DF300A6EDC4AE98CD8B5AB /* libFastImage.a in Frameworks */ = {isa = PBXBuildFile; fileRef = A668FDF5F71F4AC7B4EC6B1D /* libFastImage.a */; };
 		912899FDD21841C7A2444920 /* Feather.ttf in Resources */ = {isa = PBXBuildFile; fileRef = D81FE31209CF4D24AA4DAE1B /* Feather.ttf */; };
 		ADBDB9381DFEBF1600ED6528 /* libRCTBlob.a in Frameworks */ = {isa = PBXBuildFile; fileRef = ADBDB9271DFEBF0700ED6528 /* libRCTBlob.a */; };
 		CBE87E3CB30C4B90B585E2FD /* Foundation.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 6CC9B75BE0E640CBB2DE5316 /* Foundation.ttf */; };
@@ -58,6 +57,7 @@
 		F9220AB054914BE1BF04A4B2 /* libRNVectorIcons.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 8616E7F6C6264500B0F3C0AB /* libRNVectorIcons.a */; };
 		FB28DFAA729D4DC3B1668FBC /* Entypo.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 0754D5AAEA2D4DCA9DA7283D /* Entypo.ttf */; };
 		FE22D3734B2C48CB890715FF /* libRealmReact.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 6D0A4B6BC3004763A0094EF3 /* libRealmReact.a */; };
+		BA0C1519F2E34F3090353B33 /* libFastImage.a in Frameworks */ = {isa = PBXBuildFile; fileRef = A0E809C308B04FFF8DEB1C3E /* libFastImage.a */; };
 /* End PBXBuildFile section */
 
 /* Begin PBXContainerItemProxy section */
@@ -117,13 +117,6 @@
 			remoteGlobalIDString = 64AA15081EF7F30100718508;
 			remoteInfo = "BVLinearGradient-tvOS";
 		};
-		0C518B79217202700049DBA5 /* PBXContainerItemProxy */ = {
-			isa = PBXContainerItemProxy;
-			containerPortal = 5B1A171CF0E94B1CB0D66C57 /* FastImage.xcodeproj */;
-			proxyType = 2;
-			remoteGlobalIDString = A287971D1DE0C0A60081BDFA;
-			remoteInfo = FastImage;
-		};
 		0C518B7C217202700049DBA5 /* PBXContainerItemProxy */ = {
 			isa = PBXContainerItemProxy;
 			containerPortal = 2DBBBAA0633D41CBB01D6FEB /* RCTRestart.xcodeproj */;
@@ -409,7 +402,6 @@
 		2F7FE3F27575464186B3A5EC /* Zocial.ttf */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = 9; includeInIndex = 0; lastKnownFileType = unknown; name = Zocial.ttf; path = "../node_modules/native-base/Fonts/Zocial.ttf"; sourceTree = "<group>"; };
 		44CA43D49E374185BA6F37AF /* BVLinearGradient.xcodeproj */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = 9; includeInIndex = 0; lastKnownFileType = "wrapper.pb-project"; name = BVLinearGradient.xcodeproj; path = "../node_modules/react-native-linear-gradient/BVLinearGradient.xcodeproj"; sourceTree = "<group>"; };
 		56E30585028B4757AFB2F260 /* Octicons.ttf */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = 9; includeInIndex = 0; lastKnownFileType = unknown; name = Octicons.ttf; path = "../node_modules/native-base/Fonts/Octicons.ttf"; sourceTree = "<group>"; };
-		5B1A171CF0E94B1CB0D66C57 /* FastImage.xcodeproj */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = 9; includeInIndex = 0; lastKnownFileType = "wrapper.pb-project"; name = FastImage.xcodeproj; path = "../node_modules/react-native-fast-image/ios/FastImage.xcodeproj"; sourceTree = "<group>"; };
 		5E91572D1DD0AC6500FF2AA8 /* RCTAnimation.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTAnimation.xcodeproj; path = "../node_modules/react-native/Libraries/NativeAnimation/RCTAnimation.xcodeproj"; sourceTree = "<group>"; };
 		6CC9B75BE0E640CBB2DE5316 /* Foundation.ttf */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = 9; includeInIndex = 0; lastKnownFileType = unknown; name = Foundation.ttf; path = "../node_modules/native-base/Fonts/Foundation.ttf"; sourceTree = "<group>"; };
 		6D0A4B6BC3004763A0094EF3 /* libRealmReact.a */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = 9; includeInIndex = 0; lastKnownFileType = archive.ar; path = libRealmReact.a; sourceTree = "<group>"; };
@@ -419,7 +411,6 @@
 		88197F38DF02441F9B738AFF /* rubicon-icon-font.ttf */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = 9; includeInIndex = 0; lastKnownFileType = unknown; name = "rubicon-icon-font.ttf"; path = "../node_modules/native-base/Fonts/rubicon-icon-font.ttf"; sourceTree = "<group>"; };
 		8C8AE61985C54992AC765420 /* FontAwesome.ttf */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = 9; includeInIndex = 0; lastKnownFileType = unknown; name = FontAwesome.ttf; path = "../node_modules/native-base/Fonts/FontAwesome.ttf"; sourceTree = "<group>"; };
 		9F13A372FBF946B5BDBE78FA /* Ionicons.ttf */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = 9; includeInIndex = 0; lastKnownFileType = unknown; name = Ionicons.ttf; path = "../node_modules/native-base/Fonts/Ionicons.ttf"; sourceTree = "<group>"; };
-		A668FDF5F71F4AC7B4EC6B1D /* libFastImage.a */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = 9; includeInIndex = 0; lastKnownFileType = archive.ar; path = libFastImage.a; sourceTree = "<group>"; };
 		ADBDB91F1DFEBF0600ED6528 /* RCTBlob.xcodeproj */ = {isa = PBXFileReference; lastKnownFileType = "wrapper.pb-project"; name = RCTBlob.xcodeproj; path = "../node_modules/react-native/Libraries/Blob/RCTBlob.xcodeproj"; sourceTree = "<group>"; };
 		B2C904BFD14B44C68128BB7F /* libRCTRestart.a */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = 9; includeInIndex = 0; lastKnownFileType = archive.ar; path = libRCTRestart.a; sourceTree = "<group>"; };
 		B3E4DB34CA2240EDA2D0E831 /* SimpleLineIcons.ttf */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = 9; includeInIndex = 0; lastKnownFileType = unknown; name = SimpleLineIcons.ttf; path = "../node_modules/native-base/Fonts/SimpleLineIcons.ttf"; sourceTree = "<group>"; };
@@ -431,6 +422,8 @@
 		E75C11A31EE54C5899D50416 /* Roboto_medium.ttf */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = 9; includeInIndex = 0; lastKnownFileType = unknown; name = Roboto_medium.ttf; path = "../node_modules/native-base/Fonts/Roboto_medium.ttf"; sourceTree = "<group>"; };
 		F084E460D2B1450B9827AB33 /* EvilIcons.ttf */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = 9; includeInIndex = 0; lastKnownFileType = unknown; name = EvilIcons.ttf; path = "../node_modules/native-base/Fonts/EvilIcons.ttf"; sourceTree = "<group>"; };
 		FBBEEEBB9C8048F78189B2C0 /* libc++.tbd */ = {isa = PBXFileReference; explicitFileType = undefined; fileEncoding = 9; includeInIndex = 0; lastKnownFileType = "sourcecode.text-based-dylib-definition"; name = "libc++.tbd"; path = "usr/lib/libc++.tbd"; sourceTree = SDKROOT; };
+		C840826DE45F44E5A4972D7F /* FastImage.xcodeproj */ = {isa = PBXFileReference; name = "FastImage.xcodeproj"; path = "../node_modules/react-native-fast-image/ios/FastImage.xcodeproj"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = wrapper.pb-project; explicitFileType = undefined; includeInIndex = 0; };
+		A0E809C308B04FFF8DEB1C3E /* libFastImage.a */ = {isa = PBXFileReference; name = "libFastImage.a"; path = "libFastImage.a"; sourceTree = "<group>"; fileEncoding = undefined; lastKnownFileType = archive.ar; explicitFileType = undefined; includeInIndex = 0; };
 /* End PBXFileReference section */
 
 /* Begin PBXFrameworksBuildPhase section */
@@ -458,13 +451,13 @@
 				832341BD1AAA6AB300B99B32 /* libRCTText.a in Frameworks */,
 				00C302EA1ABCBA2D00DB3ED1 /* libRCTVibration.a in Frameworks */,
 				139FDEF61B0652A700C62182 /* libRCTWebSocket.a in Frameworks */,
-				85DF300A6EDC4AE98CD8B5AB /* libFastImage.a in Frameworks */,
 				3AB14466CEC544049AD08811 /* libBVLinearGradient.a in Frameworks */,
 				D91033650FE94398A5424B19 /* libRCTRestart.a in Frameworks */,
 				F9220AB054914BE1BF04A4B2 /* libRNVectorIcons.a in Frameworks */,
 				FE22D3734B2C48CB890715FF /* libRealmReact.a in Frameworks */,
 				5E482AACE164450FAD00E13F /* libc++.tbd in Frameworks */,
 				4EB85A02CD474B848E110697 /* libz.tbd in Frameworks */,
+				BA0C1519F2E34F3090353B33 /* libFastImage.a in Frameworks */,
 			);
 			runOnlyForDeploymentPostprocessing = 0;
 		};
@@ -590,14 +583,6 @@
 			name = Products;
 			sourceTree = "<group>";
 		};
-		0C518B6E2172026F0049DBA5 /* Products */ = {
-			isa = PBXGroup;
-			children = (
-				0C518B7A217202700049DBA5 /* libFastImage.a */,
-			);
-			name = Products;
-			sourceTree = "<group>";
-		};
 		0C518B702172026F0049DBA5 /* Products */ = {
 			isa = PBXGroup;
 			children = (
@@ -727,11 +712,11 @@
 				832341B01AAA6A8300B99B32 /* RCTText.xcodeproj */,
 				00C302DF1ABCB9EE00DB3ED1 /* RCTVibration.xcodeproj */,
 				139FDEE61B06529A00C62182 /* RCTWebSocket.xcodeproj */,
-				5B1A171CF0E94B1CB0D66C57 /* FastImage.xcodeproj */,
 				44CA43D49E374185BA6F37AF /* BVLinearGradient.xcodeproj */,
 				2DBBBAA0633D41CBB01D6FEB /* RCTRestart.xcodeproj */,
 				CFB5920886014F419FC6D19A /* RNVectorIcons.xcodeproj */,
 				0019E13B96A747699592B643 /* RealmReact.xcodeproj */,
+				C840826DE45F44E5A4972D7F /* FastImage.xcodeproj */,
 			);
 			name = Libraries;
 			sourceTree = "<group>";
@@ -896,10 +881,6 @@
 					ProductGroup = 0C518B682172026F0049DBA5 /* Products */;
 					ProjectRef = 44CA43D49E374185BA6F37AF /* BVLinearGradient.xcodeproj */;
 				},
-				{
-					ProductGroup = 0C518B6E2172026F0049DBA5 /* Products */;
-					ProjectRef = 5B1A171CF0E94B1CB0D66C57 /* FastImage.xcodeproj */;
-				},
 				{
 					ProductGroup = 00C302A81ABCB8CE00DB3ED1 /* Products */;
 					ProjectRef = 00C302A71ABCB8CE00DB3ED1 /* RCTActionSheet.xcodeproj */;
@@ -1021,13 +1002,6 @@
 			remoteRef = 0C518B76217202700049DBA5 /* PBXContainerItemProxy */;
 			sourceTree = BUILT_PRODUCTS_DIR;
 		};
-		0C518B7A217202700049DBA5 /* libFastImage.a */ = {
-			isa = PBXReferenceProxy;
-			fileType = archive.ar;
-			path = libFastImage.a;
-			remoteRef = 0C518B79217202700049DBA5 /* PBXContainerItemProxy */;
-			sourceTree = BUILT_PRODUCTS_DIR;
-		};
 		0C518B7D217202700049DBA5 /* libRCTRestart.a */ = {
 			isa = PBXReferenceProxy;
 			fileType = archive.ar;
@@ -1238,6 +1212,13 @@
 			remoteRef = 3DAD3EAE1DF850E9000B6D8A /* PBXContainerItemProxy */;
 			sourceTree = BUILT_PRODUCTS_DIR;
 		};
+		478F70212178F4DC00AB7885 /* libReact-Native-Webview-Bridge.a */ = {
+			isa = PBXReferenceProxy;
+			fileType = archive.ar;
+			path = "libReact-Native-Webview-Bridge.a";
+			remoteRef = 478F70202178F4DC00AB7885 /* PBXContainerItemProxy */;
+			sourceTree = BUILT_PRODUCTS_DIR;
+		};
 		5E9157331DD0AC6500FF2AA8 /* libRCTAnimation.a */ = {
 			isa = PBXReferenceProxy;
 			fileType = archive.ar;
@@ -1427,11 +1408,11 @@
 				);
 				HEADER_SEARCH_PATHS = (
 					"$(inherited)",
-					"$(SRCROOT)/../node_modules/react-native-fast-image/ios/FastImage/**",
 					"$(SRCROOT)/../node_modules/react-native-linear-gradient/BVLinearGradient",
 					"$(SRCROOT)/../node_modules/react-native-restart/ios/RCTRestart/**",
 					"$(SRCROOT)/../node_modules/react-native-vector-icons/RNVectorIconsManager",
 					"$(SRCROOT)/../node_modules/realm/src/**",
+					"$(SRCROOT)/../node_modules/react-native-fast-image/ios/FastImage/**",
 				);
 				INFOPLIST_FILE = esteemTests/Info.plist;
 				IPHONEOS_DEPLOYMENT_TARGET = 9.0;
@@ -1439,10 +1420,6 @@
 				LIBRARY_SEARCH_PATHS = (
 					"$(inherited)",
 					"\"$(SRCROOT)/$(TARGET_NAME)\"",
-					"\"$(SRCROOT)/$(TARGET_NAME)\"",
-					"\"$(SRCROOT)/$(TARGET_NAME)\"",
-					"\"$(SRCROOT)/$(TARGET_NAME)\"",
-					"\"$(SRCROOT)/$(TARGET_NAME)\"",
 				);
 				OTHER_LDFLAGS = (
 					"-ObjC",
@@ -1461,11 +1438,11 @@
 				COPY_PHASE_STRIP = NO;
 				HEADER_SEARCH_PATHS = (
 					"$(inherited)",
-					"$(SRCROOT)/../node_modules/react-native-fast-image/ios/FastImage/**",
 					"$(SRCROOT)/../node_modules/react-native-linear-gradient/BVLinearGradient",
 					"$(SRCROOT)/../node_modules/react-native-restart/ios/RCTRestart/**",
 					"$(SRCROOT)/../node_modules/react-native-vector-icons/RNVectorIconsManager",
 					"$(SRCROOT)/../node_modules/realm/src/**",
+					"$(SRCROOT)/../node_modules/react-native-fast-image/ios/FastImage/**",
 				);
 				INFOPLIST_FILE = esteemTests/Info.plist;
 				IPHONEOS_DEPLOYMENT_TARGET = 9.0;
@@ -1473,10 +1450,6 @@
 				LIBRARY_SEARCH_PATHS = (
 					"$(inherited)",
 					"\"$(SRCROOT)/$(TARGET_NAME)\"",
-					"\"$(SRCROOT)/$(TARGET_NAME)\"",
-					"\"$(SRCROOT)/$(TARGET_NAME)\"",
-					"\"$(SRCROOT)/$(TARGET_NAME)\"",
-					"\"$(SRCROOT)/$(TARGET_NAME)\"",
 				);
 				OTHER_LDFLAGS = (
 					"-ObjC",
@@ -1496,11 +1469,11 @@
 				DEAD_CODE_STRIPPING = NO;
 				HEADER_SEARCH_PATHS = (
 					"$(inherited)",
-					"$(SRCROOT)/../node_modules/react-native-fast-image/ios/FastImage/**",
 					"$(SRCROOT)/../node_modules/react-native-linear-gradient/BVLinearGradient",
 					"$(SRCROOT)/../node_modules/react-native-restart/ios/RCTRestart/**",
 					"$(SRCROOT)/../node_modules/react-native-vector-icons/RNVectorIconsManager",
 					"$(SRCROOT)/../node_modules/realm/src/**",
+					"$(SRCROOT)/../node_modules/react-native-fast-image/ios/FastImage/**",
 				);
 				INFOPLIST_FILE = esteem/Info.plist;
 				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
@@ -1522,11 +1495,11 @@
 				CURRENT_PROJECT_VERSION = 1;
 				HEADER_SEARCH_PATHS = (
 					"$(inherited)",
-					"$(SRCROOT)/../node_modules/react-native-fast-image/ios/FastImage/**",
 					"$(SRCROOT)/../node_modules/react-native-linear-gradient/BVLinearGradient",
 					"$(SRCROOT)/../node_modules/react-native-restart/ios/RCTRestart/**",
 					"$(SRCROOT)/../node_modules/react-native-vector-icons/RNVectorIconsManager",
 					"$(SRCROOT)/../node_modules/realm/src/**",
+					"$(SRCROOT)/../node_modules/react-native-fast-image/ios/FastImage/**",
 				);
 				INFOPLIST_FILE = esteem/Info.plist;
 				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
@@ -1555,21 +1528,17 @@
 				GCC_NO_COMMON_BLOCKS = YES;
 				HEADER_SEARCH_PATHS = (
 					"$(inherited)",
-					"$(SRCROOT)/../node_modules/react-native-fast-image/ios/FastImage/**",
 					"$(SRCROOT)/../node_modules/react-native-linear-gradient/BVLinearGradient",
 					"$(SRCROOT)/../node_modules/react-native-restart/ios/RCTRestart/**",
 					"$(SRCROOT)/../node_modules/react-native-vector-icons/RNVectorIconsManager",
 					"$(SRCROOT)/../node_modules/realm/src/**",
+					"$(SRCROOT)/../node_modules/react-native-fast-image/ios/FastImage/**",
 				);
 				INFOPLIST_FILE = "esteem-tvOS/Info.plist";
 				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
 				LIBRARY_SEARCH_PATHS = (
 					"$(inherited)",
 					"\"$(SRCROOT)/$(TARGET_NAME)\"",
-					"\"$(SRCROOT)/$(TARGET_NAME)\"",
-					"\"$(SRCROOT)/$(TARGET_NAME)\"",
-					"\"$(SRCROOT)/$(TARGET_NAME)\"",
-					"\"$(SRCROOT)/$(TARGET_NAME)\"",
 				);
 				OTHER_LDFLAGS = (
 					"-ObjC",
@@ -1597,21 +1566,17 @@
 				GCC_NO_COMMON_BLOCKS = YES;
 				HEADER_SEARCH_PATHS = (
 					"$(inherited)",
-					"$(SRCROOT)/../node_modules/react-native-fast-image/ios/FastImage/**",
 					"$(SRCROOT)/../node_modules/react-native-linear-gradient/BVLinearGradient",
 					"$(SRCROOT)/../node_modules/react-native-restart/ios/RCTRestart/**",
 					"$(SRCROOT)/../node_modules/react-native-vector-icons/RNVectorIconsManager",
 					"$(SRCROOT)/../node_modules/realm/src/**",
+					"$(SRCROOT)/../node_modules/react-native-fast-image/ios/FastImage/**",
 				);
 				INFOPLIST_FILE = "esteem-tvOS/Info.plist";
 				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
 				LIBRARY_SEARCH_PATHS = (
 					"$(inherited)",
 					"\"$(SRCROOT)/$(TARGET_NAME)\"",
-					"\"$(SRCROOT)/$(TARGET_NAME)\"",
-					"\"$(SRCROOT)/$(TARGET_NAME)\"",
-					"\"$(SRCROOT)/$(TARGET_NAME)\"",
-					"\"$(SRCROOT)/$(TARGET_NAME)\"",
 				);
 				OTHER_LDFLAGS = (
 					"-ObjC",
@@ -1638,21 +1603,17 @@
 				GCC_NO_COMMON_BLOCKS = YES;
 				HEADER_SEARCH_PATHS = (
 					"$(inherited)",
-					"$(SRCROOT)/../node_modules/react-native-fast-image/ios/FastImage/**",
 					"$(SRCROOT)/../node_modules/react-native-linear-gradient/BVLinearGradient",
 					"$(SRCROOT)/../node_modules/react-native-restart/ios/RCTRestart/**",
 					"$(SRCROOT)/../node_modules/react-native-vector-icons/RNVectorIconsManager",
 					"$(SRCROOT)/../node_modules/realm/src/**",
+					"$(SRCROOT)/../node_modules/react-native-fast-image/ios/FastImage/**",
 				);
 				INFOPLIST_FILE = "esteem-tvOSTests/Info.plist";
 				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks @loader_path/Frameworks";
 				LIBRARY_SEARCH_PATHS = (
 					"$(inherited)",
 					"\"$(SRCROOT)/$(TARGET_NAME)\"",
-					"\"$(SRCROOT)/$(TARGET_NAME)\"",
-					"\"$(SRCROOT)/$(TARGET_NAME)\"",
-					"\"$(SRCROOT)/$(TARGET_NAME)\"",
-					"\"$(SRCROOT)/$(TARGET_NAME)\"",
 				);
 				OTHER_LDFLAGS = (
 					"-ObjC",
@@ -1679,21 +1640,17 @@
 				GCC_NO_COMMON_BLOCKS = YES;
 				HEADER_SEARCH_PATHS = (
 					"$(inherited)",
-					"$(SRCROOT)/../node_modules/react-native-fast-image/ios/FastImage/**",
 					"$(SRCROOT)/../node_modules/react-native-linear-gradient/BVLinearGradient",
 					"$(SRCROOT)/../node_modules/react-native-restart/ios/RCTRestart/**",
 					"$(SRCROOT)/../node_modules/react-native-vector-icons/RNVectorIconsManager",
 					"$(SRCROOT)/../node_modules/realm/src/**",
+					"$(SRCROOT)/../node_modules/react-native-fast-image/ios/FastImage/**",
 				);
 				INFOPLIST_FILE = "esteem-tvOSTests/Info.plist";
 				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks @loader_path/Frameworks";
 				LIBRARY_SEARCH_PATHS = (
 					"$(inherited)",
 					"\"$(SRCROOT)/$(TARGET_NAME)\"",
-					"\"$(SRCROOT)/$(TARGET_NAME)\"",
-					"\"$(SRCROOT)/$(TARGET_NAME)\"",
-					"\"$(SRCROOT)/$(TARGET_NAME)\"",
-					"\"$(SRCROOT)/$(TARGET_NAME)\"",
 				);
 				OTHER_LDFLAGS = (
 					"-ObjC",

ios/eSteem/Info.plist

@@ -5,7 +5,7 @@
 	<key>CFBundleDevelopmentRegion</key>
 	<string>en</string>
 	<key>CFBundleDisplayName</key>
-	<string>esteem</string>
+	<string>eSteem</string>
 	<key>CFBundleExecutable</key>
 	<string>$(EXECUTABLE_NAME)</string>
 	<key>CFBundleIdentifier</key>
@@ -39,6 +39,20 @@
 	</dict>
 	<key>NSLocationWhenInUseUsageDescription</key>
 	<string/>
+	<key>UILaunchStoryboardName</key>
+	<string>LaunchScreen</string>
+	<key>UIRequiredDeviceCapabilities</key>
+	<array>
+		<string>armv7</string>
+	</array>
+	<key>UISupportedInterfaceOrientations</key>
+	<array>
+		<string>UIInterfaceOrientationPortrait</string>
+		<string>UIInterfaceOrientationLandscapeLeft</string>
+		<string>UIInterfaceOrientationLandscapeRight</string>
+	</array>
+	<key>UIViewControllerBasedStatusBarAppearance</key>
+	<false/>
 	<key>UIAppFonts</key>
 	<array>
 		<string>Entypo.ttf</string>
@@ -56,19 +70,5 @@
 		<string>SimpleLineIcons.ttf</string>
 		<string>Zocial.ttf</string>
 	</array>
-	<key>UILaunchStoryboardName</key>
-	<string>LaunchScreen</string>
-	<key>UIRequiredDeviceCapabilities</key>
-	<array>
-		<string>armv7</string>
-	</array>
-	<key>UISupportedInterfaceOrientations</key>
-	<array>
-		<string>UIInterfaceOrientationPortrait</string>
-		<string>UIInterfaceOrientationLandscapeLeft</string>
-		<string>UIInterfaceOrientationLandscapeRight</string>
-	</array>
-	<key>UIViewControllerBasedStatusBarAppearance</key>
-	<false/>
 </dict>
 </plist>

package-lock.json

@@ -1,5 +1,5 @@
 {
-  "name": "esteem",
+  "name": "eSteem",
   "version": "0.0.1",
   "lockfileVersion": 1,
   "requires": true,
@@ -302,11 +302,6 @@
       "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.1.2.tgz",
       "integrity": "sha512-x5HFsW+E/nQalGMw7hu+fvPqnBeBaIr0lWJ2SG0PPL2j+Pm9lYvCrsZJGIgauPIENx0v10INIyFjmSNUD/gSqQ=="
     },
-    "@babel/plugin-check-constants": {
-      "version": "7.0.0-beta.38",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-check-constants/-/plugin-check-constants-7.0.0-beta.38.tgz",
-      "integrity": "sha512-MjdGn/2sMLu0fnNFbkILut0OsegzRTeCOJ/uGHH88TwTXPzxONx2cTVJ36i3cTQXHMiIOUT3hX6HqzWM99Q6vA=="
-    },
     "@babel/plugin-external-helpers": {
       "version": "7.0.0",
       "resolved": "https://registry.npmjs.org/@babel/plugin-external-helpers/-/plugin-external-helpers-7.0.0.tgz",
@@ -2985,7 +2980,7 @@
       "dependencies": {
         "file-type": {
           "version": "3.9.0",
-          "resolved": "https://registry.npmjs.org/file-type/-/file-type-3.9.0.tgz",
+          "resolved": "http://registry.npmjs.org/file-type/-/file-type-3.9.0.tgz",
           "integrity": "sha1-JXoHg4TR24CHvESdEH1SpSZyuek="
         },
         "get-stream": {
@@ -7653,9 +7648,9 @@
       }
     },
     "lodash": {
-      "version": "4.17.10",
+      "version": "4.17.11",
-      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.10.tgz",
+      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.11.tgz",
-      "integrity": "sha512-UejweD1pDoXu+AD825lWwp4ZGtSwgnpZxb3JDViD7StjQz+Nb/6l093lx4OQ0foGWNRoc19mWy7BzL+UAK2iVg=="
+      "integrity": "sha512-cQKh8igo5QUhZ7lg38DYWAxMvjSAKG0A8wGSVimP07SIUEK2UO+arSRKbRZWtelMtN5V0Hkwh5ryOto/SshYIg=="
     },
     "lodash-es": {
       "version": "4.17.11",
@@ -7914,9 +7909,9 @@
       }
     },
     "metro": {
-      "version": "0.47.1",
+      "version": "0.48.1",
-      "resolved": "https://registry.npmjs.org/metro/-/metro-0.47.1.tgz",
+      "resolved": "https://registry.npmjs.org/metro/-/metro-0.48.1.tgz",
-      "integrity": "sha512-39o0ZLHNWOi8+Pc2zB/gG0bito7BEmjUF4AKZLkOSGMuQw4JF/WcgN20v3XRR4hCL8SEQr6YSFw2Vpzw8OSYyA==",
+      "integrity": "sha512-7V+YOqfmgGhomdWAoD58zRQvPxUgBIo6b1YgcZULvh7yPPMo3tTkTvrzS2Qd2N3LFTysRQWzOlkb7O7jAV5FDw==",
       "requires": {
         "@babel/core": "^7.0.0",
         "@babel/generator": "^7.0.0",
@@ -7944,13 +7939,13 @@
         "json-stable-stringify": "^1.0.1",
         "lodash.throttle": "^4.1.1",
         "merge-stream": "^1.0.1",
-        "metro-cache": "0.47.1",
+        "metro-cache": "0.48.1",
-        "metro-config": "0.47.1",
+        "metro-config": "0.48.1",
-        "metro-core": "0.47.1",
+        "metro-core": "0.48.1",
-        "metro-minify-uglify": "0.47.1",
+        "metro-minify-uglify": "0.48.1",
-        "metro-react-native-babel-preset": "0.47.1",
+        "metro-react-native-babel-preset": "0.48.1",
-        "metro-resolver": "0.47.1",
+        "metro-resolver": "0.48.1",
-        "metro-source-map": "0.47.1",
+        "metro-source-map": "0.48.1",
         "mime-types": "2.1.11",
         "mkdirp": "^0.5.1",
         "node-fetch": "^2.2.0",
@@ -7975,11 +7970,10 @@
           "integrity": "sha512-Xj9XuRuz3nTSbaTXWv3itLOcxyF4oPD8douBBmj7U9BBC6nEBYfyOJYQMf/8PJAFotC62UY5dFfIGEPr7WswzQ=="
         },
         "babel-preset-fbjs": {
-          "version": "3.0.1",
+          "version": "3.1.0",
-          "resolved": "https://registry.npmjs.org/babel-preset-fbjs/-/babel-preset-fbjs-3.0.1.tgz",
+          "resolved": "https://registry.npmjs.org/babel-preset-fbjs/-/babel-preset-fbjs-3.1.0.tgz",
-          "integrity": "sha512-Fc0t7v8T1tBwv5AVyDDZEnS3T7OQ97qV0XawVZg1ouarlM9xCHL994C5tU8TBIKPk3yZXG+SaEM1YQcx/yLlcg==",
+          "integrity": "sha512-j+B9xZsnqWFxHaqt3B8aFYftSgrcgbO5NF3mTtHYd6R442NJW2aBk3k+XvxXwIia98UuZxCg8psZY79bXbhwew==",
           "requires": {
-            "@babel/plugin-check-constants": "^7.0.0-beta.38",
             "@babel/plugin-proposal-class-properties": "^7.0.0",
             "@babel/plugin-proposal-object-rest-spread": "^7.0.0",
             "@babel/plugin-syntax-class-properties": "^7.0.0",
@@ -8040,9 +8034,9 @@
           }
         },
         "metro-react-native-babel-preset": {
-          "version": "0.47.1",
+          "version": "0.48.1",
-          "resolved": "https://registry.npmjs.org/metro-react-native-babel-preset/-/metro-react-native-babel-preset-0.47.1.tgz",
+          "resolved": "https://registry.npmjs.org/metro-react-native-babel-preset/-/metro-react-native-babel-preset-0.48.1.tgz",
-          "integrity": "sha512-p5qrbcECeZ/PYQm3Sv7cxMtVdUz4TZrhjjGFkAdmSWlhveztALYzk0lNn6fL3DCRcFRiO0NvS90JO5XXOJFk3w==",
+          "integrity": "sha512-euJ0MOyBYTa76kQNbly6An9FNpu9BqxfkXhKtD8hWZxo5dxIAk25AmoWfXU2OHj7PogG/u0Ndo3tmhZZ2NWYvA==",
           "requires": {
             "@babel/plugin-proposal-class-properties": "^7.0.0",
             "@babel/plugin-proposal-export-default-from": "^7.0.0",
@@ -8077,18 +8071,18 @@
             "@babel/plugin-transform-typescript": "^7.0.0",
             "@babel/plugin-transform-unicode-regex": "^7.0.0",
             "@babel/template": "^7.0.0",
-            "metro-babel7-plugin-react-transform": "0.47.1",
+            "metro-babel7-plugin-react-transform": "0.48.1",
             "react-transform-hmr": "^1.0.4"
           }
         },
         "mime-db": {
           "version": "1.23.0",
-          "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.23.0.tgz",
+          "resolved": "http://registry.npmjs.org/mime-db/-/mime-db-1.23.0.tgz",
           "integrity": "sha1-oxtAcK2uon1zLqMzdApk0OyaZlk="
         },
         "mime-types": {
           "version": "2.1.11",
-          "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.11.tgz",
+          "resolved": "http://registry.npmjs.org/mime-types/-/mime-types-2.1.11.tgz",
           "integrity": "sha1-wlnEcb2oCKhdbNGTtDCl+uRHOzw=",
           "requires": {
             "mime-db": "~1.23.0"
@@ -8122,9 +8116,9 @@
       }
     },
     "metro-babel-register": {
-      "version": "0.47.1",
+      "version": "0.48.1",
-      "resolved": "https://registry.npmjs.org/metro-babel-register/-/metro-babel-register-0.47.1.tgz",
+      "resolved": "https://registry.npmjs.org/metro-babel-register/-/metro-babel-register-0.48.1.tgz",
-      "integrity": "sha512-yp7Z55VrpO3ZJLgFTcBNlhYmPCfstvBDRbj0S/d6IAk9YQeI10XSFOsVJcRgbrEfihrU/un7VXc3QC8PIkjxlQ==",
+      "integrity": "sha512-bSjMAD16vpyHRWeMJ6CXvhWbFbiW58YXhA9zgRbFBdxOcJPbkhj6HEX+FlxTlr2O0MNY27/4U96MFXTcRWcZhQ==",
       "requires": {
         "@babel/core": "^7.0.0",
         "@babel/plugin-proposal-class-properties": "^7.0.0",
@@ -8148,33 +8142,33 @@
       }
     },
     "metro-babel7-plugin-react-transform": {
-      "version": "0.47.1",
+      "version": "0.48.1",
-      "resolved": "https://registry.npmjs.org/metro-babel7-plugin-react-transform/-/metro-babel7-plugin-react-transform-0.47.1.tgz",
+      "resolved": "https://registry.npmjs.org/metro-babel7-plugin-react-transform/-/metro-babel7-plugin-react-transform-0.48.1.tgz",
-      "integrity": "sha512-b7drnNbVww/AastsGlVBy3o5HJUGgjEMB1UrXHYh8Me5dVqirH5uEdy0d3cQAnMaq4lv5PBmcaoX/FP0bdLI5A==",
+      "integrity": "sha512-b39Sowwzp0bqitbS3NkF5fzcuoT6vpLqj6Su7xgfCyW5EmYpvxunK7HwMSoZagAIpbD0H6r+iw+L2Ib1EEWfWw==",
       "requires": {
         "@babel/helper-module-imports": "^7.0.0"
       }
     },
     "metro-cache": {
-      "version": "0.47.1",
+      "version": "0.48.1",
-      "resolved": "https://registry.npmjs.org/metro-cache/-/metro-cache-0.47.1.tgz",
+      "resolved": "https://registry.npmjs.org/metro-cache/-/metro-cache-0.48.1.tgz",
-      "integrity": "sha512-pMW9soKT2adcTLLPX52aJADPVl1u0NYKNBXG+B3J2vB4OZmtAQq66PlG+sl0sjqGoq4PoUW+Oq+L3J5RcAMTmQ==",
+      "integrity": "sha512-Nq1RQ7SkhVKKO/uWKzc6JtvDm0JJD/kDsoIQNR2Db37fNlyGxij0FoYRNOX3BOnyhz0NG8kU1pz0qH43bPQ5rg==",
       "requires": {
         "jest-serializer": "23.0.1",
-        "metro-core": "0.47.1",
+        "metro-core": "0.48.1",
         "mkdirp": "^0.5.1",
         "rimraf": "^2.5.4"
       }
     },
     "metro-config": {
-      "version": "0.47.1",
+      "version": "0.48.1",
-      "resolved": "https://registry.npmjs.org/metro-config/-/metro-config-0.47.1.tgz",
+      "resolved": "https://registry.npmjs.org/metro-config/-/metro-config-0.48.1.tgz",
-      "integrity": "sha512-TqVGWCfD8OHqdSmQn7hEmEYxGlATim6rnhOEp5hJvqPPdVnN8iU/5qRdTl8FR7sH7Axx5TeV1pi8G86M8m0djg==",
+      "integrity": "sha512-pqdbDHUtoQPfWiL8h3x/cN5Q8w/sPt5/UaXk4oIzalU+ooEh0Hi9w10wJHKVRtWzD27o828O04En51C9eEDY5g==",
       "requires": {
         "cosmiconfig": "^5.0.5",
-        "metro": "0.47.1",
+        "metro": "0.48.1",
-        "metro-cache": "0.47.1",
+        "metro-cache": "0.48.1",
-        "metro-core": "0.47.1",
+        "metro-core": "0.48.1",
         "pretty-format": "^23.4.1"
       },
       "dependencies": {
@@ -8203,25 +8197,25 @@
       }
     },
     "metro-core": {
-      "version": "0.47.1",
+      "version": "0.48.1",
-      "resolved": "https://registry.npmjs.org/metro-core/-/metro-core-0.47.1.tgz",
+      "resolved": "https://registry.npmjs.org/metro-core/-/metro-core-0.48.1.tgz",
-      "integrity": "sha512-xO/vP3jNd8GD2nZw7rJq+dQ/UEJ4pniHmP3rV0a8jIMRMIsknHaf8EX/C66H8bcYV0eTkRoY1MZH2AV1cCGTAw==",
+      "integrity": "sha512-uctosjP4imHThHlD5hAt0Yg7tiRLmY3GlU4VaIs0YH2i82yI56b93RtTCI1ACWhL7LUuttSVpPXCBN3ERTe+KA==",
       "requires": {
         "jest-haste-map": "23.5.0",
         "lodash.throttle": "^4.1.1",
-        "metro-resolver": "0.47.1",
+        "metro-resolver": "0.48.1",
         "wordwrap": "^1.0.0"
       }
     },
     "metro-memory-fs": {
-      "version": "0.47.1",
+      "version": "0.48.1",
-      "resolved": "https://registry.npmjs.org/metro-memory-fs/-/metro-memory-fs-0.47.1.tgz",
+      "resolved": "https://registry.npmjs.org/metro-memory-fs/-/metro-memory-fs-0.48.1.tgz",
-      "integrity": "sha512-C+QSofDZvPlWvFKMn0aYFYWpOT8t28i6TfdIhWY5AkXECUr0W8a7POgSIx022G4fWyF/SxSqccXpp7zSjn6EZA=="
+      "integrity": "sha512-ASbRBpmfRraFilm5o5gdY9X0DQAmkvCgAHDunCo0J2vlQ730VbuhhR67pVRmRr5oXXmDdEIYUkJSIqzP0Q+UKQ=="
     },
     "metro-minify-uglify": {
-      "version": "0.47.1",
+      "version": "0.48.1",
-      "resolved": "https://registry.npmjs.org/metro-minify-uglify/-/metro-minify-uglify-0.47.1.tgz",
+      "resolved": "https://registry.npmjs.org/metro-minify-uglify/-/metro-minify-uglify-0.48.1.tgz",
-      "integrity": "sha512-7AKb8wZJr4TiJMV5xyeV67ZGhhvh0s9tV56zCM1DIMuJVuFbqcKHJUPghiiA+zL6m1MgRMTxaIzjeNh3eM+xoA==",
+      "integrity": "sha512-8htDNs3dil5CopLnMrE6SGjMGg44KB+omE3ZyTNSWXbmZl8aG3spl+xpSJyvkIQrSFNSCzMVZ8V+lDJDwKJ/zg==",
       "requires": {
         "uglify-es": "^3.1.9"
       },
@@ -8302,17 +8296,17 @@
       }
     },
     "metro-resolver": {
-      "version": "0.47.1",
+      "version": "0.48.1",
-      "resolved": "https://registry.npmjs.org/metro-resolver/-/metro-resolver-0.47.1.tgz",
+      "resolved": "https://registry.npmjs.org/metro-resolver/-/metro-resolver-0.48.1.tgz",
-      "integrity": "sha512-eb6i2tnVi+wASPxWk71P4lsJ7ndbRsv8qEijgTDaOBXYZliDEJW5uHC41JJK0IeRLYu+N3eGc/EdhOjTUGJj1A==",
+      "integrity": "sha512-d28ki5RTRUPFNQVJEgiMx3Zr81NlxOm1mKgaBx93Alyy2ZZ1Gvs25olZHwHgKPsRTgCqg5kgImkIHtjP2j8BdQ==",
       "requires": {
         "absolute-path": "^0.0.0"
       }
     },
     "metro-source-map": {
-      "version": "0.47.1",
+      "version": "0.48.1",
-      "resolved": "https://registry.npmjs.org/metro-source-map/-/metro-source-map-0.47.1.tgz",
+      "resolved": "https://registry.npmjs.org/metro-source-map/-/metro-source-map-0.48.1.tgz",
-      "integrity": "sha512-E3mM+CVC4m9QMCQWgHOf2iapjZbt7KeKu1AorRt5pDbWk6bPxbmdO7y+mvaZWktqveB5qTi7CCoBhvS7E7Qonw==",
+      "integrity": "sha512-6+YSKB3zRLGA39I0G/wfPizf1HPlrnmeX70E1vvH0G1HVD/ko5dqjJgH4vlr71Za9xYZLSuaXoQmmgkcf6at4w==",
       "requires": {
         "source-map": "^0.5.6"
       }
@@ -8410,9 +8404,9 @@
       "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ="
     },
     "minipass": {
-      "version": "2.3.4",
+      "version": "2.3.5",
-      "resolved": "https://registry.npmjs.org/minipass/-/minipass-2.3.4.tgz",
+      "resolved": "https://registry.npmjs.org/minipass/-/minipass-2.3.5.tgz",
-      "integrity": "sha512-mlouk1OHlaUE8Odt1drMtG1bAJA4ZA6B/ehysgV0LUIrDHdKgo1KorZq3pK0b/7Z7LJIQ12MNM6aC+Tn6lUZ5w==",
+      "integrity": "sha512-Gi1W4k059gyRbyVUZQ4mEqLm0YIUiGYfvxhF6SIlk3ui1WVxMTGfGdQ2SInh3PDrRTVvPKgULkpJtT4RH10+VA==",
       "requires": {
         "safe-buffer": "^5.1.2",
         "yallist": "^3.0.0"
@@ -8426,9 +8420,9 @@
       }
     },
     "minizlib": {
-      "version": "1.1.0",
+      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/minizlib/-/minizlib-1.1.0.tgz",
+      "resolved": "https://registry.npmjs.org/minizlib/-/minizlib-1.1.1.tgz",
-      "integrity": "sha512-4T6Ur/GctZ27nHfpt9THOdRZNgyJ9FZchYO1ceg5S8Q3DNLCKYy44nCZzgCJgcvx2UM8czmqak5BCxJMrq37lA==",
+      "integrity": "sha512-TrfjCjk4jLhcJyGMYymBH6oTXcWjYbUAXTHDbtnWHjZC25h0cdajHuPE1zxb4DVmu8crfh+HwH/WMuyLG0nHBg==",
       "requires": {
         "minipass": "^2.2.1"
       }
@@ -8573,6 +8567,11 @@
         "tween-functions": "^1.0.1"
       },
       "dependencies": {
+        "lodash": {
+          "version": "4.17.10",
+          "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.10.tgz",
+          "integrity": "sha512-UejweD1pDoXu+AD825lWwp4ZGtSwgnpZxb3JDViD7StjQz+Nb/6l093lx4OQ0foGWNRoc19mWy7BzL+UAK2iVg=="
+        },
         "react-native-keyboard-aware-scroll-view": {
           "version": "0.5.0",
           "resolved": "https://registry.npmjs.org/react-native-keyboard-aware-scroll-view/-/react-native-keyboard-aware-scroll-view-0.5.0.tgz",
@@ -8747,9 +8746,9 @@
       "integrity": "sha512-m/e6jgWu8/v5niCUKQi9qQl8QdeEduFA96xHDDzFGqly0OOjI7c+60KM/2sppfnUU9JJagf+zs+yGhqSOFj71g=="
     },
     "npm-packlist": {
-      "version": "1.1.11",
+      "version": "1.1.12",
-      "resolved": "https://registry.npmjs.org/npm-packlist/-/npm-packlist-1.1.11.tgz",
+      "resolved": "https://registry.npmjs.org/npm-packlist/-/npm-packlist-1.1.12.tgz",
-      "integrity": "sha512-CxKlZ24urLkJk+9kCm48RTQ7L4hsmgSVzEk0TLGPzzyuFxD7VNgy5Sl24tOLMzQv773a/NeJ1ce1DKeacqffEA==",
+      "integrity": "sha512-WJKFOVMeAlsU/pjXuqVdzU0WfgtIBCupkEVwn+1Y0ERAbUfWw8R4GjgVbaKnUjRoD2FoQbHOCbOyT5Mbs9Lw4g==",
       "requires": {
         "ignore-walk": "^3.0.1",
         "npm-bundled": "^1.0.1"
@@ -8785,7 +8784,7 @@
     },
     "npmlog": {
       "version": "2.0.4",
-      "resolved": "https://registry.npmjs.org/npmlog/-/npmlog-2.0.4.tgz",
+      "resolved": "http://registry.npmjs.org/npmlog/-/npmlog-2.0.4.tgz",
       "integrity": "sha1-mLUlMPJRTKkNCexbIsiEZyI3VpI=",
       "requires": {
         "ansi": "~0.3.1",
@@ -9560,9 +9559,9 @@
       }
     },
     "querystringify": {
-      "version": "2.0.0",
+      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-2.0.0.tgz",
+      "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-2.1.0.tgz",
-      "integrity": "sha512-eTPo5t/4bgaMNZxyjWx6N2a6AuE0mq51KWvpc7nU/MAqixcI6v6KrGUKES0HaomdnolQBBXU/++X6/QQ9KL4tw=="
+      "integrity": "sha512-sluvZZ1YiTLD5jsqZcDmFyV2EwToyXZBfpoVOmktMmW+VEnhgakFHnasVph65fOjGPTWN0Nw3+XQaSeMayr0kg=="
     },
     "raf": {
       "version": "3.4.0",
@@ -9611,14 +9610,14 @@
       }
     },
     "react": {
-      "version": "16.5.0",
+      "version": "16.6.0",
-      "resolved": "https://registry.npmjs.org/react/-/react-16.5.0.tgz",
+      "resolved": "https://registry.npmjs.org/react/-/react-16.6.0.tgz",
-      "integrity": "sha512-nw/yB/L51kA9PsAy17T1JrzzGRk+BlFCJwFF7p+pwVxgqwPjYNeZEkkH7LXn9dmflolrYMXLWMTkQ77suKPTNQ==",
+      "integrity": "sha512-zJPnx/jKtuOEXCbQ9BKaxDMxR0001/hzxXwYxG8septeyYGfsgAei6NgfbVgOhbY1WOP2o3VPs/E9HaN+9hV3Q==",
       "requires": {
         "loose-envify": "^1.1.0",
         "object-assign": "^4.1.1",
         "prop-types": "^15.6.2",
-        "schedule": "^0.3.0"
+        "scheduler": "^0.10.0"
       }
     },
     "react-clone-referenced-element": {
@@ -9632,9 +9631,9 @@
       "integrity": "sha512-WUSQJ4P/wWcusaH+zZmbECOk7H5N2pOIl0vzheeornkIMhu+qrNdGFm0bDZLCb0hSF0jf/kH1SgkNGfBdTc4wA=="
     },
     "react-devtools-core": {
-      "version": "3.4.0",
+      "version": "3.4.2",
-      "resolved": "https://registry.npmjs.org/react-devtools-core/-/react-devtools-core-3.4.0.tgz",
+      "resolved": "https://registry.npmjs.org/react-devtools-core/-/react-devtools-core-3.4.2.tgz",
-      "integrity": "sha512-yV3LLhoRwbfcQyVPNwb1EZ9W7CGu+kX2EqyZ3Cl5C+cbXcb6FJ3YSeeBt9BQB+hjyjRMBjQSKqnpPS6OMSEUow==",
+      "integrity": "sha512-1pqbxenMeOiVPLf5Fm69woc+Q/pb/lLfWCizJuVJQDm9v7x0fcr76VMcq6Q30Onv3ikkfrlAQgOcOdCk/0t5tA==",
       "requires": {
         "shell-quote": "^1.6.1",
         "ws": "^3.3.1"
@@ -9658,9 +9657,9 @@
       }
     },
     "react-is": {
-      "version": "16.5.2",
+      "version": "16.6.0",
-      "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.5.2.tgz",
+      "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.6.0.tgz",
-      "integrity": "sha512-hSl7E6l25GTjNEZATqZIuWOgSnpXb3kD0DVCujmg46K5zLxsbiKaaT6VO9slkSBDPZfYs30lwfJwbOFOnoEnKQ==",
+      "integrity": "sha512-q8U7k0Fi7oxF1HvQgyBjPwDXeMplEsArnKt2iYhuIF86+GBbgLHdAmokL3XUFjTd7Q363OSNG55FOGUdONVn1g==",
       "dev": true
     },
     "react-lifecycles-compat": {
@@ -9669,9 +9668,9 @@
       "integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA=="
     },
     "react-native": {
-      "version": "0.57.2",
+      "version": "0.57.3",
-      "resolved": "https://registry.npmjs.org/react-native/-/react-native-0.57.2.tgz",
+      "resolved": "https://registry.npmjs.org/react-native/-/react-native-0.57.3.tgz",
-      "integrity": "sha512-UbFbyt0rfrNLOtBXn3EmtHJ3EqL0/PhGCfGGZIg7vHn/U4K+2wZNvrLwzhqiZYSjvtmJluA1vMiQTvWBupCx8w==",
+      "integrity": "sha512-FmJQdGjo0rEfEYbw+dhMPn2P/vDpvPebAwL3YDaQ/iYSi+IGPNHdepEaDpU1vfFOAnxrh3BlfACC+RsoeQ3SWw==",
       "requires": {
         "@babel/runtime": "^7.0.0",
         "absolute-path": "^0.0.0",
@@ -9688,17 +9687,17 @@
         "errorhandler": "^1.5.0",
         "escape-string-regexp": "^1.0.5",
         "event-target-shim": "^1.0.5",
-        "fbjs": "0.8.17",
+        "fbjs": "^1.0.0",
         "fbjs-scripts": "^0.8.1",
         "fs-extra": "^1.0.0",
         "glob": "^7.1.1",
         "graceful-fs": "^4.1.3",
         "inquirer": "^3.0.6",
         "lodash": "^4.17.5",
-        "metro": "^0.47.1",
+        "metro": "^0.48.1",
-        "metro-babel-register": "^0.47.1",
+        "metro-babel-register": "^0.48.1",
-        "metro-core": "^0.47.1",
+        "metro-core": "^0.48.1",
-        "metro-memory-fs": "^0.47.1",
+        "metro-memory-fs": "^0.48.1",
         "mime": "^1.3.4",
         "minimist": "^1.2.0",
         "mkdirp": "^0.5.1",
@@ -9727,6 +9726,26 @@
         "yargs": "^9.0.0"
       },
       "dependencies": {
+        "core-js": {
+          "version": "2.5.7",
+          "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.5.7.tgz",
+          "integrity": "sha512-RszJCAxg/PP6uzXVXL6BsxSXx/B05oJAQ2vkJRjyjrEcNVycaqOmNb5OTxZPE3xa5gwZduqza6L9JOCenh/Ecw=="
+        },
+        "fbjs": {
+          "version": "1.0.0",
+          "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-1.0.0.tgz",
+          "integrity": "sha512-MUgcMEJaFhCaF1QtWGnmq9ZDRAzECTCRAF7O6UZIlAlkTs1SasiX9aP0Iw7wfD2mJ7wDTNfg2w7u5fSCwJk1OA==",
+          "requires": {
+            "core-js": "^2.4.1",
+            "fbjs-css-vars": "^1.0.0",
+            "isomorphic-fetch": "^2.1.1",
+            "loose-envify": "^1.0.0",
+            "object-assign": "^4.1.0",
+            "promise": "^7.1.1",
+            "setimmediate": "^1.0.5",
+            "ua-parser-js": "^0.7.18"
+          }
+        },
         "fs-extra": {
           "version": "1.0.0",
           "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-1.0.0.tgz",
@@ -9871,14 +9890,6 @@
       "resolved": "https://registry.npmjs.org/react-native-linear-gradient/-/react-native-linear-gradient-2.4.2.tgz",
       "integrity": "sha512-6+efUAsLIn8jHwb861ftjNmw0QuIhKCeQ3vBgQvPDWDcdL1M7GbPmOUdATQfoPod+m+UGSjLf8Tez2QwYLAG+A=="
     },
-    "react-native-markdown-editor": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/react-native-markdown-editor/-/react-native-markdown-editor-1.0.1.tgz",
-      "integrity": "sha512-VUrRvg/Qm40cv5P6keShYQTqtkSk1IZo8RITuuzXldZo1gavOTHcaVe2OE4KHdGiiqrLMbL/mZj9NNt3I8FChA==",
-      "requires": {
-        "react-native-markdown-view": "^1.0.0"
-      }
-    },
     "react-native-markdown-view": {
       "version": "1.1.4",
       "resolved": "https://registry.npmjs.org/react-native-markdown-view/-/react-native-markdown-view-1.1.4.tgz",
@@ -10086,15 +10097,15 @@
       }
     },
     "react-test-renderer": {
-      "version": "16.5.0",
+      "version": "16.6.0-alpha.8af6728",
-      "resolved": "https://registry.npmjs.org/react-test-renderer/-/react-test-renderer-16.5.0.tgz",
+      "resolved": "https://registry.npmjs.org/react-test-renderer/-/react-test-renderer-16.6.0-alpha.8af6728.tgz",
-      "integrity": "sha512-cuN9BoZ1p6T3oxrjxN7pQDSmgWzAxWBi8gtCHcViMYcw/1xqOIyatt2YFhiCWg7115TPQqkTKEu+F44YjFE4ig==",
+      "integrity": "sha512-42RB1hvEjVuJGrGddGqVj1obs9NhWiuijkz+qsuY0qRzF0ygD5xg4eRdm0H4YNtkp+332g6OWO9O2ussu67cFQ==",
       "dev": true,
       "requires": {
         "object-assign": "^4.1.1",
         "prop-types": "^15.6.2",
-        "react-is": "^16.5.0",
+        "react-is": "^16.6.0-alpha.8af6728",
-        "schedule": "^0.3.0"
+        "scheduler": "^0.10.0-alpha.8af6728"
       }
     },
     "react-timer-mixin": {
@@ -10154,9 +10165,9 @@
       }
     },
     "realm": {
-      "version": "2.18.0",
+      "version": "2.16.0",
-      "resolved": "https://registry.npmjs.org/realm/-/realm-2.18.0.tgz",
+      "resolved": "https://registry.npmjs.org/realm/-/realm-2.16.0.tgz",
-      "integrity": "sha512-+FzQ0S3WjcnklhCZx/SPFh/rU311w+gfPOrtlG2wZPB6qq4ZJ6sarIIrHAyB0y7eHiWxDpwIYTW0oMQgwpNh3g==",
+      "integrity": "sha512-u2n8+/0XzUVcsCB2VJ0E1KU2BHG08to7td6gm/bAhHgY9a8z4+ye1Gxod7i7cXepG9zljlU9k7fJck7/EbHnMA==",
       "requires": {
         "command-line-args": "^4.0.6",
         "decompress": "^4.2.0",
@@ -10893,11 +10904,12 @@
       "resolved": "http://registry.npmjs.org/sax/-/sax-1.1.6.tgz",
       "integrity": "sha1-XWFr6KXmB9VOEUr65Vt+ry/MMkA="
     },
-    "schedule": {
+    "scheduler": {
-      "version": "0.3.0",
+      "version": "0.10.0",
-      "resolved": "https://registry.npmjs.org/schedule/-/schedule-0.3.0.tgz",
+      "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.10.0.tgz",
-      "integrity": "sha512-20+1KVo517sR7Nt+bYBN8a+bEJDKLPEx7Ohtts1kX05E4/HY53YUNuhfkVNItmWAnBYHcpG9vsd2/CJxG+aPCQ==",
+      "integrity": "sha512-+TSTVTCBAA3h8Anei3haDc1IRwMeDmtI/y/o3iBe3Mjl2vwYF9DtPDt929HyRmV/e7au7CLu8sc4C4W0VOs29w==",
       "requires": {
+        "loose-envify": "^1.1.0",
         "object-assign": "^4.1.1"
       }
     },
@@ -12113,9 +12125,9 @@
       "integrity": "sha1-rOEWq1V80Zc4ak6I9GhTeMiy5Po="
     },
     "unbzip2-stream": {
-      "version": "1.3.0",
+      "version": "1.3.1",
-      "resolved": "https://registry.npmjs.org/unbzip2-stream/-/unbzip2-stream-1.3.0.tgz",
+      "resolved": "https://registry.npmjs.org/unbzip2-stream/-/unbzip2-stream-1.3.1.tgz",
-      "integrity": "sha512-kE2WkurNnPUMcryNioS68DDbhoPB8Qxsd8btHSj+sd5Pjh2GsjmeHLzMSqV9HHziAo8FzVxVCJl9ZYhk7yY1pA==",
+      "integrity": "sha512-fIZnvdjblYs7Cru/xC6tCPVhz7JkYcVQQkePwMLyQELzYTds2Xn8QefPVnvdVhhZqubxNA1cASXEH5wcK0Bucw==",
       "requires": {
         "buffer": "^3.0.1",
         "through": "^2.3.6"

package.json

@@ -1,7 +1,12 @@
 {
-  "name": "esteem",
+  "name": "eSteem",
   "version": "0.0.1",
   "private": true,
+  "rnpm": {
+    "assets": [
+      "./assets/fonts"
+    ]
+  },
   "scripts": {
     "start": "node node_modules/react-native/local-cli/cli.js start",
     "eject": "node node_modules/react-native/local-cli/cli.js eject",
@@ -20,6 +25,7 @@
     "@esteemapp/react-native-tags": "^1.3.1",
     "crypto-js": "^3.1.9-1",
     "dsteem": "^0.10.1",
+    "lodash": "^4.17.11",
     "moment": "^2.22.2",
     "native-base": "^2.8.1",
     "react": "^16.6.0-alpha.8af6728",
@@ -29,7 +35,7 @@
     "react-native-html-renderer": "^1.0.0",
     "react-native-keyboard-aware-scroll-view": "^0.7.2",
     "react-native-linear-gradient": "^2.4.2",
-    "react-native-markdown-editor": "^1.0.1",
+    "react-native-markdown-view": "^1.1.4",
     "react-native-modal": "^6.5.0",
     "react-native-modal-dropdown": "^0.6.2",
     "react-native-modal-popover": "0.0.10",

src/components/basicUIElements/index.js

@@ -5,7 +5,15 @@ import NoPost from './view/noPostView';
 import PostPlaceHolder from './view/postPlaceHolderView';
 import TextWithIcon from './view/textWithIconView';
 import WalletLineItem from './view/walletLineItemView';
+import Chip from './view/chipView';
 
 export {
-  Card, GrayWrapper, LineBreak, NoPost, PostPlaceHolder, TextWithIcon, WalletLineItem,
+  Card,
+  GrayWrapper,
+  Chip,
+  LineBreak,
+  NoPost,
+  PostPlaceHolder,
+  TextWithIcon,
+  WalletLineItem,
 };

src/components/basicUIElements/view/chipStyle.js

@@ -0,0 +1,17 @@
+import EStyleSheet from 'react-native-extended-stylesheet';
+
+export default EStyleSheet.create({
+  textInput: {
+    color: '$white',
+    fontSize: 10,
+    backgroundColor: '#c1c5c7',
+    borderRadius: 50,
+    maxHeight: 18,
+    padding: 5,
+    paddingHorizontal: 10,
+    marginRight: 8,
+  },
+  isPin: {
+    backgroundColor: '$primaryBlue',
+  },
+});

src/components/basicUIElements/view/chipView.js

@@ -0,0 +1,16 @@
+import React, { Fragment } from 'react';
+import { TextInput } from 'react-native';
+import styles from './chipStyle';
+
+const Chip = props => (
+  <Fragment>
+    <TextInput
+      style={[styles.textInput, props.isPin && styles.isPin]}
+      onChangeText={text => props.handleOnChange(text)}
+      onBlur={() => props.handleOnBlur()}
+      {...props}
+    />
+  </Fragment>
+);
+
+export default Chip;

src/components/buttons/views/iconButtonStyles.js

@@ -1,14 +1,14 @@
-import EStyleSheet from "react-native-extended-stylesheet";
+import EStyleSheet from 'react-native-extended-stylesheet';
 
 export default EStyleSheet.create({
   circleButton: {
-    alignItems: "center",
+    alignItems: 'center',
-    backgroundColor: "$white",
+    backgroundColor: '$white',
     height: 60,
     width: 60,
     borderRadius: 60 / 2,
-    justifyContent: "center",
+    justifyContent: 'center',
-    borderColor: "$primaryBlue",
+    borderColor: '$primaryBlue',
     borderWidth: 1,
   },
 });

src/components/buttons/views/textButtonView.js

@@ -3,14 +3,13 @@ import { TouchableWithoutFeedback, Text, View } from 'react-native';
 
 import styles from './textButtonStyles';
 
-const TextButtonView = ({ text, onPress, style }) => (
+const TextButtonView = ({
+  text, onPress, style, textStyle,
+}) => (
   <Fragment>
-    <TouchableWithoutFeedback
+    <TouchableWithoutFeedback style={[styles.button]} onPress={() => onPress && onPress()}>
-      style={[styles.button, style]}
+      <View style={style}>
-      onPress={() => onPress && onPress()}
+        <Text style={[styles.buttonText, textStyle]}>{text}</Text>
-    >
-      <View>
-        <Text style={styles.buttonText}>{text}</Text>
       </View>
     </TouchableWithoutFeedback>
   </Fragment>

src/components/dropdownButton/view/dropdownButtonStyles.js

@@ -8,14 +8,14 @@ export default EStyleSheet.create({
     alignSelf: 'flex-start',
     height: 35,
   },
-  dropdownText: {
+  // dropdownText: {
-    fontSize: 9,
+  //   fontSize: 9,
-    color: '$primaryDarkGray',
+  //   color: '$primaryDarkGray',
-    marginLeft: 25,
+  //   marginLeft: 25,
-  },
+  // },
   dropdownIcon: {
     fontSize: 18,
-    color:"$iconColor",
+    color: '$iconColor',
     marginLeft: 7,
     marginTop: 1,
   },

src/components/dropdownButton/view/dropdownButtonView.js

@@ -30,15 +30,16 @@ const renderDropdownRow = (rowData, rowID, highlighted) => (
 );
 
 const DropdownButtonView = ({
-  defaultText,
-  iconName,
-  options,
-  onSelect,
-  defaultIndex,
-  children,
-  style,
-  isHasChildIcon,
   childIconWrapperStyle,
+  children,
+  defaultIndex,
+  defaultText,
+  iconStyle,
+  iconName,
+  isHasChildIcon,
+  onSelect,
+  options,
+  style,
 }) => (
   <View style={styles.container}>
     <ModalDropdown
@@ -56,7 +57,10 @@ const DropdownButtonView = ({
     >
       {isHasChildIcon && (
         <View style={[styles.iconWrapper, childIconWrapperStyle && childIconWrapperStyle]}>
-          <Ionicons style={styles.dropdownIcon} name={!iconName ? 'md-arrow-dropdown' : iconName} />
+          <Ionicons
+            style={[styles.dropdownIcon, iconStyle]}
+            name={!iconName ? 'md-arrow-dropdown' : iconName}
+          />
         </View>
       )}
     </ModalDropdown>

src/components/editorElements/index.js

@@ -0,0 +1,5 @@
+import TitleArea from './titleArea/view/titleAreaView';
+import TagArea from './tagArea/view/tagAreaView';
+import TextArea from './textArea/view/textAreaView';
+
+export { TitleArea, TagArea, TextArea };

src/components/editorElements/tagArea/view/tagAreaStyles.js

@@ -0,0 +1,21 @@
+import EStyleSheet from 'react-native-extended-stylesheet';
+
+export default EStyleSheet.create({
+  textInput: {
+    color: '$white',
+    fontSize: 10,
+    backgroundColor: '#c1c5c7',
+    borderRadius: 50,
+    maxHeight: 18,
+    padding: 5,
+    paddingHorizontal: 10,
+    marginRight: 8,
+  },
+  tagWrapper: {
+    flexDirection: 'row',
+    marginTop: 14,
+  },
+  firstTag: {
+    backgroundColor: '$primaryBlue',
+  },
+});

src/components/editorElements/tagArea/view/tagAreaView.js

@@ -0,0 +1,105 @@
+import React, { Component } from 'react';
+import { View } from 'react-native';
+// Constants
+
+// Components
+import { Chip } from '../../../basicUIElements';
+// Styles
+import styles from './tagAreaStyles';
+import globalStyles from '../../../../globalStyles';
+
+export default class TagAreaView extends Component {
+  /* Props
+    * ------------------------------------------------
+    *   @prop { type }    name                - Description....
+    */
+
+  constructor(props) {
+    super(props);
+    this.state = {
+      currentText: '',
+      chips: [' '],
+      chipsCount: props.chipsCount || 5,
+    };
+  }
+
+  // Component Life Cycles
+
+  // Component Functions
+  _handleOnChange = (text, i) => {
+    this.setState({ currentText: text.trim() });
+
+    if (text.indexOf(' ') > 0 && text) {
+      this._handleTagAdded();
+    }
+
+    if (!text && i !== 0) {
+      this._handleTagRemove(i);
+    }
+  };
+
+  _handleOnBlur = (i) => {
+    this._handleTagAdded(i);
+  };
+
+  _handleTagAdded = (i) => {
+    const { currentText, chips, chipsCount } = this.state;
+    const { handleTagChanged } = this.props;
+
+    if (currentText && currentText.trim() && chips && chips.length < chipsCount) {
+      this.setState({
+        chips: [...chips, currentText.trim()],
+        currentText: '',
+      });
+    }
+
+    if (handleTagChanged && chips.length < chipsCount + 1) {
+      handleTagChanged([...chips, currentText.trim()]);
+    }
+  };
+
+  _handleTagRemove = (i) => {
+    const { chips } = this.state;
+    const { handleTagChanged } = this.props;
+
+    this.setState({
+      chips: chips.filter((_, _i) => _i !== i),
+    });
+
+    if (handleTagChanged) {
+      handleTagChanged(chips.filter((_, _i) => _i !== i));
+    }
+  };
+
+  render() {
+    const { chipsData, isPreviewActive } = this.props;
+    const { chips } = this.state;
+
+    return (
+      <View style={globalStyles.containerHorizontal16}>
+        <View style={styles.tagWrapper}>
+          {chips.map((chip, i) => (
+            <Chip
+              key={i}
+              refs={(input) => {
+                this.inputs[i] = input;
+              }}
+              isPin={i === 0 && chips[1]}
+              placeholderTextColor="#fff"
+              editable={!isPreviewActive}
+              maxLength={50}
+              placeholder="tags"
+              autoFocus={i !== 0 && chips.length - 1 === i}
+              multiline={false}
+              handleOnChange={text => this._handleOnChange(text, i)}
+              handleOnBlur={() => this._handleOnBlur(i)}
+              blurOnSubmit
+              autoCapitalize="none"
+              {...this.props}
+            />
+          ))}
+        </View>
+      </View>
+    );
+  }
+}

src/components/editorElements/textArea/view/textAreaStyles.js

@@ -0,0 +1,8 @@
+import EStyleSheet from 'react-native-extended-stylesheet';
+
+export default EStyleSheet.create({
+  container: {
+    flex: 1,
+    marginTop: 16,
+  },
+});

src/components/editorElements/textArea/view/textAreaView.js

@@ -0,0 +1,25 @@
+import React, { Component } from 'react';
+// Constants
+
+// Components
+import { MarkdownEditor } from '../../../markdownEditor';
+
+export default class TextAreaView extends Component {
+  /* Props
+    * ------------------------------------------------
+    *   @prop { type }    name                - Description....
+    */
+
+  constructor(props) {
+    super(props);
+    this.state = {};
+  }
+
+  // Component Life Cycles
+
+  // Component Functions
+
+  render() {
+    return <MarkdownEditor {...this.props} />;
+  }
+}

src/components/editorElements/titleArea/view/titleAreaStyles.js

@@ -0,0 +1,9 @@
+import EStyleSheet from 'react-native-extended-stylesheet';
+
+export default EStyleSheet.create({
+  textInput: {
+    color: '$primaryBlack',
+    fontWeight: 'bold',
+    fontSize: 24,
+  },
+});

src/components/editorElements/titleArea/view/titleAreaView.js

@@ -0,0 +1,57 @@
+import React, { Component } from 'react';
+import { TextInput, View } from 'react-native';
+// Constants
+
+// Components
+
+// Styles
+import styles from './titleAreaStyles';
+import globalStyles from '../../../../globalStyles';
+
+export default class TitleAreaView extends Component {
+  /* Props
+    * ------------------------------------------------
+    *   @prop { type }    name                - Description....
+    */
+
+  constructor(props) {
+    super(props);
+    this.state = {};
+  }
+
+  // Component Life Cycles
+
+  // Component Functions
+  _handleOnChange = (text) => {
+    const { onChange, handleIsValid, componentID } = this.props;
+    if (onChange) {
+      onChange(text);
+    }
+
+    if (handleIsValid) {
+      handleIsValid(componentID, !!(text && text.length));
+    }
+  };
+
+  render() {
+    const { value, isPreviewActive } = this.props;
+
+    return (
+      <View style={globalStyles.containerHorizontal16}>
+        <TextInput
+          style={styles.textInput}
+          placeholderTextColor="#c1c5c7"
+          editable={!isPreviewActive}
+          maxLength={250}
+          placeholder="Title"
+          multiline
+          autoFocus
+          numberOfLines={4}
+          onChangeText={text => this._handleOnChange(text)}
+          value={value}
+          {...this.props}
+        />
+      </View>
+    );
+  }
+}

src/components/editorHeader/container/editorHeaderContainer.js

@@ -0,0 +1,37 @@
+import React, { Component } from 'react';
+import { withNavigation } from 'react-navigation';
+
+// Constants
+import { default as ROUTES } from '../../../constants/routeNames';
+
+// Components
+import { EditorHeaderView } from '..';
+
+class EditorHeaderContainer extends Component {
+  /* Props
+    * ------------------------------------------------
+    *   @prop { funtion }    handleOnPressPreviewButton                - Preview button active handler....
+    */
+
+  constructor(props) {
+    super(props);
+    this.state = {};
+  }
+
+  // Component Life Cycles
+
+  // Component Functions
+  _handleOnPressBackButton = () => {
+    const { navigation } = this.props;
+
+    navigation.navigate(ROUTES.SCREENS.HOME);
+  };
+
+  render() {
+    return (
+      <EditorHeaderView handleOnPressBackButton={this._handleOnPressBackButton} {...this.props} />
+    );
+  }
+}
+
+export default withNavigation(EditorHeaderContainer);

src/components/editorHeader/index.js

@@ -0,0 +1,5 @@
+import EditorHeaderView from './view/editorHeaderView';
+import EditorHeader from './container/editorHeaderContainer';
+
+export { EditorHeaderView, EditorHeader };
+export default EditorHeader;

src/components/editorHeader/view/editorHeaderStyles.js

@@ -0,0 +1,43 @@
+import EStyleSheet from 'react-native-extended-stylesheet';
+
+export default EStyleSheet.create({
+  container: {
+    // flex: 1,
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    padding: 16,
+    width: '$deviceWidth',
+    backgroundColor: '$white',
+  },
+  backIcon: {
+    fontSize: 24,
+    color: '$iconColor',
+  },
+  quickTitle: {
+    flexGrow: 1,
+    fontSize: 10,
+    color: '$iconColor',
+    marginLeft: 24,
+    alignSelf: 'center',
+  },
+  rightIcon: {
+    color: '$iconColor',
+  },
+  iconButton: {
+    marginRight: 24,
+    justifyContent: 'center',
+    alignSelf: 'center',
+  },
+  textButton: {
+    fontSize: 16,
+  },
+  textButtonDisable: {
+    color: '$iconColor',
+  },
+  textButtonEnable: {
+    color: '$primaryBlue',
+  },
+  textButtonWrapper: {
+    justifyContent: 'center',
+  },
+});

src/components/editorHeader/view/editorHeaderView.js

@@ -0,0 +1,82 @@
+import React, { Component } from 'react';
+import { View, SafeAreaView, Text } from 'react-native';
+import { TextButton } from '../..';
+import { IconButton } from '../../iconButton';
+// Constants
+
+// Components
+
+// Styles
+import styles from './editorHeaderStyles';
+
+class EditorHeaderView extends Component {
+  /* Props
+    * ------------------------------------------------
+    *   @prop { boolean }    isFormValid                - Righst button propertie
+    *   @prop { string }     quickTitle                 - Left side behind back button text
+    */
+
+  constructor(props) {
+    super(props);
+    this.state = {};
+  }
+
+  // Component Life Cycles
+
+  // Component Functions
+
+  _handleOnPress = () => {
+    const { handleOnSubmit } = this.props;
+
+    if (handleOnSubmit) {
+      handleOnSubmit();
+    }
+  };
+
+  render() {
+    const {
+      handleOnPressBackButton,
+      handleOnPressPreviewButton,
+      isPreviewActive,
+      quickTitle,
+      isFormValid,
+    } = this.props;
+
+    return (
+      <SafeAreaView>
+        <View style={styles.container}>
+          <IconButton
+            iconStyle={styles.backIcon}
+            name="md-arrow-back"
+            onPress={() => handleOnPressBackButton()}
+          />
+          <Text style={styles.quickTitle}>{quickTitle}</Text>
+          <IconButton
+            style={styles.iconButton}
+            iconStyle={styles.rightIcon}
+            size={20}
+            name="ios-timer"
+          />
+          <IconButton
+            style={styles.iconButton}
+            size={25}
+            onPress={() => handleOnPressPreviewButton()}
+            iconStyle={styles.rightIcon}
+            name={isPreviewActive ? 'ios-eye' : 'ios-eye-off'}
+          />
+          <TextButton
+            textStyle={[
+              styles.textButton,
+              isFormValid ? styles.textButtonEnable : styles.textButtonDisable,
+            ]}
+            onPress={isFormValid && this._handleOnPress}
+            style={styles.textButtonWrapper}
+            text="Publish"
+          />
+        </View>
+      </SafeAreaView>
+    );
+  }
+}
+
+export default EditorHeaderView;

src/components/icon/index.js

@@ -0,0 +1,4 @@
+import Icon from './view/iconView';
+
+export { Icon };
+export default Icon;

src/components/icon/view/iconView.js

@@ -0,0 +1,60 @@
+import React, { Component } from 'react';
+import { Platform } from 'react-native';
+
+import Ionicons from 'react-native-vector-icons/Ionicons';
+import MaterialCommunityIcons from 'react-native-vector-icons/MaterialCommunityIcons';
+import SimpleLineIcons from 'react-native-vector-icons/SimpleLineIcons';
+import FontAwesome from 'react-native-vector-icons/FontAwesome';
+import Feather from 'react-native-vector-icons/Feather';
+
+class IconView extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {};
+  }
+
+  // for ios its turn ios-eye-off-outline
+  // for android its turn to md-off-outline
+  _getIconName = () => {
+    const { name, androidName } = this.props;
+
+    if (name) {
+      const isIos = Platform.OS === 'ios';
+      let iconName;
+
+      if (!isIos) {
+        iconName = androidName || `md-${name.split('ios-')}`;
+      }
+      return iconName;
+    }
+    return null;
+  };
+
+  _getIcon = () => {
+    const { iconType } = this.props;
+    const name = this._getIconName();
+
+    switch (iconType) {
+      case 'Feather':
+        return <Feather {...this.props} />;
+      case 'FontAwesome':
+        return <FontAwesome {...this.props} />;
+      case 'SimpleLineIcons':
+        return <SimpleLineIcons {...this.props}>{this.props.children}</SimpleLineIcons>;
+      case 'MaterialCommunityIcons':
+        return (
+          <MaterialCommunityIcons name={name} {...this.props}>
+            {this.props.children}
+          </MaterialCommunityIcons>
+        );
+      default:
+        return <Ionicons {...this.props} />;
+    }
+  };
+
+  render() {
+    return this._getIcon();
+  }
+}
+
+export default IconView;

src/components/iconButton/view/iconButtonStyles.js

@@ -1,13 +1,12 @@
-import EStyleSheet from "react-native-extended-stylesheet";
+import EStyleSheet from 'react-native-extended-stylesheet';
 
 export default EStyleSheet.create({
   iconButton: {
     width: 30,
     height: 30,
     borderRadius: 30 / 2,
-    justifyContent: "center",
+    justifyContent: 'center',
-  },
+    alignItems: 'center',
-  icon: {
-    textAlign: "center",
   },
+  icon: {},
 });

src/components/iconButton/view/iconButtonView.js

@@ -1,32 +1,43 @@
-import React from "react";
+import React, { Fragment } from 'react';
-import { View, TouchableHighlight } from "react-native";
+import { TouchableHighlight } from 'react-native';
-import Ionicons from "react-native-vector-icons/Ionicons";
+import { Icon } from '../../icon';
 
-import styles from "./iconButtonStyles";
+import styles from './iconButtonStyles';
 
 /* Props
 * ------------------------------------------------
 *   @prop { type }    name                - Description....
 */
 
-const IconButton = ({ name, color, size, onPress, backgroundColor, style }) => (
+const IconButton = ({
-  <View>
+  name,
+  color,
+  size,
+  onPress,
+  backgroundColor,
+  style,
+  iconStyle,
+  iconType,
+}) => (
+  <Fragment>
     <TouchableHighlight
-      style={[styles.iconButton, style && style]}
+      style={[!style && styles.iconButton, style && style]}
       onPress={() => onPress && onPress()}
-      underlayColor={backgroundColor}
+      underlayColor={backgroundColor || 'white'}
     >
-      <Ionicons
+      <Icon
         style={[
+          color && { color },
+          backgroundColor && { backgroundColor },
           styles.icon,
-          color && { color: color },
+          iconStyle && iconStyle,
-          backgroundColor && { backgroundColor: backgroundColor },
         ]}
         name={name}
         size={size}
+        iconType={iconType}
       />
     </TouchableHighlight>
-  </View>
+  </Fragment>
 );
 
 export default IconButton;

src/components/markdownEditor/index.js

@@ -0,0 +1,4 @@
+import MarkdownEditor from './view/markdownEditorView';
+
+export { MarkdownEditor };
+export default MarkdownEditor;

src/components/markdownEditor/view/editorBarStyles.js

@@ -0,0 +1,14 @@
+import EStyleSheet from 'react-native-extended-stylesheet';
+
+export default EStyleSheet.create({
+  container: {
+    flexDirection: 'row',
+    backgroundColor: '$white',
+    alignItems: 'center',
+    height: 48,
+    shadowOpacity: 0.2,
+    shadowOffset: {
+      height: 1.5,
+    },
+  },
+});

src/components/markdownEditor/view/formats/applyListFormat.js

@@ -0,0 +1,32 @@
+import { replaceBetween } from './utils';
+
+export default ({ getState, item, setState }) => {
+  let { text } = getState();
+  const { selection } = getState();
+  text = text || '';
+  let newText;
+  let newSelection;
+  if (selection.start !== selection.end) {
+    newText = replaceBetween(
+      text,
+      selection,
+      `${item.prefix} ${text.substring(selection.start, selection.end)}\n`,
+    );
+    newSelection = { start: selection.end + 3, end: selection.end + 3 };
+  } else if (
+    selection.start === selection.end
+    && text.substring(selection.end - 1, selection.end) === '\n'
+  ) {
+    newText = replaceBetween(text, selection, `${item.prefix} `);
+    newSelection = { start: selection.start + 2, end: selection.start + 2 };
+  } else {
+    newText = replaceBetween(text, selection, `\n${item.prefix} `);
+    newSelection = { start: selection.start + 3, end: selection.start + 3 };
+  }
+
+  setState({ text: newText }, () => {
+    setTimeout(() => {
+      setState({ selection: newSelection });
+    }, 300);
+  });
+};

src/components/markdownEditor/view/formats/applyWebLinkFormat.js

@@ -0,0 +1,35 @@
+import { isStringWebLink, replaceBetween } from './utils';
+
+export const writeUrlTextHere = 'https://example.com';
+export const writeTextHereString = 'Text here!';
+
+export default ({ getState, item, setState }) => {
+  const { selection, text } = getState();
+  let newText;
+  let newSelection;
+  const selectedText = text.substring(selection.start, selection.end);
+  if (selection.start !== selection.end) {
+    if (isStringWebLink(selectedText)) {
+      newText = replaceBetween(text, selection, `[${writeTextHereString}](${selectedText})`);
+      newSelection = {
+        start: selection.start + 1,
+        end: selection.start + 1 + writeTextHereString.length,
+      };
+    } else {
+      newText = replaceBetween(text, selection, `[${selectedText}](${writeUrlTextHere})`);
+      newSelection = {
+        start: selection.end + 3,
+        end: selection.end + 3 + writeUrlTextHere.length,
+      };
+    }
+  } else {
+    newText = replaceBetween(text, selection, `[${writeTextHereString}](${writeUrlTextHere})`);
+    newSelection = {
+      start: selection.start + 1,
+      end: selection.start + 1 + writeTextHereString.length,
+    };
+  }
+  setState({ text: newText }, () => {
+    setState({ selection: newSelection });
+  });
+};

src/components/markdownEditor/view/formats/applyWrapFormat.js

@@ -0,0 +1,27 @@
+import { replaceBetween } from './utils';
+
+export default ({ getState, item, setState }) => {
+  const { text, selection } = getState();
+  const newText = replaceBetween(
+    text,
+    selection,
+    item.wrapper.concat(text.substring(selection.start, selection.end), item.wrapper),
+  );
+  let newPosition;
+  if (selection.start === selection.end) {
+    newPosition = selection.end + item.wrapper.length;
+  } else {
+    newPosition = selection.end + item.wrapper.length * 2;
+  }
+  const extra = {
+    selection: {
+      start: newPosition,
+      end: newPosition,
+    },
+  };
+  setState({ text: newText }, () => {
+    setTimeout(() => {
+      setState({ ...extra });
+    }, 25);
+  });
+};

src/components/markdownEditor/view/formats/applyWrapFormatNewLines.js

@@ -0,0 +1,55 @@
+import { replaceBetween } from './utils';
+
+export default ({ getState, item, setState }) => {
+  const { text, selection } = getState();
+  let newText = replaceBetween(
+    text,
+    selection,
+    `\n${item.wrapper.concat(
+      '\n',
+      text.substring(selection.start, selection.end),
+      '\n',
+      item.wrapper,
+      '\n',
+    )}`,
+  );
+  let newPosition;
+  if (selection.start === selection.end) {
+    newPosition = selection.end + item.wrapper.length + 2; // +2 For two new lines
+    newText = replaceBetween(
+      text,
+      selection,
+      `\n${item.wrapper.concat(
+        '\n',
+        text.substring(selection.start, selection.end),
+        '\n',
+        item.wrapper,
+        '\n',
+      )}`,
+    );
+  } else {
+    newPosition = selection.end + item.wrapper.length * 2 + 3; // +3 For three new lines
+    newText = replaceBetween(
+      text,
+      selection,
+      `${item.wrapper.concat(
+        '\n',
+        text.substring(selection.start, selection.end),
+        '\n',
+        item.wrapper,
+        '\n',
+      )}`,
+    );
+  }
+  const extra = {
+    selection: {
+      start: newPosition,
+      end: newPosition,
+    },
+  };
+  setState({ text: newText }, () => {
+    setTimeout(() => {
+      setState({ ...extra });
+    }, 25);
+  });
+};

src/components/markdownEditor/view/formats/formats.js

@@ -0,0 +1,116 @@
+import applyWrapFormat from './applyWrapFormat';
+import applyWrapFormatNewLines from './applyWrapFormatNewLines';
+import applyListFormat from './applyListFormat';
+import applyWebLinkFormat from './applyWebLinkFormat';
+
+export default [
+  {
+    key: 'B',
+    title: 'B',
+    icon: 'bold',
+    iconType: 'Feather',
+    wrapper: '**',
+    onPress: applyWrapFormat,
+    // style: { fontWeight: 'bold' },
+  },
+  {
+    key: 'H1',
+    title: 'H1',
+    icon: 'format-size',
+    iconType: 'MaterialCommunityIcons',
+    prefix: '#',
+    onPress: applyListFormat,
+  },
+  {
+    key: 'L',
+    title: 'L',
+    icon: 'list',
+    iconType: 'Feather',
+    prefix: '-',
+    onPress: applyListFormat,
+  },
+  {
+    key: 'C',
+    title: 'C',
+    icon: 'ios-code',
+    wrapper: '`',
+    onPress: applyWrapFormat,
+  },
+  {
+    key: 'I',
+    title: 'I',
+    icon: 'italic',
+    iconType: 'Feather',
+    wrapper: '*',
+    onPress: applyWrapFormat,
+  },
+  {
+    key: 'U',
+    title: 'U',
+    icon: 'underline',
+    iconType: 'Feather',
+    wrapper: '__',
+    onPress: applyWrapFormat,
+  },
+  {
+    key: 'S',
+    title: 'S',
+    wrapper: '~~',
+    icon: 'strikethrough',
+    iconType: 'FontAwesome',
+    onPress: applyWrapFormat,
+  },
+  {
+    key: '>',
+    title: '>',
+    prefix: '>',
+    icon: 'ios-quote',
+    onPress: applyListFormat,
+  },
+
+  {
+    key: 'CC',
+    title: 'CC',
+    icon: 'ios-code-working',
+    wrapper: '```',
+    onPress: applyWrapFormatNewLines,
+  },
+
+  {
+    key: 'WEB',
+    title: 'WEB',
+    icon: 'link-2',
+    iconType: 'Feather',
+    onPress: applyWebLinkFormat,
+  },
+  // {
+  //   key: 'H2',
+  //   title: 'H2',
+  //   prefix: '##',
+  //   onPress: applyListFormat,
+  // },
+  // {
+  //   key: 'H3',
+  //   title: 'H3',
+  //   prefix: '###',
+  //   onPress: applyListFormat,
+  // },
+  // {
+  //   key: 'H4',
+  //   title: 'H4',
+  //   prefix: '####',
+  //   onPress: applyListFormat,
+  // },
+  // {
+  //   key: 'H5',
+  //   title: 'H5',
+  //   prefix: '#####',
+  //   onPress: applyListFormat,
+  // },
+  // {
+  //   key: 'H6',
+  //   title: 'H6',
+  //   prefix: '######',
+  //   onPress: applyListFormat,
+  // },
+];

src/components/markdownEditor/view/formats/utils.js

@@ -0,0 +1,8 @@
+import regexValidator from './webLinkValidator';
+
+export const replaceBetween = (text: string, selection: Object, what: string) => text.substring(0, selection.start) + what + text.substring(selection.end);
+
+export const isStringWebLink = (text: string): boolean => {
+  const pattern = regexValidator;
+  return pattern.test(text);
+};

src/components/markdownEditor/view/formats/webLinkValidator.js

@@ -0,0 +1,45 @@
+// Regular Expression for URL validation
+//
+// Author: Diego Perini
+// Updated: 2010/12/05
+// License: MIT
+//
+// Copyright (c) 2010-2013 Diego Perini (http://www.iport.it)
+//
+export default new RegExp(
+  '^'
+    // protocol identifier
+    + '(?:(?:https?|ftp)://)'
+    // user:pass authentication
+    + '(?:\\S+(?::\\S*)?@)?'
+    + '(?:'
+    // IP address exclusion
+    // private & local networks
+    + '(?!(?:10|127)(?:\\.\\d{1,3}){3})'
+    + '(?!(?:169\\.254|192\\.168)(?:\\.\\d{1,3}){2})'
+    + '(?!172\\.(?:1[6-9]|2\\d|3[0-1])(?:\\.\\d{1,3}){2})'
+    // IP address dotted notation octets
+    // excludes loopback network 0.0.0.0
+    // excludes reserved space >= 224.0.0.0
+    // excludes network & broacast addresses
+    // (first & last IP address of each class)
+    + '(?:[1-9]\\d?|1\\d\\d|2[01]\\d|22[0-3])'
+    + '(?:\\.(?:1?\\d{1,2}|2[0-4]\\d|25[0-5])){2}'
+    + '(?:\\.(?:[1-9]\\d?|1\\d\\d|2[0-4]\\d|25[0-4]))'
+    + '|'
+    // host name
+    + '(?:(?:[a-z\\u00a1-\\uffff0-9]-*)*[a-z\\u00a1-\\uffff0-9]+)'
+    // domain name
+    + '(?:\\.(?:[a-z\\u00a1-\\uffff0-9]-*)*[a-z\\u00a1-\\uffff0-9]+)*'
+    // TLD identifier
+    + '(?:\\.(?:[a-z\\u00a1-\\uffff]{2,}))'
+    // TLD may end with dot
+    + '\\.?'
+    + ')'
+    // port number
+    + '(?::\\d{2,5})?'
+    // resource path
+    + '(?:[/?#]\\S*)?'
+    + '$',
+  'i',
+);

src/components/markdownEditor/view/markdownEditorStyles.js

@@ -0,0 +1,56 @@
+import EStyleSheet from 'react-native-extended-stylesheet';
+
+export default EStyleSheet.create({
+  container: {
+    flex: 1,
+    flexDirection: 'column',
+    alignItems: 'stretch',
+    backgroundColor: '$white',
+  },
+  textWrapper: {
+    flex: 1,
+    flexDirection: 'column',
+    fontSize: 12,
+    marginVertical: 16,
+    paddingHorizontal: 16,
+  },
+  inlinePadding: {
+    padding: 8,
+  },
+  editorButtons: {
+    flexDirection: 'row',
+    backgroundColor: '$white',
+    alignItems: 'center',
+    justifyContent: 'space-between',
+    height: 50,
+    shadowOpacity: 0.2,
+    shadowOffset: {
+      height: 1.5,
+    },
+  },
+  leftButtonsWrapper: {
+    marginLeft: 16,
+    flexDirection: 'row',
+    alignItems: 'center',
+    maxWidth: '$deviceWidth / 1.85',
+  },
+  rightButtonsWrapper: {
+    marginRight: 16,
+    flexDirection: 'row',
+    alignItems: 'center',
+  },
+  editorButton: {
+    color: '$primaryDarkGray',
+    paddingRight: 22,
+    height: 24,
+  },
+  dropdownStyle: {
+    marginRight: 8,
+  },
+  rightIcons: {
+    paddingRight: 21,
+  },
+  dropdownIconStyle: {
+    color: '$primaryDarkGray',
+  },
+});

src/components/markdownEditor/view/markdownEditorView.js

@@ -0,0 +1,152 @@
+import React, { Component } from 'react';
+import {
+  View, TextInput, KeyboardAvoidingView, ScrollView, FlatList,
+} from 'react-native';
+import { MarkdownView } from 'react-native-markdown-view';
+
+// Components
+import Formats from './formats/formats';
+import { IconButton } from '../../iconButton';
+import { DropdownButton } from '../../dropdownButton';
+
+// Styles
+import styles from './markdownEditorStyles';
+import previewStyles from './markdownPreviewStyles';
+
+export default class MarkdownEditorView extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      text: '',
+      selection: { start: 0, end: 0 },
+    };
+  }
+
+  componentDidMount() {
+    this.textInput.focus();
+  }
+
+  changeText = (input) => {
+    const {
+      onChange, handleOnTextChange, handleIsValid, componentID,
+    } = this.props;
+
+    this.setState({ text: input });
+
+    if (onChange) {
+      onChange(input);
+    }
+
+    if (handleIsValid) {
+      handleIsValid(componentID, !!(input && input.length));
+    }
+
+    handleOnTextChange && handleOnTextChange(input);
+  };
+
+  _handleOnSelectionChange = (event) => {
+    this.setState({
+      selection: event.nativeEvent.selection,
+    });
+  };
+
+  _getState = () => {
+    this.setState({
+      selection: {
+        start: 1,
+        end: 1,
+      },
+    });
+    return this.state;
+  };
+
+  _renderPreview = () => {
+    const { text } = this.state;
+
+    return (
+      <View style={styles.textWrapper}>
+        <ScrollView removeClippedSubviews>
+          <MarkdownView styles={previewStyles}>{text === '' ? '...' : text}</MarkdownView>
+        </ScrollView>
+      </View>
+    );
+  };
+
+  _renderMarkupButton = ({ item, getState, setState }) => (
+    <View style={styles.buttonWrapper}>
+      <IconButton
+        size={20}
+        style={styles.editorButton}
+        iconType={item.iconType}
+        name={item.icon}
+        onPress={() => item.onPress({ getState, setState, item })}
+      />
+    </View>
+  );
+
+  _renderEditorButtons = ({ getState, setState }) => (
+    <View style={styles.editorButtons}>
+      <View style={styles.leftButtonsWrapper}>
+        <FlatList
+          data={Formats}
+          keyboardShouldPersistTaps="always"
+          renderItem={({ item }) => this._renderMarkupButton({ item, getState, setState })}
+          horizontal
+        />
+      </View>
+      <View style={styles.rightButtonsWrapper}>
+        <IconButton
+          size={20}
+          style={styles.rightIcons}
+          iconType="Feather"
+          name="link-2"
+          onPress={() => Formats[9].onPress({ getState, setState })}
+        />
+        <IconButton style={styles.rightIcons} size={20} iconType="Feather" name="image" />
+        <DropdownButton
+          style={styles.dropdownStyle}
+          options={['option1', 'option2', 'option3', 'option4']}
+          iconName="md-more"
+          iconStyle={styles.dropdownIconStyle}
+          isHasChildIcon
+        />
+      </View>
+    </View>
+  );
+
+  render() {
+    const { isPreviewActive } = this.props;
+    const { text, selection } = this.state;
+
+    return (
+      <KeyboardAvoidingView style={styles.container} behavior="padding">
+        {!isPreviewActive ? (
+          <TextInput
+            multiline
+            onChangeText={text => this.changeText(text)}
+            onSelectionChange={this._handleOnSelectionChange}
+            placeholder="What would you like to write about today?"
+            placeholderTextColor="#c1c5c7"
+            ref={textInput => (this.textInput = textInput)}
+            selection={selection}
+            selectionColor="#357ce6"
+            style={styles.textWrapper}
+            underlineColorAndroid="transparent"
+            value={text}
+            {...this.props}
+          />
+        ) : (
+          this._renderPreview()
+        )}
+        {!isPreviewActive
+          && this._renderEditorButtons({
+            getState: this._getState,
+            setState: (state, callback) => {
+              this.textInput.focus();
+              this.setState(state, callback);
+            },
+          })}
+      </KeyboardAvoidingView>
+    );
+  }
+}

src/components/markdownEditor/view/markdownPreviewStyles.js

@@ -0,0 +1,16 @@
+export const markdownPreviewStyles = {
+  heading1: {
+    fontSize: 24,
+    color: 'red',
+    backgroundColor: 'red',
+  },
+  link: {
+    color: 'pink',
+  },
+  mailTo: {
+    color: 'orange',
+  },
+  text: {
+    color: '#555555',
+  },
+};

src/components/markdownEditor/view/renderButtons.js

@@ -0,0 +1,31 @@
+import React from 'react';
+import {
+  FlatList, TouchableOpacity, Text, View,
+} from 'react-native';
+
+import Formats from './formats/formats';
+
+import styles from './editorBarStyles';
+
+const FOREGROUND_COLOR = '#788187';
+const defaultStyles = { padding: 8, color: FOREGROUND_COLOR, fontSize: 16 };
+
+const defaultMarkdownButton = ({ item, getState, setState }) => (
+  <TouchableOpacity onPress={() => item.onPress({ getState, setState, item })}>
+    <Text style={[defaultStyles, item.style]}>{item.title}</Text>
+  </TouchableOpacity>
+);
+
+export const renderEditorButtons = ({ getState, setState }, formats, markdownButton) => (
+  <View style={styles.container}>
+    <FlatList
+      data={formats || Formats}
+      keyboardShouldPersistTaps="always"
+      renderItem={({ item, index }) => (markdownButton
+        ? markdownButton({ item, getState, setState })
+        : defaultMarkdownButton({ item, getState, setState }))
+      }
+      horizontal
+    />
+  </View>
+);

src/components/numericKeyboard/views/numericKeyboardView.js

@@ -1,15 +1,13 @@
-import React, { Fragment, Component } from "react";
+import React, { Component } from 'react';
-import { View } from "react-native";
+import { View } from 'react-native';
 
-import { CircularButton, IconButton } from "../../";
+import { CircularButton, IconButton } from '../..';
 
-import styles from "./numericKeyboardStyles";
+import styles from './numericKeyboardStyles';
 
 class NumericKeyboard extends Component {
   /* Props
-    *
     *   @prop { func }    onPress            - Function will trigger when any button clicked.
-    * 
     */
   constructor(props) {
     super(props);
@@ -20,7 +18,7 @@ class NumericKeyboard extends Component {
 
   // Component Functions
 
-  _handleOnPress = value => {
+  _handleOnPress = (value) => {
     alert(value);
   };
 
@@ -98,7 +96,7 @@ class NumericKeyboard extends Component {
           />
 
           <IconButton
-            handleOnPress={() => onPress && onPress("clear")}
+            handleOnPress={() => onPress && onPress('clear')}
             isCircle
             style={styles.iconButton}
             name="close"

src/components/postButton/container/postButtonContainer.js

@@ -0,0 +1,28 @@
+import React, { Component } from 'react';
+import { withNavigation } from 'react-navigation';
+
+// Components
+import { PostButtonView } from '..';
+
+class PostButtonContainer extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {};
+  }
+
+  // Component Life Cycle Functions
+
+  // Component Functions
+
+  _handleSubButtonPress = (route) => {
+    const { navigation } = this.props;
+
+    navigation.navigate(route);
+  };
+
+  render() {
+    return <PostButtonView handleSubButtonPress={this._handleSubButtonPress} {...this.props} />;
+  }
+}
+
+export default withNavigation(PostButtonContainer);

src/components/postButton/index.js

@@ -1,4 +1,5 @@
-import PostButton from './view/postButtonView';
+import PostButtonView from './view/postButtonView';
+import PostButton from './container/postButtonContainer';
 
-export { PostButton };
+export { PostButtonView, PostButton };
 export default PostButton;

src/components/postButton/view/postButtonView.js

@@ -81,15 +81,7 @@ class PostButtonView extends Component {
       outputRange: ['0deg', '45deg'],
     });
 
-    // const bluring = this.mode.interpolate({
+    const { handleSubButtonPress } = this.props;
-    //   inputRange: [0, 1],
-    //   outputRange: [10, 5],
-    // });
-
-    // const blurin2 = this.mode.interpolate({
-    //   inputRange: [0, 1],
-    //   outputRange: [0, -20],
-    // });
 
     return (
       <View style={styles.postButtonWrapper}>
@@ -108,6 +100,7 @@ class PostButtonView extends Component {
             top: secondY,
           }}
           icon="pencil"
+          onPress={() => handleSubButtonPress('EditorScreen')}
         />
         <SubPostButton
           size={SIZE}

src/components/postForm/index.js

@@ -0,0 +1,4 @@
+import PostForm from './view/postFormView';
+
+export { PostForm };
+export default PostForm;

src/components/postForm/view/postFormView.js

@@ -0,0 +1,46 @@
+import React, { Component, Fragment } from 'react';
+
+class PostFormView extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {};
+  }
+
+  _handleOnSubmitEditing = (returnKeyType = null, inputElement = null) => {
+    const { handleOnSubmit, isFormValid } = this.props;
+
+    if (isFormValid && handleOnSubmit && returnKeyType === 'done') {
+      handleOnSubmit();
+    } else if (returnKeyType === 'next' && inputElement) {
+      // TODO: its accept current input but its should be next input ref
+      inputElement.focus();
+    }
+  };
+
+  _handleOnChange = (componentID, value, isValid = null) => {
+    const { handleFormUpdate } = this.props;
+
+    handleFormUpdate(componentID, value, !!isValid || !!value);
+  };
+
+  render() {
+    const { children, isFormValid, isPreviewActive } = this.props;
+
+    return (
+      <Fragment>
+        {React.Children.map(children, (child) => {
+          if (child) {
+            return React.cloneElement(child, {
+              onSubmitEditing: item => this._handleOnSubmitEditing(child.props.returnKeyType, item),
+              onChange: value => this._handleOnChange(child.props.componentID, value),
+              returnKeyType: isFormValid ? 'done' : 'next',
+              isPreviewActive,
+            });
+          }
+        })}
+      </Fragment>
+    );
+  }
+}
+
+export default PostFormView;

src/components/sideMenu/container/sideMenuContainer.js

@@ -29,7 +29,7 @@ class SideMenuContainer extends Component {
 
   // Component Functions
 
-  _navigateToRoute = (route) => {
+  _navigateToRoute = (route = null) => {
     const { navigation } = this.props;
     navigation.navigate(route);
   };

src/components/sideMenu/view/sideMenuView.js

@@ -28,6 +28,7 @@ class SideMenuView extends Component {
 
   render() {
     const { isLoggedIn, userAvatar, navigateToRoute } = this.props;
+
     return (
       <View style={styles.container}>
         <View style={styles.headerView}>

src/config/routes.js

@@ -4,7 +4,7 @@ import { default as ROUTES } from '../constants/routeNames';
 
 // Screens
 import {
-  Splash, Login, PinCode, SteemConnect,
+  Splash, Login, PinCode, SteemConnect, Editor,
 } from '../screens';
 
 // Components
@@ -25,9 +25,10 @@ const mainNavigation = DrawerNavigator(
 );
 
 export default SwitchNavigator({
-  [ROUTES.SCREENS.SPLASH]: { screen: Splash },
+  [ROUTES.DRAWER.MAIN]: mainNavigation,
+  [ROUTES.SCREENS.EDITOR]: { screen: Editor },
   [ROUTES.SCREENS.LOGIN]: { screen: Login },
   [ROUTES.SCREENS.PINCODE]: { screen: PinCode },
   [ROUTES.SCREENS.STEEM_CONNECT]: { screen: SteemConnect },
-  [ROUTES.DRAWER.MAIN]: mainNavigation,
+  [ROUTES.SCREENS.SPLASH]: { screen: Splash },
 });

src/constants/routeNames.js

@@ -3,11 +3,12 @@ const DRAWER_SUFFIX = 'Drawer';
 
 export default {
   SCREENS: {
-    SPLASH: `Splash${SCREEN_SUFFIX}`,
+    EDITOR: `Editor${SCREEN_SUFFIX}`,
+    HOME: `Home${SCREEN_SUFFIX}`,
     LOGIN: `Login${SCREEN_SUFFIX}`,
     PINCODE: `PinCode${SCREEN_SUFFIX}`,
-    HOME: `Home${SCREEN_SUFFIX}`,
     STEEM_CONNECT: `SteemConnect${SCREEN_SUFFIX}`,
+    SPLASH: `Splash${SCREEN_SUFFIX}`,
   },
   DRAWER: {
     MAIN: `Main${DRAWER_SUFFIX}`,

src/globalStyles.js

@@ -1,10 +1,11 @@
 import EStyleSheet from 'react-native-extended-stylesheet';
 
 export default EStyleSheet.create({
-  container: {
+  containerHorizontal16: {
+    paddingHorizontal: 16,
+  },
+  defaultContainer: {
     flex: 1,
-    alignItems: 'center',
-    justifyContent: 'center',
   },
   title: {},
   text: {

src/providers/steem/auth.js

@@ -26,7 +26,9 @@ export const Login = (username, password) => {
     // Get user account data from STEEM Blockchain
     getAccount(username)
       .then((result) => {
-        if (result.length < 1) {
+        if (isLoggedInUser(username)) {
+          reject(new Error('You are already logged in, please try to add another account'));
+        } else if (result.length < 1) {
           reject(new Error('Invalid credentails, please check and try again'));
         }
 
@@ -80,6 +82,46 @@ export const Login = (username, password) => {
   });
 };
 
+export const loginWithSC2 = async (accessToken) => {
+  await steemConnect.setAccessToken(accessToken);
+  const account = await steemConnect.me();
+
+  return new Promise((resolve, reject) => {
+    const userData = {
+      username: account.account.name,
+      authType: 'steemConnect',
+      masterKey: '',
+      postingKey: '',
+      activeKey: '',
+      memoKey: '',
+      accessToken: '',
+    };
+
+    const authData = {
+      isLoggedIn: true,
+    };
+
+    if (isLoggedInUser(account.account.name)) {
+      reject(new Error('You are already logged in, please try to add another account'));
+    }
+
+    setAuthStatus(authData)
+      .then(() => {
+        setUserData(userData)
+          .then(() => {
+            resolve({ ...account.account, accessToken });
+          })
+          .catch((error) => {
+            reject(error);
+          });
+      })
+      .catch((error) => {
+        reject(error);
+      });
+  });
+};
+
+
 export const setUserDataWithPinCode = data => new Promise((resolve, reject) => {
   let updatedUserData;
   const result = getUserDataWithUsername(data.username);
@@ -135,7 +177,7 @@ export const setUserDataWithPinCode = data => new Promise((resolve, reject) => {
   resolve();
 });
 
-export const verifyPinCode = async data => {
+export const verifyPinCode = async (data) => {
   const result = getUserDataWithUsername(data.username);
   const userData = result[0];
   let loginFlag = false;
@@ -169,8 +211,7 @@ export const verifyPinCode = async data => {
       reject(new Error('Invalid pin code, please check and try again'));
     }
   });
-  
+};
-}
 
 const getPrivateKeys = (username, password) => ({
   active: dsteem.PrivateKey.fromLogin(username, password, 'active'),
@@ -179,37 +220,10 @@ const getPrivateKeys = (username, password) => ({
   posting: dsteem.PrivateKey.fromLogin(username, password, 'posting'),
 });
 
-export const loginWithSC2 = async (accessToken) => {
+const isLoggedInUser = (username) => {
-  await steemConnect.setAccessToken(accessToken);
+  const result = getUserDataWithUsername(username);
-  const account = await steemConnect.me();
+  if (result.length > 0) {
-
+    return true;
-  return new Promise((resolve, reject) => {
+  }
-    const userData = {
+  return false;
-      username: account.name,
-      authType: 'steemConnect',
-      masterKey: '',
-      postingKey: '',
-      activeKey: '',
-      memoKey: '',
-      accessToken: '',
-    };
-
-    const authData = {
-      isLoggedIn: true,
-    };
-
-    setAuthStatus(authData)
-      .then(() => {
-        setUserData(userData)
-          .then(() => {
-            resolve({ ...account, accessToken });
-          })
-          .catch((error) => {
-            reject(error);
-          });
-      })
-      .catch((error) => {
-        reject(error);
-      });
-  });
 };

src/screens/editor/container/editorContainer.js

@@ -0,0 +1,76 @@
+import React, { Component } from 'react';
+
+// Services and Actions
+import { postContent } from '../../../providers/steem/dsteem';
+import { getUserData } from '../../../realm/realm';
+
+// Middleware
+
+// Constants
+import { default as ROUTES } from '../../../constants/routeNames';
+
+// Utilities
+import { generatePermlink } from '../../../utils/editor';
+import { decryptKey } from '../../../utils/crypto';
+
+// Component
+import { EditorScreen } from '../screen/editorScreen';
+
+/*
+  *            Props Name        Description                                     Value
+  *@props -->  props name here   description here                                Value Type Here
+  *
+  */
+
+class ExampleContainer extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {};
+  }
+
+  // Component Life Cycle Functions
+
+  // Component Functions
+
+  _submitPost = async (form) => {
+    const { navigation } = this.props;
+    let userData;
+    let postingKey;
+    const title = form.formFields['title-area'].content;
+    const permlink = generatePermlink(title);
+
+    await getUserData().then((res) => {
+      userData = res && Array.from(res)[0];
+      postingKey = decryptKey(userData.postingKey, '1234');
+    });
+
+    if (userData) {
+      const post = {
+        body: form.formFields['text-area'].content,
+        title,
+        author: userData.username,
+        permlink: permlink && permlink,
+        tags: form.tags,
+      };
+
+      postContent(post, postingKey)
+        .then((result) => {
+          alert('Your post succesfully shared');
+          navigation.navigate(ROUTES.SCREENS.HOME);
+        })
+        .catch((error) => {
+          alert(`Opps! there is a problem${error}`);
+        });
+    }
+  };
+
+  _handleSubmit = (form) => {
+    this._submitPost(form);
+  };
+
+  render() {
+    return <EditorScreen handleOnSubmit={this._handleSubmit} />;
+  }
+}
+
+export default ExampleContainer;

src/screens/editor/editor.js

@@ -1,188 +0,0 @@
-import React from 'react';
-import {
-  Container,
-  Header,
-  Left,
-  Body,
-  Right,
-  Button,
-  Icon,
-  Title,
-  Content,
-} from 'native-base';
-import { MarkdownEditor } from 'react-native-markdown-editor';
-import {
-  StatusBar,
-  View,
-  TextInput,
-  TouchableOpacity,
-  Text,
-} from 'react-native';
-import Tags from '@esteemapp/react-native-tags';
-import { postContent } from '../../providers/steem/dsteem';
-import { getUserData, getAuthStatus } from '../../realm/realm';
-import { decryptKey } from '../../utils/crypto';
-
-class EditorPage extends React.Component {
-  constructor(props) {
-    super(props);
-    this.onChangeBody = this.onChangeBody.bind(this);
-    this.onChangeTitle = this.onChangeTitle.bind(this);
-    this.onChangeTags = this.onChangeTags.bind(this);
-
-    this.state = {
-      body: '',
-      title: '',
-      author: '',
-      permlink: '',
-      tags: ['esteem'],
-    };
-  }
-
-  componentDidMount() {}
-
-    onChangeBody = (body) => {
-      this.setState({
-        body,
-      });
-    };
-
-    onChangeTitle = (title) => {
-      this.setState({
-        title,
-      });
-    };
-
-    onChangeTags = (tags) => {
-      this.setState({
-        tags,
-      });
-    };
-
-    generatePermlink = () => {
-      let title;
-
-      title = this.state.title
-        .replace(/[^\w\s]/gi, '')
-        .replace(/\s\s+/g, '-')
-        .replace(/\s/g, '-')
-        .toLowerCase();
-      title = `${title
-      }-id-${
-        Math.random()
-          .toString(36)
-          .substr(2, 16)}`;
-
-      return title;
-    };
-
-    submitPost = async () => {
-      let userData;
-      let postingKey;
-
-      await getUserData().then((res) => {
-        userData = Array.from(res);
-        postingKey = decryptKey(userData[0].postingKey, 'pinCode');
-      });
-
-      post = {
-        body: this.state.body,
-        title: this.state.title,
-        author: userData[0].username,
-        permlink: this.generatePermlink(),
-        tags: this.state.tags,
-      };
-
-      console.log(post);
-
-      postContent(post, postingKey)
-        .then((result) => {
-          console.log(result);
-        })
-        .catch((error) => {
-          console.log(error);
-        });
-    };
-
-    render() {
-      return (
-        <Container style={{ flex: 1 }}>
-          <View style={{ flex: 1, flexDirection: 'column' }}>
-            <TextInput
-              placeholder="Title"
-              onChangeText={title => this.onChangeTitle(title)}
-              style={{
-                borderWidth: 1,
-                borderColor: 'lightgray',
-                height: 40,
-                margin: 10,
-                borderRadius: 10,
-                flex: 0.08,
-              }}
-            />
-            <Tags
-              initialText=""
-              initialTags={this.state.tags}
-              onChangeTags={tags => this.onChangeTags(tags)}
-              onTagLongPress={(index, tagLabel, event, deleted) => console.log(
-                index,
-                tagLabel,
-                event,
-                deleted ? 'deleted' : 'not deleted',
-              )
-                        }
-              containerStyle={{ justifyContent: 'center' }}
-              inputStyle={{ backgroundColor: 'white' }}
-              maxNumberOfTags={5}
-              tagContainerStyle={{
-                height: 25,
-                backgroundColor: '#284b78',
-              }}
-              tagTextStyle={{ fontWeight: '600', color: 'white' }}
-              style={{
-                borderWidth: 1,
-                borderColor: 'lightgray',
-                flex: 0.12,
-              }}
-            />
-            <View style={{ borderRadius: 10, flex: 0.7 }}>
-              <MarkdownEditor
-                onMarkdownChange={(text) => {
-                  this.onChangeBody(text);
-                }}
-              />
-            </View>
-
-            <View style={{ flex: 0.1, flexDirection: 'row' }}>
-              <View style={{ flex: 0.7 }}>
-                <Text>Options</Text>
-              </View>
-              <View style={{ flex: 0.3 }}>
-                <TouchableOpacity
-                  onPress={this.submitPost}
-                  style={{
-                    borderRadius: 10,
-                    backgroundColor: '#284b78',
-                    width: 100,
-                    height: 20,
-                    alignItems: 'center',
-                  }}
-                >
-                  <Text
-                    style={{
-                      color: 'white',
-                      alignSelf: 'center',
-                    }}
-                  >
-                                    Submit
-                  </Text>
-                </TouchableOpacity>
-              </View>
-            </View>
-          </View>
-        </Container>
-      );
-    }
-}
-
-export default EditorPage;

src/screens/editor/index.js

@@ -0,0 +1,4 @@
+import Editor from './container/editorContainer';
+
+export { Editor };
+export default Editor;

src/screens/editor/screen/editorScreen.js

@@ -0,0 +1,117 @@
+import React, { Component } from 'react';
+import { View } from 'react-native';
+
+// Utils
+import { getWordsCount } from '../../../utils/editor';
+
+// Constants
+
+// Components
+import { EditorHeader } from '../../../components/editorHeader';
+import { TitleArea, TagArea, TextArea } from '../../../components/editorElements';
+import { PostForm } from '../../../components/postForm';
+// Styles
+import globalStyles from '../../../globalStyles';
+
+export class EditorScreen extends Component {
+  /* Props
+    * ------------------------------------------------
+    *   @prop { type }    name                - Description....
+    */
+
+  constructor(props) {
+    super(props);
+    this.state = {
+      isPreviewActive: false,
+      wordsCount: null,
+      formFields: {},
+      isFormValid: false,
+      tags: [],
+    };
+  }
+
+  // Component Life Cycles
+
+  // Component Functions
+  _handleOnPressPreviewButton = () => {
+    const { isPreviewActive } = this.state;
+
+    this.setState({ isPreviewActive: !isPreviewActive });
+  };
+
+  _setWordsCount = (content) => {
+    const _wordsCount = getWordsCount(content);
+    const { wordsCount } = this.state;
+
+    if (_wordsCount !== wordsCount) {
+      this.setState({ wordsCount: _wordsCount });
+    }
+  };
+
+  _handleOnSubmit = () => {
+    const { handleOnSubmit } = this.props;
+    const { formFields, tags } = this.state;
+
+    if (handleOnSubmit) {
+      handleOnSubmit({ formFields, tags });
+    }
+  };
+
+  _handleIsFormValid = () => {
+    const { formFields, tags } = this.state;
+
+    this.setState({
+      isFormValid:
+        formFields['title-area']
+        && formFields['text-area']
+        && formFields['title-area'].isValid
+        && formFields['text-area'].isValid
+        && tags
+        && tags.length > 0,
+    });
+  };
+
+  _handleFormUpdate = (componentID, content, isValid) => {
+    const { formFields } = this.state;
+    const newFormFields = formFields;
+
+    newFormFields[componentID] = {
+      content,
+      isValid,
+    };
+
+    this.setState({ formFields: newFormFields });
+
+    this._handleIsFormValid();
+  };
+
+  _handleOnTagAdded = (tags) => {
+    this.setState({ tags: tags.filter(tag => tag && tag !== ' ') });
+  };
+
+  render() {
+    const { isPreviewActive, wordsCount, isFormValid } = this.state;
+
+    return (
+      <View style={globalStyles.defaultContainer}>
+        <EditorHeader
+          isPreviewActive={isPreviewActive}
+          quickTitle={wordsCount > 0 && `${wordsCount} words`}
+          handleOnPressPreviewButton={this._handleOnPressPreviewButton}
+          isFormValid={isFormValid}
+          handleOnSubmit={this._handleOnSubmit}
+        />
+        <PostForm
+          handleFormUpdate={this._handleFormUpdate}
+          handleOnSubmit={this._handleOnSubmit}
+          isPreviewActive={isPreviewActive}
+          isFormValid={isFormValid}
+        >
+          <TitleArea componentID="title-area" />
+          <TagArea componentID="tag-area" handleTagChanged={this._handleOnTagAdded} />
+          <TextArea handleOnTextChange={this._setWordsCount} componentID="text-area" />
+        </PostForm>
+      </View>
+    );
+  }
+}

src/screens/index.js

@@ -1,10 +1,11 @@
 import PinCode from './pinCode';
 import Splash from './splash';
+import { Editor } from './editor';
 import { Home } from './home';
 import { Login } from './login';
-import { Profile } from './profile';
 import { Notification } from './notification';
 import SteemConnect from './steem-connect/steemConnect';
+import { Profile } from './profile';
 
 // import Author from './authorProfile';
 // import SideMenu from './sideMenuScreen';
@@ -19,13 +20,14 @@ import SteemConnect from './steem-connect/steemConnect';
 // import { Notification } from './notification';
 
 export {
+  Editor,
   Home,
   Login,
-  PinCode,
-  Splash,
-  Profile,
   Notification,
+  PinCode,
+  Profile,
   SteemConnect,
+  Splash,
   // Author,
   // SideMenu,
   // Hot,

src/screens/steem-connect/steemConnect.js

@@ -26,7 +26,7 @@ class SteemConnect extends Component {
     const { isLoading } = this.state;
 
     if (event.url.indexOf('?access_token=') > -1) {
-      // this.webview.stopLoading();
+      this.webview.stopLoading();
       try {
         accessToken = event.url.match(/\?(?:access_token)\=([\S\s]*?)\&/)[1];
       } catch (error) {

src/utils/editor.js

@@ -0,0 +1,15 @@
+export const getWordsCount = text => (text && typeof text === 'string' ? text.replace(/^\s+|\s+$/g, '').split(/\s+/).length : 0);
+
+export const generatePermlink = (text) => {
+  if (text) {
+    const re = /[^a-z0-9]+/gi;
+    const re2 = /^-*|-*$/g;
+    let permlink = text.replace(re, '-');
+
+    permlink = `${permlink.replace(re2, '').toLowerCase()}-id-${Math.random()
+      .toString(36)
+      .substr(2, 16)}`;
+    return permlink;
+  }
+  return null;
+};