Merge pull request #4233 from vojtechszocs/migrate-all-dashboard-exte…

…nsions Migrate all dashboard extensions
openshift · Mar 20, 2020 · a8121c1 · a8121c1
2 parents c02a510 + 19cfff5
commit a8121c1
Show file tree

Hide file tree

Showing 22 changed files with 639 additions and 552 deletions.
diff --git a/frontend/packages/ceph-storage-plugin/src/extensions/dashboards.ts b/frontend/packages/ceph-storage-plugin/src/extensions/dashboards.ts
@@ -1,4 +1,12 @@
-import { Extension, DashboardsExtensionProperties } from '@console/plugin-sdk';
+import { Extension } from '@console/plugin-sdk';
+
+interface DashboardsExtensionProperties {
+  /** Feature flags which are required for this extension to be effective. */
+  required?: string | string[];
+
+  /** Feature flags which are disallowed for this extension to be effective. */
+  disallowed?: string | string[];
+}
 
 namespace ExtensionProperties {
   export interface DashboardsStorageCapacityDropdownItem extends DashboardsExtensionProperties {

diff --git a/frontend/packages/ceph-storage-plugin/src/plugin.ts b/frontend/packages/ceph-storage-plugin/src/plugin.ts
@@ -99,8 +99,10 @@ const plugin: Plugin<ConsumedExtensions> = [
     properties: {
       id: 'persistent-storage',
       title: 'Persistent Storage',
-      required: CEPH_FLAG,
-      disallowed: OCS_INDEPENDENT_FLAG,
+    },
+    flags: {
+      required: [CEPH_FLAG],
+      disallowed: [OCS_INDEPENDENT_FLAG],
     },
   },
   {
@@ -125,7 +127,9 @@ const plugin: Plugin<ConsumedExtensions> = [
         import(
           './components/dashboard-page/storage-dashboard/details-card' /* webpackChunkName: "ceph-storage-details-card" */
         ).then((m) => m.default),
-      required: CEPH_FLAG,
+    },
+    flags: {
+      required: [CEPH_FLAG],
     },
   },
   {
@@ -137,7 +141,9 @@ const plugin: Plugin<ConsumedExtensions> = [
         import(
           './components/dashboard-page/storage-dashboard/inventory-card' /* webpackChunkName: "ceph-storage-inventory-card" */
         ).then((m) => m.default),
-      required: CEPH_FLAG,
+    },
+    flags: {
+      required: [CEPH_FLAG],
     },
   },
   // Ceph Storage Dashboard Main Cards
@@ -150,7 +156,9 @@ const plugin: Plugin<ConsumedExtensions> = [
         import(
           './components/dashboard-page/storage-dashboard/status-card/status-card' /* webpackChunkName: "ceph-storage-status-card" */
         ).then((m) => m.default),
-      required: CEPH_FLAG,
+    },
+    flags: {
+      required: [CEPH_FLAG],
     },
   },
   {
@@ -162,7 +170,9 @@ const plugin: Plugin<ConsumedExtensions> = [
         import(
           './components/dashboard-page/storage-dashboard/capacity-breakdown/capacity-breakdown-card' /* webpackChunkName: "ceph-storage-usage-breakdown-card" */
         ).then((m) => m.default),
-      required: CEPH_FLAG,
+    },
+    flags: {
+      required: [CEPH_FLAG],
     },
   },
   {
@@ -174,7 +184,9 @@ const plugin: Plugin<ConsumedExtensions> = [
         import(
           './components/dashboard-page/storage-dashboard/utilization-card/utilization-card' /* webpackChunkName: "ceph-storage-utilization-card" */
         ).then((m) => m.default),
-      required: CEPH_FLAG,
+    },
+    flags: {
+      required: [CEPH_FLAG],
     },
   },
   // Ceph Storage Dashboard Right Cards
@@ -187,7 +199,9 @@ const plugin: Plugin<ConsumedExtensions> = [
         import(
           './components/dashboard-page/storage-dashboard/activity-card/activity-card' /* webpackChunkName: "ceph-storage-activity-card" */
         ).then((m) => m.ActivityCard),
-      required: CEPH_FLAG,
+    },
+    flags: {
+      required: [CEPH_FLAG],
     },
   },
   {
@@ -196,7 +210,9 @@ const plugin: Plugin<ConsumedExtensions> = [
       title: 'Storage',
       queries: [STORAGE_HEALTH_QUERIES[StorageDashboardQuery.CEPH_STATUS_QUERY]],
       healthHandler: getCephHealthState,
-      required: CEPH_FLAG,
+    },
+    flags: {
+      required: [CEPH_FLAG],
     },
   },
   {
@@ -205,7 +221,9 @@ const plugin: Plugin<ConsumedExtensions> = [
       id: OverviewQuery.STORAGE_UTILIZATION,
       query: CAPACITY_USAGE_QUERIES[StorageDashboardQuery.CEPH_CAPACITY_USED],
       totalQuery: CAPACITY_USAGE_QUERIES[StorageDashboardQuery.CEPH_CAPACITY_TOTAL],
-      required: CEPH_FLAG,
+    },
+    flags: {
+      required: [CEPH_FLAG],
     },
   },
   {
@@ -255,7 +273,9 @@ const plugin: Plugin<ConsumedExtensions> = [
     properties: {
       id: 'independent-dashboard',
       title: 'Persistent Storage',
-      required: OCS_INDEPENDENT_FLAG,
+    },
+    flags: {
+      required: [OCS_INDEPENDENT_FLAG],
     },
   },
   // Left Cards
@@ -268,7 +288,9 @@ const plugin: Plugin<ConsumedExtensions> = [
         import(
           './components/independent-dashboard-page/details-card/card' /* webpackChunkName: "indepedent-details-card" */
         ).then((m) => m.default),
-      required: OCS_INDEPENDENT_FLAG,
+    },
+    flags: {
+      required: [OCS_INDEPENDENT_FLAG],
     },
   },
   {
@@ -280,7 +302,9 @@ const plugin: Plugin<ConsumedExtensions> = [
         import(
           './components/dashboard-page/storage-dashboard/inventory-card' /* webpackChunkName: "ceph-storage-inventory-card" */
         ).then((m) => m.default),
-      required: OCS_INDEPENDENT_FLAG,
+    },
+    flags: {
+      required: [OCS_INDEPENDENT_FLAG],
     },
   },
   // Center
