From 82e54bcc77078b71ec406fc5df19fa7107cdef61 Mon Sep 17 00:00:00 2001
From: Philippe Perrin <philippe.perrin@sonarsource.com>
Date: Thu, 17 Sep 2020 17:10:09 +0200
Subject: [PATCH] SONAR-13643 Improve user feedback when there is no plugins

---
 .../src/main/js/apps/marketplace/App.tsx      | 26 ++++++----
 .../apps/marketplace/__tests__/App-test.tsx   | 22 +++++----
 .../__tests__/__snapshots__/App-test.tsx.snap | 47 ++++++++++++-------
 .../resources/org/sonar/l10n/core.properties  |  3 ++
 4 files changed, 63 insertions(+), 35 deletions(-)

diff --git a/server/sonar-web/src/main/js/apps/marketplace/App.tsx b/server/sonar-web/src/main/js/apps/marketplace/App.tsx
index 27289b329c4..1075118cb17 100644
--- a/server/sonar-web/src/main/js/apps/marketplace/App.tsx
+++ b/server/sonar-web/src/main/js/apps/marketplace/App.tsx
@@ -20,6 +20,7 @@
 import { sortBy, uniqBy } from 'lodash';
 import * as React from 'react';
 import { Helmet } from 'react-helmet-async';
+import DeferredSpinner from 'sonar-ui-common/components/ui/DeferredSpinner';
 import { translate } from 'sonar-ui-common/helpers/l10n';
 import {
   getAvailablePlugins,
@@ -135,16 +136,21 @@ export class App extends React.PureComponent<Props, State> {
           updateCenterActive={this.props.updateCenterActive}
           updateQuery={this.updateQuery}
         />
-        {loadingPlugins && <i className="spinner" />}
-        {!loadingPlugins && (
-          <PluginsList
-            pending={pendingPlugins}
-            plugins={filteredPlugins}
-            readOnly={!standaloneMode}
-            refreshPending={this.props.fetchPendingPlugins}
-          />
-        )}
-        {!loadingPlugins && <Footer total={filteredPlugins.length} />}
+        <DeferredSpinner loading={loadingPlugins}>
+          {filteredPlugins.length === 0 &&
+            translate('marketplace.plugin_list.no_plugins', query.filter)}
+          {filteredPlugins.length > 0 && (
+            <>
+              <PluginsList
+                pending={pendingPlugins}
+                plugins={filteredPlugins}
+                readOnly={!standaloneMode}
+                refreshPending={this.props.fetchPendingPlugins}
+              />
+              <Footer total={filteredPlugins.length} />
+            </>
+          )}
+        </DeferredSpinner>
       </div>
     );
   }
