]> source.dussan.org Git - sonarqube.git/commitdiff
SONAR-8878 Split to components and containers
authorGrégoire Aubert <gregoire.aubert@sonarsource.com>
Wed, 8 Mar 2017 12:10:05 +0000 (13:10 +0100)
committerGrégoire Aubert <gregaubert@users.noreply.github.com>
Mon, 13 Mar 2017 09:03:16 +0000 (10:03 +0100)
13 files changed:
server/sonar-web/src/main/js/apps/projects/components/PageSidebar.js
server/sonar-web/src/main/js/apps/projects/filters/CoverageFilter.js
server/sonar-web/src/main/js/apps/projects/filters/DuplicationsFilter.js
server/sonar-web/src/main/js/apps/projects/filters/FilterContainer.js [deleted file]
server/sonar-web/src/main/js/apps/projects/filters/IssuesFilter.js
server/sonar-web/src/main/js/apps/projects/filters/LanguageFilter.js
server/sonar-web/src/main/js/apps/projects/filters/LanguageFilterFooter.js
server/sonar-web/src/main/js/apps/projects/filters/LanguageFilterOption.js
server/sonar-web/src/main/js/apps/projects/filters/QualityGateFilter.js
server/sonar-web/src/main/js/apps/projects/filters/SearchFilter.js
server/sonar-web/src/main/js/apps/projects/filters/SearchFilterContainer.js [new file with mode: 0644]
server/sonar-web/src/main/js/apps/projects/filters/SizeFilter.js
server/sonar-web/src/main/js/apps/projects/filters/containers.js [new file with mode: 0644]

index cf9378ad610b89a6b468946613df1435dd1c201d..f4f2614ac60e877e0b703acb6f54e0cdc583990a 100644 (file)
@@ -27,7 +27,7 @@ import ReliabilityFilter from '../filters/ReliabilityFilter';
 import SecurityFilter from '../filters/SecurityFilter';
 import MaintainabilityFilter from '../filters/MaintainabilityFilter';
 import LanguageFilter from '../filters/LanguageFilter';
-import SearchFilter from '../filters/SearchFilter';
+import SearchFilterContainer from '../filters/SearchFilterContainer';
 import { translate } from '../../../helpers/l10n';
 
 export default class PageSidebar extends React.PureComponent {
@@ -57,7 +57,7 @@ export default class PageSidebar extends React.PureComponent {
             )}
 
             <h3>{translate('filters')}</h3>
-            <SearchFilter
+            <SearchFilterContainer
                 query={this.props.query.search}
                 isFavorite={this.props.isFavorite}
                 organization={this.props.organization}/>
index e6bc17ee881c39bb3cc24882a2c7a2a93727c380..560af1eba081ae50a75825dbb0125bec9705a11d 100644 (file)
@@ -18,7 +18,7 @@
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
 import React from 'react';
-import FilterContainer from './FilterContainer';
+import { FilterContainer } from './containers';
 import SortingFilter from './SortingFilter';
 import CoverageRating from '../../../components/ui/CoverageRating';
 import { getCoverageRatingLabel, getCoverageRatingAverageValue } from '../../../helpers/ratings';
index d5faaccd712098a1806da2704237cc9e627ba9bb..ae1acc160abf6c8e8f52806a13f540b08da419c8 100644 (file)
@@ -18,7 +18,7 @@
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
 import React from 'react';
