From 1f271fd894cdc74682b801cbc202309b120a3738 Mon Sep 17 00:00:00 2001
From: =?utf8?q?Gr=C3=A9goire=20Aubert?= <gregoire.aubert@sonarsource.com>
Date: Tue, 30 Jan 2018 16:02:17 +0100
Subject: [PATCH] Add back missing action to bulk unassign issues

---
 .../apps/issues/components/BulkChangeModal.js |  84 +++++++--------
 .../src/main/js/apps/issues/utils.js          |   2 +-
 .../{SearchSelect.js => SearchSelect.tsx}     | 100 +++++++++---------
 ...chSelect-test.js => SearchSelect-test.tsx} |   2 +-
 ...est.js.snap => SearchSelect-test.tsx.snap} |   1 -
 .../__snapshots__/FacetFooter-test.js.snap    |   2 -
 6 files changed, 89 insertions(+), 102 deletions(-)
 rename server/sonar-web/src/main/js/components/controls/{SearchSelect.js => SearchSelect.tsx} (58%)
 rename server/sonar-web/src/main/js/components/controls/__tests__/{SearchSelect-test.js => SearchSelect-test.tsx} (98%)
 rename server/sonar-web/src/main/js/components/controls/__tests__/__snapshots__/{SearchSelect-test.js.snap => SearchSelect-test.tsx.snap} (96%)

diff --git a/server/sonar-web/src/main/js/apps/issues/components/BulkChangeModal.js b/server/sonar-web/src/main/js/apps/issues/components/BulkChangeModal.js
index 6ac8ce8b88f..c5d585adcf3 100644
--- a/server/sonar-web/src/main/js/apps/issues/components/BulkChangeModal.js
+++ b/server/sonar-web/src/main/js/apps/issues/components/BulkChangeModal.js
@@ -109,44 +109,40 @@ export default class BulkChangeModal extends React.PureComponent {
     this.mounted = false;
   }
 
+  loadIssues = () => this.props.fetchIssues({ additionalFields: 'actions,transitions', ps: 250 });
+
+  getDefaultAssignee = () => {
+    const { currentUser } = this.props;
+    const { issues } = this.state;
+    const options = [];
+
+    if (currentUser.isLoggedIn) {
+      const canBeAssignedToMe =
+        issues.filter(issue => issue.assignee !== currentUser.login).length > 0;
+      if (canBeAssignedToMe) {
+        options.push({
+          avatar: currentUser.avatar,
+          label: currentUser.name,
+          value: currentUser.login
+        });
+      }
+    }
+
+    const canBeUnassigned = issues.filter(issue => issue.assignee).length > 0;
+    if (canBeUnassigned) {
+      options.push({ label: translate('unassigned'), value: '' });
+    }
+
+    return options;
+  };
+
   handleCloseClick = (e /*: Event & { target: HTMLElement } */) => {
     e.preventDefault();
     e.target.blur();
     this.props.onClose();
   };
 
