From: Pascal Mugnier <pascal.mugnier@sonarsource.com>
Date: Thu, 3 May 2018 09:56:05 +0000 (+0200)
Subject: Fix SONAR-6691
X-Git-Tag: 7.5~1260
X-Git-Url: https://source.dussan.org/?a=commitdiff_plain;h=2f7df43382ea068d0a9fcdcf9f7b2be58b78a628;p=sonarqube.git

Fix SONAR-6691
---

diff --git a/server/sonar-web/src/main/js/apps/quality-profiles/details/ChangeProjectsForm.tsx b/server/sonar-web/src/main/js/apps/quality-profiles/details/ChangeProjectsForm.tsx
index 408c5afa85d..dde79b6c7c0 100644
--- a/server/sonar-web/src/main/js/apps/quality-profiles/details/ChangeProjectsForm.tsx
+++ b/server/sonar-web/src/main/js/apps/quality-profiles/details/ChangeProjectsForm.tsx
@@ -104,6 +104,7 @@ export default class ChangeProjectsForm extends React.PureComponent<Props> {
 
         <div className="modal-body" id="profile-projects">
           <SelectList
+            allowBulkSelection={true}
             elements={this.state.projects.map(project => project.key)}
             labelAll={translate('quality_gates.projects.all')}
             labelSelected={translate('quality_gates.projects.with')}
diff --git a/server/sonar-web/src/main/js/components/SelectList/SelectList.tsx b/server/sonar-web/src/main/js/components/SelectList/SelectList.tsx
index c57fc9a7029..f1a0b2f7a48 100644
--- a/server/sonar-web/src/main/js/components/SelectList/SelectList.tsx
+++ b/server/sonar-web/src/main/js/components/SelectList/SelectList.tsx
@@ -31,6 +31,7 @@ export enum Filter {
 }
 
 interface Props {
+  allowBulkSelection?: boolean;
   elements: string[];
   disabledElements?: string[];
   labelSelected?: string;
@@ -114,6 +115,7 @@ export default class SelectList extends React.PureComponent<Props, State> {
           />
         </div>
         <SelectListListContainer
+          allowBulkSelection={this.props.allowBulkSelection}
           disabledElements={this.props.disabledElements || []}
           elements={this.props.elements}
           filter={this.getFilter()}
diff --git a/server/sonar-web/src/main/js/components/SelectList/SelectListListContainer.tsx b/server/sonar-web/src/main/js/components/SelectList/SelectListListContainer.tsx
index ac54e39d417..124b0814b58 100644
--- a/server/sonar-web/src/main/js/components/SelectList/SelectListListContainer.tsx
+++ b/server/sonar-web/src/main/js/components/SelectList/SelectListListContainer.tsx
@@ -20,8 +20,12 @@
 import * as React from 'react';
 import { Filter } from './SelectList';
 import SelectListListElement from './SelectListListElement';
+import Checkbox from '../controls/Checkbox';
+import DeferredSpinner from '../common/DeferredSpinner';
+import { translate } from '../../helpers/l10n';
 
 interface Props {
+  allowBulkSelection?: boolean;
   elements: string[];
   disabledElements: string[];
   filter: Filter;
@@ -31,7 +35,28 @@ interface Props {
   selectedElements: string[];
 }
 
-export default class SelectListListContainer extends React.PureComponent<Props> {
+interface State {
+  loading: boolean;
+}
+
+export default class SelectListListContainer extends React.PureComponent<Props, State> {
+  mounted = false;
+  state: State = { loading: false };
+
+  componentDidMount() {
+    this.mounted = true;
+  }
+
+  componentWillUnmount() {
+    this.mounted = false;
+  }
+
+  stopLoading = () => {
+    if (this.mounted) {
+      this.setState({ loading: false });
+    }
+  };
+
   isDisabled = (element: string): boolean => {
     return this.props.disabledElements.includes(element);
   };
@@ -40,8 +65,42 @@ export default class SelectListListContainer extends React.PureComponent<Props>
     return this.props.selectedElements.includes(element);
   };
 
+  handleBulkChange = (checked: boolean) => {
+    this.setState({ loading: true });
+    if (checked) {
+      Promise.all(this.props.elements.map(element => this.props.onSelect(element)))
+        .then(this.stopLoading)
+        .catch(this.stopLoading);
+    } else {
+      Promise.all(this.props.selectedElements.map(element => this.props.onUnselect(element)))
+        .then(this.stopLoading)
+        .catch(this.stopLoading);
+    }
+  };
+
+  renderBulkSelector() {
+    const { elements, selectedElements } = this.props;
+    return (
+      <>
+        <li>
+          <Checkbox
+            checked={selectedElements.length > 0}
+            disabled={this.state.loading}
+            onCheck={this.handleBulkChange}
+            thirdState={selectedElements.length > 0 && elements.length !== selectedElements.length}>
+            <span className="big-spacer-left">
+              {translate('update_key.bulk_update')}
+              <DeferredSpinner className="spacer-left" loading={this.state.loading} timeout={10} />
+            </span>
+          </Checkbox>
+        </li>
+        <li className="divider" />
+      </>
+    );
+  }
+
   render() {
-    const { elements, filter } = this.props;
+    const { allowBulkSelection, elements, filter } = this.props;
     const filteredElements = elements.filter(element => {
       if (filter === Filter.All) {
         return true;
@@ -53,6 +112,10 @@ export default class SelectListListContainer extends React.PureComponent<Props>
     return (
       <div className="select-list-list-container spacer-top">
         <ul className="menu">
+          {allowBulkSelection &&
+            elements.length > 0 &&
+            filter === Filter.All &&
+            this.renderBulkSelector()}
           {filteredElements.map(element => (
             <SelectListListElement
               disabled={this.isDisabled(element)}