feat(NavigationTree): add new icon of streaming query (#102)

Author: DaryaVorontsova

src/components/NavigationTree/NavigationTreeNode.tsx

@@ -10,6 +10,7 @@ import {
     FolderIcon,
     FolderOpenIcon,
     ResourcePoolIcon,
+    StreamingQueryIcon,
     TableIcon,
     TableIndexIcon,
     TopicIcon,
@@ -61,6 +62,8 @@ function renderIcon(type: NavigationTreeNodeType, collapsed: boolean) {
             return <ExternalTableIcon />;
         case 'external_data_source':
             return <ExternalDataSourceIcon />;
+        case 'streaming_query':
+            return <StreamingQueryIcon />;
         case 'view':
             return <ViewIcon />;
         case 'resource_pool':

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

@@ -129,6 +129,10 @@ async function fetchPath(path: string) {
                 name: 'external_data_source',
                 type: 'external_data_source',
             },
+            {
+                name: 'streaming_query',
+                type: 'streaming_query',
+            },
             {
                 name: 'view',
                 type: 'view',

src/components/NavigationTree/types.ts

@@ -12,6 +12,7 @@ export type NavigationTreeNodeType =
     | 'index'
     | 'stream'
     | 'system_table'
+    | 'streaming_query'
     | 'table'
     | 'topic'
     | 'transfer'

src/components/icons/StreamingQuery.tsx

@@ -0,0 +1,17 @@
+import React from 'react';
+
+export function StreamingQueryIcon(props: React.SVGProps<SVGSVGElement>) {
+    return (
+        <svg
+            xmlns="http://www.w3.org/2000/svg"
+            width={16}
+            height={16}
+            viewBox="0 0 16 16"
+            fill="currentColor"
+            {...props}
+        >
+            <path d="M1.74736 10.2865C3.06151 9.1017 4.5271 8.93752 5.7625 9.14443C6.9676 9.34634 7.98265 9.90421 8.49297 10.1889C9.08861 10.5211 9.83649 10.9101 10.6673 11.0311C11.4608 11.1467 12.3492 11.0208 13.2747 10.2636C13.5952 10.0013 14.068 10.0481 14.3304 10.3685C14.5927 10.6891 14.5454 11.1619 14.2249 11.4242C12.9391 12.4764 11.6157 12.6852 10.451 12.5155C9.32352 12.3513 8.36538 11.8355 7.76201 11.4989C7.2599 11.2188 6.44194 10.7793 5.51445 10.6239C4.61708 10.4736 3.64946 10.5919 2.75225 11.4008C2.44461 11.678 1.97 11.6537 1.69268 11.3461C1.41543 11.0385 1.43991 10.5639 1.74736 10.2865Z" />
+            <path d="M1.74736 4.62734C3.06151 3.44252 4.52711 3.27834 5.7625 3.48525C6.96757 3.68716 7.98264 4.24502 8.49297 4.52968C9.08861 4.86192 9.8365 5.25091 10.6673 5.37196C11.4608 5.48752 12.3492 5.36169 13.2747 4.60439C13.5952 4.34209 14.068 4.38896 14.3304 4.70937C14.5927 5.02991 14.5454 5.50269 14.2249 5.76503C12.9391 6.81728 11.6157 7.02598 10.451 6.85634C9.32352 6.69207 8.36538 6.17629 7.76201 5.83974C7.2599 5.55967 6.44192 5.1201 5.51445 4.96474C4.61709 4.81446 3.64946 4.93275 2.75225 5.74159C2.44461 6.01886 1.97001 5.99449 1.69268 5.68691C1.41547 5.37931 1.43989 4.90468 1.74736 4.62734Z" />
+        </svg>
+    );
+}

src/components/icons/index.ts

@@ -11,3 +11,4 @@ export {TableIndexIcon} from './TableIndex';
 export {TopicIcon} from './Topic';
 export {TransferIcon} from './Transfer';
 export {ViewIcon} from './View';
+export {StreamingQueryIcon} from './StreamingQuery';