@@ -293,7 +317,9 @@ const plugin: Plugin<ConsumedExtensions> = [
         import(
           './components/independent-dashboard-page/status-card/card' /* webpackChunkName: "indepedent-status-card" */
         ).then((m) => m.default),
-      required: OCS_INDEPENDENT_FLAG,
+    },
+    flags: {
+      required: [OCS_INDEPENDENT_FLAG],
     },
   },
   {
@@ -305,7 +331,9 @@ const plugin: Plugin<ConsumedExtensions> = [
         import(
           './components/independent-dashboard-page/breakdown-card/card' /* webpackChunkName: "independent-breakdown-card" */
         ).then((m) => m.default),
-      required: OCS_INDEPENDENT_FLAG,
+    },
+    flags: {
+      required: [OCS_INDEPENDENT_FLAG],
     },
   },
   {
@@ -317,7 +345,9 @@ const plugin: Plugin<ConsumedExtensions> = [
         import(
           './components/independent-dashboard-page/utilization-card/card' /* webpackChunkName: "utilization-card" */
         ).then((m) => m.default),
-      required: OCS_INDEPENDENT_FLAG,
+    },
+    flags: {
+      required: [OCS_INDEPENDENT_FLAG],
     },
   },
   // Right
@@ -330,7 +360,9 @@ const plugin: Plugin<ConsumedExtensions> = [
         import(
           './components/dashboard-page/storage-dashboard/activity-card/activity-card' /* webpackChunkName: "ceph-storage-activity-card" */
         ).then((m) => m.ActivityCard),
-      required: OCS_INDEPENDENT_FLAG,
+    },
+    flags: {
+      required: [OCS_INDEPENDENT_FLAG],
     },
   },
   {
@@ -361,7 +393,9 @@ const plugin: Plugin<ConsumedExtensions> = [
         import(
           './components/dashboard-page/storage-dashboard/activity-card/cluster-expand-activity' /* webpackChunkName: "ceph-storage-plugin" */
         ).then((m) => m.ClusterExpandActivity),
-      required: CEPH_FLAG,
+    },
+    flags: {
+      required: [CEPH_FLAG],
     },
   },
 ];

diff --git a/frontend/packages/console-app/src/__tests__/extension-checks/dashboards.spec.ts b/frontend/packages/console-app/src/__tests__/extension-checks/dashboards.spec.ts
@@ -1,9 +1,10 @@
 import * as _ from 'lodash';
