feat: add transfer navigation tree node type

src/components/NavigationTree/NavigationTreeNode.tsx

@@ -12,6 +12,7 @@
 import {ResourcePoolIcon} from '../icons/ResourcePool';
 import {TableIcon} from '../icons/Table';
 import {TopicIcon} from '../icons/Topic';
+import {TransferIcon} from '../icons/Transfer';
 import {ViewIcon} from '../icons/View';
 
 import {NavigationTreeActionType} from './state';
@@ -37,6 +38,8 @@
     switch (type) {
         case 'async_replication':
             return <AsyncReplicationIcon height={16} />;
+        case 'transfer':
+            return <TransferIcon height={16} />;
         case 'database':
             // this icon is larger than the others, therefore 14 for a better fit
             return <DatabaseIcon height={14} />;
@@ -115,7 +118,7 @@
                     payload: {path, error},
                 });
             });
     }, [nodeState.collapsed]);
 
     const handleClick = React.useCallback(() => {
         if (onActivate) {

src/components/NavigationTree/__stories__/NavigationTree.stories.tsx

@@ -117,6 +117,10 @@ async function fetchPath(path: string) {
                 name: 'replication',
                 type: 'async_replication',
             },
+            {
+                name: 'transfer',
+                type: 'transfer',
+            },
             {
                 name: 'external_table',
                 type: 'external_table',

src/components/NavigationTree/types.ts

@@ -13,6 +13,7 @@
     | 'stream'
     | 'table'
     | 'topic'
+    | 'transfer'
     | 'view';
 
 export interface NavigationTreeDataItem {
@@ -51,7 +52,7 @@
     'loading' | 'loaded' | 'error' | 'children'
 >;
 
 export interface NavigationTreeProps<D = any> {
     rootState: NavigationTreeNodePartialState;
     fetchPath: (path: string) => Promise<NavigationTreeDataItem[]>;
     onActionsOpenToggle?: (args: {

src/components/icons/Transfer.tsx

@@ -0,0 +1,13 @@
+import React from 'react';
+
+export function TransferIcon(props: React.SVGProps<SVGSVGElement>) {
+    return (
+        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="currentColor" {...props}>
+            <path
+                fillRule="evenodd"
+                clipRule="evenodd"
+                d="M9.22 15.03s-.001 0 0 0a.75.75 0 0 0 1.06-1.06l-.47-.47H10a3.016 3.016 0 0 0 1.507-.405A2.999 2.999 0 0 0 13 10.5V7.896h.003a2.735 2.735 0 0 0 .785-.366 2.75 2.75 0 1 0-2.288.366V10.5A1.5 1.5 0 0 1 10 12h-.19l.47-.47s0 .001 0 0a.75.75 0 0 0-1.06-1.06l-.47.47-1.28 1.28a.75.75 0 0 0 0 1.06l1.75 1.75ZM5.72 2.97a.75.75 0 0 1 1.06 0l.47.47 1.28 1.28a.748.748 0 0 1 0 1.06L6.78 7.53c.001 0 0 0 0 0a.751.751 0 0 1-1.06-1.06L6.19 6H6a1.5 1.5 0 0 0-1.5 1.5v2.604a2.757 2.757 0 0 1 2 2.646 2.738 2.738 0 0 1-1.212 2.28 2.737 2.737 0 0 1-1.538.47A2.747 2.747 0 0 1 1 12.75a2.751 2.751 0 0 1 2-2.646V7.5a2.999 2.999 0 0 1 3-3h.19l-.47-.47a.75.75 0 0 1 0-1.06Zm-.908 9.121A1.246 1.246 0 0 1 5 12.75a1.25 1.25 0 1 1-.188-.659ZM11 5.25a1.25 1.25 0 1 1 2.5 0 1.25 1.25 0 0 1-2.5 0Z"
+            />
+        </svg>
+    );
+}