]> source.dussan.org Git - sonarqube.git/commitdiff
Add format rule : order react component lifecycle methods (#1882)
authorGrégoire Aubert <gregaubert@users.noreply.github.com>
Fri, 31 Mar 2017 14:50:34 +0000 (16:50 +0200)
committerGitHub <noreply@github.com>
Fri, 31 Mar 2017 14:50:34 +0000 (16:50 +0200)
22 files changed:
server/sonar-web/.eslintrc
server/sonar-web/src/main/js/app/components/App.js
server/sonar-web/src/main/js/app/components/LocalizationContainer.js
server/sonar-web/src/main/js/app/components/nav/global/GlobalNavSearch.js
server/sonar-web/src/main/js/apps/account/components/Tokens.js
server/sonar-web/src/main/js/apps/account/notifications/Projects.js
server/sonar-web/src/main/js/apps/account/organizations/CreateOrganizationForm.js
server/sonar-web/src/main/js/apps/projects-admin/search.js
server/sonar-web/src/main/js/apps/projects/components/ProjectTagsSelectorContainer.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/IssuesFilter.js
server/sonar-web/src/main/js/apps/projects/filters/LanguagesFilter.js
server/sonar-web/src/main/js/apps/projects/filters/QualityGateFilter.js
server/sonar-web/src/main/js/apps/projects/filters/SizeFilter.js
server/sonar-web/src/main/js/apps/projects/filters/TagsFilter.js
server/sonar-web/src/main/js/apps/quality-gates/components/Projects.js
server/sonar-web/src/main/js/apps/quality-profiles/details/ProfileRules.js
server/sonar-web/src/main/js/apps/users/components/UsersSearch.js
server/sonar-web/src/main/js/components/SourceViewer/SourceViewerIssueLocations.js
server/sonar-web/src/main/js/components/common/MultiSelect.js
server/sonar-web/src/main/js/components/issue/Issue.js

index a03e1f19e92f5315a15d7f95c85884eeb5a6a53d..d6e85fb913937a40f2f7da7f9cac5e93104c10e3 100644 (file)
     "react/no-unknown-property": 2,
     "react/react-in-jsx-scope": 2,
     "react/require-render-return": 2,
-    "react/self-closing-comp": 2
+    "react/self-closing-comp": 2,
+    "react/sort-comp": [2, {
+      "order": [
+        "type-annotations",
+        "static-methods",
+        "lifecycle",
+        "everything-else",
+        "rendering"
+      ],
+      "groups": {
+        "rendering": [
+          "/^render.+$/",
+          "render"
+        ]
+      }
+    }]
   },
 
   "settings": {
index 647acffd144901c72644bfa9d78ee4e2cd7b9c15..bc1904c63864c0f7a40f31dab29e3ff5cdc3f9f9 100644 (file)
@@ -39,12 +39,6 @@ class App extends React.Component {
     loading: true
   };
 
-  finishLoading = () => {
-    if (this.mounted) {
-      this.setState({ loading: false });
-    }
-  };
-
   componentDidMount() {
     this.mounted = true;
 
@@ -63,6 +57,12 @@ class App extends React.Component {
     this.mounted = false;
   }
 
+  finishLoading = () => {
+    if (this.mounted) {
+      this.setState({ loading: false });
+    }
+  };
+
   render() {
     if (this.state.loading) {
       return <GlobalLoading />;
index 8cbbec134be9cfb52fa0cb9815769361e23d74a9..341d4ff8121738d0a677738f0fb53b416d6cee64 100644 (file)
@@ -28,12 +28,6 @@ export default class LocalizationContainer extends React.Component {
     loading: true
   };
 
-  finishLoading = () => {
-    if (this.mounted) {
-      this.setState({ loading: false });
-    }
-  };
-
   componentDidMount() {
     this.mounted = true;
     requestMessages().then(this.finishLoading, this.finishLoading);
@@ -43,6 +37,12 @@ export default class LocalizationContainer extends React.Component {
     this.mounted = false;
   }
 
+  finishLoading = () => {
+    if (this.mounted) {
+      this.setState({ loading: false });
+    }
+  };
+
   render() {
     return this.state.loading ? null : this.props.children;
   }
index 2b5aa6ccf6383049686101c92e6738815faad054..cb8349ecca58257ca171acd102ba1855358a9363 100644 (file)
@@ -62,15 +62,6 @@ class GlobalNavSearch extends React.Component {
     this.setState({ open: false });
   };
 
-  renderSearchView = () => {
-    const searchContainer = this.refs.container;
-    this.searchView = new SearchView({
-      model: new Backbone.Model(this.props),
-      hide: this.closeSearch
-    });
-    this.searchView.render().$el.appendTo(searchContainer);
-  };
-
   resetSearchView = () => {
     if (this.searchView) {
       this.searchView.destroy();
@@ -92,6 +83,15 @@ class GlobalNavSearch extends React.Component {
     }
   };
 
+  renderSearchView = () => {
+    const searchContainer = this.refs.container;
+    this.searchView = new SearchView({
+      model: new Backbone.Model(this.props),
+      hide: this.closeSearch
+    });
+    this.searchView.render().$el.appendTo(searchContainer);
+  };
+
   render() {
     const dropdownClassName = 'dropdown' + (this.state.open ? ' open' : '');
     return (
index 284f0fd9f9d1a8c6302dd2d5554bbb02af251bec..a919b09b646623f0e30414be3bae6ff562dc73cc 100644 (file)
@@ -30,6 +30,12 @@ export default class Tokens extends Component {
     this.destroyView();
   }
 
+  destroyView() {
+    if (this.destroyView) {
+      this.tokensView.destroy();
+    }
+  }
+
   renderView() {
     const account = new Backbone.Model({
       id: this.props.user.login
@@ -41,12 +47,6 @@ export default class Tokens extends Component {
     }).render();
   }
 
-  destroyView() {
-    if (this.destroyView) {
-      this.tokensView.destroy();
-    }
-  }
-
   render() {
     return <div ref="container" />;
   }
index 89c32e17079b15446dd67586963285fd2f29b0ba..e378b4a0a959386a173496e2572183e3ea63c355 100644 (file)
@@ -62,14 +62,6 @@ class Projects extends React.Component {
     }
   }
 
-  renderOption = option => {
-    return (
-      <span>
-        <Organization organizationKey={option.organization} link={false} />
-        <strong>{option.label}</strong>
-      </span>
-    );
-  };
   loadOptions = (query, cb) => {
     if (query.length < 2) {
       cb(null, { options: [] });
@@ -103,6 +95,15 @@ class Projects extends React.Component {
     });
   };
 
+  renderOption = option => {
+    return (
+      <span>
+        <Organization organizationKey={option.organization} link={false} />
+        <strong>{option.label}</strong>
+      </span>
+    );
+  };
+
   render() {
     const allProjects = [...this.props.projects, ...this.state.addedProjects];
 
index fc0fca467d982e6aa35be12d5decce4a936aac38..04b822d40b22108dbbf63c0935071c43a67edb08 100644 (file)
@@ -38,24 +38,23 @@ type State = {
 
 class CreateOrganizationForm extends React.Component {
   mounted: boolean;
-
+  state: State;
   props: {
     createOrganization: () => Promise<*>,
     router: { push: (string) => void }
   };
 
-  state: State = {
-    loading: false,
-    avatar: '',
-    avatarImage: '',
-    description: '',
-    key: '',
-    name: '',
-    url: ''
-  };
-
   constructor(props) {
     super(props);
+    this.state = {
+      loading: false,
+      avatar: '',
+      avatarImage: '',
+      description: '',
+      key: '',
+      name: '',
+      url: ''
+    };
     this.changeAvatarImage = debounce(this.changeAvatarImage, 500);
   }
 
index 542946ce55bf40b7ccff97311aae7a123a3a3a07..2437b928026a90ff2ad1bcef33c64e5ee6e9e07a 100644 (file)
@@ -55,6 +55,20 @@ export default React.createClass({
     return sortBy(options, option => QUALIFIERS_ORDER.indexOf(option.value));
   },
 
+  onCheck(checked) {
+    if (checked) {
+      this.props.onAllSelected();
+    } else {
+      this.props.onAllDeselected();
+    }
+  },
+
+  deleteProjects() {
+    new DeleteView({
+      deleteProjects: this.props.deleteProjects
+    }).render();
+  },
+
   renderCheckbox() {
     const isAllChecked = this.props.projects.length > 0 &&
       this.props.selection.length === this.props.projects.length;
@@ -65,18 +79,6 @@ export default React.createClass({
     return <Checkbox checked={checked} thirdState={thirdState} onCheck={this.onCheck} />;
   },
 
-  renderSpinner() {
-    return <i className="spinner" />;
-  },
-
-  onCheck(checked) {
-    if (checked) {
-      this.props.onAllSelected();
-    } else {
-      this.props.onAllDeselected();
-    }
-  },
-
   renderGhostsDescription() {
     if (this.props.type !== TYPE.GHOSTS || !this.props.ready) {
       return null;
@@ -88,12 +90,6 @@ export default React.createClass({
     );
   },
 
-  deleteProjects() {
-    new DeleteView({
-      deleteProjects: this.props.deleteProjects
-    }).render();
-  },
-
   renderQualifierFilter() {
     const options = this.getQualifierOptions();
     if (options.length < 2) {
@@ -111,6 +107,10 @@ export default React.createClass({
     );
   },
 
+  renderSpinner() {
+    return <i className="spinner" />;
+  },
+
   render() {
     const isSomethingSelected = this.props.projects.length > 0 && this.props.selection.length > 0;
     return (
index fae4f79b62e5941b6528e48fcf55f4beb15b4cfc..1db66ab8553f8369afdf34c55204ed1d3af64ebb 100644 (file)
@@ -41,12 +41,11 @@ const LIST_SIZE = 10;
 
 class ProjectTagsSelectorContainer extends React.PureComponent {
   props: Props;
-  state: State = {
-    searchResult: []
-  };
+  state: State;
 
   constructor(props: Props) {
     super(props);
+    this.state = { searchResult: [] };
     this.onSearch = debounce(this.onSearch, 250);
   }
 
index 46c3ed99a22ace108d73bae03a2f62b61c3292a7..e914a5180cd075a3e731443dc08798316e458ec1 100644 (file)
@@ -33,6 +33,11 @@ export default class CoverageFilter extends React.PureComponent {
 
   property = 'coverage';
 
+  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]];
+  }
+
   renderOption(option, selected) {
     return (
       <span>
@@ -48,11 +53,6 @@ export default class CoverageFilter extends React.PureComponent {
     );
   }
 
-  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]];
-  }
-
   render() {
     return (
       <FilterContainer
index b4f4585d025d20cf007600e3d4127b80f3748910..c1fed7f07230d48a256e347ab2e90213c1f827eb 100644 (file)
@@ -36,6 +36,11 @@ export default class DuplicationsFilter extends React.PureComponent {
 
   property = 'duplications';
 
+  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]];
+  }
+
   renderOption(option, selected) {
     return (
       <span>
@@ -51,11 +56,6 @@ export default class DuplicationsFilter extends React.PureComponent {
     );
   }
 
-  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]];
-  }
-
   render() {
     return (
       <FilterContainer
index ae89055ba1045616b17b8b3d4ecc7439a2dc2152..96e1a2669e2974987725eb5b91e116c64c150ebb 100644 (file)
@@ -32,6 +32,10 @@ export default class IssuesFilter extends React.PureComponent {
     organization: React.PropTypes.object
   };
 
+  getFacetValueForOption(facet, option) {
+    return facet[option];
+  }
+
   renderOption(option, selected) {
     return (
       <span>
@@ -41,10 +45,6 @@ export default class IssuesFilter extends React.PureComponent {
     );
   }
 
-  getFacetValueForOption(facet, option) {
-    return facet[option];
-  }
-
   render() {
     return (
       <FilterContainer
index 12de3c1879326aef993ddf0ee68b96e7b08c5901..47de2131a8f34a8c874d596aa92d360711a4560a 100644 (file)
@@ -44,13 +44,6 @@ export default class LanguagesFilter extends React.PureComponent {
   props: Props;
   property = 'languages';
 
-  renderOption = (option: string) => (
-    <SearchableFilterOption
-      optionKey={option}
-      option={getLanguageByKey(this.props.languages, option)}
-    />
-  );
-
   getSearchOptions(facet: {}, languages: {}) {
     let languageKeys = Object.keys(languages);
     if (facet) {
@@ -67,6 +60,13 @@ export default class LanguagesFilter extends React.PureComponent {
 
   getFacetValueForOption = (facet: {} = {}, option: string) => facet[option];
 
+  renderOption = (option: string) => (
+    <SearchableFilterOption
+      optionKey={option}
+      option={getLanguageByKey(this.props.languages, option)}
+    />
+  );
+
   render() {
     return (
       <Filter
index 367f8588ec94867cbc497bc443f556ddaab81f7f..d40bd4edf2f4584c4bc4a0227057e0002bd46441 100644 (file)
@@ -29,14 +29,14 @@ export default class QualityGateFilter extends React.PureComponent {
     organization: React.PropTypes.object
   };
 
-  renderOption(option, selected) {
-    return <Level level={option} small={true} muted={!selected} />;
-  }
-
   getFacetValueForOption(facet, option) {
     return facet[option];
   }
 
+  renderOption(option, selected) {
+    return <Level level={option} small={true} muted={!selected} />;
+  }
+
   render() {
     return (
       <FilterContainer
index 1a107f2156aeb51f4c11040543398f070cb91561..d97524f25469dbd4ca7e41123b44887e074a74b7 100644 (file)
@@ -34,6 +34,17 @@ export default class SizeFilter extends React.PureComponent {
 
   property = 'size';
 
+  getFacetValueForOption(facet, option) {
+    const map = [
+      '*-1000.0',
+      '1000.0-10000.0',
+      '10000.0-100000.0',
+      '100000.0-500000.0',
+      '500000.0-*'
+    ];
+    return facet[map[option - 1]];
+  }
+
   renderOption(option, selected) {
     return (
       <span>
@@ -58,17 +69,6 @@ export default class SizeFilter extends React.PureComponent {
     );
   };
 
-  getFacetValueForOption(facet, option) {
-    const map = [
-      '*-1000.0',
-      '1000.0-10000.0',
-      '10000.0-100000.0',
-      '100000.0-500000.0',
-      '500000.0-*'
-    ];
-    return facet[map[option - 1]];
-  }
-
   render() {
     return (
       <FilterContainer
index 675c47d1c000f95d6795cb1e17bfd24d3756369a..c79b7bf2fb82028ba6df22c94ecd0c29a958fa15 100644 (file)
@@ -47,20 +47,20 @@ const LIST_SIZE = 10;
 export default class TagsFilter extends React.PureComponent {
   getSearchOptions: () => [{ label: string, value: string }];
   props: Props;
-  state: State = {
-    isLoading: false,
-    search: '',
-    tags: []
-  };
-  property = 'tags';
+  state: State;
+  property: string;
 
   constructor(props: Props) {
     super(props);
+    this.state = {
+      isLoading: false,
+      search: '',
+      tags: []
+    };
+    this.property = 'tags';
     this.handleSearch = debounce(this.handleSearch.bind(this), 250);
   }
 
-  renderOption = (option: string) => <SearchableFilterOption optionKey={option} />;
-
   getSearchOptions(facet: {}, tags: Array<string>) {
     let tagsCopy = [...tags];
     if (facet) {
@@ -88,6 +88,8 @@ export default class TagsFilter extends React.PureComponent {
 
   getFacetValueForOption = (facet: {}, option: string) => facet[option];
 
+  renderOption = (option: string) => <SearchableFilterOption optionKey={option} />;
+
   render() {
     return (
       <Filter
index 1d9cee719184e262e539cd1784c982a89ca2b8eb..a5c96cd79678d7125e6cfd9a292e826250eb0650 100644 (file)
@@ -37,6 +37,12 @@ export default class Projects extends Component {
     this.destroyView();
   }
 
+  destroyView() {
+    if (this.projectsView) {
+      this.projectsView.destroy();
+    }
+  }
+
   renderView() {
     const { qualityGate, edit } = this.props;
 
@@ -48,12 +54,6 @@ export default class Projects extends Component {
     this.projectsView.render();
   }
 
-  destroyView() {
-    if (this.projectsView) {
-      this.projectsView.destroy();
-    }
-  }
-
   render() {
     return <div ref="container" />;
   }
index cf530249158f37365f037f1ce41ae0933191db78..2dee1b5680e7dbf3a8b153fb36adcbc3ce38f431 100644 (file)
@@ -101,6 +101,12 @@ export default class ProfileRules extends React.Component {
     );
   }
 
+  getTooltipForType(type) {
+    const { count } = this.state.activatedByType[type];
+    const total = this.state.allByType[type].count;
+    return this.getTooltip(count, total);
+  }
+
   renderActiveTitle() {
     return (
       <strong>
@@ -151,12 +157,6 @@ export default class ProfileRules extends React.Component {
     );
   }
 
-  getTooltipForType(type) {
-    const { count } = this.state.activatedByType[type];
-    const total = this.state.allByType[type].count;
-    return this.getTooltip(count, total);
-  }
-
   renderTitleForType(type) {
     return (
       <span>
index e450d51b4c1d086c9d9648f88b20aa95456a19aa..8d336b0c44ff1d786cb7b30e921e71c2bef4b550 100644 (file)
@@ -34,12 +34,13 @@ type State = {
 
 export default class UsersSearch extends React.PureComponent {
   props: Props;
-  state: State = {
-    query: ''
-  };
+  state: State;
 
   constructor(props: Props) {
     super(props);
+    this.state = {
+      query: ''
+    };
     this.handleSearch = debounce(this.handleSearch, 250);
   }
 
index 98e7b1a2e788a54b8f5ad2023d9f472ba2a34914..5e2df2d659478d9ae8fff625c622f9bf8e0ffb23 100644 (file)
@@ -43,7 +43,7 @@ type State = {
 
 export default class SourceViewerIssueLocations extends React.Component {
   fixedNode: HTMLElement;
-  locations: { [string]: HTMLElement } = {};
+  locations: { [string]: HTMLElement };
   node: HTMLElement;
   props: Props;
   rootNode: HTMLElement;
@@ -52,6 +52,7 @@ export default class SourceViewerIssueLocations extends React.Component {
   constructor(props: Props) {
     super(props);
     this.state = { fixed: true, locationBlink: false };
+    this.locations = {};
     this.handleScroll = throttle(this.handleScroll, 50);
   }
 
index d6ba67ca473debd8eb71ffeb2f42f6f3d5367bd6..ecc74825395856ed3fc467743af52878a08ffcfe 100644 (file)
@@ -44,18 +44,23 @@ export default class MultiSelect extends React.PureComponent {
   container: HTMLElement;
   searchInput: HTMLInputElement;
   props: Props;
-  state: State = {
-    query: '',
-    selectedElements: [],
-    unselectedElements: [],
-    activeIdx: 0
-  };
+  state: State;
 
   static defaultProps = {
     listSize: 10,
     validateSearchInput: (value: string) => value
   };
 
+  constructor(props: Props) {
+    super(props);
+    this.state = {
+      query: '',
+      selectedElements: [],
+      unselectedElements: [],
+      activeIdx: 0
+    };
+  }
+
   componentDidMount() {
     this.updateSelectedElements(this.props);
     this.updateUnselectedElements(this.props);
index 5717a060e3ba5e25b335c309d97f44eb148714b4..67f0083f87e237d9cd200e8bf3bb0a4355d8d03c 100644 (file)
@@ -116,6 +116,10 @@ class Issue extends React.PureComponent {
     }
   };
 
+  destroyIssueView() {
+    this.issueView.destroy();
+  }
+
   renderIssueView() {
     const model = this.props.issue.toJSON ? this.props.issue : new IssueModel(this.props.issue);
     this.issueView = new IssueView({
@@ -132,10 +136,6 @@ class Issue extends React.PureComponent {
     }
   }
 
-  destroyIssueView() {
-    this.issueView.destroy();
-  }
-
   render() {
     return <div className="issue-container" ref={node => this.node = node} />;
   }