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

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

Hide file tree

Showing 14 changed files with 247 additions and 43 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/src/components/productView/__tests__/__snapshots__/productView.test.js.snap b/src/components/productView/__tests__/__snapshots__/productView.test.js.snap
@@ -97,6 +97,93 @@ exports[`ProductView Component should allow custom product views: custom graphCa
       />
     </Connect(GraphCard)>
   </PageSection>
+  <PageSection
+    className=""
+  >
+    <Connect(InventoryTabs)
+      key="inventory_lorem ipsum"
+      productId="lorem ipsum"
+    >
+      <InventoryTab
+        active={false}
+        key="inventory_hosts_lorem ipsum"
+        title="t(curiosity-inventory.tabHosts, {\\"context\\":\\"noInstances_lorem ipsum\\"})"
+      >
+        <Connect(InventoryList)
+          key="inv_lorem ipsum"
+          productId="lorem ipsum"
+          query={Object {}}
+          viewId="dolor sit"
+        />
+      </InventoryTab>
+    </Connect(InventoryTabs)>
+  </PageSection>
+</PageLayout>
+`;
+
+exports[`ProductView Component should allow custom product views: custom tabs, subscriptions table 1`] = `
+<PageLayout
+  className=""
+>
+  <PageHeader
+    includeTour={false}
+    productLabel="lorem ipsum product label"
+    t={[Function]}
+  >
+    t(curiosity-view.title, {"appName":"Subscriptions","context":"lorem ipsum product label"})
+  </PageHeader>
+  <PageMessages
+    className=""
+  >
+    <Connect(BannerMessages)
+      productId="lorem ipsum"
+      query={Object {}}
+      viewId="dolor sit"
+    />
+  </PageMessages>
+  <PageToolbar
+    className=""
+  >
+    dolor sit
+  </PageToolbar>
+  <PageSection
+    className=""
+  >
+    <Connect(GraphCard)
+      cardTitle={
+        <React.Fragment>
+          t(curiosity-graph.cardHeading, {"context":"lorem ipsum"})
+          <Tooltip
+            content={
+              <p>
+                t(curiosity-graph.cardHeadingDescription, {"context":"lorem ipsum"})
+              </p>
+            }
+            distance={5}
+            enableFlip={false}
+            entryDelay={100}
+            exitDelay={0}
+            position="top"
+          >
+            <sup
+              className="curiosity-icon__info"
+            >
+              <InfoCircleIcon
+                color="currentColor"
+                noVerticalAlign={false}
+                size="sm"
+              />
+            </sup>
+          </Tooltip>
+        </React.Fragment>
+      }
+      key="graph_lorem ipsum"
+      productId="lorem ipsum"
+      productLabel="lorem ipsum product label"
+      query={Object {}}
+      viewId="dolor sit"
+    />
+  </PageSection>
   <PageSection
     className=""
   >
@@ -122,6 +209,7 @@ exports[`ProductView Component should allow custom product views: custom graphCa
         title="t(curiosity-inventory.tabSubscriptions, {\\"context\\":\\"lorem ipsum\\"})"
       >
         <Connect(InventorySubscriptions)
+          filterInventoryData={Array []}
           key="subs_lorem ipsum"
           productId="lorem ipsum"
           query={Object {}}
@@ -193,18 +281,6 @@ exports[`ProductView Component should allow custom product views: custom toolbar
           viewId="dolor sit"
         />
       </InventoryTab>
-      <InventoryTab
-        active={false}
-        key="inventory_subs_lorem ipsum"
-        title="t(curiosity-inventory.tabSubscriptions, {\\"context\\":\\"lorem ipsum\\"})"
-      >
-        <Connect(InventorySubscriptions)
-          key="subs_lorem ipsum"
-          productId="lorem ipsum"
-          query={Object {}}
-          viewId="dolor sit"
-        />
-      </InventoryTab>
     </Connect(InventoryTabs)>
   </PageSection>
 </PageLayout>
@@ -270,18 +346,6 @@ exports[`ProductView Component should allow custom product views: custom toolbar
           viewId="dolor sit"
         />
       </InventoryTab>
-      <InventoryTab
-        active={false}
-        key="inventory_subs_lorem ipsum"
-        title="t(curiosity-inventory.tabSubscriptions, {\\"context\\":\\"lorem ipsum\\"})"
-      >
-        <Connect(InventorySubscriptions)
-          key="subs_lorem ipsum"
-          productId="lorem ipsum"
-          query={Object {}}
-          viewId="dolor sit"
-        />
-      </InventoryTab>
     </Connect(InventoryTabs)>
   </PageSection>
 </PageLayout>
@@ -381,18 +445,6 @@ exports[`ProductView Component should render a non-connected component: non-conn
           viewId="dolor sit"
         />
       </InventoryTab>
-      <InventoryTab
-        active={false}
-        key="inventory_subs_lorem ipsum"
-        title="t(curiosity-inventory.tabSubscriptions, {\\"context\\":\\"lorem ipsum\\"})"
-      >
-        <Connect(InventorySubscriptions)
-          key="subs_lorem ipsum"
-          productId="lorem ipsum"
-          query={Object {}}
-          viewId="dolor sit"
-        />
-      </InventoryTab>
     </Connect(InventoryTabs)>
   </PageSection>
 </PageLayout>

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/__tests__/productView.test.js b/src/components/productView/__tests__/productView.test.js
@@ -61,5 +61,15 @@ describe('ProductView Component', () => {
     });
 
     expect(component).toMatchSnapshot('custom toolbar, toolbarProduct');
+
+    component.setProps({
+      ...props,
+      routeDetail: {
+        ...props.routeDetail,
+        productConfig: [{ lorem: 'ipsum', initialSubscriptionsInventoryFilters: [] }]
+      }
+    });
+
+    expect(component).toMatchSnapshot('custom tabs, subscriptions table');
   });
 });
diff --git a/src/components/productView/productView.js b/src/components/productView/productView.js
@@ -162,7 +162,7 @@ const ProductView = ({ routeDetail, t, toolbarGraph, toolbarGraphDescription, to
               viewId={viewId}
             />
           </InventoryTab>
-          {!helpers.UI_DISABLED_TABLE_SUBSCRIPTIONS && (
+          {initialSubscriptionsInventoryFilters && (
             <InventoryTab
               key={`inventory_subs_${productId}`}
               title={t('curiosity-inventory.tabSubscriptions', { context: productId })}

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 [