More accurate slowness warnings

- message is different depending on "match"
- fixed indexed filter is resource, not name
- side stuff: added a note in the readme for initial repo setup

Author: jotak

README.md

@@ -4,6 +4,16 @@
 
 Based on [Openshift Console dynamic plugin](https://github.com/openshift/console/tree/master/frontend/packages/console-dynamic-plugin-sdk), this plugin implement the console elements for Network Observability.
 
+## First setup
+
+You will need Go, Node.js and npm in order to run the `make` commands described below. You can take a look at the [Dockerfile](./Dockerfile) to get known working versions of these tools. In particular, node and npm are known to often break builds if you don't use the expected versions (even patch versions for npm). You can use [nvm](https://github.com/nvm-sh/nvm) to manage installed node / npm versions.
+
+Once these tools are installed, run the following command:
+
+```bash
+make install-frontend
+```
+
 ## Building, linting, testing
 
 To build the plugin, run:

web/locales/en/plugin__network-observability-plugin.json

@@ -154,8 +154,10 @@
   "Expand": "Expand",
   "Actions": "Actions",
   "View": "View",
-  "Network Traffic": "Network Traffic",
+  "When in \"Match any\" mode, try using only Namespace, Owner or Resource filters (which use indexed fields), or decrease limit / range, to improve the query performance": "When in \"Match any\" mode, try using only Namespace, Owner or Resource filters (which use indexed fields), or decrease limit / range, to improve the query performance",
+  "Add Namespace, Owner or Resource filters (which use indexed fields), or decrease limit / range, to improve the query performance": "Add Namespace, Owner or Resource filters (which use indexed fields), or decrease limit / range, to improve the query performance",
   "Add more filters or decrease limit / range to improve the query performance": "Add more filters or decrease limit / range to improve the query performance",
+  "Network Traffic": "Network Traffic",
   "Query limit reached": "Query limit reached",
   "Filtered flows count": "Filtered flows count",
   "{{count}} flows": "{{count}} flows",

web/src/components/netflow-traffic.tsx

@@ -47,7 +47,14 @@ import { DefaultOptions, TopologyGroupTypes, TopologyOptions } from '../model/to
 import { Column, getDefaultColumns } from '../utils/columns';
 import { TimeRange } from '../utils/datetime';
 import { getHTTPErrorDetails } from '../utils/errors';
-import { DisabledFilters, Filter, hasIndexFields, getDisabledFiltersRecord, getEnabledFilters } from '../model/filters';
+import {
+  DisabledFilters,
+  Filter,
+  hasIndexFields,
+  getDisabledFiltersRecord,
+  getEnabledFilters,
+  hasNonIndexFields
+} from '../model/filters';
 import {
   LOCAL_STORAGE_COLS_KEY,
   LOCAL_STORAGE_DISABLED_FILTERS_KEY,
@@ -675,6 +682,20 @@ export const NetflowTraffic: React.FC<{
     });
   }, [isFullScreen]);
 
+  const slownessReason = React.useCallback(() => {
+    if (match === 'any' && hasNonIndexFields(filters)) {
+      return t(
+        'When in "Match any" mode, try using only Namespace, Owner or Resource filters (which use indexed fields), or decrease limit / range, to improve the query performance'
+      );
+    }
+    if (match === 'all' && !hasIndexFields(filters)) {
+      return t(
+        'Add Namespace, Owner or Resource filters (which use indexed fields), or decrease limit / range, to improve the query performance'
+      );
+    }
+    return t('Add more filters or decrease limit / range to improve the query performance');
+  }, [match, filters]);
+
   return !_.isEmpty(extensions) ? (
     <PageSection id="pageSection" className={isTab ? 'tab' : ''}>
       {
@@ -754,9 +775,7 @@ export const NetflowTraffic: React.FC<{
           variant="warning"
           actionClose={<AlertActionCloseButton onClose={() => setWarningMessage(undefined)} />}
         >
-          {hasIndexFields(filters)
-            ? t('Add more filters or decrease limit / range to improve the query performance')
-            : t('Add Namespace, Owner or Resource filters (which use indexed fields) to improve the query performance')}
+          {slownessReason()}
         </Alert>
       )}
     </PageSection>

web/src/model/filters.ts

@@ -127,13 +127,14 @@ export const getDisabledFiltersRecord = (filters: Filter[]) => {
   return disabledFilters;
 };
 
+const isIndexed = (f: Filter) => {
+  return f.def.id.includes('namespace') || f.def.id.includes('owner') || f.def.id.includes('resource');
+};
+
 export const hasIndexFields = (filters: Filter[]) => {
-  return (
-    filters.find(
-      f =>
-        f.def.id.includes('namespace') ||
-        f.def.id.includes('owner') ||
-        ['name', 'src_name', 'dst_name'].includes(f.def.id.toString())
-    ) !== undefined
-  );
+  return filters.some(isIndexed);
+};
+
+export const hasNonIndexFields = (filters: Filter[]) => {
+  return filters.some(f => !isIndexed(f));
 };