-import FilterContainer from './FilterContainer';
+import { FilterContainer } from './containers';
 import SortingFilter from './SortingFilter';
 import DuplicationsRating from '../../../components/ui/DuplicationsRating';
 import {
diff --git a/server/sonar-web/src/main/js/apps/projects/filters/FilterContainer.js b/server/sonar-web/src/main/js/apps/projects/filters/FilterContainer.js
deleted file mode 100644 (file)
index 5a9655c..0000000
+++ /dev/null
@@ -1,33 +0,0 @@
-/*
- * SonarQube
- * Copyright (C) 2009-2017 SonarSource SA
- * mailto:info AT sonarsource DOT com
- *
- * This program is free software; you can redistribute it and/or
- * modify it under the terms of the GNU Lesser General Public
- * License as published by the Free Software Foundation; either
- * version 3 of the License, or (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
- * Lesser General Public License for more details.
- *
- * You should have received a copy of the GNU Lesser General Public License
- * along with this program; if not, write to the Free Software Foundation,
- * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
- */
-import { connect } from 'react-redux';
-import { withRouter } from 'react-router';
-import Filter from './Filter';
-import { getProjectsAppFacetByProperty, getProjectsAppMaxFacetValue } from '../../../store/rootReducer';
-
-const mapStateToProps = (state, ownProps) => ({
-  value: ownProps.query[ownProps.property],
-  facet: getProjectsAppFacetByProperty(state, ownProps.property),
-  maxFacetValue: getProjectsAppMaxFacetValue(state),
-  // override query value to avoid re-rendering
-  query: undefined
-});
-
-export default connect(mapStateToProps)(withRouter(Filter));
index 6330edaf39b08da4f34b709cb06ed5de270d83d8..7d5e6c9ad26e3c3c954b6ad90e565ea89ccfb87a 100644 (file)
@@ -18,7 +18,7 @@
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
 import React from 'react';
-import FilterContainer from './FilterContainer';
+import { FilterContainer } from './containers';
 import SortingFilter from './SortingFilter';
 import Rating from '../../../components/ui/Rating';
 
index b1f45ee06b0c5958dcccf8342fef54b3ee2bd5ad..d7cdb3947c364b8405c8613a3e5a2b07263bc3ff 100644 (file)
  */
 import React from 'react';
 import sortBy from 'lodash/sortBy';
-import FilterContainer from './FilterContainer';
-import LanguageFilterOption from './LanguageFilterOption';
-import LanguageFilterFooter from './LanguageFilterFooter';
+import {
+  FilterContainer,
+  LanguageFilterFooterContainer,
+  LanguageFilterOptionContainer
+} from './containers';
 
 export default class LanguageFilter extends React.PureComponent {
   static propTypes = {
@@ -33,7 +35,7 @@ export default class LanguageFilter extends React.PureComponent {
   property = 'languages';
 
   renderOption = option => {
-    return <LanguageFilterOption languageKey={option}/>;
+    return <LanguageFilterOptionContainer languageKey={option}/>;
   };
 
   getSortedOptions (facet) {
@@ -41,7 +43,7 @@ export default class LanguageFilter extends React.PureComponent {
   }
 
   renderFooter = () => (
-    <LanguageFilterFooter
+    <LanguageFilterFooterContainer
       property={this.property}
       query={this.props.query}
       isFavorite={this.props.isFavorite}
index 21a09c110c08cd4073450104ab2747e8cc186f9b..12b8058bbea0bcbdb20ba47dad0554c466f5c314 100644 (file)
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
 import React from 'react';
-import { connect } from 'react-redux';
-import { withRouter } from 'react-router';
 import Select from 'react-select';
 import difference from 'lodash/difference';
 import { getFilterUrl } from './utils';
-import { getProjectsAppFacetByProperty, getLanguages } from '../../../store/rootReducer';
 import { translate } from '../../../helpers/l10n';
 
-class LanguageFilterFooter extends React.Component {
+export default class LanguageFilterFooter extends React.Component {
   static propTypes = {
     property: React.PropTypes.string.isRequired,
     query: React.PropTypes.object.isRequired,
-    isFavorite: React.PropTypes.bool,
-    organization: React.PropTypes.object,
     languages: React.PropTypes.object,
     value: React.PropTypes.any,
     facet: React.PropTypes.object
@@ -64,11 +59,3 @@ class LanguageFilterFooter extends React.Component {
     );
   }
 }
-
-const mapStateToProps = (state, ownProps) => ({
-  languages: getLanguages(state),
-  value: ownProps.query[ownProps.property],
-  facet: getProjectsAppFacetByProperty(state, ownProps.property)
-});
-
-export default connect(mapStateToProps)(withRouter(LanguageFilterFooter));
index 002a8f04ff0e854f8a5220a50c28169d9ac45c0e..ef940b2cf45248be02a6efe93c196649279d310b 100644 (file)
  * along with this program; if not, write to the Free Software Foundation,
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
-import { connect } from 'react-redux';
 import React from 'react';
 import { translate } from '../../../helpers/l10n';
-import { getLanguageByKey } from '../../../store/rootReducer';
 
-class LanguageFilterOption extends React.Component {
+export default class LanguageFilterOption extends React.Component {
   static propTypes = {
     languageKey: React.PropTypes.string.isRequired,
     language: React.PropTypes.object
@@ -35,9 +33,3 @@ class LanguageFilterOption extends React.Component {
     );
   }
 }
-
-const mapStateToProps = (state, ownProps) => ({
-  language: getLanguageByKey(state, ownProps.languageKey)
-});
-
-export default connect(mapStateToProps)(LanguageFilterOption);
index 62707a385910cfc29ad550902fc889ce9627a941..abfff98dd478629084c35ac858ebd2edb90b0a1c 100644 (file)
@@ -18,7 +18,7 @@
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
 import React from 'react';
-import FilterContainer from './FilterContainer';
+import { FilterContainer } from './containers';
 import Level from '../../../components/ui/Level';
 
 export default class QualityGateFilter extends React.PureComponent {
index 8fe85b240f08642c6d469e5b85c44ba752ddc231..1bfd44d5e9fe65d0abec859b6d219b7a10f9b96c 100644 (file)
  * 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 debounce from 'lodash/debounce';
-import { getFilterUrl } from './utils';
 import { translate, translateWithParameters } from '../../../helpers/l10n';
 
-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;
+export default class SearchFilter extends React.Component {
+  static propTypes = {
+    query: React.PropTypes.object.isRequired,
+    handleSearch: React.PropTypes.func.isRequired
+  }
 
-  constructor (props: Props) {
+  constructor (props) {
     super(props);
-    this.state = { userQuery: props.query };
-    this.handleSearch = debounce(this.handleSearch.bind(this), 250);
+    this.state = {
+      userQuery: props.query.search
+    };
   }
 
-  componentWillReceiveProps (nextProps: Props) {
-    if (this.props.query === this.state.userQuery && nextProps.query !== this.props.query) {
-      this.setState({ userQuery: nextProps.query || '' });
+  componentWillReceiveProps (nextProps) {
+    if (this.props.query.search === this.state.userQuery && nextProps.query.search !== this.props.query.search) {
+      this.setState({
+        userQuery: nextProps.query.search || ''
+      });
     }
   }
 
-  handleSearch (userQuery) {
-    const path = getFilterUrl(this.props, { search: userQuery || null });
-    this.props.router.push(path);
-  }
-
-  handleQueryChange (userQuery) {
-    this.setState({ userQuery });
-    if (!userQuery || userQuery.length >= 2) {
-      this.handleSearch(userQuery);
+  handleQueryChange = ({ target }) => {
+    this.setState({ userQuery: target.value });
+    if (!target.value || target.value.length >= 2) {
+      this.props.handleSearch(target.value);
     }
   }
 
   render () {
     const { userQuery } = this.state;
     const inputClassName = classNames('input-super-large', {
-      touched: userQuery && userQuery.length < 2
+      'touched': userQuery && userQuery.length < 2
     });
 
     return (
@@ -78,7 +62,7 @@ class SearchFilter extends React.PureComponent {
           value={userQuery || ''}
           className={inputClassName}
           placeholder={translate('projects.search')}
-          onChange={event => this.handleQueryChange(event.target.value)}
+          onChange={this.handleQueryChange}
           autoComplete="off"/>
         <span className="note spacer-left">
           {translateWithParameters('select2.tooShort', 2)}
@@ -87,5 +71,3 @@ class SearchFilter extends React.PureComponent {
     );
   }
 }
-
-export default withRouter(SearchFilter);
diff --git a/server/sonar-web/src/main/js/apps/projects/filters/SearchFilterContainer.js b/server/sonar-web/src/main/js/apps/projects/filters/SearchFilterContainer.js
new file mode 100644 (file)
index 0000000..c65d92c
--- /dev/null
@@ -0,0 +1,52 @@
+/*
+ * SonarQube
+ * Copyright (C) 2009-2017 SonarSource SA
+ * mailto:info AT sonarsource DOT com
+ *
+ * This program is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 3 of the License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program; if not, write to the Free Software Foundation,
+ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+ */
+import React from 'react';
+import { withRouter } from 'react-router';
+import debounce from 'lodash/debounce';
+import { getFilterUrl } from './utils';
+import SearchFilter from './SearchFilter';
+
+class SearchFilterContainer extends React.Component {
+  static propTypes = {
+    query: React.PropTypes.object.isRequired,
+    isFavorite: React.PropTypes.bool,
+    organization: React.PropTypes.object
+  }
+
+  constructor (props) {
+    super(props);
+    this.handleSearch = debounce(this.handleSearch.bind(this), 250);
+  }
+
+  handleSearch (userQuery) {
+    const path = getFilterUrl(this.props, { search: userQuery || null });
+    this.props.router.push(path);
+  }
+
+  render () {
+    return (
+      <SearchFilter
+        query={this.props.query}
+        handleSearch={this.handleSearch}/>
+    );
+  }
+}
+
+export default withRouter(SearchFilterContainer);
index 53e081a4df073cca399df4db8df182f97996e056..be13a07fd13be28bd7a95bc9d5f2b2b85526c9d6 100644 (file)
@@ -18,7 +18,7 @@
  * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
  */
 import React from 'react';
-import FilterContainer from './FilterContainer';
+import { FilterContainer } from './containers';
 import SortingFilter from './SortingFilter';
 import SizeRating from '../../../components/ui/SizeRating';
 import { translate } from '../../../helpers/l10n';
diff --git a/server/sonar-web/src/main/js/apps/projects/filters/containers.js b/server/sonar-web/src/main/js/apps/projects/filters/containers.js
new file mode 100644 (file)
index 0000000..d9e7669
--- /dev/null
@@ -0,0 +1,55 @@
+/*
+ * SonarQube
+ * Copyright (C) 2009-2017 SonarSource SA
+ * mailto:info AT sonarsource DOT com
+ *
+ * This program is free software; you can redistribute it and/or
+ * modify it under the terms of the GNU Lesser General Public
+ * License as published by the Free Software Foundation; either
+ * version 3 of the License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU
+ * Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with this program; if not, write to the Free Software Foundation,
+ * Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
+ */
+import { connect } from 'react-redux';
+import { withRouter } from 'react-router';
+import Filter from './Filter';
+import LanguageFilterFooter from './LanguageFilterFooter';
+import LanguageFilterOption from './LanguageFilterOption';
+import {
+  getProjectsAppFacetByProperty,
+  getProjectsAppMaxFacetValue,
+  getLanguages,
+  getLanguageByKey
+} from '../../../store/rootReducer';
+
+export const FilterContainer = (function () {
+  const mapStateToProps = (state, ownProps) => ({
+    value: ownProps.query[ownProps.property],
+    facet: getProjectsAppFacetByProperty(state, ownProps.property),
+    maxFacetValue: getProjectsAppMaxFacetValue(state)
+  });
+  return connect(mapStateToProps)(withRouter(Filter));
+})();
+
+export const LanguageFilterFooterContainer = (function () {
+  const mapStateToProps = (state, ownProps) => ({
+    languages: getLanguages(state),
+    value: ownProps.query[ownProps.property],
+    facet: getProjectsAppFacetByProperty(state, ownProps.property)
+  });
+  return connect(mapStateToProps)(withRouter(LanguageFilterFooter));
+})();
+
+export const LanguageFilterOptionContainer = (function () {
+  const mapStateToProps = (state, ownProps) => ({
+    language: getLanguageByKey(state, ownProps.languageKey)
+  });
+  return connect(mapStateToProps)(LanguageFilterOption);
+})();