86 lines
2.0 KiB
JavaScript
86 lines
2.0 KiB
JavaScript
import { List } from 'immutable';
|
|
import React, { Component } from 'react';
|
|
import PropTypes from 'prop-types';
|
|
|
|
import {
|
|
FlatList,
|
|
Text,
|
|
View,
|
|
} from 'react-native';
|
|
|
|
import { SORT_MODES, AUCTION_VIEW_MODES } from '../constants/constants.js';
|
|
|
|
import FilterBar from '../components/Auction/FilterBar.js';
|
|
import AuctionListItem from '../containers/Auction/AuctionListItem.js';
|
|
|
|
//import styles from './Marketplace.styles.js';
|
|
|
|
export default class Marketplace extends Component {
|
|
static get propTypes() {
|
|
return {
|
|
changeFilter: PropTypes.func,
|
|
changeViewMode: PropTypes.func.isRequired,
|
|
fetchItems: PropTypes.func.isRequired,
|
|
fetchStatus: PropTypes.func.isRequired,
|
|
items: PropTypes.oneOfType([
|
|
PropTypes.array,
|
|
PropTypes.instanceOf(List),
|
|
]),
|
|
};
|
|
}
|
|
|
|
static get defaultProps() {
|
|
return {
|
|
changeFilter: () => { console.log('Change Filter Default Prop', arguments); },
|
|
items: [],
|
|
};
|
|
}
|
|
|
|
constructor(props) {
|
|
super(props);
|
|
|
|
this.changeFilter = this.changeFilter.bind(this);
|
|
this.changeViewMode = this.changeViewMode.bind(this);
|
|
|
|
this.state = {
|
|
sort: SORT_MODES.TITLE_ASC,
|
|
view: AUCTION_VIEW_MODES.ALL,
|
|
};
|
|
}
|
|
|
|
componentDidMount() {
|
|
this.props.fetchStatus();
|
|
this.props.fetchItems();
|
|
}
|
|
|
|
changeFilter(filter) {
|
|
this.props.changeFilter('auction', filter);
|
|
}
|
|
|
|
_keyExtractor = (item, index) => `${item._id}_${index}`;
|
|
|
|
_renderAuctionListItem = ({ item }) => <AuctionListItem item={item} />;
|
|
|
|
render() {
|
|
const { items } = this.props;
|
|
const { sort, view } = this.state;
|
|
|
|
return (
|
|
<View style={styles.container}>
|
|
<FilterBar
|
|
changeFilterer={this.changeFilter}
|
|
/>
|
|
{items.size > 0 && (
|
|
<FlatList
|
|
data={items}
|
|
keyExtractor={this._keyExtractor}
|
|
renderItem={this._renderAuctionListItem}
|
|
contentContainerStyle={styles.itemListContentContainer}
|
|
style={styles.itemList}
|
|
/>
|
|
)}
|
|
</View>
|
|
);
|
|
}
|
|
}
|