Move CatalogTree from views to components/connection (#18185)

airbyte-webapp/src/views/Connection/CatalogTree/components/BulkHeader.tsx → airbyte-webapp/src/components/connection/CatalogTree/BulkHeader.tsx

@@ -11,13 +11,13 @@ import { SyncSchemaField, SyncSchemaFieldObject, SyncSchemaStream, traverseSchem
 import { DestinationSyncMode, SyncMode } from "core/request/AirbyteClient";
 import { useBulkEditService } from "hooks/services/BulkEdit/BulkEditService";
 import { useConnectionFormService } from "hooks/services/ConnectionForm/ConnectionFormService";
+import { SUPPORTED_MODES } from "views/Connection/ConnectionForm/formConfig";
 
-import { SUPPORTED_MODES } from "../../ConnectionForm/formConfig";
-import { ArrowCell, CheckboxCell, HeaderCell } from "../styles";
-import { flatten, getPathType } from "../utils";
 import styles from "./BulkHeader.module.scss";
 import { pathDisplayName, PathPopout } from "./PathPopout";
+import { ArrowCell, CheckboxCell, HeaderCell } from "./styles";
 import { SyncSettingsDropdown } from "./SyncSettingsDropdown";
+import { flatten, getPathType } from "./utils";
 
 const ActionCell = styled.div`
   display: flex;

airbyte-webapp/src/views/Connection/CatalogTree/CatalogSection.module.scss → airbyte-webapp/src/components/connection/CatalogTree/CatalogSection.module.scss

@@ -1,4 +1,4 @@
-@use "../../../scss/colors";
+@use "scss/colors";
 
 .streamFieldTableContainer {
   margin-left: 85px;

airbyte-webapp/src/views/Connection/CatalogTree/CatalogSection.tsx → airbyte-webapp/src/components/connection/CatalogTree/CatalogSection.tsx

@@ -6,17 +6,17 @@ import { DropDownOptionDataItem } from "components/ui/DropDown";
 
 import { SyncSchemaField, SyncSchemaFieldObject, SyncSchemaStream } from "core/domain/catalog";
 import { traverseSchemaToField } from "core/domain/catalog/fieldUtil";
-import { useDestinationNamespace } from "hooks/connection/useDestinationNamespace";
-import { useConnectionFormService } from "hooks/services/ConnectionForm/ConnectionFormService";
-import { equal, naturalComparatorBy } from "utils/objects";
-import { ConnectionFormValues, SUPPORTED_MODES } from "views/Connection/ConnectionForm/formConfig";
-
 import {
   AirbyteStreamConfiguration,
   DestinationSyncMode,
   NamespaceDefinitionType,
   SyncMode,
-} from "../../../core/request/AirbyteClient";
+} from "core/request/AirbyteClient";
+import { useDestinationNamespace } from "hooks/connection/useDestinationNamespace";
+import { useConnectionFormService } from "hooks/services/ConnectionForm/ConnectionFormService";
+import { equal, naturalComparatorBy } from "utils/objects";
+import { ConnectionFormValues, SUPPORTED_MODES } from "views/Connection/ConnectionForm/formConfig";
+
 import styles from "./CatalogSection.module.scss";
 import { StreamFieldTable } from "./StreamFieldTable";
 import { StreamHeader } from "./StreamHeader";

airbyte-webapp/src/views/Connection/CatalogTree/CatalogTree.tsx → airbyte-webapp/src/components/connection/CatalogTree/CatalogTree.tsx

@@ -7,11 +7,11 @@ import { BulkEditServiceProvider } from "hooks/services/BulkEdit/BulkEditService
 import { useConnectionFormService } from "hooks/services/ConnectionForm/ConnectionFormService";
 import { naturalComparatorBy } from "utils/objects";
 
+import { BulkHeader } from "./BulkHeader";
 import { CatalogTreeBody } from "./CatalogTreeBody";
 import { CatalogTreeHeader } from "./CatalogTreeHeader";
 import { CatalogTreeSearch } from "./CatalogTreeSearch";
 import { CatalogTreeSubheader } from "./CatalogTreeSubheader";
-import { BulkHeader } from "./components/BulkHeader";
 
 interface CatalogTreeProps {
   streams: SyncSchemaStream[];

airbyte-webapp/src/views/Connection/CatalogTree/FieldRow.tsx → airbyte-webapp/src/components/connection/CatalogTree/FieldRow.tsx

@@ -10,8 +10,8 @@ import { AirbyteStreamConfiguration } from "core/request/AirbyteClient";
 import { equal } from "utils/objects";
 import { useTranslateDataType } from "utils/useTranslateDataType";
 
-import DataTypeCell from "./components/DataTypeCell";
-import { pathDisplayName } from "./components/PathPopout";
+import DataTypeCell from "./DataTypeCell";
+import { pathDisplayName } from "./PathPopout";
 import { NameContainer } from "./styles";
 
 interface FieldRowProps {

airbyte-webapp/src/views/Connection/CatalogTree/components/PathPopoutButton.module.scss → airbyte-webapp/src/components/connection/CatalogTree/PathPopoutButton.module.scss

@@ -1,5 +1,5 @@
-@use "../../../../scss/colors";
-@use "../../../../scss/variables";
+@use "scss/colors";
+@use "scss/variables";
 
 .arrow {
   color: colors.$grey-300;

airbyte-webapp/src/views/Connection/CatalogTree/StreamFieldTable.tsx → airbyte-webapp/src/components/connection/CatalogTree/StreamFieldTable.tsx

@@ -2,12 +2,12 @@ import React from "react";
 import styled from "styled-components";
 
 import { SyncSchemaField, SyncSchemaFieldObject } from "core/domain/catalog";
+import { AirbyteStreamConfiguration } from "core/request/AirbyteClient";
 
-import { AirbyteStreamConfiguration } from "../../../core/request/AirbyteClient";
-import { pathDisplayName } from "./components/PathPopout";
-import { TreeRowWrapper } from "./components/TreeRowWrapper";
 import { FieldHeader } from "./FieldHeader";
 import { FieldRow } from "./FieldRow";
+import { pathDisplayName } from "./PathPopout";
+import { TreeRowWrapper } from "./TreeRowWrapper";
 
 const RowsContainer = styled.div`
   background: ${({ theme }) => theme.whiteColor};

airbyte-webapp/src/views/Connection/CatalogTree/StreamHeader.module.scss → airbyte-webapp/src/components/connection/CatalogTree/StreamHeader.module.scss

@@ -1,5 +1,5 @@
-@use "../../../scss/colors";
-@use "../../../scss/variables";
+@use "scss/colors";
+@use "scss/variables";
 @forward "./CatalogTreeBody.module.scss";
 
 .icon {

airbyte-webapp/src/views/Connection/CatalogTree/StreamHeader.tsx → airbyte-webapp/src/components/connection/CatalogTree/StreamHeader.tsx

@@ -14,11 +14,11 @@ import { Path, SyncSchemaField, SyncSchemaStream } from "core/domain/catalog";
 import { DestinationSyncMode, SyncMode } from "core/request/AirbyteClient";
 import { useBulkEditSelect } from "hooks/services/BulkEdit/BulkEditService";
 
-import { Arrow as ArrowBlock } from "./components/Arrow";
-import { IndexerType, PathPopout } from "./components/PathPopout";
-import { SyncSettingsDropdown } from "./components/SyncSettingsDropdown";
+import { Arrow as ArrowBlock } from "./Arrow";
+import { IndexerType, PathPopout } from "./PathPopout";
 import styles from "./StreamHeader.module.scss";
 import { ArrowCell, HeaderCell } from "./styles";
+import { SyncSettingsDropdown } from "./SyncSettingsDropdown";
 
 const EmptyField = styled.span`
   color: ${({ theme }) => theme.greyColor40};

airbyte-webapp/src/views/Connection/CatalogTree/utils.ts → airbyte-webapp/src/components/connection/CatalogTree/utils.ts

@@ -1,6 +1,6 @@
 import { SyncSchemaField } from "core/domain/catalog";
 
-import { IndexerType } from "./components/PathPopout";
+import { IndexerType } from "./PathPopout";
 
 export const flatten = (fArr: SyncSchemaField[], arr: SyncSchemaField[] = []): SyncSchemaField[] =>
   fArr.reduce<SyncSchemaField[]>((acc, f) => {

airbyte-webapp/src/views/Connection/ConnectionForm/components/SyncCatalogField.tsx

@@ -2,12 +2,12 @@ import { FieldProps } from "formik";
 import React, { useCallback } from "react";
 import { FormattedMessage } from "react-intl";
 
+import { CatalogTree } from "components/connection/CatalogTree";
 import { Text } from "components/ui/Text";
 
 import { SyncSchemaStream } from "core/domain/catalog";
 import { DestinationSyncMode } from "core/request/AirbyteClient";
 import { useConnectionFormService } from "hooks/services/ConnectionForm/ConnectionFormService";
-import { CatalogTree } from "views/Connection/CatalogTree";
 
 import styles from "./SyncCatalogField.module.scss";