import R from "@res/R";
import PropTypes from "prop-types";
import React from "react";
import { ActivityIndicator, FlatList, View } from "react-native";

export default class FlatListSupport extends React.Component {
    static propTypes = {
        datasource: PropTypes.any,
        renderItem: PropTypes.func
    };

    viewModel = new FlatListSupportViewModel();

    mCallback = new CallBackLoadMore((result, error, nextRequest) => {
        this.viewModel.mNextRequest = nextRequest;
        if (nextRequest) {
            this.viewModel.isLoadMore = true;
        } else {
            this.viewModel.isLoadMore = false;
        }
        this.viewModel.datas.push.apply(this.viewModel.datas, result);
        this.setState({});
    });

    componentDidMount() {
        this.props.datasource.onInitPage(this.mCallback);
    }

    componentWillReceiveProps() {
        this.viewModel.datas = [];
        this.mNextRequest = null;
        this.props.datasource.onInitPage(this.mCallback);
    }

    getFootter = () => {
        if (this.viewModel.isLoadMore) {
            return <View>
                <ActivityIndicator />
            </View>

        } else {
            return <View/>

        }
    }

    render() {
        if (this.viewModel.datas.length == 0) {
            return (
                <View style={{ flex: 1, justifyContent: "center" }}>
                    <ActivityIndicator size="small" color={R.colors.primary} />
                </View>
            );
        } else {
            return (
                <FlatList
                    data={this.viewModel.datas}
                    extraData={this.state}
                    onEndReached={() => {
                        if (this.viewModel.isLoadMore) {
                            this.props.datasource.onNext(
                                this.mCallback,
                                this.mNextRequest
                            );
                        }
                    }}
                    ListFooterComponent={
                        this.getFootter()
                    }
                    renderItem={this.props.renderItem}
                />
            );
        }
    }
}

class CallBackLoadMore {
    constructor(callback) {
        this.callback = callback;
    }
}

class FlatListSupportViewModel {
    mNextRequest = null;
    datas = [];
    isLoadMore = false;
}