Commit e954c116 authored by Matija Obreza's avatar Matija Obreza
Browse files

Merge branch '319-use-i18n-in-PrettyFilters' into 'master'

Resolve "Use i18n in PrettyFilters"

Closes #319

See merge request !256
parents d7392e75 b6a4704a
......@@ -141,5 +141,72 @@
"partner": "Data providers",
"dataset": "Datasets"
}
},
"f": {
"dataset": {
"_text": "Keywords",
"accessionIdentifier": {
"acceNumb": "Accession number",
"doi": "Accession DOI",
"genus": "Accession genus",
"instCode": "Accession institution code"
},
"description": "Description",
"descriptor": {
"_text": "Descriptor keywords",
"title": "Descriptor title"
},
"owner": {
"uuid": "Owner uuid",
"name": "Owner name",
"shortName": "Owner short name",
"wiewsCodes": "Owner WIEWS institute code"
},
"published": "Published",
"title": "Title"
},
"partner": {
"description": "Description",
"name": "Name",
"shortName": "Short name"
},
"descriptorList": {
"_text": "Keywords",
"description": "Description",
"owner": {
"uuid": "Partner"
},
"published": "Published",
"publisher": "Publisher",
"title": "Title"
},
"descriptor": {
"_text": "Keywords",
"category": "Category",
"columnName": "Column name",
"key": "Key crop descriptor",
"list": {
"uuid": "Descriptor list"
},
"owner": {
"uuid": "Partner"
},
"published": "Published",
"uom": "UOM"
},
"accessions": {
"crops": "Crop name",
"institute": {
"code" : "Institute code"
},
"orgCty": {
"iso3": "ORIGCTY"
},
"taxonomy": {
"genus": "Genus",
"species": "Species",
"subtaxa": "Subtaxon"
}
}
}
}
import * as React from 'react';
import { connect } from 'react-redux';
import {withStyles} from 'material-ui/styles';
import { translate } from 'react-i18next';
import Chip from 'material-ui/Chip';
import Paper from 'material-ui/Paper';
import * as flattenjs from 'flattenjs';
......@@ -27,6 +28,8 @@ interface IPrettyFiltersProps extends React.ClassAttributes<any> {
onSubmit: (newFilter) => any;
filterObj: object;
lookups: object;
prefix: string;
t: any;
}
const styles = (theme) => ({
......@@ -44,10 +47,6 @@ const styles = (theme) => ({
// Following keywords are skipped for showing
const keywordsToSkip = ['ge', 'gt', 'le', 'lt', 'eq', 'contains', 'sw'];
function capitalizeFirstLetter(value: string) {
return value.charAt(0).toUpperCase() + value.slice(1);
}
/**
* Remove value by path from filterObj and return updated filterObj.
* @param filterObj - IPrettyFiltersProps.filterObj.
......@@ -80,9 +79,11 @@ function handleFilterObj(filterObj, path) {
* @param path - path to filterObj value ie crop[0]
* @param value - filterObj value ie BN27.
* @param lookups - IPrettyFiltersProps.filterObj.
* @param prefix - for determination which page filter localize
* @param t - i18n translation function
* @return IPrettyFiltersProps.filterObj.
*/
function getLabelName(path, value, lookups) {
function getLabelName(path, value, lookups, prefix, t) {
const lastKey = path.replace(/\[(.+?)\]/g, '').split('.').pop();
let name = value;
......@@ -98,18 +99,17 @@ function getLabelName(path, value, lookups) {
// skip for showing keywords such as 'contains', 'eq'...
.filter((e) => keywordsToSkip.indexOf(e) === -1)
// join
.join(' ');
.join('.');
const capitalizedPrettyPath = capitalizeFirstLetter(prettyPath);
const translatedPrettyPath = t(`f.${prefix}.${prettyPath}`);
return `${capitalizedPrettyPath}: ${name}`;
return `${translatedPrettyPath}: ${name}`;
}
class PrettyFilters extends React.Component<IPrettyFiltersProps, any> {
constructor(props: IPrettyFiltersProps, context: any) {
super(props, context);
this.state = {
chipData: flattenjs.convert(props.filterObj),
};
......@@ -129,7 +129,7 @@ class PrettyFilters extends React.Component<IPrettyFiltersProps, any> {
}
public render() {
const {classes, lookups} = this.props;
const {classes, lookups, prefix, t } = this.props;
const {chipData} = this.state;
const dataArr = Object.getOwnPropertyNames(chipData);
......@@ -139,7 +139,7 @@ class PrettyFilters extends React.Component<IPrettyFiltersProps, any> {
return (
<Chip
key={ key }
label={ getLabelName(key, chipData[key], lookups) }
label={ getLabelName(key, chipData[key], lookups, prefix, t) }
onDelete={ this.handleDelete(key) }
className={ classes.chip }
/>
......@@ -163,4 +163,4 @@ const mapStateToProps = (state, ownProps) => ({
},
});
export default connect(mapStateToProps)(styled);
export default translate()(connect(mapStateToProps)(styled));
......@@ -129,6 +129,7 @@ class BrowsePage extends React.Component<IDatasetsProps, any> {
</Grid>
<Grid item xs={ 12 }>
<PrettyFilters
prefix="dataset"
filterObj={ pagination.filter }
onSubmit={ this.applyFilters }
/>
......
......@@ -129,6 +129,7 @@ class BrowsePage extends React.Component<IDescriptorListsPageProps & any, any> {
</Grid>
<Grid item xs={ 12 }>
<PrettyFilters
prefix="descriptor"
filterObj={ pagination.filter }
onSubmit={ this.applyFilters }
/>
......
......@@ -135,6 +135,7 @@ class BrowsePage extends React.Component<IBrowsePageProps, any> {
</Grid>
<Grid item xs={ 12 }>
<PrettyFilters
prefix="descriptorList"
filterObj={ pagination.filter }
onSubmit={ this.applyFilters }
/>
......
......@@ -264,6 +264,7 @@ class BrowsePage extends React.Component<IBrowsePageProps, any> {
</Grid>
<Grid item xs={ 12 }>
<PrettyFilters
prefix="accessions"
filterObj={ filter }
onSubmit={ this.applyFilters }
/>
......
......@@ -135,6 +135,7 @@ class PartnerListPage extends React.Component<IBrowsePageProps, any> {
</Grid>
<Grid item xs={ 12 }>
<PrettyFilters
prefix="partner"
filterObj={ pagination.filter }
onSubmit={ this.applyFilters }
/>
......
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