add UDN tab

Author: jpinsonneau

web/console-extensions.json

@@ -243,6 +243,23 @@
       }
     }
   },
+  {
+    "type": "console.tab/horizontalNav",
+    "properties": {
+      "model": {
+        "version": "v1",
+        "group": "k8s.ovn.org",
+        "kind": "UserDefinedNetwork"
+      },
+      "component": {
+        "$codeRef": "netflowTab.default"
+      },
+      "page": {
+        "name": "%plugin__netobserv-plugin~Network Traffic%",
+        "href": "netflow"
+      }
+    }
+  },
   {
     "type": "console.tab",
     "properties": {

web/src/app.tsx

@@ -44,6 +44,10 @@ export const pages = [
   {
     id: 'dev-tab',
     name: 'Dev tab'
+  },
+  {
+    id: 'udn-tab',
+    name: 'UDN tab'
   }
 ];
 
@@ -75,6 +79,8 @@ export class App extends React.Component<{}, AppState> {
   private getPageContent = (id: string) => {
     console.debug('getPageContent', id);
     switch (id) {
+      case 'udn-tab':
+        return <NetflowTrafficTab obj={{ kind: 'UserDefinedNetwork', metadata: { name: 'my-udn', namespace: 'default' } }} />;
       case 'pod-tab':
         return <NetflowTrafficTab obj={{ kind: 'Pod', metadata: { name: 'test', namespace: 'default' } }} />;
       case 'namespace-tab':

web/src/components/netflow-traffic-tab.tsx

@@ -193,6 +193,17 @@ export const NetflowTrafficTab: React.FC<NetflowTrafficTabProps> = ({ match, obj
           backAndForth: true
         });
         break;
+      case 'UserDefinedNetwork':
+        setForcedFilters({
+          list: [
+            {
+              def: findFilter(filterDefinitions, 'udn')!,
+              values: [{ v: obj!.metadata!.name as string }]
+            }
+          ],
+          backAndForth: true
+        });
+        break;
     }
   }, [config, obj, previous, t]);