import React, {Component} from 'react';
import {
StyleSheet,
Text,
View,
} from 'react-native';
import DataRepository from '../expand/dao/DataRepository';
import ScrollableTabView, {DefaultTabBar,} from 'react-native-scrollable-tab-view';
const URL = 'https://api.github.com/search/repositories?q=';
const QUERY_STR = '&sort=stars';
export default class PopularPage extends Component {
constructor(props) {
super(props);
}
render() {
return (
<View>
<ScrollableTabView
renderTabBar={() => <DefaultTabBar/>}>
<PopularTab tabLabel='java'>JAVA</PopularTab>
<PopularTab tabLabel='ios'>IOS</PopularTab>
<PopularTab tabLabel='android'>Android</PopularTab>
<PopularTab tabLabel='javascript'>JavaScript</PopularTab>
</ScrollableTabView>
</View>
)
}
}
class PopularTab extends Component {
constructor(props) {
super(props);
this.dataRepository = new DataRepository();
this.state = {
result: '',
}
}
componentDidMount() {
this.onLoad();
}
onLoad() {
let url = URL + this.props.tabLabel + QUERY_STR;
this.dataRepository.fetchNetRepository(url)
.then((result) => {
this.setState({
result: JSON.stringify(result)
})
})
.catch((error) => {
this.setState({
result: JSON.stringify(error)
})
})
}
render() {
return (
<View>
<Text style={{height: 600}}>{this.state.result}</Text>
</View>
)
}
}