SONAR-9936 Better handling of button disabled depending on the edition status

3 files changed, 114 insertions, 18 deletions

diff --git a/server/sonar-web/src/main/js/apps/marketplace/components/EditionBox.tsx b/server/sonar-web/src/main/js/apps/marketplace/components/EditionBox.tsx
index 147cb081c5f..91142a45cf7 100644
--- a/server/sonar-web/src/main/js/apps/marketplace/components/EditionBox.tsx
+++ b/server/sonar-web/src/main/js/apps/marketplace/components/EditionBox.tsx
@@ -33,10 +33,13 @@ export default class EditionBox extends React.PureComponent<Props> {
 
   render() {
     const { edition, editionStatus } = this.props;
-    const isInstalled = editionStatus && editionStatus.currentEditionKey === edition.key;
-    const isInstalling = editionStatus && editionStatus.nextEditionKey === edition.key;
     const installInProgress =
-      editionStatus && editionStatus.installationStatus === 'AUTOMATIC_IN_PROGRESS';
+      editionStatus &&
+      ['AUTOMATIC_IN_PROGRESS', 'AUTOMATIC_READY'].includes(editionStatus.installationStatus);
+    const installReady = editionStatus && editionStatus.installationStatus === 'AUTOMATIC_READY';
+    const isInstalled = editionStatus && editionStatus.currentEditionKey === edition.key;
+    const isInstalling =
+      installInProgress && editionStatus && editionStatus.nextEditionKey === edition.key;
     return (
       <div className="boxed-group boxed-group-inner marketplace-edition">
         {isInstalled &&
@@ -48,7 +51,7 @@ export default class EditionBox extends React.PureComponent<Props> {
         )}
         {isInstalling && (
           <span className="marketplace-edition-badge badge badge-normal-size">
-            {translate('marketplace.installing')}
+            {installReady ? translate('marketplace.pending') : translate('marketplace.installing')}
           </span>
         )}
         <div>
diff --git a/server/sonar-web/src/main/js/apps/marketplace/components/__tests__/EditionBox-test.tsx b/server/sonar-web/src/main/js/apps/marketplace/components/__tests__/EditionBox-test.tsx
index 2b89b1bc1e2..c1a000d33ad 100644
--- a/server/sonar-web/src/main/js/apps/marketplace/components/__tests__/EditionBox-test.tsx
+++ b/server/sonar-web/src/main/js/apps/marketplace/components/__tests__/EditionBox-test.tsx
@@ -59,7 +59,19 @@ it('should display installing badge', () => {
       editionStatus: {
         currentEditionKey: 'foo',
         nextEditionKey: 'foo',
-        installationStatus: 'NONE'
+        installationStatus: 'AUTOMATIC_IN_PROGRESS'
+      }
+    })
+  ).toMatchSnapshot();
+});
+
+it('should display pending badge', () => {
+  expect(
+    getWrapper({
+      editionStatus: {
+        currentEditionKey: '',
+        nextEditionKey: 'foo',
+        installationStatus: 'AUTOMATIC_READY'
       }
     })
   ).toMatchSnapshot();
@@ -69,19 +81,28 @@ it('should disable install button', () => {
   expect(
     getWrapper({
       editionStatus: {
-        currentEditionKey: 'foo',
-        nextEditionKey: '',
+        currentEditionKey: '',
+        nextEditionKey: 'foo',
         installationStatus: 'AUTOMATIC_IN_PROGRESS'
       }
     })
   ).toMatchSnapshot();
+  expect(
+    getWrapper({
+      editionStatus: {
+        currentEditionKey: '',
+        nextEditionKey: 'foo',
+        installationStatus: 'AUTOMATIC_READY'
+      }
+    })
+  ).toMatchSnapshot();
 });
 
 it('should disable uninstall button', () => {
   expect(
     getWrapper({
       editionStatus: {
-        currentEditionKey: '',
+        currentEditionKey: 'foo',
         nextEditionKey: 'foo',
         installationStatus: 'AUTOMATIC_IN_PROGRESS'
       }
diff --git a/server/sonar-web/src/main/js/apps/marketplace/components/__tests__/__snapshots__/EditionBox-test.tsx.snap b/server/sonar-web/src/main/js/apps/marketplace/components/__tests__/__snapshots__/EditionBox-test.tsx.snap
index e37bd585c1b..6aabd158c3a 100644
--- a/server/sonar-web/src/main/js/apps/marketplace/components/__tests__/__snapshots__/EditionBox-test.tsx.snap
+++ b/server/sonar-web/src/main/js/apps/marketplace/components/__tests__/__snapshots__/EditionBox-test.tsx.snap
@@ -7,11 +7,7 @@ exports[`should disable install button 1`] = `
   <span
     className="marketplace-edition-badge badge badge-normal-size"
   >
-    <CheckIcon
-      className="little-spacer-right text-text-top"
-      size={14}
-    />
-    marketplace.installed
+    marketplace.installing
   </span>
   <div>
     <h3
@@ -33,23 +29,23 @@ exports[`should disable install button 1`] = `
       marketplace.learn_more
     </a>
     <button
-      className="button-red"
       disabled={true}
+      onClick={[Function]}
     >
-      marketplace.uninstall
+      marketplace.install
     </button>
   </div>
 </div>
 `;
 
-exports[`should disable uninstall button 1`] = `
+exports[`should disable install button 2`] = `
 <div
   className="boxed-group boxed-group-inner marketplace-edition"
 >
   <span
     className="marketplace-edition-badge badge badge-normal-size"
   >
-    marketplace.installing
+    marketplace.pending
   </span>
   <div>
     <h3
@@ -80,6 +76,44 @@ exports[`should disable uninstall button 1`] = `
 </div>
 `;
 
+exports[`should disable uninstall button 1`] = `
+<div
+  className="boxed-group boxed-group-inner marketplace-edition"
+>
+  <span
+    className="marketplace-edition-badge badge badge-normal-size"
+  >
+    marketplace.installing
+  </span>
+  <div>
+    <h3
+      className="spacer-bottom"
+    >
+      Foo
+    </h3>
+    <p>
+      Foo desc
+    </p>
+  </div>
+  <div
+    className="marketplace-edition-action spacer-top"
+  >
+    <a
+      href="more_url"
+      target="_blank"
+    >
+      marketplace.learn_more
+    </a>
+    <button
+      className="button-red"
+      disabled={true}
+    >
+      marketplace.uninstall
+    </button>
+  </div>
+</div>
+`;
+
 exports[`should display installed badge 1`] = `
 <div
   className="boxed-group boxed-group-inner marketplace-edition"
@@ -152,7 +186,7 @@ exports[`should display installing badge 1`] = `
     </a>
     <button
       className="button-red"
-      disabled={false}
+      disabled={true}
     >
       marketplace.uninstall
     </button>
@@ -160,6 +194,44 @@ exports[`should display installing badge 1`] = `
 </div>
 `;
 
+exports[`should display pending badge 1`] = `
+<div
+  className="boxed-group boxed-group-inner marketplace-edition"
+>
+  <span
+    className="marketplace-edition-badge badge badge-normal-size"
+  >
+    marketplace.pending
+  </span>
+  <div>
+    <h3
+      className="spacer-bottom"
+    >
+      Foo
+    </h3>
+    <p>
+      Foo desc
+    </p>
+  </div>
+  <div
+    className="marketplace-edition-action spacer-top"
+  >
+    <a
+      href="more_url"
+      target="_blank"
+    >
+      marketplace.learn_more
+    </a>
+    <button
+      disabled={true}
+      onClick={[Function]}
+    >
+      marketplace.install
+    </button>
+  </div>
+</div>
+`;
+
 exports[`should display the edition 1`] = `
 <div
   className="boxed-group boxed-group-inner marketplace-edition"