maverick/flex-template-web
1
0
Fork 0
mirror of https://github.com/kingomarnajjar/flex-template-web.git synced 2026-07-28 20:53:24 +10:00
Code Issues Projects Releases Packages Wiki Activity Actions

Use SDK duck for listing search

Browse source
This commit is contained in:
Kimmo Puputti 2017-02-23 13:41:46 +02:00
parent 081e56c99f
commit 1278f24b1a
2 changed files with 21 additions and 27 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

44
src/containers/SearchPage/SearchPage.js
View file

@ -1,9 +1,8 @@
import React, { Component, PropTypes } from 'react';
import classNames from 'classnames';
import { connect } from 'react-redux';
import { addFlashNotification } from '../../ducks/FlashNotification.duck';
import { addFilter, callFetchListings, loadListings } from './SearchPage.duck';
import css from './SearchPage.css';
import { types } from 'sharetribe-sdk';
import { searchListings, getListingsById } from '../../ducks/sdk.duck';
import {
FilterPanel,
ListingCard,
@ -13,13 +12,13 @@ import {
SearchResultsPanel,
} from '../../components';
import css from './SearchPage.css';
const { LatLng } = types;
export class SearchPageComponent extends Component {
componentDidMount() {
// TODO: This should be moved to Router
const { initialListingsLoaded } = this.props;
if (!initialListingsLoaded) {
this.props.onLoadListings();
}
SearchPageComponent.loadData(this.props.dispatch);
}
render() {
@ -37,12 +36,12 @@ export class SearchPageComponent extends Component {
</div>
<div className={listingsClassName}>
<SearchResultsPanel>
{listings.map(l => <ListingCard key={l.id} {...l} />)}
{listings.map(l => <ListingCard key={l.id.uuid} listing={l} />)}
</SearchResultsPanel>
</div>
<div className={mapClassName}>
<MapPanel>
{listings.map(l => <ListingCardSmall key={l.id} {...l} />)}
{listings.map(l => <ListingCardSmall key={l.id.uuid} listing={l} />)}
</MapPanel>
</div>
</div>
@ -51,30 +50,23 @@ export class SearchPageComponent extends Component {
}
}
SearchPageComponent.loadData = callFetchListings;
SearchPageComponent.loadData = dispatch => {
dispatch(searchListings({ origin: new LatLng(40, 70), include: ['author'] }));
};
SearchPageComponent.defaultProps = { initialListingsLoaded: false, listings: [], tab: 'listings' };
const { array, bool, func, oneOf } = PropTypes;
const { array, func, oneOf } = PropTypes;
SearchPageComponent.propTypes = {
onLoadListings: func.isRequired,
initialListingsLoaded: bool,
listings: array,
tab: oneOf(['filters', 'listings', 'map']).isRequired,
dispatch: func.isRequired,
};
const mapStateToProps = state => ({
initialListingsLoaded: state.SearchPage.initialListingsLoaded,
listings: state.SearchPage.listings,
});
const mapDispatchToProps = function mapDispatchToProps(dispatch) {
return {
onAddNotice: msg => dispatch(addFlashNotification('notice', msg)),
onAddFilter: (k, v) => dispatch(addFilter(k, v)),
onLoadListings: () => dispatch(loadListings.request()),
};
const mapStateToProps = state => {
const listingIds = state.data.searchPageResults;
return { listings: getListingsById(state.data, listingIds) };
};
export default connect(mapStateToProps, mapDispatchToProps)(SearchPageComponent);
export default connect(mapStateToProps)(SearchPageComponent);

4
src/containers/SearchPage/SearchPage.test.js
View file

@ -17,7 +17,9 @@ const { LatLng } = types;
describe('SearchPageComponent', () => {
it('matches snapshot', () => {
const tree = renderShallow(<SearchPageComponent onLoadListings={v => v} />);
const tree = renderShallow(
<SearchPageComponent onLoadListings={v => v} dispatch={() => null} />,
);
expect(tree).toMatchSnapshot();
});
});