feat(inventorySubscriptions): ent-3352 activate subs table (#795)

* dotenv, productViews, RHEL, OpenShift, activate subs * locales, subs table column headers
RedHatInsights · Sep 21, 2021 · 4b12b82 · 4b12b82
1 parent 956edd1
commit 4b12b82
Show file tree

Hide file tree

Showing 12 changed files with 160 additions and 20 deletions.
diff --git a/.env.production b/.env.production
@@ -2,4 +2,3 @@ REACT_APP_ENV=production
 REACT_APP_UI_VERSION=${UI_VERSION}
 
 REACT_APP_UI_DISABLED_TOOLBAR=false
-REACT_APP_UI_DISABLED_TABLE_SUBSCRIPTIONS=true
diff --git a/public/locales/en-US.json b/public/locales/en-US.json
@@ -112,6 +112,9 @@
     "header_productName": "Product",
     "header_quantity": "Quantity",
     "header_serviceLevel": "Service level",
+    "header_subscriptions": "Sockets",
+    "header_subscriptions_cores": "Cores",
+    "header_subscriptions_sockets": "Sockets",
     "measurementType": "{{context}}",
     "measurementType_cloud": "Public cloud",
     "measurementType_alibaba": "Public cloud",

diff --git a/src/components/i18n/__tests__/__snapshots__/i18n.test.js.snap b/src/components/i18n/__tests__/__snapshots__/i18n.test.js.snap
@@ -498,6 +498,10 @@ Array [
         "key": "curiosity-inventory.header",
         "match": "translate('curiosity-inventory.header', { context: ['cores', 'OpenShift Container Platform'] })",
       },
+      Object {
+        "key": "curiosity-inventory.header",
+        "match": "translate('curiosity-inventory.header', { context: ['subscriptions', data?.uom?.value] })",
+      },
     ],
   },
   Object {
@@ -545,6 +549,10 @@ Array [
         "key": "curiosity-inventory.cloudProvider",
         "match": "translate('curiosity-inventory.cloudProvider', { context: cloudProvider.value })",
       },
+      Object {
+        "key": "curiosity-inventory.header",
+        "match": "translate('curiosity-inventory.header', { context: ['subscriptions', data?.uom?.value] })",
+      },
     ],
   },
   Object {

diff --git a/...components/productView/__tests__/__snapshots__/productViewOpenShiftContainer.test.js.snap b/...components/productView/__tests__/__snapshots__/productViewOpenShiftContainer.test.js.snap
@@ -228,14 +228,28 @@ exports[`ProductViewOpenShiftContainer Component should render a non-connected c
               Array [
                 Object {
                   "id": "productName",
-                  "isSortable": true,
+                  "isSortable": false,
+                  "isWrappable": true,
                 },
                 Object {
                   "cellWidth": 15,
                   "id": "serviceLevel",
                   "isSortable": true,
                   "isWrappable": true,
                 },
+                Object {
+                  "cellWidth": 20,
+                  "id": "quantity",
+                  "isSortable": true,
+                  "isWrappable": true,
+                },
+                Object {
+                  "cellWidth": 15,
+                  "header": [Function],
+                  "id": "totalCapacity",
+                  "isSortable": false,
+                  "isWrappable": true,
+                },
                 Object {
                   "cell": [Function],
                   "cellWidth": 15,

diff --git a/src/components/productView/productView.js b/src/components/productView/productView.js
@@ -162,20 +162,18 @@ const ProductView = ({ routeDetail, t, toolbarGraph, toolbarGraphDescription, to
               viewId={viewId}
             />
           </InventoryTab>
-          {!helpers.UI_DISABLED_TABLE_SUBSCRIPTIONS && (
-            <InventoryTab
-              key={`inventory_subs_${productId}`}
-              title={t('curiosity-inventory.tabSubscriptions', { context: productId })}
-            >
-              <ConnectedInventorySubscriptions
-                key={`subs_${productId}`}
-                filterInventoryData={initialSubscriptionsInventoryFilters}
-                productId={productId}
-                query={initialInventorySubscriptionsQuery}
-                viewId={viewId}
-              />
-            </InventoryTab>
-          )}
+          <InventoryTab
+            key={`inventory_subs_${productId}`}
+            title={t('curiosity-inventory.tabSubscriptions', { context: productId })}
+          >
+            <ConnectedInventorySubscriptions
+              key={`subs_${productId}`}
+              filterInventoryData={initialSubscriptionsInventoryFilters}
+              productId={productId}
+              query={initialInventorySubscriptionsQuery}
+              viewId={viewId}
+            />
+          </InventoryTab>
         </InventoryTabs>
       </PageSection>
     </PageLayout>

diff --git a/src/components/productView/productViewOpenShiftContainer.js b/src/components/productView/productViewOpenShiftContainer.js
@@ -140,7 +140,7 @@ const ProductViewOpenShiftContainer = ({ routeDetail, t }) => {
                 viewId={viewId}
               />
             </InventoryTab>
-            {!helpers.UI_DISABLED_TABLE_SUBSCRIPTIONS && initialSubscriptionsInventoryFilters && (
+            {initialSubscriptionsInventoryFilters && (
               <InventoryTab
                 key={`inventory_subs_${productId}`}
                 title={t('curiosity-inventory.tabSubscriptions', { context: productId })}

diff --git a/src/components/router/__tests__/__snapshots__/redirect.test.js.snap b/src/components/router/__tests__/__snapshots__/redirect.test.js.snap
@@ -116,14 +116,28 @@ Object {
       "initialSubscriptionsInventoryFilters": Array [
         Object {
           "id": "productName",
-          "isSortable": true,
+          "isSortable": false,
+          "isWrappable": true,
         },
         Object {
           "cellWidth": 15,
           "id": "serviceLevel",
           "isSortable": true,
           "isWrappable": true,
         },
+        Object {
+          "cellWidth": 20,
+          "id": "quantity",
+          "isSortable": true,
+          "isWrappable": true,
+        },
+        Object {
+          "cellWidth": 15,
+          "header": [Function],
+          "id": "totalCapacity",
+          "isSortable": false,
+          "isWrappable": true,
+        },
         Object {
           "cell": [Function],
           "cellWidth": 15,

diff --git a/src/config/__tests__/__snapshots__/product.openshiftContainer.test.js.snap b/src/config/__tests__/__snapshots__/product.openshiftContainer.test.js.snap
@@ -282,6 +282,12 @@ Object {
     Object {
       "title": "hello world",
     },
+    Object {
+      "title": "",
+    },
+    Object {
+      "title": "",
+    },
     [Function],
   ],
   "columnHeaders": Array [
@@ -295,6 +301,18 @@ Object {
         [Function],
       ],
     },
+    Object {
+      "title": "t(curiosity-inventory.header, {\\"context\\":\\"quantity\\"})",
+      "transforms": Array [
+        [Function],
+      ],
+    },
+    Object {
+      "title": "t(curiosity-inventory.header, {\\"context\\":\\"subscriptions\\"})",
+      "transforms": Array [
+        [Function],
+      ],
+    },
     Object {
       "title": "t(curiosity-inventory.header, {\\"context\\":\\"nextEventDate\\"})",
       "transforms": Array [
@@ -328,6 +346,12 @@ Object {
     Object {
       "title": "",
     },
+    Object {
+      "title": "",
+    },
+    Object {
+      "title": "",
+    },
     [Function],
   ],
   "columnHeaders": Array [
@@ -341,6 +365,18 @@ Object {
         [Function],
       ],
     },
+    Object {
+      "title": "t(curiosity-inventory.header, {\\"context\\":\\"quantity\\"})",
+      "transforms": Array [
+        [Function],
+      ],
+    },
+    Object {
+      "title": "t(curiosity-inventory.header, {\\"context\\":\\"subscriptions\\"})",
+      "transforms": Array [
+        [Function],
+      ],
+    },
     Object {
       "title": "t(curiosity-inventory.header, {\\"context\\":\\"nextEventDate\\"})",
       "transforms": Array [

diff --git a/src/config/__tests__/__snapshots__/product.rhel.test.js.snap b/src/config/__tests__/__snapshots__/product.rhel.test.js.snap
@@ -314,6 +314,12 @@ Object {
     Object {
       "title": "hello world",
     },
+    Object {
+      "title": "",
+    },
+    Object {
+      "title": "",
+    },
     [Function],
   ],
   "columnHeaders": Array [
@@ -327,6 +333,18 @@ Object {
         [Function],
       ],
     },
+    Object {
+      "title": "t(curiosity-inventory.header, {\\"context\\":\\"quantity\\"})",
+      "transforms": Array [
+        [Function],
+      ],
+    },
+    Object {
+      "title": "t(curiosity-inventory.header, {\\"context\\":\\"subscriptions\\"})",
+      "transforms": Array [
+        [Function],
+      ],
+    },
     Object {
       "title": "t(curiosity-inventory.header, {\\"context\\":\\"nextEventDate\\"})",
       "transforms": Array [
@@ -360,6 +378,12 @@ Object {
     Object {
       "title": "",
     },
+    Object {
+      "title": "",
+    },
+    Object {
+      "title": "",
+    },
     [Function],
   ],
   "columnHeaders": Array [
@@ -373,6 +397,18 @@ Object {
         [Function],
       ],
     },
+    Object {
+      "title": "t(curiosity-inventory.header, {\\"context\\":\\"quantity\\"})",
+      "transforms": Array [
+        [Function],
+      ],
+    },
+    Object {
+      "title": "t(curiosity-inventory.header, {\\"context\\":\\"subscriptions\\"})",
+      "transforms": Array [
+        [Function],
+      ],
+    },
     Object {
       "title": "t(curiosity-inventory.header, {\\"context\\":\\"nextEventDate\\"})",
       "transforms": Array [

diff --git a/src/config/product.openshiftContainer.js b/src/config/product.openshiftContainer.js
@@ -177,14 +177,28 @@ const config = {
   initialSubscriptionsInventoryFilters: [
     {
       id: 'productName',
-      isSortable: true
+      isSortable: false,
+      isWrappable: true
     },
     {
       id: 'serviceLevel',
       isSortable: true,
       isWrappable: true,
       cellWidth: 15
     },
+    {
+      id: 'quantity',
+      isSortable: true,
+      cellWidth: 20,
+      isWrappable: true
+    },
+    {
+      id: 'totalCapacity',
+      header: data => translate('curiosity-inventory.header', { context: ['subscriptions', data?.uom?.value] }),
+      isSortable: false,
+      cellWidth: 15,
+      isWrappable: true
+    },
     {
       id: 'nextEventDate',
       cell: data =>

diff --git a/src/config/product.rhel.js b/src/config/product.rhel.js
@@ -16,6 +16,7 @@ import {
   RHSM_API_QUERY_SORT_TYPES,
   RHSM_API_QUERY_SUBSCRIPTIONS_SORT_TYPES,
   RHSM_API_QUERY_TYPES,
+  RHSM_API_QUERY_UOM_TYPES,
   RHSM_API_PATH_ID_TYPES
 } from '../types/rhsmApiTypes';
 import { dateHelpers, helpers } from '../common';
@@ -35,6 +36,7 @@ const config = {
   productId,
   viewId: `view${productGroup}`,
   query: {
+    [RHSM_API_QUERY_TYPES.UOM]: RHSM_API_QUERY_UOM_TYPES.SOCKETS,
     [RHSM_API_QUERY_TYPES.START_DATE]: dateHelpers.getRangedDateTime(GRANULARITY_TYPES.DAILY).startDate.toISOString(),
     [RHSM_API_QUERY_TYPES.END_DATE]: dateHelpers.getRangedDateTime(GRANULARITY_TYPES.DAILY).endDate.toISOString()
   },
@@ -188,14 +190,28 @@ const config = {
   initialSubscriptionsInventoryFilters: [
     {
       id: 'productName',
-      isSortable: true
+      isSortable: false,
+      isWrappable: true
     },
     {
       id: 'serviceLevel',
       isSortable: true,
       isWrappable: true,
       cellWidth: 15
     },
+    {
+      id: 'quantity',
+      isSortable: true,
+      cellWidth: 10,
+      isWrappable: true
+    },
+    {
+      id: 'totalCapacity',
+      header: data => translate('curiosity-inventory.header', { context: ['subscriptions', data?.uom?.value] }),
+      isSortable: false,
+      cellWidth: 10,
+      isWrappable: true
+    },
     {
       id: 'nextEventDate',
       cell: data =>

diff --git a/src/redux/selectors/subscriptionsListSelectors.js b/src/redux/selectors/subscriptionsListSelectors.js
@@ -110,6 +110,8 @@ const selector = createDeepEqualSelector([statePropsFilter, queryFilter], (respo
       switch (key) {
         case rhsmApiTypes.RHSM_API_RESPONSE_INVENTORY_SUBSCRIPTIONS_DATA_TYPES.NEXT_EVENT_DATE:
           return (value && new Date(value)) || null;
+        case rhsmApiTypes.RHSM_API_RESPONSE_INVENTORY_SUBSCRIPTIONS_DATA_TYPES.UOM:
+          return value?.toLowerCase() || null;
         default:
           return value ?? null;
       }