NETOBSERV-1294 fix features check

netobserv · Sep 12, 2023 · 754ad9a · 754ad9a
1 parent 83c6b3d
commit 754ad9a
Show file tree

Hide file tree

Showing 3 changed files with 53 additions and 22 deletions.
diff --git a/web/src/components/dropdowns/metric-type-dropdown.tsx b/web/src/components/dropdowns/metric-type-dropdown.tsx
@@ -3,17 +3,30 @@ import * as React from 'react';
 import { useTranslation } from 'react-i18next';
 import { MetricType } from '../../model/flow-query';
 
-const metricTypeOptions: MetricType[] = ['bytes', 'packets', 'dnsLatencies', 'flowRtt'];
-
 export const MetricTypeDropdown: React.FC<{
   selected?: string;
   setMetricType: (v: MetricType) => void;
   isTopology?: boolean;
+  allowDNSMetric?: boolean;
+  allowRTTMetric?: boolean;
   id?: string;
-}> = ({ selected, setMetricType, id, isTopology }) => {
+}> = ({ selected, setMetricType, id, isTopology, allowDNSMetric, allowRTTMetric }) => {
   const { t } = useTranslation('plugin__netobserv-plugin');
   const [metricDropdownOpen, setMetricDropdownOpen] = React.useState(false);
 
+  const getMetricTypeOptions = React.useCallback(() => {
+    const options: MetricType[] = ['bytes', 'packets'];
+    if (isTopology) {
+      if (allowDNSMetric) {
+        options.push('dnsLatencies');
+      }
+      if (allowRTTMetric) {
+        options.push('flowRtt');
+      }
+    }
+    return options;
+  }, [allowDNSMetric, allowRTTMetric, isTopology]);
+
   const getMetricDisplay = React.useCallback(
     (metricType: MetricType): string => {
       switch (metricType) {
@@ -47,21 +60,19 @@ export const MetricTypeDropdown: React.FC<{
         </DropdownToggle>
       }
       isOpen={metricDropdownOpen}
-      dropdownItems={metricTypeOptions
-        .filter(v => isTopology || !['dnsLatencies', 'flowRtt'].includes(v))
-        .map(v => (
-          <DropdownItem
-            data-test={v}
-            id={v}
-            key={v}
-            onClick={() => {
-              setMetricDropdownOpen(false);
-              setMetricType(v);
-            }}
-          >
-            {getMetricDisplay(v)}
-          </DropdownItem>
-        ))}
+      dropdownItems={getMetricTypeOptions().map(v => (
+        <DropdownItem
+          data-test={v}
+          id={v}
+          key={v}
+          onClick={() => {
+            setMetricDropdownOpen(false);
+            setMetricType(v);
+          }}
+        >
+          {getMetricDisplay(v)}
+        </DropdownItem>
+      ))}
     />
   );
 };

diff --git a/web/src/components/dropdowns/topology-display-dropdown.tsx b/web/src/components/dropdowns/topology-display-dropdown.tsx
@@ -25,6 +25,8 @@ export const TopologyDisplayOptions: React.FC<{
   setMetricScope: (s: FlowScope) => void;
   topologyOptions: TopologyOptions;
   setTopologyOptions: (o: TopologyOptions) => void;
+  allowDNSMetric: boolean;
+  allowRTTMetric: boolean;
 }> = ({
   metricFunction,
   setMetricFunction,
@@ -33,7 +35,9 @@ export const TopologyDisplayOptions: React.FC<{
   metricScope,
   setMetricScope,
   topologyOptions,
-  setTopologyOptions
+  setTopologyOptions,
+  allowDNSMetric,
+  allowRTTMetric
 }) => {
   const { t } = useTranslation('plugin__netobserv-plugin');
 
@@ -86,6 +90,8 @@ export const TopologyDisplayOptions: React.FC<{
                 isTopology
                 selected={metricType}
                 setMetricType={setMetricType}
+                allowDNSMetric={allowDNSMetric}
+                allowRTTMetric={allowRTTMetric}
               />
             </FlexItem>
           </Flex>
@@ -225,6 +231,8 @@ export const TopologyDisplayDropdown: React.FC<{
   setMetricScope: (s: FlowScope) => void;
   topologyOptions: TopologyOptions;
   setTopologyOptions: (o: TopologyOptions) => void;
+  allowDNSMetric: boolean;
+  allowRTTMetric: boolean;
 }> = ({
   metricFunction,
   setMetricFunction,
@@ -233,7 +241,9 @@ export const TopologyDisplayDropdown: React.FC<{
   metricScope,
   setMetricScope,
   topologyOptions,
-  setTopologyOptions
+  setTopologyOptions,
+  allowDNSMetric,
+  allowRTTMetric
 }) => {
   const { t } = useTranslation('plugin__netobserv-plugin');
   const [isOpen, setOpen] = React.useState<boolean>(false);
@@ -255,6 +265,8 @@ export const TopologyDisplayDropdown: React.FC<{
             setMetricScope={setMetricScope}
             topologyOptions={topologyOptions}
             setTopologyOptions={setTopologyOptions}
+            allowDNSMetric={allowDNSMetric}
+            allowRTTMetric={allowRTTMetric}
           />
         }
       />

diff --git a/web/src/components/netflow-traffic.tsx b/web/src/components/netflow-traffic.tsx
@@ -1140,7 +1140,10 @@ export const NetflowTraffic: React.FC<{
             panels={panels.filter(
               panel =>
                 panel.isSelected &&
-                (isPktDrop() || (!panel.id.includes('dropped') && (isDNSTracking() || !panel.id.includes('dns'))))
+                (isPktDrop() ||
+                  (!panel.id.includes('dropped') &&
+                    (isDNSTracking() || !panel.id.includes('dns')) &&
+                    (isFlowRTT() || !panel.id.includes('rtt'))))
             )}
             recordType={recordType}
             metricType={metricType}
@@ -1490,6 +1493,8 @@ export const NetflowTraffic: React.FC<{
                   setMetricScope={setMetricScope}
                   topologyOptions={topologyOptions}
                   setTopologyOptions={setTopologyOptions}
+                  allowDNSMetric={isDNSTracking()}
+                  allowRTTMetric={isFlowRTT()}
                 />
               )}
             </OverflowMenuItem>
@@ -1533,7 +1538,10 @@ export const NetflowTraffic: React.FC<{
         setModalOpen={setOverviewModalOpen}
         recordType={recordType}
         panels={panels.filter(
-          panel => (isPktDrop() || !panel.id.includes('dropped')) && (isDNSTracking() || !panel.id.includes('dns'))
+          panel =>
+            (isPktDrop() || !panel.id.includes('dropped')) &&
+            (isDNSTracking() || !panel.id.includes('dns')) &&
+            (isFlowRTT() || !panel.id.includes('rtt'))
         )}
         setPanels={setSelectedPanels}
       />