diff --git a/GitView b/GitView
new file mode 160000
index 0000000000000000000000000000000000000000..690282746b8a50666215d24d2bf4c8cb7801b9de
--- /dev/null
+++ b/GitView
@@ -0,0 +1 @@
+Subproject commit 690282746b8a50666215d24d2bf4c8cb7801b9de
diff --git a/src/App.js b/src/App.js
new file mode 100644
index 0000000000000000000000000000000000000000..3abd4b3d216d8a38ae4ea6c92b4e0e05d42e6092
--- /dev/null
+++ b/src/App.js
@@ -0,0 +1,294 @@
+// import { StatusBar } from 'expo-status-bar';
+// import React from 'react';
+// import { StyleSheet, Text, View } from 'react-native';
+// import { NavigationContainer } from '@react-navigation/native';
+// import { createStackNavigator } from '@react-navigation/stack';
+
+// function HomeScreen() {
+// return (
+// <View style={viewStyleVertical}>
+// <Text>Home Screen</Text>
+// </View>
+// );
+// }
+
+// const Stack = createStackNavigator();
+
+// export default function App() {
+// return (
+// <View style={styles.container}>
+// <Text>Open up App.js to start working on your app!!!</Text>
+// <StatusBar style="auto" />
+// <NavigationContainer>
+// <Stack.Navigator>
+// <Stack.Screen name="Home" component={HomeScreen} />
+// </Stack.Navigator>
+// </NavigationContainer>
+// </View>
+// );
+// }
+
+// const styles = StyleSheet.create({
+// container: {
+// flex: 1,
+// backgroundColor: '#fff',
+// alignItems: 'center',
+// justifyContent: 'center',
+// },
+// });
+
+import * as React from 'react';
+import { Pressable, View, Text, Image, StyleSheet, ImageBackground } from 'react-native';
+import { NavigationContainer } from '@react-navigation/native';
+import { createStackNavigator } from '@react-navigation/stack';
+
+const Stack = createStackNavigator();
+const styles = StyleSheet.create({
+ viewStyleVertical : { alignItems: 'center', justifyContent: 'center', margin: '10%' },
+ viewStyleHorizon : { flex: 1, flexDirection: 'row', justifyContent: 'space-between'},
+ pressableStyle : {flex: 1, flexDirection: 'row', justifyContent: 'space-between', backgroundColor:'lavender', paddingHorizontal:20,
+ paddingVertical:10, borderColor:'thistle', borderWidth:2, borderRadius:5, marginHorizontal: 10, marginTop: 10},
+ image: { flex: 1, resizeMode: "cover", justifyContent: "center"},
+ container : {flex: 1},
+ textBox : {flex: 1, marginTop: 20, backgroundColor:'white', borderColor:'black', borderWidth:2, borderRadius:5,
+ marginHorizontal: 10, paddingVertical:10, paddingHorizontal: 50, alignItems: 'flex-start'}
+});
+
+/** Home page **/
+function HomeScreen({ navigation }) {
+ return (
+ <View style={styles.container}>
+ <ImageBackground source={require('C:/Coding/cs242-assignment3/GitView/assets/ice.jpg')} style={styles.image}>
+ <View style={styles.viewStyleVertical}>
+ <Pressable style={styles.pressableStyle} onPress={() => navigation.navigate('LoadingProfile')}>
+ <Text> Start </Text>
+ </Pressable>
+ </View>
+ </ImageBackground>
+ </View>
+ );
+}
+
+/** Profile page **/
+function ProfileScreen({ route, navigation }) {
+ const {name, login, avatarUrl, bio, createdAt, email, websiteUrl, repositories} = route.params;
+ const nameContent = 'Name: \n' + name;
+ const userNameContent = 'UserName\n: ' + login
+ const bioContent = 'Bio: \n' + bio
+ const createDate = 'Create at: \n' + createdAt
+ const emailContent = 'Email: \n' + email
+ const websiteLink = 'Website: \n' + websiteUrl
+ const repoCount = 'Repository count: ' + repositories['nodes'].length
+ console.log(avatarUrl)
+ var iconUrl
+ if (avatarUrl != null) {
+ iconUrl = { uri: avatarUrl }
+ } else {
+ iconUrl = require('C:/Coding/cs242-assignment3/GitView/assets/default.png')
+ }
+ return (
+ <View style={styles.container}>
+ <ImageBackground source={require('C:/Coding/cs242-assignment3/GitView/assets/ice.jpg')} style={styles.image}>
+ <View style={styles.viewStyleVertical}>
+ <View style={styles.viewStyleVertical}>
+ <Image style={{width: 100, height: 100}} source={iconUrl} />
+ </View>
+ <View style={styles.viewStyleHorizon}>
+ <Pressable style={styles.pressableStyle}>
+ <Text> Followers </Text>
+ </Pressable>
+ <Pressable style={styles.pressableStyle}>
+ <Text> Followings </Text>
+ </Pressable>
+ </View>
+ <View style={styles.viewStyleVertical} >
+ <Text style={styles.textBox}> {nameContent} </Text>
+ <Text style={styles.textBox}> {userNameContent} </Text>
+ <Text style={styles.textBox}> {bioContent} </Text>
+ <Text style={styles.textBox}> {websiteLink} </Text>
+ <Text style={styles.textBox}> {emailContent} </Text>
+ <Text style={styles.textBox}> {createDate} </Text>
+ </View>
+ <View style={styles.viewStyleVertical} >
+ <Pressable style={styles.pressableStyle} onPress={() => navigation.navigate('LoadingRepo')}>
+ <Text> {repoCount} </Text>
+ </Pressable>
+ </View>
+ </View>
+ </ImageBackground>
+ </View>
+ );
+}
+
+/** Repo page **/
+function RepoScreen({ route, navigation }) {
+ const {nodes} = route.params
+ let cards = [];
+ for (let i = 0; i < nodes.length; i++) {
+ var repoName = 'Repo name: \n' + nodes[i]['name'] + '\n'
+ var repoDescription = 'Repo description: \n' + nodes[i]['description'] + '\n'
+ var repoOwner = 'Repo owner: \n' + nodes[i]['owner']['login'] + '\n'
+ var nativeID = 'repo#' + i
+ cards.push(
+ <View style={styles.textBox} nativeID={nativeID}>
+ <Text> {repoName} </Text>
+ <Text> {repoDescription} </Text>
+ <Text> {repoOwner} </Text>
+ </View>
+ )
+ }
+
+ return (
+ <View style={styles.container}>
+ <ImageBackground source={require('C:/Coding/cs242-assignment3/GitView/assets/ice.jpg')} style={styles.image}>
+ <View style={styles.viewStyleVertical}>
+ {cards}
+ <Pressable style={styles.pressableStyle} onPress={() => navigation.navigate('Profile')}>
+ <Text> Go to Profile </Text>
+ </Pressable>
+ </View>
+ </ImageBackground>
+ </View>
+ );
+}
+
+/** Unfound page **/
+function UnfoundScreen({ route, navigation }) {
+ const {errorMsg} = route.params
+ console.error(errorMsg)
+ return (
+ <View style={styles.container}>
+ <ImageBackground source={require('C:/Coding/cs242-assignment3/GitView/assets/ice.jpg')} style={styles.image}>
+ <View style={styles.viewStyleVertical}>
+ <Text style={{ fontSize: 30 }}> Error! Check log to see details </Text>
+ <Image style={{width: 200, height: 200}} source={require('C:/Coding/cs242-assignment3/GitView/assets/warn.png')} />
+ <Pressable style={styles.pressableStyle} onPress={() => navigation.navigate('Home')}>
+ <Text> Go back to Home Page </Text>
+ </Pressable>
+ </View>
+ </ImageBackground>
+ </View>
+ );
+}
+
+/** Loading Profile page **/
+function LoadProfileScreen({navigation}) {
+ const dataJson = require('C:/Coding/cs242-assignment3/env.json');
+ fetch(dataJson['endPoint'], {
+ method: 'POST',
+ headers: {
+ "Content-Type": "application/json",
+ "Authorization": dataJson['token']
+ },
+ body: JSON.stringify({
+ query: `
+ query {
+ viewer {
+ name
+ login
+ avatarUrl
+ bio
+ createdAt
+ email
+ websiteUrl
+ repositories(last:100, privacy:PUBLIC){
+ nodes{
+ name
+ }
+ }
+ }
+ }
+ `
+ })
+ })
+ .then(res => res.json())
+ .then((data)=> {
+ navigation.navigate('Profile', data['data']['viewer'])
+ })
+ .catch(error => {
+ console.error('Error:', error)
+ navigation.navigate('Unfound', {errorMsg: error})
+ })
+
+ return (
+ <View style={styles.container}>
+ <ImageBackground source={require('C:/Coding/cs242-assignment3/GitView/assets/ice.jpg')} style={styles.image}>
+ <View style={styles.viewStyleVertical}>
+ <Text style={{ fontSize: 30 }}>Loading......</Text>
+ <Image style={{width: 200, height: 200}} source={require('C:/Coding/cs242-assignment3/GitView/assets/loading.png')} />
+ </View>
+ </ImageBackground>
+ </View>
+ );
+}
+
+/** Loading Repo page **/
+function LoadRepoScreen({navigation}) {
+ // setTimeout(function(){
+ // navigation.navigate('Unfound');
+ // }, 1000)
+ const dataJson = require('C:/Coding/cs242-assignment3/env.json');
+ fetch(dataJson['endPoint'], {
+ method: 'POST',
+ headers: {
+ "Content-Type": "application/json",
+ "Authorization": dataJson['token']
+ },
+ body: JSON.stringify({
+ query: `
+ query {
+ viewer{
+ repositories(last:100, privacy:PUBLIC){
+ nodes{
+ name
+ owner{
+ login
+ }
+ description
+ }
+ }
+ }
+ }
+ `
+ })
+ })
+ .then(res => res.json())
+ // .then((data) => console.log(data['data']['viewer']['repositories']['nodes']))
+ // .then((data) => console.log(data))
+ .then((data)=> {
+ navigation.navigate('Repo', data['data']['viewer']['repositories'])
+ })
+ .catch(error => {
+ console.error('Error:', error)
+ navigation.navigate('Unfound', {errorMsg: error})
+ })
+
+ return (
+ <View style={styles.container}>
+ <ImageBackground source={require('C:/Coding/cs242-assignment3/GitView/assets/ice.jpg')} style={styles.image}>
+ <View style={styles.viewStyleVertical}>
+ <Text style={{ fontSize: 30 }}>Loading......</Text>
+ <Image style={{width: 200, height: 200}} source={require('C:/Coding/cs242-assignment3/GitView/assets/loading.png')} />
+ </View>
+ </ImageBackground>
+ </View>
+ );
+}
+
+/** Page loader **/
+function App() {
+ return (
+ <NavigationContainer>
+ <Stack.Navigator initialRouteName="Home">
+ <Stack.Screen name="Home" component={HomeScreen} options={{ title: 'Github User Info' }}/>
+ <Stack.Screen name="Profile" component={ProfileScreen} />
+ <Stack.Screen name="Repo" component={RepoScreen} options={{ title: 'Repositories' }}/>
+ <Stack.Screen name="LoadingProfile" component={LoadProfileScreen} />
+ <Stack.Screen name="LoadingRepo" component={LoadRepoScreen} />
+ <Stack.Screen name="Unfound" component={UnfoundScreen} options={{ title: 'Error' }}/>
+ </Stack.Navigator>
+ </NavigationContainer>
+ );
+}
+
+export default App;
diff --git a/src/Components/Profile.js b/src/Components/Profile.js
new file mode 100644
index 0000000000000000000000000000000000000000..a1d11dbebf0af5037e9e09b773cde8bd643f8d79
--- /dev/null
+++ b/src/Components/Profile.js
@@ -0,0 +1,53 @@
+import * as React from 'react';
+import { Pressable, View, Text, Image, StyleSheet, ImageBackground } from 'react-native';
+import { NavigationContainer } from '@react-navigation/native';
+import { createStackNavigator } from '@react-navigation/stack';
+
+const Stack = createStackNavigator();
+const styles = StyleSheet.create({
+ viewStyleVertical : { alignItems: 'center', justifyContent: 'center', margin: '10%' },
+ viewStyleHorizon : { flex: 1, flexDirection: 'row', justifyContent: 'space-between'},
+ pressableStyle : {flex: 1, flexDirection: 'row', justifyContent: 'space-between', backgroundColor:'lavender', paddingHorizontal:20,
+ paddingVertical:10, borderColor:'thistle', borderWidth:2, borderRadius:5, marginHorizontal: 10, marginTop: 10},
+ image: { flex: 1, resizeMode: "cover", justifyContent: "center"},
+ container : {flex: 1},
+ textBox : {flex: 1, marginTop: 20, backgroundColor:'white', borderColor:'black', borderWidth:2, borderRadius:5,
+ marginHorizontal: 10, paddingVertical:10, paddingHorizontal: 50, alignItems: 'flex-start'}
+});
+
+const Profile = (props) => {
+ return (
+ <View style={styles.container}>
+ <ImageBackground source={require('C:/Coding/cs242-assignment3/GitView/assets/ice.jpg')} style={styles.image}>
+ <View style={styles.viewStyleVertical}>
+ <View style={styles.viewStyleVertical}>
+ <Image style={{width: 100, height: 100}} source={iconUrl} />
+ </View>
+ <View style={styles.viewStyleHorizon}>
+ <Pressable style={styles.pressableStyle}>
+ <Text> Followers </Text>
+ </Pressable>
+ <Pressable style={styles.pressableStyle}>
+ <Text> Followings </Text>
+ </Pressable>
+ </View>
+ <View style={styles.viewStyleVertical} >
+ <Text style={styles.textBox}> {nameContent} </Text>
+ <Text style={styles.textBox}> {userNameContent} </Text>
+ <Text style={styles.textBox}> {bioContent} </Text>
+ <Text style={styles.textBox}> {websiteLink} </Text>
+ <Text style={styles.textBox}> {emailContent} </Text>
+ <Text style={styles.textBox}> {createDate} </Text>
+ </View>
+ <View style={styles.viewStyleVertical} >
+ <Pressable style={styles.pressableStyle} onPress={() => navigation.navigate('LoadingRepo')}>
+ <Text> {repoCount} </Text>
+ </Pressable>
+ </View>
+ </View>
+ </ImageBackground>
+ </View>
+ )
+}
+
+export default Profile;
\ No newline at end of file
diff --git a/src/Tests/UnitTest.js b/src/Tests/UnitTest.js
new file mode 100644
index 0000000000000000000000000000000000000000..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391
diff --git a/src/assets/adaptive-icon.png b/src/assets/adaptive-icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..03d6f6b6c6727954aec1d8206222769afd178d8d
Binary files /dev/null and b/src/assets/adaptive-icon.png differ
diff --git a/src/assets/default.png b/src/assets/default.png
new file mode 100644
index 0000000000000000000000000000000000000000..7284d396a4c589f887c952a760616fecfe734b5b
Binary files /dev/null and b/src/assets/default.png differ
diff --git a/src/assets/favicon.png b/src/assets/favicon.png
new file mode 100644
index 0000000000000000000000000000000000000000..e75f697b1801871ad8cd9309b05e8ffe8c6b6d01
Binary files /dev/null and b/src/assets/favicon.png differ
diff --git a/src/assets/ice.jpg b/src/assets/ice.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..ae36dd1e6687f10a20c552c269cf65e7c111c9c1
Binary files /dev/null and b/src/assets/ice.jpg differ
diff --git a/src/assets/icon.png b/src/assets/icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..a0b1526fc7b78680fd8d733dbc6113e1af695487
Binary files /dev/null and b/src/assets/icon.png differ
diff --git a/src/assets/loading.png b/src/assets/loading.png
new file mode 100644
index 0000000000000000000000000000000000000000..110b65163b7a69485ccfca66ea61e5ff35a02d73
Binary files /dev/null and b/src/assets/loading.png differ
diff --git a/src/assets/splash.png b/src/assets/splash.png
new file mode 100644
index 0000000000000000000000000000000000000000..6f47774733be408640c3db372cf91117354b0479
Binary files /dev/null and b/src/assets/splash.png differ
diff --git a/src/assets/warn.png b/src/assets/warn.png
new file mode 100644
index 0000000000000000000000000000000000000000..3c13a9627d5d9db54c3d4f72ef1244e7dba01f46
Binary files /dev/null and b/src/assets/warn.png differ