diff --git a/server/sonar-web/src/main/js/apps/marketplace/__tests__/App-test.tsx b/server/sonar-web/src/main/js/apps/marketplace/__tests__/App-test.tsx
index ed16e97c189..2d390431bb7 100644
--- a/server/sonar-web/src/main/js/apps/marketplace/__tests__/App-test.tsx
+++ b/server/sonar-web/src/main/js/apps/marketplace/__tests__/App-test.tsx
@@ -29,19 +29,25 @@ import {
 import { mockLocation, mockRouter } from '../../../helpers/testMocks';
 import { App } from '../App';
 
-jest.mock('../../../api/plugins', () => ({
-  getAvailablePlugins: jest.fn().mockResolvedValue({ plugins: [] }),
-  getInstalledPlugins: jest.fn().mockResolvedValue([]),
-  getInstalledPluginsWithUpdates: jest.fn().mockResolvedValue([]),
-  getPluginUpdates: jest.fn().mockResolvedValue([])
-}));
+jest.mock('../../../api/plugins', () => {
+  const plugin = jest.requireActual('../../../helpers/mocks/plugins').mockPlugin();
+
+  return {
+    getAvailablePlugins: jest.fn().mockResolvedValue({ plugins: [plugin] }),
+    getInstalledPlugins: jest.fn().mockResolvedValue([]),
+    getInstalledPluginsWithUpdates: jest.fn().mockResolvedValue([]),
+    getPluginUpdates: jest.fn().mockResolvedValue([])
+  };
+});
 
 beforeEach(jest.clearAllMocks);
 
-it('should render correctly', () => {
+it('should render correctly', async () => {
   const wrapper = shallowRender();
   expect(wrapper).toMatchSnapshot('loading');
-  expect(wrapper.setState({ loadingPlugins: false })).toMatchSnapshot('loaded');
+
+  await waitAndUpdate(wrapper);
+  expect(wrapper).toMatchSnapshot('loaded');
 });
 
 it('should fetch plugin info', async () => {
diff --git a/server/sonar-web/src/main/js/apps/marketplace/__tests__/__snapshots__/App-test.tsx.snap b/server/sonar-web/src/main/js/apps/marketplace/__tests__/__snapshots__/App-test.tsx.snap
index 8b49373723e..09a6bc145c1 100644
--- a/server/sonar-web/src/main/js/apps/marketplace/__tests__/__snapshots__/App-test.tsx.snap
+++ b/server/sonar-web/src/main/js/apps/marketplace/__tests__/__snapshots__/App-test.tsx.snap
@@ -39,21 +39,32 @@ exports[`should render correctly: loaded 1`] = `
     updateCenterActive={false}
     updateQuery={[Function]}
   />
-  <PluginsList
-    pending={
-      Object {
-        "installing": Array [],
-        "removing": Array [],
-        "updating": Array [],
+  <DeferredSpinner
+    loading={false}
+  >
+    <PluginsList
+      pending={
+        Object {
+          "installing": Array [],
+          "removing": Array [],
+          "updating": Array [],
+        }
       }
-    }
-    plugins={Array []}
-    readOnly={true}
-    refreshPending={[MockFunction]}
-  />
-  <Footer
-    total={0}
-  />
+      plugins={
+        Array [
+          Object {
+            "key": "sonar-foo",
+            "name": "Sonar Foo",
+          },
+        ]
+      }
+      readOnly={true}
+      refreshPending={[MockFunction]}
+    />
+    <Footer
+      total={1}
+    />
+  </DeferredSpinner>
 </div>
 `;
 
@@ -96,8 +107,10 @@ exports[`should render correctly: loading 1`] = `
     updateCenterActive={false}
     updateQuery={[Function]}
   />
-  <i
-    className="spinner"
-  />
+  <DeferredSpinner
+    loading={true}
+  >
+    marketplace.plugin_list.no_plugins.all
+  </DeferredSpinner>
 </div>
 `;
diff --git a/sonar-core/src/main/resources/org/sonar/l10n/core.properties b/sonar-core/src/main/resources/org/sonar/l10n/core.properties
index 7d61696fff8..afb4e3092de 100644
--- a/sonar-core/src/main/resources/org/sonar/l10n/core.properties
+++ b/sonar-core/src/main/resources/org/sonar/l10n/core.properties
@@ -2558,6 +2558,9 @@ marketplace.page.you_are_running.enterprise=You are currently running an Enterpr
 marketplace.page.you_are_running.datacenter=You are currently running a Data Center Edition.
 marketplace.page.plugins=Plugins
 marketplace.page.plugins.description=Plugins available in the MarketPlace are not provided or supported by SonarSource. Please reach out directly to their maintainers for support.
+marketplace.plugin_list.no_plugins.all=No installed plugins or updates available
+marketplace.plugin_list.no_plugins.installed=No installed plugins
+marketplace.plugin_list.no_plugins.updates=No plugin updates available
 marketplace.instance_needs_to_be_restarted_to={instance} needs to be restarted in order to
 marketplace.install_x_plugins=install {nb} plugins
 marketplace.update_x_plugins=update {nb} plugins
-- 
2.39.5