ISPN-13510 Cache Metrics size fix

* added t hook and externalise the labels into the properties file * Toltips for Heap and off-heap metrics * Integration Testing * change in the metrics for heap and off-heap memory storage * cache size metrics labels and tooltips
infinispan · Jan 28, 2022 · 562bb47 · 562bb47
1 parent e03a797
commit 562bb47
Show file tree

Hide file tree

Showing 4 changed files with 106 additions and 16 deletions.
diff --git a/cypress/integration/cache-metrics-spec.js b/cypress/integration/cache-metrics-spec.js
@@ -0,0 +1,44 @@
+describe('Cache Metrics Overview', () => {
+    it('successfully checks cache metrics', () => {
+      cy.visit('http://localhost:11222/console/cache/people', {
+               headers: {
+                       "Accept-Encoding": "gzip, deflate, br"
+                        }
+      });
+
+      //Check for Labels
+      cy.contains('Metrics (Enabled)').click();;
+      cy.contains('Current number of entries');
+      cy.contains('Minimum number of nodes');
+      cy.contains('Size of cache in off-heap memory');
+      cy.contains('Size of cache in heap memory');
+
+      // Check for data greater than -1
+      cy.get('dt[aria-label="view-cache-metrics-size"]').invoke('text').then(parseFloat).should('be.gt', -1)
+      cy.get('dt[aria-label="view-cache-metrics-nodes"]').invoke('text').then(parseFloat).should('be.gt', -1)
+    })
+
+    it('successfully checks cache metrics for heap memory', () => {
+      cy.visit('http://localhost:11222/console/cache/heap-test', {
+              headers: {
+                "Accept-Encoding": "gzip, deflate, br"
+                }
+      });
+
+      cy.contains('Metrics (Enabled)').click();
+      cy.get('dt[aria-label="view-cache-metrics-heap"]').invoke('text').then(parseFloat).should('be.gt', -1)
+
+    })
+
+    it('successfully checks cache metrics for off-heap memory', () => {
+      cy.visit('http://localhost:11222/console/cache/off-heap-test', {
+              headers: {
+                "Accept-Encoding": "gzip, deflate, br"
+                }
+      });
+
+      cy.contains('Metrics (Enabled)').click();
+      cy.get('dt[aria-label="view-cache-metrics-off-heap"]').invoke('text').then(parseFloat).should('be.gt', -1)
+    })
+
+});
diff --git a/scripts/infinispan-no-secured.xml b/scripts/infinispan-no-secured.xml
@@ -15,6 +15,16 @@
     <distributed-cache-configuration name="e2e-test-template">
       <encoding media-type="application/x-protostream"/>
     </distributed-cache-configuration>
+    <distributed-cache name="heap-test" statistics="true">
+      <transaction mode="NON_XA"/>
+      <memory storage="HEAP" max-size="1.5GB"/>
+      <encoding media-type="application/x-protostream"/>
+    </distributed-cache>
+    <distributed-cache name="off-heap-test" statistics="true">
+      <transaction mode="NON_XA"/>
+      <memory storage="OFF_HEAP"/>
+      <encoding media-type="application/x-protostream"/>
+    </distributed-cache>
   </cache-container>
 
   <server xmlns="urn:infinispan:server:13.0">

diff --git a/src/app/Caches/CacheMetrics.tsx b/src/app/Caches/CacheMetrics.tsx
@@ -24,15 +24,31 @@ import {CubesIcon} from '@patternfly/react-icons';
 import {QueryMetrics} from '@app/Caches/Query/QueryMetrics';
 import {ConsoleServices} from "@services/ConsoleServices";
 import {CustomCardTitle} from "@app/Common/CustomCardTitle";
