v1.0.1

App.jsx

@@ -2,6 +2,7 @@ import React, { Component } from 'react';
 import { WebView } from 'react-native-webview';
 import Loader from './components/Loader';
 import { StatusBar } from 'react-native';
+import Error from './components/Error';
 
 export default class App extends Component {
 
@@ -23,10 +24,16 @@ export default class App extends Component {
 	render() {
 		if (!this.state.loading) {
 			return (
-				<WebView source={{ uri: 'https://scratch-for-discord.netlify.app' }} style={{ marginTop: StatusBar.currentHeight }} />
+				<WebView 
+					source={{ uri: 'https://scratch-for-discord.netlify.app' }} 
+					style={{ marginTop: StatusBar.currentHeight }}
+					userAgent=""
+					renderError={(name) => <Error message={name} />}
+					renderLoading={() => <Loader message="Loading..." />}
+				/>
 			);
 		} else {
-			return <Loader />;
+			return <Loader message="Scratch For Discord" />;
 		}
 	}
 

app.json

@@ -2,7 +2,7 @@
   "expo": {
     "name": "scratch-for-discord",
     "slug": "scratch-for-discord",
-    "version": "1.0.0",
+    "version": "1.0.1",
     "orientation": "portrait",
     "icon": "./assets/icon.png",
     "splash": {

components/Error.jsx

@@ -0,0 +1,31 @@
+import React from 'react'
+import { StyleSheet, Text, View, Image } from 'react-native';
+import Logo from '../assets/icon.png'
+
+export default function Error({ message }) {
+    return (
+        <View style={styles.container}>
+            <Image source={Logo} style={styles.image} />
+            <Text style={styles.text}>{message || 'Something went wrong!'}</Text>
+        </View>
+    )
+}
+
+const styles = StyleSheet.create({
+    container: {
+        flex: 1,
+        backgroundColor: '#fff',
+        alignItems: 'center',
+        justifyContent: 'center',
+    },
+    text: {
+        color: '#000000',
+        fontSize: 48,
+        fontWeight: 'bold',
+        textAlign: 'center'
+    },
+    image: {
+        width: 100,
+        height: 100
+    }
+});

components/Loader.jsx

@@ -2,11 +2,11 @@ import React from 'react'
 import { StyleSheet, Text, View, Image } from 'react-native';
 import Logo from "../assets/icon.png"
 
-export default function Loader() {
+export default function Loader({ message }) {
     return (
         <View style={styles.container}>
             <Image source={Logo} style={styles.image} />
-            <Text style={styles.text}>Scratch For Discord</Text>
+            <Text style={styles.text}>{message || 'Scratch For Discord'}</Text>
         </View>
     )
 }

package.json

@@ -21,7 +21,7 @@
   },
   "private": true,
   "name": "scratch-for-discord",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "Scratch For Discord android app",
   "repository": {
     "type": "git",