Skip to content
Snippets Groups Projects
Commit 6ce28402 authored by zshan2's avatar zshan2
Browse files

assignment3.0 ver3: all snapshot tests deployed, going for navigation test

parent 044cbe07
No related branches found
No related tags found
1 merge request!2Assignment 3.1
Hide whitespace changes
Inline Side-by-side
src/App.js
+ 28
− 243
View file @ 6ce28402
...@@ -7,7 +7,14 @@ import Profile from './Components/Profile' ...@@ -7,7 +7,14 @@ import Profile from './Components/Profile'
import Repo from './Components/Repo' import Repo from './Components/Repo'
import Unfound from './Components/Unfound' import Unfound from './Components/Unfound'
import Users from './Components/Users' import Users from './Components/Users'
import DataGenerator from './Components/DataGenerator' import LoadFollowingScreenModule from './Components/LoadFollowingScreenModule'
import LoadFollowersScreenModule from './Components/LoadFollowersScreenModule'
import LoadProfileScreenModule from './Components/LoadProfileScreenModule'
import LoadRepoScreenModule from './Components/LoadRepoScreenModule'
import Follower from './Components/Followers'
import Following from './Components/Following'
const Stack = createStackNavigator(); const Stack = createStackNavigator();
const styles = StyleSheet.create({ const styles = StyleSheet.create({
...@@ -35,9 +42,9 @@ function generateData(route, navigation) { ...@@ -35,9 +42,9 @@ function generateData(route, navigation) {
dataFile['repoCount'] = 'Repository count: ' + repositories['nodes'].length dataFile['repoCount'] = 'Repository count: ' + repositories['nodes'].length
var iconUrl var iconUrl
if (avatarUrl != null) { if (avatarUrl != null) {
iconUrl = { uri: avatarUrl } iconUrl = avatarUrl
} else { } else {
iconUrl = require('C:/Coding/cs242-assignment3/GitView/assets/default.png') iconUrl = "https://png.pngtree.com/element_our/20200610/ourlarge/pngtree-cat-default-avatar-image_2246581.jpg"
} }
dataFile['iconUrl'] = iconUrl dataFile['iconUrl'] = iconUrl
return dataFile return dataFile
...@@ -102,86 +109,13 @@ function RepoScreen({ route, navigation }) { ...@@ -102,86 +109,13 @@ function RepoScreen({ route, navigation }) {
/** Follower page **/ /** Follower page **/
function FollowerScreen({ route, navigation }) { function FollowerScreen({ route, navigation }) {
const user = route.params const user = route.params
const nodes = user['followers']['nodes'] return Follower(user, navigation)
const login = user['login']
let cards = []
if (nodes.length === 0) {
cards.push(
<Pressable style={styles.textBox} key={'Nobody'}>
<Text style={{ fontSize: 30 }}>
Oops! Nobody is in this list!
</Text>
</Pressable>
)
} else {
for (let i = 0; i < nodes.length; i++) {
var name = 'Name: \n' + nodes[i]['name'] + '\n'
var userName = 'Github Username: \n' + nodes[i]['login'] + '\n'
var key = 'user#' + i
var avatarUrl = nodes[i]['avatarUrl']
cards.push(
<Pressable style={styles.textBox} key={key} onPress={()=>navigation.push('LoadingProfile', {login: nodes[i]['login']})}>
<View style={styles.viewStyleVertical}>
<Image style={{width:90, height:90}} source={{uri: avatarUrl}}/>
</View>
<View style={styles.viewStyleVertical}>
<Text> {name} </Text>
<Text> {userName} </Text>
</View>
</Pressable>
)
}
}
const dataFile = {}
dataFile['cards'] = cards
dataFile['navi'] = navigation
dataFile['login'] = login
console.log(login)
return (
<Users data={dataFile}/>
);
} }
/** Following page **/ /** Following page **/
function FollowingScreen({ route, navigation }) { function FollowingScreen({ route, navigation }) {
const user = route.params const user = route.params
const nodes = user['following']['nodes'] return Following(user, navigation)
const login = user['login']
let cards = []
if (nodes.length === 0) {
cards.push(
<Pressable style={styles.textBox} key={'Nobody'}>
<Text style={{ fontSize: 30 }}>
Oops! Nobody is in this list!
</Text>
</Pressable>
)
} else {
for (let i = 0; i < nodes.length; i++) {
var name = 'Name: \n' + nodes[i]['name'] + '\n'
var userName = 'Github Username: \n' + nodes[i]['login'] + '\n'
var key = 'user#' + i
var avatarUrl = nodes[i]['avatarUrl']
cards.push(
<Pressable style={styles.textBox} key={key} onPress={()=>navigation.push('LoadingProfile', {login: nodes[i]['login']})}>
<View style={styles.viewStyleVertical}>
<Image style={{width:90, height:90}} source={{uri: avatarUrl}}/>
</View>
<View style={styles.viewStyleVertical}>
<Text> {name} </Text>
<Text> {userName} </Text>
</View>
</Pressable>
)
}
}
const dataFile = {}
dataFile['cards'] = cards
dataFile['navi'] = navigation
dataFile['login'] = login
return (
<Users data={dataFile}/>
);
} }
/** Unfound page **/ /** Unfound page **/
...@@ -201,48 +135,9 @@ function UnfoundScreen({ route, navigation }) { ...@@ -201,48 +135,9 @@ function UnfoundScreen({ route, navigation }) {
function LoadProfileScreen({route, navigation}) { function LoadProfileScreen({route, navigation}) {
const dataJson = require('C:/Coding/cs242-assignment3/env.json') const dataJson = require('C:/Coding/cs242-assignment3/env.json')
const {login} = route.params const {login} = route.params
fetch(dataJson['endPoint'], { const endPoint = dataJson['endPoint']
method: 'POST', const token = dataJson['token']
headers: { LoadProfileScreenModule(login, endPoint, token, navigation)
"Content-Type": "application/json",
"Authorization": dataJson['token']
},
body: JSON.stringify({
query: `
query {
user(login:"`+ login + `") {
name
login
avatarUrl
bio
createdAt
email
websiteUrl
repositories(last:100, privacy:PUBLIC){
nodes{
name
}
}
}
}
`
})
})
.then(res => res.json())
.then((data)=> {
if (data['data']['user'] === null) {
/** User not found! **/
navigation.push('Unfound', {errorMsg: 'Wrong!'})
console.log('Error, cannot find the github user by the login username:' + login + ', maybe this is an organization!')
} else {
navigation.push('Profile', data['data']['user'])
}
})
.catch(error => {
console.error('Error:', error)
navigation.push('Unfound', {errorMsg: error})
})
return ( return (
<Loading/> <Loading/>
); );
...@@ -250,48 +145,11 @@ function LoadProfileScreen({route, navigation}) { ...@@ -250,48 +145,11 @@ function LoadProfileScreen({route, navigation}) {
/** Loading Repo page **/ /** Loading Repo page **/
function LoadRepoScreen({route, navigation}) { function LoadRepoScreen({route, navigation}) {
const dataJson = require('C:/Coding/cs242-assignment3/env.json')
const {login} = route.params const {login} = route.params
const dataJson = require('C:/Coding/cs242-assignment3/env.json'); const endPoint = dataJson['endPoint']
fetch(dataJson['endPoint'], { const token = dataJson['token']
method: 'POST', LoadRepoScreenModule(login, endPoint, token, navigation)
headers: {
"Content-Type": "application/json",
"Authorization": dataJson['token']
},
body: JSON.stringify({
query: `
query {
user(login:"`+login+`"){
login
repositories(last:100, privacy:PUBLIC){
nodes{
name
owner{
login
}
description
}
}
}
}
`
})
})
.then(res => res.json())
.then((data)=> {
if (data['data']['user'] === null) {
/** User not found! **/
navigation.push('Unfound', {errorMsg: 'Wrong!'})
console.log('Error, cannot find the github user by the login username:' + login + ', maybe this is an organization!')
} else {
navigation.push('Repo', data['data']['user'])
}
})
.catch(error => {
console.error('Error:', error)
navigation.push('Unfound', {errorMsg: error})
})
return ( return (
<Loading/> <Loading/>
); );
...@@ -301,94 +159,21 @@ function LoadRepoScreen({route, navigation}) { ...@@ -301,94 +159,21 @@ function LoadRepoScreen({route, navigation}) {
function LoadFollowersScreen({route, navigation}) { function LoadFollowersScreen({route, navigation}) {
const {login} = route.params const {login} = route.params
const dataJson = require('C:/Coding/cs242-assignment3/env.json'); const dataJson = require('C:/Coding/cs242-assignment3/env.json');
fetch(dataJson['endPoint'], { const endPoint = dataJson['endPoint']
method: 'POST', const token = dataJson['token']
headers: { /** Call function in module part to fetch data and send to view part */
"Content-Type": "application/json", return LoadFollowersScreenModule(login, endPoint, token, navigation)
"Authorization": dataJson['token']
},
body: JSON.stringify({
query: `
query {
user(login:"`+ login +`"){
login
followers(last:100) {
nodes {
name
login
avatarUrl
}
}
}
}
`
})
})
.then(res => res.json())
.then((data)=> {
if (data['data']['user'] === null) {
/** User not found! **/
navigation.push('Unfound', {errorMsg: 'Wrong!'})
console.log('Error, cannot find the github user by the login username:' + login + ', maybe this is an organization!')
} else {
navigation.push('Followers', data['data']['user'])
}
})
.catch(error => {
console.error('Error:', error)
navigation.push('Unfound', {errorMsg: error})
})
return (
<Loading/>
);
} }
/** Loading Followings page **/ /** Loading Followings page **/
function LoadFollowingScreen({route, navigation}) { function LoadFollowingScreen({route, navigation}) {
const {login} = route.params const {login} = route.params
const dataJson = require('C:/Coding/cs242-assignment3/env.json'); const dataJson = require('C:/Coding/cs242-assignment3/env.json');
fetch(dataJson['endPoint'], { const endPoint = dataJson['endPoint']
method: 'POST', const token = dataJson['token']
headers: { /** Call function in module part to fetch data and send to view part */
"Content-Type": "application/json", return LoadFollowingScreenModule(login, endPoint, token, navigation)
"Authorization": dataJson['token']
},
body: JSON.stringify({
query: `
query {
user(login:"` + login + `"){
login
following(last:100) {
nodes {
name
login
avatarUrl
}
}
}
}
`
})
})
.then(res => res.json())
.then((data)=> {
if (data['data']['user'] === null) {
/** User not found! **/
navigation.push('Unfound', {errorMsg: 'Wrong!'})
console.log('Error, cannot find the github user by the login username:' + login + ', maybe this is an organization!')
} else {
navigation.push('Following', data['data']['user'])
}
})
.catch(error => {
console.error('Error:', error)
navigation.push('Unfound', {errorMsg: error})
})
return (
<Loading/>
);
} }
......
src/Components/Loading.js
+ 1
− 1
View file @ 6ce28402
import * as React from 'react'; import * as React from 'react';
import { Pressable, View, Text, Image, StyleSheet, ImageBackground } from 'react-native'; import { View, Text, Image, StyleSheet, ImageBackground } from 'react-native';
const styles = StyleSheet.create({ const styles = StyleSheet.create({
viewStyleVertical : { alignItems: 'center', justifyContent: 'center', margin: '10%' }, viewStyleVertical : { alignItems: 'center', justifyContent: 'center', margin: '10%' },
......
src/Components/Profile.js
+ 1
− 3
View file @ 6ce28402
import * as React from 'react'; import * as React from 'react';
import { Pressable, View, Text, Image, StyleSheet, ImageBackground } from 'react-native'; import { Pressable, View, Text, Image, StyleSheet, ImageBackground } from 'react-native';
import { createStackNavigator } from '@react-navigation/stack';
const Stack = createStackNavigator();
const styles = StyleSheet.create({ const styles = StyleSheet.create({
viewStyleVertical : { alignItems: 'center', justifyContent: 'center', margin: '10%' }, viewStyleVertical : { alignItems: 'center', justifyContent: 'center', margin: '10%' },
viewStyleHorizon : { flex: 1, flexDirection: 'row', justifyContent: 'space-between'}, viewStyleHorizon : { flex: 1, flexDirection: 'row', justifyContent: 'space-between'},
...@@ -31,7 +29,7 @@ const Profile = (props) => { ...@@ -31,7 +29,7 @@ const Profile = (props) => {
<ImageBackground source={{uri: "https://www.fonewalls.com/wp-content/uploads/2020/04/Ice-Phone-Wallpaper.jpg"}} style={styles.image}> <ImageBackground source={{uri: "https://www.fonewalls.com/wp-content/uploads/2020/04/Ice-Phone-Wallpaper.jpg"}} style={styles.image}>
<View style={styles.viewStyleVertical}> <View style={styles.viewStyleVertical}>
<View style={styles.viewStyleVertical}> <View style={styles.viewStyleVertical}>
<Image style={{width: 100, height: 100}} source={{uri: iconUrl}} /> <Image style={{width: 120, height: 120}} source={{uri: iconUrl}}/>
</View> </View>
<View style={styles.viewStyleHorizon}> <View style={styles.viewStyleHorizon}>
<Pressable style={styles.pressableStyle} onPress={() => navigation.push('LoadingFollowers', {login: login})}> <Pressable style={styles.pressableStyle} onPress={() => navigation.push('LoadingFollowers', {login: login})}>
......
src/Components/Repo.js
+ 1
− 3
View file @ 6ce28402
import * as React from 'react'; import * as React from 'react';
import { Pressable, View, Text, Image, StyleSheet, ImageBackground } from 'react-native'; import { Pressable, View, Text, Image, StyleSheet, ImageBackground } from 'react-native';
import { createStackNavigator } from '@react-navigation/stack';
const Stack = createStackNavigator();
const styles = StyleSheet.create({ const styles = StyleSheet.create({
viewStyleVertical : { alignItems: 'center', justifyContent: 'center', margin: '10%' }, viewStyleVertical : { alignItems: 'center', justifyContent: 'center', margin: '10%' },
viewStyleHorizon : { flex: 1, flexDirection: 'row', justifyContent: 'space-between'}, viewStyleHorizon : { flex: 1, flexDirection: 'row', justifyContent: 'space-between'},
...@@ -18,7 +17,6 @@ const Repo = (props) => { ...@@ -18,7 +17,6 @@ const Repo = (props) => {
const file = props.data const file = props.data
const cards = file['cards'] const cards = file['cards']
const navigation = file['navi'] const navigation = file['navi']
const login = file['login']
return ( return (
<View style={styles.container}> <View style={styles.container}>
<ImageBackground source={{uri: "https://www.fonewalls.com/wp-content/uploads/2020/04/Ice-Phone-Wallpaper.jpg"}} style={styles.image}> <ImageBackground source={{uri: "https://www.fonewalls.com/wp-content/uploads/2020/04/Ice-Phone-Wallpaper.jpg"}} style={styles.image}>
......
src/Components/Unfound.js
+ 0
− 2
View file @ 6ce28402
import * as React from 'react'; import * as React from 'react';
import { Pressable, View, Text, Image, StyleSheet, ImageBackground } from 'react-native'; import { Pressable, View, Text, Image, StyleSheet, ImageBackground } from 'react-native';
import { createStackNavigator } from '@react-navigation/stack';
const Stack = createStackNavigator();
const styles = StyleSheet.create({ const styles = StyleSheet.create({
viewStyleVertical : { alignItems: 'center', justifyContent: 'center', margin: '10%' }, viewStyleVertical : { alignItems: 'center', justifyContent: 'center', margin: '10%' },
viewStyleHorizon : { flex: 1, flexDirection: 'row', justifyContent: 'space-between'}, viewStyleHorizon : { flex: 1, flexDirection: 'row', justifyContent: 'space-between'},
......
src/package.json
+ 5
− 2
View file @ 6ce28402
...@@ -9,9 +9,10 @@ ...@@ -9,9 +9,10 @@
"test": "jest" "test": "jest"
}, },
"jest": { "jest": {
"preset": "react-native", "preset": "jest-expo",
"automock": false,
"setupFiles": [ "setupFiles": [
"./node_modules/react-native-gesture-handler/jestSetup.js" "./setupJest.js"
], ],
"moduleNameMapper": { "moduleNameMapper": {
"\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/__mocks__/fileMock.js", "\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/__mocks__/fileMock.js",
...@@ -24,6 +25,8 @@ ...@@ -24,6 +25,8 @@
"@react-navigation/stack": "^5.14.3", "@react-navigation/stack": "^5.14.3",
"expo": "~40.0.0", "expo": "~40.0.0",
"expo-status-bar": "~1.0.3", "expo-status-bar": "~1.0.3",
"jest-expo": "^40.0.2",
"jest-fetch-mock": "^3.0.3",
"react": "16.13.1", "react": "16.13.1",
"react-dom": "16.13.1", "react-dom": "16.13.1",
"react-native": "https://github.com/expo/react-native/archive/sdk-40.0.1.tar.gz", "react-native": "https://github.com/expo/react-native/archive/sdk-40.0.1.tar.gz",
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment