SQBILLING-88 Add coupon input in billing upgrade page

* Update plugin dependencies
* Update license headers
* Better support to disable inputs and react-select

6 files changed, 35 insertions, 13 deletions

diff --git a/server/sonar-web/src/main/js/app/styles/components/menu.css b/server/sonar-web/src/main/js/app/styles/components/menu.css
index 11e247b18a0..0ae00301aa3 100644
--- a/server/sonar-web/src/main/js/app/styles/components/menu.css
+++ b/server/sonar-web/src/main/js/app/styles/components/menu.css
@@ -58,6 +58,8 @@
 
 .menu > li > a.disabled {
   color: #bbb !important;
+  cursor: not-allowed !important;
+  pointer-events: none !important;
 }
 
 .menu > li > a:hover,
diff --git a/server/sonar-web/src/main/js/app/styles/init/forms.css b/server/sonar-web/src/main/js/app/styles/init/forms.css
index 60d8fb53f3e..98a484ef21e 100644
--- a/server/sonar-web/src/main/js/app/styles/init/forms.css
+++ b/server/sonar-web/src/main/js/app/styles/init/forms.css
@@ -80,6 +80,20 @@ select.invalid {
   border-color: var(--red);
 }
 
+input.disabled,
+input:disabled,
+textarea.disabled,
+textarea:disabled,
+select.disabled,
+select:disabled {
+  color: var(--disableGrayText) !important;
+  border-color: var(--disableGrayBorder) !important;
+  background: var(--disableGrayBg) !important;
+  cursor: not-allowed !important;
+  pointer-events: none !important;
+  box-shadow: none !important;
+}
+
 input[type='text'],
 input[type='password'],
 input[type='email'],
@@ -177,9 +191,9 @@ button:disabled:focus,
 .button:disabled:focus,
 input[type='submit']:disabled:focus,
 input[type='button']:disabled:focus {
-  color: #bbb !important;
-  border-color: #ddd !important;
-  background: #ebebeb !important;
+  color: var(--disableGrayText) !important;
+  border-color: var(--disableGrayBorder) !important;
+  background: var(--disableGrayBg) !important;
   cursor: not-allowed !important;
   box-shadow: none !important;
 }
diff --git a/server/sonar-web/src/main/js/app/theme.js b/server/sonar-web/src/main/js/app/theme.js
index dd39fe0a445..434a6bc2ecc 100644
--- a/server/sonar-web/src/main/js/app/theme.js
+++ b/server/sonar-web/src/main/js/app/theme.js
@@ -40,6 +40,10 @@ module.exports = {
   gray60: '#999',
   gray40: '#404040',
 
+  disableGrayText: '#bbb',
+  disableGrayBorder: '#ddd',
+  disableGrayBg: '#ebebeb',
+
   barBackgroundColor: '#f3f3f3',
   barBorderColor: '#e6e6e6',
 
diff --git a/server/sonar-web/src/main/js/components/common/MultiSelectOption.tsx b/server/sonar-web/src/main/js/components/common/MultiSelectOption.tsx
index 879bdada43f..ffdea8dd9e4 100644
--- a/server/sonar-web/src/main/js/components/common/MultiSelectOption.tsx
+++ b/server/sonar-web/src/main/js/components/common/MultiSelectOption.tsx
@@ -50,11 +50,7 @@ export default class MultiSelectOption extends React.PureComponent<Props> {
       'icon-checkbox-checked': selected,
       'icon-checkbox-invisible': disabled
     });
-    const activeClass = classNames({
-      active: this.props.active,
-      disabled,
-      'cursor-not-allowed': disabled
-    });
+    const activeClass = classNames({ active: this.props.active, disabled });
 
     return (
       <li>
diff --git a/server/sonar-web/src/main/js/components/common/__tests__/__snapshots__/MultiSelectOption-test.tsx.snap b/server/sonar-web/src/main/js/components/common/__tests__/__snapshots__/MultiSelectOption-test.tsx.snap
index 3f9a5cc7ef5..ff5048c163c 100644
--- a/server/sonar-web/src/main/js/components/common/__tests__/__snapshots__/MultiSelectOption-test.tsx.snap
+++ b/server/sonar-web/src/main/js/components/common/__tests__/__snapshots__/MultiSelectOption-test.tsx.snap
@@ -40,7 +40,7 @@ exports[`should render custom element 1`] = `
 exports[`should render disabled element 1`] = `
 <li>
   <a
-    className="disabled cursor-not-allowed"
+    className="disabled"
     href="#"
     onClick={[Function]}
     onFocus={[Function]}
diff --git a/server/sonar-web/src/main/js/components/controls/react-select.css b/server/sonar-web/src/main/js/components/controls/react-select.css
index a8bc7eac879..bac1d66a0b8 100644
--- a/server/sonar-web/src/main/js/components/controls/react-select.css
+++ b/server/sonar-web/src/main/js/components/controls/react-select.css
@@ -33,16 +33,22 @@
 }
 
 .Select.is-disabled > .Select-control {
-  background-color: #f9f9f9;
+  background-color: var(--disableGrayBg) !important;
+  border-color: var(--disableGrayBorder) !important;
 }
 
 .Select.is-disabled > .Select-control:hover {
-  box-shadow: none;
+  box-shadow: none !important;
 }
 
 .Select.is-disabled .Select-arrow-zone {
-  cursor: default;
-  pointer-events: none;
+  cursor: not-allowed !important;
+  pointer-events: none !important;
+}
+
+.Select.is-disabled .Select-placeholder,
+.Select.is-disabled .Select-value {
+  color: var(--disableGrayText) !important;
 }
 
 .Select-control {