SONAR-8693 Do not allow to filter portfolios or applications by status on management page

4 files changed, 114 insertions, 55 deletions

diff --git a/server/sonar-web/src/main/js/apps/projectsManagement/__tests__/App-test.tsx b/server/sonar-web/src/main/js/apps/projectsManagement/__tests__/App-test.tsx
index ae2cfdcee0e..07339957c4c 100644
--- a/server/sonar-web/src/main/js/apps/projectsManagement/__tests__/App-test.tsx
+++ b/server/sonar-web/src/main/js/apps/projectsManagement/__tests__/App-test.tsx
@@ -23,6 +23,13 @@ jest.mock('lodash', () => {
   return lodash;
 });
 
+// actual version breaks `mount`
+jest.mock('rc-tooltip', () => ({
+  default: function Tooltip() {
+    return null;
+  }
+}));
+
 jest.mock('../../../api/components', () => ({
   getComponents: jest.fn(),
   getProvisioned: jest.fn(() => Promise.resolve({ paging: { total: 0 }, projects: [] }))
@@ -31,7 +38,6 @@ jest.mock('../../../api/components', () => ({
 import * as React from 'react';
 import { mount } from 'enzyme';
 import App, { Props } from '../App';
-import { Type } from '../utils';
 
 const getComponents = require('../../../api/components').getComponents as jest.Mock<any>;
 const getProvisioned = require('../../../api/components').getProvisioned as jest.Mock<any>;
@@ -57,15 +63,15 @@ it('fetches all projects on mount', () => {
   expect(getComponents).lastCalledWith({ ...defaultSearchParameters, qualifiers: 'TRK' });
 });
 
-it('changes type', () => {
+it('selects provisioned', () => {
   const wrapper = mountRender();
-  wrapper.find('Search').prop<Function>('onTypeChanged')(Type.Provisioned);
+  wrapper.find('Search').prop<Function>('onProvisionedChanged')(true);
   expect(getProvisioned).lastCalledWith(defaultSearchParameters);
 });
 
-it('changes qualifier and resets type', () => {
+it('changes qualifier and resets provisioned', () => {
   const wrapper = mountRender();
-  wrapper.setState({ type: Type.Provisioned });
+  wrapper.setState({ provisioned: true });
   wrapper.find('Search').prop<Function>('onQualifierChanged')('VW');
   expect(getComponents).lastCalledWith({ ...defaultSearchParameters, qualifiers: 'VW' });
 });
diff --git a/server/sonar-web/src/main/js/apps/projectsManagement/__tests__/BulkApplyTemplateModal-test.tsx b/server/sonar-web/src/main/js/apps/projectsManagement/__tests__/BulkApplyTemplateModal-test.tsx
index 1c8399e6eda..6f11a5d48da 100644
--- a/server/sonar-web/src/main/js/apps/projectsManagement/__tests__/BulkApplyTemplateModal-test.tsx
+++ b/server/sonar-web/src/main/js/apps/projectsManagement/__tests__/BulkApplyTemplateModal-test.tsx
@@ -26,7 +26,6 @@ jest.mock('../../../api/permissions', () => ({
 import * as React from 'react';
 import { mount, shallow } from 'enzyme';
 import BulkApplyTemplateModal, { Props } from '../BulkApplyTemplateModal';
-import { Type } from '../utils';
 import { click } from '../../../helpers/testUtils';
 
 const applyTemplateToProject = require('../../../api/permissions')
@@ -117,11 +116,11 @@ function render(props?: { [P in keyof Props]?: Props[P] }) {
     <BulkApplyTemplateModal
       onClose={jest.fn()}
       organization="org"
+      provisioned={true}
       qualifier="TRK"
       query="bla"
       selection={[]}
       total={17}
-      type={Type.All}
       {...props}
     />
   );
diff --git a/server/sonar-web/src/main/js/apps/projectsManagement/__tests__/Search-test.tsx b/server/sonar-web/src/main/js/apps/projectsManagement/__tests__/Search-test.tsx
index 950b78e1624..2c0ee5f2348 100644
--- a/server/sonar-web/src/main/js/apps/projectsManagement/__tests__/Search-test.tsx
+++ b/server/sonar-web/src/main/js/apps/projectsManagement/__tests__/Search-test.tsx
@@ -20,7 +20,6 @@
 import * as React from 'react';
 import { shallow } from 'enzyme';
 import Search, { Props } from '../Search';
-import { Type } from '../utils';
 import { change, click } from '../../../helpers/testUtils';
 
 const organization = { key: 'org', name: 'org', projectVisibility: 'public' };
@@ -36,15 +35,22 @@ it('render qualifiers filter', () => {
 it('updates qualifier', () => {
   const onQualifierChanged = jest.fn();
   const wrapper = shallowRender({ onQualifierChanged, topLevelQualifiers: ['TRK', 'VW', 'APP'] });
-  wrapper.find('RadioToggle[name="projects-qualifier"]').prop<Function>('onCheck')('VW');
+  wrapper.find('Select[name="projects-qualifier"]').prop<Function>('onChange')({ value: 'VW' });
   expect(onQualifierChanged).toBeCalledWith('VW');
 });
 
-it('updates type', () => {
-  const onTypeChanged = jest.fn();
-  const wrapper = shallowRender({ onTypeChanged });
-  wrapper.find('RadioToggle[name="projects-type"]').prop<Function>('onCheck')(Type.Provisioned);
-  expect(onTypeChanged).toBeCalledWith(Type.Provisioned);
+it('selects provisioned', () => {
+  const onProvisionedChanged = jest.fn();
+  const wrapper = shallowRender({ onProvisionedChanged });
+  wrapper.find('Checkbox[id="projects-provisioned"]').prop<Function>('onCheck')(true);
+  expect(onProvisionedChanged).toBeCalledWith(true);
+});
+
+it('does not render provisioned filter for portfolios', () => {
+  const wrapper = shallowRender();
+  expect(wrapper.find('Checkbox[id="projects-provisioned"]').exists()).toBeTruthy();
+  wrapper.setProps({ qualifiers: 'VW' });
+  expect(wrapper.find('Checkbox[id="projects-provisioned"]').exists()).toBeFalsy();
 });
 
 it('searches', () => {
@@ -59,10 +65,10 @@ it('checks all or none projects', () => {
   const onAllSelected = jest.fn();
   const wrapper = shallowRender({ onAllDeselected, onAllSelected });
 
-  wrapper.find('Checkbox').prop<Function>('onCheck')(true);
+  wrapper.find('Checkbox[id="projects-selection"]').prop<Function>('onCheck')(true);
   expect(onAllSelected).toBeCalled();
 
-  wrapper.find('Checkbox').prop<Function>('onCheck')(false);
+  wrapper.find('Checkbox[id="projects-selection"]').prop<Function>('onCheck')(false);
   expect(onAllDeselected).toBeCalled();
 });
 
@@ -89,18 +95,18 @@ function shallowRender(props?: { [P in keyof Props]?: Props[P] }) {
       onAllDeselected={jest.fn()}
       onAllSelected={jest.fn()}
       onDeleteProjects={jest.fn()}
+      onProvisionedChanged={jest.fn()}
       onQualifierChanged={jest.fn()}
       onSearch={jest.fn()}
-      onTypeChanged={jest.fn()}
       organization={organization}
       projects={[]}
+      provisioned={false}
       qualifiers="TRK"
       query=""
       ready={true}
       selection={[]}
       topLevelQualifiers={['TRK']}
       total={0}
-      type={Type.All}
       {...props}
     />
   );
diff --git a/server/sonar-web/src/main/js/apps/projectsManagement/__tests__/__snapshots__/Search-test.tsx.snap b/server/sonar-web/src/main/js/apps/projectsManagement/__tests__/__snapshots__/Search-test.tsx.snap
index eb9c3bd28ca..c8c1006646c 100644
--- a/server/sonar-web/src/main/js/apps/projectsManagement/__tests__/__snapshots__/Search-test.tsx.snap
+++ b/server/sonar-web/src/main/js/apps/projectsManagement/__tests__/__snapshots__/Search-test.tsx.snap
@@ -4,11 +4,11 @@ exports[`bulk applies permission template 1`] = `
 <BulkApplyTemplateModal
   onClose={[Function]}
   organization="org"
+  provisioned={false}
   qualifier="TRK"
   query=""
   selection={Array []}
   total={0}
-  type="ALL"
 />
 `;
 
@@ -41,6 +41,7 @@ exports[`render qualifiers filter 1`] = `
         >
           <Checkbox
             checked={false}
+            id="projects-selection"
             onCheck={[Function]}
             thirdState={false}
           />
@@ -48,10 +49,40 @@ exports[`render qualifiers filter 1`] = `
         <td
           className="thin nowrap text-middle"
         >
-          <RadioToggle
+          <Select
+            addLabelText="Add \\"{label}\\"?"
+            arrowRenderer={[Function]}
+            autosize={true}
+            backspaceRemoves={true}
+            backspaceToRemoveMessage="Press backspace to remove {label}"
+            className="input-medium"
+            clearAllText="Clear all"
+            clearRenderer={[Function]}
+            clearValueText="Clear value"
+            clearable={false}
+            deleteRemoves={true}
+            delimiter=","
             disabled={false}
+            escapeClearsValue={true}
+            filterOptions={[Function]}
+            ignoreAccents={true}
+            ignoreCase={true}
+            inputProps={Object {}}
+            isLoading={false}
+            joinValues={false}
+            labelKey="label"
+            matchPos="any"
+            matchProp="any"
+            menuBuffer={0}
+            menuRenderer={[Function]}
+            multi={false}
             name="projects-qualifier"
-            onCheck={[Function]}
+            noResultsText="No results found"
+            onBlurResetsInput={true}
+            onChange={[Function]}
+            onCloseResetsInput={true}
+            optionComponent={[Function]}
+            optionRenderer={[Function]}
             options={
               Array [
                 Object {
@@ -68,30 +99,43 @@ exports[`render qualifiers filter 1`] = `
                 },
               ]
             }
+            pageSize={5}
+            placeholder="Select..."
+            required={false}
+            scrollMenuIntoView={true}
+            searchable={false}
+            simpleValue={false}
+            tabSelectsValue={true}
             value="TRK"
+            valueComponent={[Function]}
+            valueKey="value"
+            valueRenderer={[Function]}
           />
         </td>
         <td
           className="thin nowrap text-middle"
         >
-          <RadioToggle
-            disabled={false}
-            name="projects-type"
+          <Checkbox
+            checked={false}
+            className="link-checkbox-control"
+            id="projects-provisioned"
             onCheck={[Function]}
-            options={
-              Array [
-                Object {
-                  "label": "All",
-                  "value": "ALL",
-                },
-                Object {
-                  "label": "Provisioned",
-                  "value": "PROVISIONED",
-                },
-              ]
-            }
-            value="ALL"
-          />
+            thirdState={false}
+          >
+            <span
+              className="little-spacer-left"
+            >
+              provisioning.only_provisioned
+              <Tooltip
+                overlay="provisioning.only_provisioned.tooltip"
+                placement="bottom"
+              >
+                <i
+                  className="spacer-left icon-help"
+                />
+              </Tooltip>
+            </span>
+          </Checkbox>
         </td>
         <td
           className="text-middle"
@@ -153,6 +197,7 @@ exports[`renders 1`] = `
         >
           <Checkbox
             checked={false}
+            id="projects-selection"
             onCheck={[Function]}
             thirdState={false}
           />
@@ -160,24 +205,27 @@ exports[`renders 1`] = `
         <td
           className="thin nowrap text-middle"
         >
-          <RadioToggle
-            disabled={false}
-            name="projects-type"
+          <Checkbox
+            checked={false}
+            className="link-checkbox-control"
+            id="projects-provisioned"
             onCheck={[Function]}
-            options={
-              Array [
-                Object {
-                  "label": "All",
-                  "value": "ALL",
-                },
-                Object {
-                  "label": "Provisioned",
-                  "value": "PROVISIONED",
-                },
-              ]
-            }
-            value="ALL"
-          />
+            thirdState={false}
+          >
+            <span
+              className="little-spacer-left"
+            >
+              provisioning.only_provisioned
+              <Tooltip
+                overlay="provisioning.only_provisioned.tooltip"
+                placement="bottom"
+              >
+                <i
+                  className="spacer-left icon-help"
+                />
+              </Tooltip>
+            </span>
+          </Checkbox>
         </td>
         <td
           className="text-middle"