NETOBSERV-916 Higher CPU utilization seen due to connection tracking

web/locales/en/plugin__netobserv-plugin.json

@@ -39,10 +39,11 @@
   "Match any": "Match any",
   "Log type to query. A conversation is an aggregation of flows between same peers. Only ended conversations will appear in Overview and Topology tabs.": "Log type to query. A conversation is an aggregation of flows between same peers. Only ended conversations will appear in Overview and Topology tabs.",
   "Log type": "Log type",
-  "Only available when FlowCollector.processor.outputRecordTypes option includes at least \"newConnection\", \"heartbeat\" or \"endConnection\"": "Only available when FlowCollector.processor.outputRecordTypes option includes at least \"newConnection\", \"heartbeat\" or \"endConnection\"",
+  "Only available when FlowCollector.processor.outputRecordTypes option equals \"CONNECTIONS\", \"ENDED_CONNECTIONS\" or \"ALL\"": "Only available when FlowCollector.processor.outputRecordTypes option equals \"CONNECTIONS\", \"ENDED_CONNECTIONS\" or \"ALL\"",
+  "Only available when FlowCollector.processor.outputRecordTypes option equals \"FLOWS\" or \"ALL\"": "Only available when FlowCollector.processor.outputRecordTypes option equals \"FLOWS\" or \"ALL\"",
   "Every flow can be reported from the source node and/or the destination node. For in-cluster traffic, usually both source and destination nodes report flows, resulting in duplicated data. Cluster ingress traffic is only reported by destination nodes, and cluster egress by source nodes.": "Every flow can be reported from the source node and/or the destination node. For in-cluster traffic, usually both source and destination nodes report flows, resulting in duplicated data. Cluster ingress traffic is only reported by destination nodes, and cluster egress by source nodes.",
   "Reporter node": "Reporter node",
-  "Only available in Flow Table view": "Only available in Flow Table view",
+  "Only available using \"Flow\" log type. This option will be ignored for \"Conversation\".": "Only available using \"Flow\" log type. This option will be ignored for \"Conversation\".",
   "Whether each query result has to match all the filters or just any of them": "Whether each query result has to match all the filters or just any of them",
   "Match filters": "Match filters",
   "Top items for internal backend queries.": "Top items for internal backend queries.",

web/src/components/dropdowns/__tests__/query-options-dropdown.spec.tsx

@@ -8,6 +8,7 @@ describe('<QueryOptionsDropdown />', () => {
   const props: QueryOptionsDropdownProps = {
     recordType: 'allConnections',
     reporter: 'destination',
+    allowFlow: true,
     allowConnection: true,
     allowReporterBoth: true,
     useTopK: false,
@@ -29,6 +30,7 @@ describe('<QueryOptionsPanel />', () => {
   const props: QueryOptionsDropdownProps = {
     recordType: 'allConnections',
     reporter: 'destination',
+    allowFlow: true,
     allowConnection: true,
     allowReporterBoth: true,
     useTopK: false,

web/src/components/dropdowns/query-options-dropdown.tsx

@@ -11,6 +11,7 @@ export interface QueryOptionsDropdownProps {
   setRecordType: (recordType: RecordType) => void;
   reporter: Reporter;
   setReporter: (reporter: Reporter) => void;
+  allowFlow: boolean;
   allowConnection: boolean;
   allowReporterBoth: boolean;
   useTopK: boolean;
@@ -32,6 +33,7 @@ export const QueryOptionsPanel: React.FC<QueryOptionsDropdownProps> = ({
   setRecordType,
   reporter,
   setReporter,
+  allowFlow,
   allowConnection,
   allowReporterBoth,
   useTopK,
@@ -97,18 +99,24 @@ export const QueryOptionsPanel: React.FC<QueryOptionsDropdownProps> = ({
           </div>
         </Tooltip>
         {recordTypeOptions.map(opt => {
-          const disabled = !allowConnection && opt.value === 'allConnections';
+          const disabled =
+            (!allowFlow && opt.value === 'flowLog') || (!allowConnection && opt.value === 'allConnections');
           return (
             <div key={`recordType-${opt.value}`}>
               <label className="pf-c-select__menu-item">
                 <Tooltip
                   trigger={disabled ? 'mouseenter focus' : ''}
                   content={
                     disabled
-                      ? t(
-                          // eslint-disable-next-line max-len
-                          'Only available when FlowCollector.processor.outputRecordTypes option includes at least "newConnection", "heartbeat" or "endConnection"'
-                        )
+                      ? opt.value === 'allConnections'
+                        ? t(
+                            // eslint-disable-next-line max-len
+                            'Only available when FlowCollector.processor.outputRecordTypes option equals "CONNECTIONS", "ENDED_CONNECTIONS" or "ALL"'
+                          )
+                        : t(
+                            // eslint-disable-next-line max-len
+                            'Only available when FlowCollector.processor.outputRecordTypes option equals "FLOWS" or "ALL"'
+                          )
                       : undefined
                   }
                 >
@@ -148,7 +156,11 @@ export const QueryOptionsPanel: React.FC<QueryOptionsDropdownProps> = ({
               <label className="pf-c-select__menu-item">
                 <Tooltip
                   trigger={disabled ? 'mouseenter focus' : ''}
-                  content={disabled ? t('Only available in Flow Table view') : undefined}
+                  content={
+                    disabled
+                      ? t('Only available using "Flow" log type. This option will be ignored for "Conversation".')
+                      : undefined
+                  }
                 >
                   <Radio
                     isChecked={opt.value === reporter}

web/src/components/filters/__tests__/filters-toolbar.spec.tsx

@@ -18,6 +18,7 @@ describe('<FiltersToolbar />', () => {
       limit: 100,
       recordType: 'allConnections',
       reporter: 'destination',
+      allowFlow: true,
       allowConnection: true,
       allowReporterBoth: true,
       useTopK: false,

web/src/components/netflow-traffic.tsx

@@ -468,10 +468,24 @@ export const NetflowTraffic: React.FC<{
 
   usePoll(tick, interval);
 
+  const isFlow = React.useCallback(() => {
+    return config.recordTypes.some(rt => rt === 'flowLog');
+  }, [config.recordTypes]);
+
   const isConnectionTracking = React.useCallback(() => {
     return config.recordTypes.some(rt => rt === 'newConnection' || rt === 'heartbeat' || rt === 'endConnection');
   }, [config.recordTypes]);
 
+  React.useEffect(() => {
+    if (initState.current.includes('configLoaded')) {
+      if (recordType === 'flowLog' && !isFlow() && isConnectionTracking()) {
+        setRecordType('allConnections');
+      } else if (recordType === 'allConnections' && isFlow() && !isConnectionTracking()) {
+        setRecordType('flowLog');
+      }
+    }
+  }, [config.recordTypes, isConnectionTracking, isFlow, recordType]);
+
   // tick on state change
   React.useEffect(() => {
     // init function will be triggered only once
@@ -1140,6 +1154,7 @@ export const NetflowTraffic: React.FC<{
           setRecordType,
           reporter,
           setReporter,
+          allowFlow: isFlow(),
           allowConnection: isConnectionTracking(),
           allowReporterBoth: selectedViewId === 'table',
           useTopK: selectedViewId === 'overview'