From 2e846c8bfa5ffc8a3d752d724587d398793fd118 Mon Sep 17 00:00:00 2001
From: KC <krishna@airbyte.io>
Date: Thu, 19 Jan 2023 11:40:41 -0500
Subject: [PATCH] Remove source and destination definition calls that were used
 only to get the icon.

---
 .../StreamFieldsTable/StreamFieldsTable.tsx            | 10 +++-------
 1 file changed, 3 insertions(+), 7 deletions(-)

diff --git a/airbyte-webapp/src/components/connection/CatalogTree/next/StreamDetailsPanel/StreamFieldsTable/StreamFieldsTable.tsx b/airbyte-webapp/src/components/connection/CatalogTree/next/StreamDetailsPanel/StreamFieldsTable/StreamFieldsTable.tsx
index 3f6f9f6a5f165..54bf980f0d4ac 100644
--- a/airbyte-webapp/src/components/connection/CatalogTree/next/StreamDetailsPanel/StreamFieldsTable/StreamFieldsTable.tsx
+++ b/airbyte-webapp/src/components/connection/CatalogTree/next/StreamDetailsPanel/StreamFieldsTable/StreamFieldsTable.tsx
@@ -9,8 +9,6 @@ import { NextTable } from "components/ui/NextTable";
 import { SyncSchemaField, SyncSchemaFieldObject } from "core/domain/catalog";
 import { AirbyteStreamConfiguration } from "core/request/AirbyteClient";
 import { useConnectionFormService } from "hooks/services/ConnectionForm/ConnectionFormService";
-import { useDestinationDefinition } from "services/connector/DestinationDefinitionService";
-import { useSourceDefinition } from "services/connector/SourceDefinitionService";
 import { equal } from "utils/objects";
 import { getDataType } from "utils/useTranslateDataType";
 
@@ -59,8 +57,6 @@ export const StreamFieldsTable: React.FC<StreamFieldsTableProps> = ({
   const {
     connection: { source, destination },
   } = useConnectionFormService();
-  const sourceDefinition = useSourceDefinition(source.sourceDefinitionId);
-  const destinationDefinition = useDestinationDefinition(destination.destinationDefinitionId);
 
   // prepare data for table
   const tableData: TableStream[] = useMemo(
@@ -163,7 +159,7 @@ export const StreamFieldsTable: React.FC<StreamFieldsTableProps> = ({
     () => [
       columnHelper.group({
         id: "source",
-        header: () => <ConnectorHeaderGroupIcon type="source" icon={sourceDefinition.icon} />,
+        header: () => <ConnectorHeaderGroupIcon type="source" icon={source.icon} />,
         columns: sourceColumns,
         meta: {
           thClassName: styles.headerGroupCell,
@@ -188,7 +184,7 @@ export const StreamFieldsTable: React.FC<StreamFieldsTableProps> = ({
       }),
       columnHelper.group({
         id: "destination",
-        header: () => <ConnectorHeaderGroupIcon type="destination" icon={destinationDefinition.icon} />,
+        header: () => <ConnectorHeaderGroupIcon type="destination" icon={destination.icon} />,
         columns: destinationColumns,
         meta: {
           thClassName: styles.headerGroupCell,
@@ -196,7 +192,7 @@ export const StreamFieldsTable: React.FC<StreamFieldsTableProps> = ({
         },
       }),
     ],
-    [columnHelper, destinationColumns, destinationDefinition.icon, sourceColumns, sourceDefinition.icon]
+    [columnHelper, destination.icon, destinationColumns, source.icon, sourceColumns]
   );
 
   return <NextTable<TableStream> columns={columns} data={tableData} className={styles.customTableStyle} />;