+import {MoreInfoTooltip} from '@app/Common/MoreInfoTooltip';
+import { useTranslation } from 'react-i18next';
 
 const CacheMetrics = (props: { cacheName: string; display: boolean }) => {
   const [stats, setStats] = useState<CacheStats | undefined>(undefined);
   const [statsError, setStatsError] = useState<string | undefined>(undefined);
   const [displayQueryStats, setDisplayQueryStats] = useState<boolean>(false);
+  const [size, setSize] = useState<number|undefined>(0)
+  const [memory, setMemory] = useState<string|undefined>(undefined)
+  const { t } = useTranslation();
 
   useEffect(() => {
     ConsoleServices.caches().retrieveFullDetail(props.cacheName).then((detail) => {
       if (detail.isRight()) {
+
+        // Load the memory storage and size eviction
+        const loadMemory = JSON.parse(detail.value.configuration.config)["distributed-cache"]
+        if(loadMemory.memory){
+          if(loadMemory.memory.storage==="HEAP" && loadMemory.memory["max-size"])
+            setMemory(loadMemory.memory.storage)
+          else if(loadMemory.memory.storage==="OFF_HEAP")
+            setMemory(loadMemory.memory.storage)
+        }
+
+        setSize(detail.value.size)
         setStats(detail.value.stats);
         let loadQueryStats =
           detail.value.stats != undefined && detail.value.stats.enabled && detail.value.features.indexed;
@@ -175,7 +191,7 @@ const CacheMetrics = (props: { cacheName: string; display: boolean }) => {
   };
 
   const buildEntriesCard = () => {
-    if (!stats) {
+  if (!stats) {
       return '';
     }
 
@@ -185,17 +201,23 @@ const CacheMetrics = (props: { cacheName: string; display: boolean }) => {
         <CardBody>
           <TextContent>
             <TextList component={TextListVariants.dl}>
-              <TextListItem component={TextListItemVariants.dt}>
-                {displayUtils.formatNumber(stats.current_number_of_entries)}
+              <TextListItem aria-label="view-cache-metrics-size" component={TextListItemVariants.dt}>
+                {displayUtils.formatNumber(size)}
               </TextListItem>
               <TextListItem component={TextListItemVariants.dd}>
-                Current number
+              <MoreInfoTooltip
+                label={t('caches.cache-metrics.current-number-entries')}
+                toolTip={t('caches.cache-metrics.current-number-entries-tooltip')}
+              />
               </TextListItem>
-              <TextListItem component={TextListItemVariants.dt}>
-                {displayUtils.formatNumber(stats.total_number_of_entries)}
+              <TextListItem aria-label="view-cache-metrics-nodes" component={TextListItemVariants.dt}>
+                {displayUtils.formatNumber(stats.required_minimum_number_of_nodes)}
               </TextListItem>
               <TextListItem component={TextListItemVariants.dd}>
-                Total number
+              <MoreInfoTooltip
+              label={t('caches.cache-metrics.min-nodes')}
+              toolTip={t('caches.cache-metrics.min-nodes-tooltip')}
+              />
               </TextListItem>
               <TextListItem component={TextListItemVariants.dd}>-</TextListItem>
             </TextList>
@@ -216,19 +238,23 @@ const CacheMetrics = (props: { cacheName: string; display: boolean }) => {
         <CardBody>
           <TextContent>
             <TextList component={TextListVariants.dl}>
-              <TextListItem component={TextListItemVariants.dt}>
-                {displayUtils.formatNumber(
-                  stats.current_number_of_entries_in_memory
-                )}
+              <TextListItem aria-label="view-cache-metrics-off-heap" component={TextListItemVariants.dt}>
+                { memory==="OFF_HEAP" ? displayUtils.formatNumber(stats.off_heap_memory_used) : "-" }
               </TextListItem>
               <TextListItem component={TextListItemVariants.dd}>
-                Current number
+                <MoreInfoTooltip
+                  label={t('caches.cache-metrics.cache-size-off-heap')}
+                  toolTip={memory==="OFF_HEAP" ? '': t('caches.cache-metrics.cache-size-off-heap-tooltip')}
+                />
               </TextListItem>
-              <TextListItem component={TextListItemVariants.dt}>
-                {displayUtils.formatNumber(stats.data_memory_used)}
+              <TextListItem aria-label="view-cache-metrics-heap" component={TextListItemVariants.dt}>
+                { memory==="HEAP" ? displayUtils.formatNumber(stats.data_memory_used) : "-" }
               </TextListItem>
               <TextListItem component={TextListItemVariants.dd}>
-                Total in use
+                <MoreInfoTooltip
+                  label={t('caches.cache-metrics.cache-size-heap')}
+                  toolTip={memory==="HEAP" ? '': t('caches.cache-metrics.cache-size-heap-tooltip')}
+                />
               </TextListItem>
               <TextListItem component={TextListItemVariants.dd}>-</TextListItem>
             </TextList>
@@ -239,7 +265,7 @@ const CacheMetrics = (props: { cacheName: string; display: boolean }) => {
   };
 
   if (!stats?.enabled) {
-    const message = 'Statistics disabled.';
+    const message = 'Statistics are disabled.';
 
     return (
       <EmptyState variant={EmptyStateVariant.small}>

diff --git a/src/app/assets/languages/en.json b/src/app/assets/languages/en.json
@@ -275,6 +275,16 @@
       "modal-available-description": "will become available for read and write operations.",
       "modal-available-button-done": "OK",
       "modal-available-button-cancel": "Cancel"
+    },
+    "cache-metrics":{
+      "current-number-entries":"Current number of entries",
+      "current-number-entries-tooltip":"Displays the number of entries that are stored in the cache. Each entry is counted only once so the number does not include replicas.",
+      "min-nodes":"Minimum number of nodes",
+      "min-nodes-tooltip":"Displays the number of nodes that must remain in the cluster to avoid data loss.",
+      "cache-size-off-heap":"Size of cache in off-heap memory",
+      "cache-size-off-heap-tooltip":"Displays the amount of off-heap memory that data in the cache uses. Total memory usage is higher because it includes internal data structures.",
+      "cache-size-heap":"Size of cache in heap memory",
+      "cache-size-heap-tooltip":"Displays the amount of JVM heap memory that data in the cache uses. Total memory usage is higher because it includes internal data structures."
     }
   }
 }