Commit 1532eb6c authored by Valeriy Panov's avatar Valeriy Panov
Browse files

#211 BUG: Descriptor selector broken

parent 7ebcff84
......@@ -8,7 +8,6 @@ import partner from './partner';
import login from './login';
import serverInfo from './serverInfo';
import datasets from './datasets';
import pagination from './pagination';
import filter from './filter';
import appMounted from './appMounted';
import vocabulary from './vocabulary';
......@@ -24,7 +23,6 @@ const rootReducer = combineReducers({
login,
serverInfo,
datasets,
pagination,
filter,
appMounted,
routing: routerReducer,
......
import * as update from 'immutability-helper';
import { RECEIVE_DESCRIPTOR_PAGE } from 'constants/descriptors';
import { Page } from 'model/common.model';
import { Descriptor } from 'model/descriptor.model';
const INITIAL_STATE = {
descriptorPage: null,
};
// FIXME Consider moving these to their respective reducers
function pagination(state: { descriptorPage: Page<Descriptor> } = INITIAL_STATE, action: { type: string, payload?: Page<any> } = { type: '' }) {
switch (action.type) {
case RECEIVE_DESCRIPTOR_PAGE: {
return update(state, { descriptorPage: { $set: action.payload } });
}
default:
return state;
}
}
export default pagination;
......@@ -4,20 +4,24 @@ import { withStyles } from 'material-ui/styles';
import * as classnames from 'classnames';
import Card, { CardHeader } from 'ui/common/Card';
import { Page } from 'model/common.model';
import { Page, Pagination } from 'model/common.model';
import { Descriptor, IDescriptorFilter } from 'model/descriptor.model';
import DescriptorCard from 'ui/catalog/descriptor/DescriptorCard';
import DescriptorSearchMenu from 'ui/catalog/descriptor/DescriptorSearchMenu';
import PaginationComponent from 'ui/common/pagination';
import DescriptorFilters from 'ui/catalog/descriptor/Filters';
import {log} from 'utilities/debug';
interface IDescriptorPickerProps extends React.ClassAttributes<any> {
classes: any;
loadDescriptors: (page?: number, results?: number, sortBy?: string, filter?: IDescriptorFilter) => void;
router: any;
loadDescriptors: (page?: number, results?: number, sortBy?: string, filter?: IDescriptorFilter, order?: string) => void;
matchingDescriptors: Page<Descriptor>; // results from loadDescriptors
onAddDescriptor: (descriptor: Descriptor) => void; // event handler
onRemoveDescriptor: (descriptor: Descriptor) => void; // event handler
currentDescriptors: Descriptor[]; // currently selected descriptors
pagination?: Pagination<IDescriptorFilter>;
listCrops: () => any;
}
const styles = (theme) => ({
......@@ -46,25 +50,45 @@ const styles = (theme) => ({
},
});
const sort = {
title: 'Name',
};
class DescriptorPicker extends React.Component<IDescriptorPickerProps, any> {
constructor(props: IDescriptorPickerProps, context: any) {
super(props, context);
public componentWillMount() {
const {matchingDescriptors, pagination, loadDescriptors, listCrops} = this.props;
if (! matchingDescriptors) {
log('Loading descriptors');
loadDescriptors(pagination.page, pagination.size, pagination.sort as string, pagination.filter, pagination.dir as string);
}
listCrops();
}
public componentWillReceiveProps(nextProps) {
const {loadDescriptors, pagination: oldPagination} = this.props;
const {pagination} = nextProps;
if (! oldPagination.equals(pagination)) {
log('Paginations differ!', pagination);
loadDescriptors(pagination.page, pagination.size, pagination.sort, pagination.filter, pagination.dir);
}
}
protected onPaginationChange = (page, results, sortBy, dir) => {
log('onPaginationChange', page, results, sortBy);
const {router, router: { location }} = this.props;
this.state = {
sortBy: '',
};
location.query.p = page;
location.query.l = results;
location.query.s = sortBy;
location.query.d = dir;
router.push(location);
}
private onPaginationChange = (page, results, sortBy) => {
const {loadDescriptors} = this.props;
protected applyFilters = (newFilters) => {
const {loadDescriptors, pagination} = this.props;
this.setState({sortBy});
loadDescriptors(page, results, sortBy);
log('Applying new filter', newFilters);
loadDescriptors(pagination.page, pagination.size, pagination.sort as string, newFilters, pagination.dir as string);
}
private onDescriptorSelected = (select) => (descriptor: Descriptor) => {
......@@ -79,7 +103,7 @@ class DescriptorPicker extends React.Component<IDescriptorPickerProps, any> {
public render() {
const {classes, loadDescriptors, matchingDescriptors} = this.props;
const {classes, pagination, matchingDescriptors} = this.props;
// handle empty current descriptors
let {currentDescriptors} = this.props;
......@@ -90,7 +114,7 @@ class DescriptorPicker extends React.Component<IDescriptorPickerProps, any> {
return (
<Grid container spacing={ 0 } className={ classes.container }>
<Grid item xs={ 12 } md={ 4 } lg={ 2 } className={ classes.leftPanel }>
<DescriptorSearchMenu loadDescriptors={ loadDescriptors } sortBy={ this.state.sortBy } filter={ {} }/>
<DescriptorFilters initialValues={ pagination.filter } onSubmit={ this.applyFilters } />
</Grid>
<Grid item xs={ 12 } md={ 4 } lg={ 5 } className={ classes.grayBackground }>
{ matchingDescriptors &&
......@@ -118,8 +142,7 @@ class DescriptorPicker extends React.Component<IDescriptorPickerProps, any> {
pageObj={ matchingDescriptors }
onChange={ this.onPaginationChange }
displayName="descriptors"
sortOptions={ sort }
sortBy={ this.state.sortBy }
sortOptions={ Descriptor.SORT_OPTIONS }
/>
}
</Grid>
......
......@@ -4,7 +4,7 @@ import {bindActionCreators} from 'redux';
import {connect} from 'react-redux';
import {updateDescriptorFilterModel} from 'actions/filter';
import DescriptorFilterForm from 'ui/catalog/descriptor/DescriptorFilterForm';
import DescriptorFilters from 'ui/catalog/descriptor/Filters';
import { IDescriptorFilter } from 'model/descriptor.model';
import {Page} from 'model/common.model';
import ExpandFiltersComponent from 'ui/common/filter/ExpandFiltersComponent';
......@@ -43,14 +43,14 @@ class DescriptorSearchMenu extends React.Component<IDescriptorSearchMenuProps, a
public render() {
return (
<ExpandFiltersComponent title="Search">
<DescriptorFilterForm onSubmit={ this.handleFilterFormSubmit }/>
<DescriptorFilters onSubmit={ this.handleFilterFormSubmit }/>
</ExpandFiltersComponent>
);
}
}
const mapStateToProps = (state, ownProps) => ({
paginationDescriptorPage: state.pagination.descriptorPage,
paginationDescriptorPage: state.descriptors.paged,
});
const mapDispatchToProps = (dispatch) => bindActionCreators({
......
......@@ -117,7 +117,7 @@ const mapStateToProps = (state, ownProps) => ({
pageSort: ownProps.location.query.s, // page sort
pageDir: ownProps.location.query.d, // page sort direction
datasets: state.datasets.paged,
descriptors: state.pagination.descriptorPage,
descriptors: state.descriptors.paged,
descriptorLists: state.descriptorList.paged,
});
......
......@@ -158,7 +158,7 @@ const mapStateToProps = (state, ownProps) => ({
pageSort: ownProps.location.query.s, // page sort
pageDir: ownProps.location.query.d, // page sort direction
datasets: state.datasets.paged,
descriptors: state.pagination.descriptorPage,
descriptors: state.descriptors.paged,
descriptorLists: state.descriptorList.paged,
});
......
......@@ -7,12 +7,17 @@ import {log} from 'utilities/debug';
import {loadDescriptors} from 'actions/descriptors';
import {addDescriptorsToDatasetRequest, removeDescriptorsFromDatasetRequest} from 'actions/dataset';
import {Descriptor} from 'model/descriptor.model';
import {Descriptor, IDescriptorFilter} from 'model/descriptor.model';
import DescriptorPicker from 'ui/catalog/descriptor/DescriptorPicker';
import {listCrops} from 'actions/crop';
import {Pagination} from 'model/common.model';
class Traits extends React.Component<any, any> {
protected static needs = [() => loadDescriptors(0, 10, null, {})];
protected static needs = [
({ location: { query: { p: pageCurrent, l: pageSize, s: pageSort, d: pageDir } } }) => loadDescriptors(pageCurrent, pageSize, pageSort, {}, pageDir),
listCrops,
];
public componentDidMount() {
const { appMounted, loadDescriptors } = this.props;
......@@ -36,7 +41,7 @@ class Traits extends React.Component<any, any> {
}
public render() {
const { matchingDescriptors, loadDescriptors, dataset} = this.props;
const { matchingDescriptors, loadDescriptors, dataset, router, listCrops, pagination} = this.props;
return (
<DescriptorPicker
......@@ -45,6 +50,9 @@ class Traits extends React.Component<any, any> {
currentDescriptors={ dataset.descriptors }
onAddDescriptor={ this.addDescriptor }
onRemoveDescriptor={ this.removeDescriptor }
router={ router }
pagination={ pagination }
listCrops={ listCrops }
classes={ {} }
/>
);
......@@ -53,13 +61,21 @@ class Traits extends React.Component<any, any> {
const mapStateToProps = (state, ownProps) => ({
dataset: state.datasets.currentDataset,
matchingDescriptors: state.pagination.descriptorPage,
matchingDescriptors: state.descriptors.paged,
pagination: new Pagination<IDescriptorFilter>({
page: +ownProps.location.query.p || 0, // current page
size: +ownProps.location.query.l || 20, // page size
sort: ownProps.location.query.s, // page sorts
dir: ownProps.location.query.d, // page sort directions
filter: state.descriptors.pagedQuery && state.descriptors.pagedQuery.filter || null,
}),
});
const mapDispatchToProps = (dispatch) => bindActionCreators({
loadDescriptors,
addDescriptorsToDatasetRequest,
removeDescriptorsFromDatasetRequest,
listCrops,
}, dispatch);
export default connect(
......
......@@ -14,7 +14,7 @@ import Loading from 'ui/common/Loading';
import PaginationComponent from 'ui/common/pagination';
import DescriptorCard from 'ui/catalog/descriptor/DescriptorCard';
import ContentHeader from 'ui/common/heading/ContentHeader';
import DescriptorFilters from './c/Filters';
import DescriptorFilters from 'ui/catalog/descriptor/Filters';
import PrettyFilters from 'ui/common/filter/PrettyFilters';
import Grid from 'material-ui/Grid';
......
......@@ -5,14 +5,14 @@ import {bindActionCreators} from 'redux';
import {log} from 'utilities/debug';
import {Page} from 'model/common.model';
import {Page, Pagination} from 'model/common.model';
import {loadMyPartners} from 'actions/partner';
import {Partner} from 'model/partner.model';
import {loadDescriptors} from 'actions/descriptors';
import {loadDescriptorList, saveDescriptorList, publishDescriptorList, addDescriptorToDescriptorList, removeDescriptorFromDescriptorList} from 'actions/descriptorList';
import {DescriptorList, Descriptor} from 'model/descriptor.model';
import {DescriptorList, Descriptor, IDescriptorFilter} from 'model/descriptor.model';
import DescriptorListForm from './c/DescriptorListForm';
import DescriptorPicker from 'ui/catalog/descriptor/DescriptorPicker';
......@@ -20,9 +20,11 @@ import ContentHeaderWithButton from 'ui/common/heading/ContentHeaderWithButton';
import Grid from 'material-ui/Grid';
import Paper from 'material-ui/Paper';
import {listCrops} from 'actions/crop';
interface IDescriptorListEditPageProps extends React.ClassAttributes<any> {
classes: any;
router: any;
uuid?: string;
descriptorList?: DescriptorList;
......@@ -37,6 +39,9 @@ interface IDescriptorListEditPageProps extends React.ClassAttributes<any> {
loadDescriptors: any;
matchingDescriptors: Page<Descriptor>;
pagination?: Pagination<IDescriptorFilter>;
listCrops: () => any;
}
// Page to edit a descriptor list
......@@ -44,7 +49,8 @@ class DescriptorListEditPage extends React.Component<IDescriptorListEditPageProp
protected static needs = [
({ params: { uuid } }) => loadDescriptorList(uuid),
loadDescriptors,
({ location: { query: { p: pageCurrent, l: pageSize, s: pageSort, d: pageDir } } }) => loadDescriptors(pageCurrent, pageSize, pageSort, {}, pageDir),
listCrops,
loadMyPartners,
];
......@@ -95,7 +101,7 @@ class DescriptorListEditPage extends React.Component<IDescriptorListEditPageProp
}
public render() {
const {myPartners, loadDescriptors, matchingDescriptors} = this.props;
const {myPartners, loadDescriptors, pagination, matchingDescriptors, listCrops, router} = this.props;
let { descriptorList } = this.props;
if (! descriptorList) {
......@@ -122,6 +128,9 @@ class DescriptorListEditPage extends React.Component<IDescriptorListEditPageProp
currentDescriptors={ descriptorList.descriptors }
onAddDescriptor={ this.addDescriptor }
onRemoveDescriptor={ this.removeDescriptor }
pagination={ pagination }
listCrops={ listCrops }
router={ router }
classes={ {} }
/>
</Grid>
......@@ -136,13 +145,25 @@ const mapStateToProps = (state, ownProps) => ({
uuid: ownProps.params.uuid,
descriptorList: state.descriptorList.currentDescriptorList,
myPartners: state.partner.myPartners,
matchingDescriptors: state.pagination.descriptorPage,
matchingDescriptors: state.descriptors.paged,
pagination: new Pagination<IDescriptorFilter>({
page: +ownProps.location.query.p || 0, // current page
size: +ownProps.location.query.l || 20, // page size
sort: ownProps.location.query.s, // page sorts
dir: ownProps.location.query.d, // page sort directions
filter: state.descriptors.pagedQuery && state.descriptors.pagedQuery.filter || null,
}),
});
const mapDispatchToProps = (dispatch) => bindActionCreators({
loadDescriptorList, saveDescriptorList, publishDescriptorList,
loadDescriptors, addDescriptorToDescriptorList, removeDescriptorFromDescriptorList,
loadDescriptorList,
saveDescriptorList,
publishDescriptorList,
loadDescriptors,
addDescriptorToDescriptorList,
removeDescriptorFromDescriptorList,
loadMyPartners,
listCrops,
}, dispatch);
export default connect(mapStateToProps, mapDispatchToProps)(DescriptorListEditPage);
Supports Markdown
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