import SearchFilter from '../filters/SearchFilter';
import { translate } from '../../../helpers/l10n';
-export default class PageSidebar extends React.Component {
+export default class PageSidebar extends React.PureComponent {
static propTypes = {
query: React.PropTypes.object.isRequired,
isFavorite: React.PropTypes.bool.isRequired,
<h3>{translate('filters')}</h3>
<SearchFilter
- query={this.props.query}
+ query={this.props.query.search}
isFavorite={this.props.isFavorite}
organization={this.props.organization}/>
</div>
import Organization from '../../../components/shared/Organization';
import { translate, translateWithParameters } from '../../../helpers/l10n';
-export default class ProjectCard extends React.Component {
+export default class ProjectCard extends React.PureComponent {
props: {
measures: { [string]: string },
organization?: {},
import ProjectCard from './ProjectCard';
import { getComponent, getComponentMeasures } from '../../../store/rootReducer';
-export default connect(
- (state, ownProps) => ({
- project: getComponent(state, ownProps.projectKey),
- measures: getComponentMeasures(state, ownProps.projectKey)
- })
-)(ProjectCard);
+export default connect((state, ownProps) => ({
+ project: getComponent(state, ownProps.projectKey),
+ measures: getComponentMeasures(state, ownProps.projectKey)
+}))(ProjectCard);
import SizeRating from '../../../components/ui/SizeRating';
import { translate } from '../../../helpers/l10n';
-export default class ProjectCardMeasures extends React.Component {
+export default class ProjectCardMeasures extends React.PureComponent {
static propTypes = {
measures: React.PropTypes.object
};
import Level from '../../../components/ui/Level';
import { translate } from '../../../helpers/l10n';
-export default class ProjectCardQualityGate extends React.Component {
+export default class ProjectCardQualityGate extends React.PureComponent {
static propTypes = {
status: React.PropTypes.string
};
import NoFavoriteProjects from './NoFavoriteProjects';
import EmptyInstance from './EmptyInstance';
-export default class ProjectsList extends React.Component {
+export default class ProjectsList extends React.PureComponent {
static propTypes = {
projects: React.PropTypes.arrayOf(React.PropTypes.string),
isFavorite: React.PropTypes.bool.isRequired,
import CoverageRating from '../../../components/ui/CoverageRating';
import { getCoverageRatingLabel, getCoverageRatingAverageValue } from '../../../helpers/ratings';
-export default class CoverageFilter extends React.Component {
+export default class CoverageFilter extends React.PureComponent {
static propTypes = {
query: React.PropTypes.object.isRequired,
isFavorite: React.PropTypes.bool,
organization: React.PropTypes.object
- }
+ };
property = 'coverage';
renderOption = (option, selected) => {
return (
- <span>
- <CoverageRating value={getCoverageRatingAverageValue(option)} size="small" muted={!selected}/>
- <span className="spacer-left">
- {getCoverageRatingLabel(option)}
- </span>
+ <span>
+ <CoverageRating
+ value={getCoverageRatingAverageValue(option)}
+ size="small"
+ muted={!selected}/>
+ <span className="spacer-left">
+ {getCoverageRatingLabel(option)}
</span>
+ </span>
);
};
renderSort = () => {
return (
- <SortingFilter
- property={this.property}
- query={this.props.query}
- isFavorite={this.props.isFavorite}
- organization={this.props.organization}
- sortDesc="right"/>
+ <SortingFilter
+ property={this.property}
+ query={this.props.query}
+ isFavorite={this.props.isFavorite}
+ organization={this.props.organization}
+ sortDesc="right"/>
);
- }
+ };
getFacetValueForOption = (facet, option) => {
const map = ['80.0-*', '70.0-80.0', '50.0-70.0', '30.0-50.0', '*-30.0'];
return facet[map[option - 1]];
};
+ getOptions = () => [1, 2, 3, 4, 5];
+
+ renderName = () => 'Coverage';
+
render () {
return (
- <FilterContainer
- property={this.property}
- getOptions={() => [1, 2, 3, 4, 5]}
- renderName={() => 'Coverage'}
- renderOption={this.renderOption}
- renderSort={this.renderSort}
- getFacetValueForOption={this.getFacetValueForOption}
- query={this.props.query}
- isFavorite={this.props.isFavorite}
- organization={this.props.organization}/>
+ <FilterContainer
+ property={this.property}
+ getOptions={this.getOptions}
+ renderName={this.renderName}
+ renderOption={this.renderOption}
+ renderSort={this.renderSort}
+ getFacetValueForOption={this.getFacetValueForOption}
+ query={this.props.query}
+ isFavorite={this.props.isFavorite}
+ organization={this.props.organization}/>
);
}
}
import FilterContainer from './FilterContainer';
import SortingFilter from './SortingFilter';
import DuplicationsRating from '../../../components/ui/DuplicationsRating';
-import { getDuplicationsRatingLabel, getDuplicationsRatingAverageValue } from '../../../helpers/ratings';
+import {
+ getDuplicationsRatingLabel,
+ getDuplicationsRatingAverageValue
+} from '../../../helpers/ratings';
-export default class DuplicationsFilter extends React.Component {
+export default class DuplicationsFilter extends React.PureComponent {
static propTypes = {
query: React.PropTypes.object.isRequired,
isFavorite: React.PropTypes.bool,
organization: React.PropTypes.object
- }
+ };
property = 'duplications';
renderOption = (option, selected) => {
return (
- <span>
- <DuplicationsRating value={getDuplicationsRatingAverageValue(option)} size="small" muted={!selected}/>
- <span className="spacer-left">
- {getDuplicationsRatingLabel(option)}
- </span>
+ <span>
+ <DuplicationsRating
+ value={getDuplicationsRatingAverageValue(option)}
+ size="small"
+ muted={!selected}/>
+ <span className="spacer-left">
+ {getDuplicationsRatingLabel(option)}
</span>
+ </span>
);
};
renderSort = () => {
return (
- <SortingFilter
- property={this.property}
- query={this.props.query}
- isFavorite={this.props.isFavorite}
- organization={this.props.organization}/>
+ <SortingFilter
+ property={this.property}
+ query={this.props.query}
+ isFavorite={this.props.isFavorite}
+ organization={this.props.organization}/>
);
- }
+ };
getFacetValueForOption = (facet, option) => {
const map = ['*-3.0', '3.0-5.0', '5.0-10.0', '10.0-20.0', '20.0-*'];
return facet[map[option - 1]];
};
+ getOptions = () => [1, 2, 3, 4, 5];
+
+ renderName = () => 'Duplications';
+
render () {
return (
- <FilterContainer
- property={this.property}
- getOptions={() => [1, 2, 3, 4, 5]}
- renderName={() => 'Duplications'}
- renderOption={this.renderOption}
- renderSort={this.renderSort}
- getFacetValueForOption={this.getFacetValueForOption}
- query={this.props.query}
- isFavorite={this.props.isFavorite}
- organization={this.props.organization}/>
+ <FilterContainer
+ property={this.property}
+ getOptions={this.getOptions}
+ renderName={this.renderName}
+ renderOption={this.renderOption}
+ renderSort={this.renderSort}
+ getFacetValueForOption={this.getFacetValueForOption}
+ query={this.props.query}
+ isFavorite={this.props.isFavorite}
+ organization={this.props.organization}/>
);
}
}
import { formatMeasure } from '../../../helpers/measures';
import { translate } from '../../../helpers/l10n';
-export default class Filter extends React.Component {
+export default class Filter extends React.PureComponent {
static propTypes = {
value: React.PropTypes.any,
property: React.PropTypes.string.isRequired,
const mapStateToProps = (state, ownProps) => ({
value: ownProps.query[ownProps.property],
facet: getProjectsAppFacetByProperty(state, ownProps.property),
- maxFacetValue: getProjectsAppMaxFacetValue(state)
+ maxFacetValue: getProjectsAppMaxFacetValue(state),
+ // override query value to avoid re-rendering
+ query: undefined
});
export default connect(mapStateToProps)(withRouter(Filter));
import SortingFilter from './SortingFilter';
import Rating from '../../../components/ui/Rating';
-export default class IssuesFilter extends React.Component {
+export default class IssuesFilter extends React.PureComponent {
static propTypes = {
property: React.PropTypes.string.isRequired,
name: React.PropTypes.string.isRequired,
query: React.PropTypes.object.isRequired,
isFavorite: React.PropTypes.bool,
organization: React.PropTypes.object
- }
+ };
renderOption = (option, selected, value) => {
const isUnderSelectedOption = this.highlightUnder(value) && option > value;
renderSort = () => {
return (
- <SortingFilter
- property={this.props.property}
- query={this.props.query}
- isFavorite={this.props.isFavorite}
- organization={this.props.organization}/>
+ <SortingFilter
+ property={this.props.property}
+ query={this.props.query}
+ isFavorite={this.props.isFavorite}
+ organization={this.props.organization}/>
);
- }
+ };
highlightUnder (option) {
return option !== null && option > 1;
return facet[option];
};
+ getOptions = () => [1, 2, 3, 4, 5];
+
+ renderName = () => this.props.name;
+
render () {
return (
<FilterContainer
property={this.props.property}
- getOptions={() => [1, 2, 3, 4, 5]}
- renderName={() => this.props.name}
+ getOptions={this.getOptions}
+ renderName={this.renderName}
renderOption={this.renderOption}
renderSort={this.renderSort}
highlightUnder={this.highlightUnder}
import LanguageFilterOption from './LanguageFilterOption';
import LanguageFilterFooter from './LanguageFilterFooter';
-export default class LanguageFilter extends React.Component {
+export default class LanguageFilter extends React.PureComponent {
static propTypes = {
query: React.PropTypes.object.isRequired,
isFavorite: React.PropTypes.bool,
organization: React.PropTypes.object
- }
+ };
property = 'languages';
renderOption = option => {
- return (
- <LanguageFilterOption languageKey={option}/>
- );
+ return <LanguageFilterOption languageKey={option}/>;
};
getSortedOptions (facet) {
renderFooter = () => (
<LanguageFilterFooter
- property={this.property}
- query={this.props.query}
- isFavorite={this.props.isFavorite}
- organization={this.props.organization}/>
+ property={this.property}
+ query={this.props.query}
+ isFavorite={this.props.isFavorite}
+ organization={this.props.organization}/>
);
getFacetValueForOption = (facet, option) => facet[option];
+ getOptions = facet => facet ? this.getSortedOptions(facet) : [];
+
+ renderName = () => 'Languages';
+
render () {
return (
<FilterContainer
- property={this.property}
- getOptions={facet => facet ? this.getSortedOptions(facet) : []}
- renderName={() => 'Languages'}
- renderOption={this.renderOption}
- renderFooter={this.renderFooter}
- getFacetValueForOption={this.getFacetValueForOption}
- query={this.props.query}
- isFavorite={this.props.isFavorite}
- organization={this.props.organization}/>
+ property={this.property}
+ getOptions={this.getOptions}
+ renderName={this.renderName}
+ renderOption={this.renderOption}
+ renderFooter={this.renderFooter}
+ getFacetValueForOption={this.getFacetValueForOption}
+ query={this.props.query}
+ isFavorite={this.props.isFavorite}
+ organization={this.props.organization}/>
);
}
}
import FilterContainer from './FilterContainer';
import Level from '../../../components/ui/Level';
-export default class QualityGateFilter extends React.Component {
+export default class QualityGateFilter extends React.PureComponent {
renderOption = (option, selected) => {
- return (
- <Level level={option} small={true} muted={!selected}/>
- );
+ return <Level level={option} small={true} muted={!selected}/>;
};
getFacetValueForOption = (facet, option) => {
return facet[option];
};
+ getOptions = () => ['OK', 'WARN', 'ERROR'];
+
+ renderName = () => 'Quality Gate';
+
render () {
return (
- <FilterContainer
- property="gate"
- getOptions={() => ['OK', 'WARN', 'ERROR']}
- renderName={() => 'Quality Gate'}
- renderOption={this.renderOption}
- getFacetValueForOption={this.getFacetValueForOption}
- query={this.props.query}
- isFavorite={this.props.isFavorite}
- organization={this.props.organization}/>
+ <FilterContainer
+ property="gate"
+ getOptions={this.getOptions}
+ renderName={this.renderName}
+ renderOption={this.renderOption}
+ getFacetValueForOption={this.getFacetValueForOption}
+ query={this.props.query}
+ isFavorite={this.props.isFavorite}
+ organization={this.props.organization}/>
);
}
}
* along with this program; if not, write to the Free Software Foundation,
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
+// @flow
import React from 'react';
import { withRouter } from 'react-router';
import classNames from 'classnames';
import { getFilterUrl } from './utils';
import { translate, translateWithParameters } from '../../../helpers/l10n';
-class SearchFilter extends React.Component {
- static propTypes = {
- query: React.PropTypes.object.isRequired,
- router: React.PropTypes.object.isRequired,
- isFavorite: React.PropTypes.bool,
- organization: React.PropTypes.object
- }
+type Props = {
+ query?: string,
+ router: { push: (string) => void },
+ isFavorite?: boolean,
+ organization?: {}
+};
+
+type State = {
+ userQuery?: string
+};
+
+class SearchFilter extends React.PureComponent {
+ handleSearch: (string) => void;
+ props: Props;
+ state: State;
- constructor (props) {
+ constructor (props: Props) {
super(props);
- this.state = {
- userQuery: props.query.search
- };
+ this.state = { userQuery: props.query };
this.handleSearch = debounce(this.handleSearch.bind(this), 250);
}
- componentWillReceiveProps (nextProps) {
- if (this.props.query.search === this.state.userQuery && nextProps.query.search !== this.props.query.search) {
- this.setState({
- userQuery: nextProps.query.search || ''
- });
+ componentWillReceiveProps (nextProps: Props) {
+ if (this.props.query === this.state.userQuery && nextProps.query !== this.props.query) {
+ this.setState({ userQuery: nextProps.query || '' });
}
}
render () {
const { userQuery } = this.state;
const inputClassName = classNames('input-super-large', {
- 'touched': userQuery && userQuery.length < 2
+ touched: userQuery && userQuery.length < 2
});
return (
import { translate } from '../../../helpers/l10n';
import { getSizeRatingLabel, getSizeRatingAverageValue } from '../../../helpers/ratings';
-export default class SizeFilter extends React.Component {
+export default class SizeFilter extends React.PureComponent {
static propTypes = {
query: React.PropTypes.object.isRequired,
isFavorite: React.PropTypes.bool,
organization: React.PropTypes.object
- }
+ };
property = 'size';
renderOption = (option, selected) => {
return (
- <span>
- <SizeRating value={getSizeRatingAverageValue(option)} small={true} muted={!selected}/>
- <span className="spacer-left">
- {getSizeRatingLabel(option)}
- </span>
+ <span>
+ <SizeRating value={getSizeRatingAverageValue(option)} small={true} muted={!selected}/>
+ <span className="spacer-left">
+ {getSizeRatingLabel(option)}
</span>
+ </span>
);
};
renderSort = () => {
return (
- <SortingFilter
- property={this.property}
- query={this.props.query}
- isFavorite={this.props.isFavorite}
- organization={this.props.organization}
- leftText={translate('biggest')}
- rightText={translate('smallest')}/>
+ <SortingFilter
+ property={this.property}
+ query={this.props.query}
+ isFavorite={this.props.isFavorite}
+ organization={this.props.organization}
+ leftText={translate('biggest')}
+ rightText={translate('smallest')}/>
);
- }
+ };
getFacetValueForOption = (facet, option) => {
- const map = ['*-1000.0', '1000.0-10000.0', '10000.0-100000.0', '100000.0-500000.0', '500000.0-*'];
+ const map = [
+ '*-1000.0',
+ '1000.0-10000.0',
+ '10000.0-100000.0',
+ '100000.0-500000.0',
+ '500000.0-*'
+ ];
return facet[map[option - 1]];
};
+ getOptions = () => [1, 2, 3, 4, 5];
+
+ renderName = () => 'Size';
+
render () {
return (
- <FilterContainer
- property={this.property}
- getOptions={() => [1, 2, 3, 4, 5]}
- renderName={() => 'Size'}
- renderOption={this.renderOption}
- renderSort={this.renderSort}
- getFacetValueForOption={this.getFacetValueForOption}
- query={this.props.query}
- isFavorite={this.props.isFavorite}
- organization={this.props.organization}/>
+ <FilterContainer
+ property={this.property}
+ getOptions={this.getOptions}
+ renderName={this.renderName}
+ renderOption={this.renderOption}
+ renderSort={this.renderSort}
+ getFacetValueForOption={this.getFacetValueForOption}
+ query={this.props.query}
+ isFavorite={this.props.isFavorite}
+ organization={this.props.organization}/>
);
}
}
import { getFilterUrl } from './utils';
import { translate } from '../../../helpers/l10n';
-export default class SortingFilter extends React.Component {
+export default class SortingFilter extends React.PureComponent {
static propTypes = {
property: React.PropTypes.string.isRequired,
query: React.PropTypes.object.isRequired,
import { translate, translateWithParameters } from '../../helpers/l10n';
import { formatMeasure } from '../../helpers/measures';
-export default class ListFooter extends React.Component {
+export default class ListFooter extends React.PureComponent {
static propTypes = {
count: React.PropTypes.number.isRequired,
total: React.PropTypes.number.isRequired,