-import { testedRegistry } from '../plugin-test-utils';
+import { isDashboardsOverviewUtilizationItem } from '@console/plugin-sdk';
+import { testedExtensions } from '../plugin-test-utils';
 
 describe('DashboardsOverviewUtilizationItem', () => {
   it('duplicate ids are not allowed', () => {
-    const items = testedRegistry.getDashboardsOverviewUtilizationItems();
+    const items = testedExtensions.toArray().filter(isDashboardsOverviewUtilizationItem);
     const dedupedItems = _.uniqWith(items, (a, b) => a.properties.id === b.properties.id);
     const duplicateItems = _.difference(items, dedupedItems);
 

diff --git a/frontend/packages/console-app/src/plugin.tsx b/frontend/packages/console-app/src/plugin.tsx
@@ -78,7 +78,9 @@ const plugin: Plugin<ConsumedExtensions> = [
         import(
           './components/dashboards-page/ClusterUpdateActivity' /* webpackChunkName: "console-app" */
         ).then((m) => m.default),
-      required: FLAGS.CLUSTER_VERSION,
+    },
+    flags: {
+      required: [FLAGS.CLUSTER_VERSION],
     },
   },
   {
@@ -157,7 +159,9 @@ const plugin: Plugin<ConsumedExtensions> = [
           './components/dashboards-page/OperatorStatus' /* webpackChunkName: "console-app" */
         ).then((c) => c.default),
       viewAllLink: '/settings/cluster/clusteroperators',
-      required: FLAGS.CLUSTER_VERSION,
+    },
+    flags: {
+      required: [FLAGS.CLUSTER_VERSION],
     },
   },
 ];

diff --git a/frontend/packages/console-demo-plugin/src/plugin.tsx b/frontend/packages/console-demo-plugin/src/plugin.tsx
@@ -56,6 +56,8 @@ type ConsumedExtensions =
   | DashboardsOverviewPrometheusActivity
   | HorizontalNavTab;
 
+const TEST_MODEL_FLAG = 'TEST_MODEL';
+
 const plugin: Plugin<ConsumedExtensions> = [
   {
     type: 'ModelDefinition',
@@ -67,7 +69,7 @@ const plugin: Plugin<ConsumedExtensions> = [
     type: 'FeatureFlag/Model',
     properties: {
       model: PodModel,
-      flag: 'TEST_MODEL_FLAG',
+      flag: TEST_MODEL_FLAG,
     },
   },
   {
@@ -80,7 +82,7 @@ const plugin: Plugin<ConsumedExtensions> = [
       },
     },
     flags: {
-      required: ['TEST_MODEL_FLAG'],
+      required: [TEST_MODEL_FLAG],
     },
   },
   {
@@ -93,7 +95,7 @@ const plugin: Plugin<ConsumedExtensions> = [
       },
     },
     flags: {
-      required: ['TEST_MODEL_FLAG'],
+      required: [TEST_MODEL_FLAG],
     },
   },
   {
@@ -106,7 +108,7 @@ const plugin: Plugin<ConsumedExtensions> = [
       },
     },
     flags: {
-      required: [FLAGS.OPENSHIFT, 'TEST_MODEL_FLAG'],
+      required: [FLAGS.OPENSHIFT, TEST_MODEL_FLAG],
     },
   },
   {
@@ -153,7 +155,9 @@ const plugin: Plugin<ConsumedExtensions> = [
       title: 'Foo system',
       url: 'fooUrl',
       healthHandler: getFooHealthState,
-      required: 'TEST_MODEL_FLAG',
+    },
+    flags: {
+      required: [TEST_MODEL_FLAG],
     },
   },
   {
@@ -168,7 +172,9 @@ const plugin: Plugin<ConsumedExtensions> = [
         namespaced: false,
         prop: 'nodes',
       },
-      required: 'TEST_MODEL_FLAG',
+    },
+    flags: {
+      required: [TEST_MODEL_FLAG],
     },
   },
   {
@@ -205,7 +211,9 @@ const plugin: Plugin<ConsumedExtensions> = [
     properties: {
       id: 'foo-tab',
       title: 'Foo',
-      required: 'TEST_MODEL_FLAG',
+    },
+    flags: {
+      required: [TEST_MODEL_FLAG],
     },
   },
   {
@@ -217,7 +225,9 @@ const plugin: Plugin<ConsumedExtensions> = [
         import('./components/dashboards/foo-card' /* webpackChunkName: "demo" */).then(
           (m) => m.FooCard,
         ),
-      required: 'TEST_MODEL_FLAG',
+    },
+    flags: {
+      required: [TEST_MODEL_FLAG],
     },
   },
   {
@@ -229,15 +239,19 @@ const plugin: Plugin<ConsumedExtensions> = [
         import(
           './components/dashboards/inventory' /* webpackChunkName: "demo-inventory-item" */
         ).then((m) => m.ExpandedRoutes),
-      required: 'TEST_MODEL_FLAG',
+    },
+    flags: {
+      required: [TEST_MODEL_FLAG],
     },
   },
   {
     type: 'Dashboards/Inventory/Item/Group',
     properties: {
       id: 'demo-inventory-group',
       icon: <DemoGroupIcon />,
-      required: 'TEST_MODEL_FLAG',
+    },
+    flags: {
+      required: [TEST_MODEL_FLAG],
     },
   },
   {
@@ -246,7 +260,9 @@ const plugin: Plugin<ConsumedExtensions> = [
       id: OverviewQuery.STORAGE_UTILIZATION,
       query: 'barQuery',
       totalQuery: 'fooQuery',
-      required: 'TEST_MODEL_FLAG',
+    },
+    flags: {
+      required: [TEST_MODEL_FLAG],
     },
   },
   {
@@ -264,7 +280,9 @@ const plugin: Plugin<ConsumedExtensions> = [
         import('./components/dashboards/activity' /* webpackChunkName: "demo" */).then(
           (m) => m.DemoActivity,
         ),
-      required: 'TEST_MODEL_FLAG',
+    },
+    flags: {
+      required: [TEST_MODEL_FLAG],
     },
   },
   {
@@ -276,7 +294,9 @@ const plugin: Plugin<ConsumedExtensions> = [
         import('./components/dashboards/activity' /* webpackChunkName: "demo" */).then(
           (m) => m.DemoPrometheusActivity,
         ),
-      required: 'TEST_MODEL_FLAG',
+    },
+    flags: {
+      required: [TEST_MODEL_FLAG],
     },
   },
   {