-  loadIssues = () => {
-    return this.props.fetchIssues({ additionalFields: 'actions,transitions', ps: 250 });
-  };
-
-  handleAssigneeSearch = (query /*: string */) => {
-    if (query.length > 1) {
-      return searchAssignees(query, this.state.organization);
-    } else {
-      const { currentUser } = this.props;
-      const { issues } = this.state;
-      const options = [];
-
-      if (currentUser.isLoggedIn) {
-        const canBeAssignedToMe =
-          issues.filter(issue => issue.assignee !== currentUser.login).length > 0;
-        if (canBeAssignedToMe) {
-          options.push({
-            email: currentUser.email,
-            label: currentUser.name,
-            value: currentUser.login
-          });
-        }
-      }
-
-      const canBeUnassigned = issues.filter(issue => issue.assignee).length > 0;
-      if (canBeUnassigned) {
-        options.push({ label: translate('unassigned'), value: '' });
-      }
-
-      return Promise.resolve(options);
-    }
-  };
+  handleAssigneeSearch = (query /*: string */) => searchAssignees(query, this.state.organization);
 
   handleAssigneeSelect = (assignee /*: string */) => {
     this.setState({ assignee });
@@ -270,19 +266,16 @@ export default class BulkChangeModal extends React.PureComponent {
     </div>
   );
 
-  renderAssigneeOption = (option /*: { avatar?: string, email?: string, label: string } */) => (
-    <span>
-      {option.avatar != null && (
-        <Avatar
-          className="little-spacer-right"
-          hash={option.avatar}
-          name={option.label}
-          size={16}
-        />
-      )}
-      {option.label}
-    </span>
-  );
+  renderAssigneeOption = (option /*: { avatar?: string, email?: string, label: string } */) => {
+    return (
+      <span>
+        {option.avatar != null && (
+          <Avatar className="spacer-right" hash={option.avatar} name={option.label} size={16} />
+        )}
+        {option.label}
+      </span>
+    );
+  };
 
   renderAssigneeField = () => {
     const affected /*: number */ = this.state.issues.filter(hasAction('assign')).length;
@@ -293,6 +286,7 @@ export default class BulkChangeModal extends React.PureComponent {
 
     const input = (
       <SearchSelect
+        defaultOptions={this.getDefaultAssignee()}
         onSearch={this.handleAssigneeSearch}
         onSelect={this.handleAssigneeSelect}
         minimumQueryLength={2}
diff --git a/server/sonar-web/src/main/js/apps/issues/utils.js b/server/sonar-web/src/main/js/apps/issues/utils.js
index d4455f7b031..0878f213bd0 100644
--- a/server/sonar-web/src/main/js/apps/issues/utils.js
+++ b/server/sonar-web/src/main/js/apps/issues/utils.js
@@ -218,7 +218,7 @@ export type Component = {
 /*::
 export type CurrentUser =
   | { isLoggedIn: false }
-  | { isLoggedIn: true, email?: string, login: string, name: string };
+  | { isLoggedIn: true, avatar:string, email?: string, login: string, name: string };
 */
 
 export const searchAssignees = (query /*: string */, organization /*: ?string */) => {
diff --git a/server/sonar-web/src/main/js/components/controls/SearchSelect.js b/server/sonar-web/src/main/js/components/controls/SearchSelect.tsx
similarity index 58%
rename from server/sonar-web/src/main/js/components/controls/SearchSelect.js
rename to server/sonar-web/src/main/js/components/controls/SearchSelect.tsx
index bed2a3acd1b..07f9b2dac2a 100644
--- a/server/sonar-web/src/main/js/components/controls/SearchSelect.js
+++ b/server/sonar-web/src/main/js/components/controls/SearchSelect.tsx
@@ -17,51 +17,40 @@
  * 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 * as React from 'react';
 import { debounce } from 'lodash';
 import Select from '../../components/controls/Select';
 import { translate, translateWithParameters } from '../../helpers/l10n';
 
-/*::
-type Option = { label: string, value: string };
-*/
-
-/*::
-type Props = {|
-  autofocus: boolean,
-  minimumQueryLength: number,
-  onSearch: (query: string) => Promise<Array<Option>>,
-  onSelect: (value: string) => void,
-  renderOption?: (option: Object) => React.Element<*>,
-  resetOnBlur: boolean,
-  value?: string
-|};
-*/
+interface Option {
+  label: string;
+  value: string;
+}
 
-/*::
-type State = {
-  loading: boolean,
-  options: Array<Option>,
-  query: string
-};
-*/
+interface Props {
+  autofocus?: boolean;
+  defaultOptions?: Option[];
+  minimumQueryLength?: number;
+  onSearch: (query: string) => Promise<Option[]>;
+  onSelect: (value: string) => void;
+  renderOption?: (option: Object) => JSX.Element;
+  resetOnBlur?: boolean;
+  value?: string;
+}
 
-export default class SearchSelect extends React.PureComponent {
-  /*:: mounted: boolean; */
-  /*:: props: Props; */
-  /*:: state: State; */
+interface State {
+  loading: boolean;
+  options: Option[];
+  query: string;
+}
 
-  static defaultProps = {
-    autofocus: true,
-    minimumQueryLength: 2,
-    resetOnBlur: true
-  };
+export default class SearchSelect extends React.PureComponent<Props, State> {
+  mounted: boolean;
 
-  constructor(props /*: Props */) {
+  constructor(props: Props) {
     super(props);
-    this.state = { loading: false, options: [], query: '' };
-    this.search = debounce(this.search, 250);
+    this.state = { loading: false, options: props.defaultOptions || [], query: '' };
+    this.handleSearch = debounce(this.handleSearch, 250);
   }
 
   componentDidMount() {
@@ -72,7 +61,18 @@ export default class SearchSelect extends React.PureComponent {
     this.mounted = false;
   }
 
-  search = (query /*: string */) => {
+  get autofocus() {
+    return this.props.autofocus !== undefined ? this.props.autofocus : true;
+  }
+
+  get minimumQueryLength() {
+    return this.props.minimumQueryLength !== undefined ? this.props.minimumQueryLength : 2;
+  }
+  get resetOnBlur() {
+    return this.props.resetOnBlur !== undefined ? this.props.resetOnBlur : true;
+  }
+
+  handleSearch = (query: string) =>
     this.props.onSearch(query).then(
       options => {
         if (this.mounted) {
@@ -85,20 +85,18 @@ export default class SearchSelect extends React.PureComponent {
         }
       }
     );
-  };
 
-  handleChange = (option /*: Option */) => {
-    this.props.onSelect(option.value);
-  };
+  handleChange = (option: Option) => this.props.onSelect(option.value);
 
-  handleInputChange = (query /*: string */) => {
+  handleInputChange = (query: string) => {
     // `onInputChange` is called with an empty string after a user selects a value
     // in this case we shouldn't reset `options`, because it also resets select value :(
-    if (query.length >= this.props.minimumQueryLength) {
+    if (query.length >= this.minimumQueryLength) {
       this.setState({ loading: true, query });
-      this.search(query);
-    } else if (query.length > 0) {
-      this.setState({ options: [], query });
+      this.handleSearch(query);
+    } else {
+      const options = (query.length === 0 && this.props.defaultOptions) || [];
+      this.setState({ options, query });
     }
   };
 
@@ -108,21 +106,19 @@ export default class SearchSelect extends React.PureComponent {
   render() {
     return (
       <Select
-        autofocus={this.props.autofocus}
-        cache={false}
+        autofocus={this.autofocus}
         className="input-super-large"
         clearable={false}
         filterOption={this.handleFilterOption}
         isLoading={this.state.loading}
         noResultsText={
-          this.state.query.length < this.props.minimumQueryLength
-            ? translateWithParameters('select2.tooShort', this.props.minimumQueryLength)
+          this.state.query.length < this.minimumQueryLength
+            ? translateWithParameters('select2.tooShort', this.minimumQueryLength)
             : translate('select2.noMatches')
         }
-        onBlurResetsInput={this.props.resetOnBlur}
+        onBlurResetsInput={this.resetOnBlur}
         onChange={this.handleChange}
         onInputChange={this.handleInputChange}
-        onOpen={this.props.minimumQueryLength === 0 ? this.handleInputChange : undefined}
         optionRenderer={this.props.renderOption}
         options={this.state.options}
         placeholder={translate('search_verb')}
diff --git a/server/sonar-web/src/main/js/components/controls/__tests__/SearchSelect-test.js b/server/sonar-web/src/main/js/components/controls/__tests__/SearchSelect-test.tsx
similarity index 98%
rename from server/sonar-web/src/main/js/components/controls/__tests__/SearchSelect-test.js
rename to server/sonar-web/src/main/js/components/controls/__tests__/SearchSelect-test.tsx
index 0f8017bf766..34d964549b4 100644
--- a/server/sonar-web/src/main/js/components/controls/__tests__/SearchSelect-test.js
+++ b/server/sonar-web/src/main/js/components/controls/__tests__/SearchSelect-test.tsx
@@ -17,7 +17,7 @@
  * 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 * as React from 'react';
 import { shallow } from 'enzyme';
 import SearchSelect from '../SearchSelect';
 
diff --git a/server/sonar-web/src/main/js/components/controls/__tests__/__snapshots__/SearchSelect-test.js.snap b/server/sonar-web/src/main/js/components/controls/__tests__/__snapshots__/SearchSelect-test.tsx.snap
similarity index 96%
rename from server/sonar-web/src/main/js/components/controls/__tests__/__snapshots__/SearchSelect-test.js.snap
rename to server/sonar-web/src/main/js/components/controls/__tests__/__snapshots__/SearchSelect-test.tsx.snap
index 00b34224f8c..0ecd070f31d 100644
--- a/server/sonar-web/src/main/js/components/controls/__tests__/__snapshots__/SearchSelect-test.js.snap
+++ b/server/sonar-web/src/main/js/components/controls/__tests__/__snapshots__/SearchSelect-test.tsx.snap
@@ -3,7 +3,6 @@
 exports[`should render Select 1`] = `
 <Select
   autofocus={true}
-  cache={false}
   className="input-super-large"
   clearable={false}
   filterOption={[Function]}
diff --git a/server/sonar-web/src/main/js/components/facet/__tests__/__snapshots__/FacetFooter-test.js.snap b/server/sonar-web/src/main/js/components/facet/__tests__/__snapshots__/FacetFooter-test.js.snap
index e57d0a002f6..9043a2cc22c 100644
--- a/server/sonar-web/src/main/js/components/facet/__tests__/__snapshots__/FacetFooter-test.js.snap
+++ b/server/sonar-web/src/main/js/components/facet/__tests__/__snapshots__/FacetFooter-test.js.snap
@@ -6,10 +6,8 @@ exports[`should render 1`] = `
 >
   <SearchSelect
     autofocus={false}
-    minimumQueryLength={2}
     onSearch={[MockFunction]}
     onSelect={[MockFunction]}
-    resetOnBlur={true}
   />
 </div>
 `;
-- 
2.39.5