Display sourceDefined cursor field when possible (airbytehq#11436)

roelsadza · Mar 30, 2022 · 39107bf · 39107bf
1 parent 6db7a28
commit 39107bf
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 2 deletions.
diff --git a/airbyte-webapp/src/views/Connection/CatalogTree/StreamHeader.tsx b/airbyte-webapp/src/views/Connection/CatalogTree/StreamHeader.tsx
@@ -71,6 +71,8 @@ export const StreamHeader: React.FC<StreamHeaderProps> = ({
     cursorField,
     destinationSyncMode,
   } = stream.config;
+
+  const { defaultCursorField } = stream.stream;
   const syncSchema = useMemo(
     () => ({
       syncMode,
@@ -126,9 +128,11 @@ export const StreamHeader: React.FC<StreamHeaderProps> = ({
           <PathPopout
             pathType={cursorType}
             paths={paths}
-            path={cursorField}
+            path={
+              cursorType === "sourceDefined" ? defaultCursorField : cursorField
+            }
             placeholder={
-              <FormattedMessage id="connectionForm.primaryKey.searchPlaceholder" />
+              <FormattedMessage id="connectionForm.cursor.searchPlaceholder" />
             }
             onPathChange={onCursorChange}
           />

diff --git a/airbyte-webapp/src/views/Connection/CatalogTree/components/PathPopout.tsx b/airbyte-webapp/src/views/Connection/CatalogTree/components/PathPopout.tsx
@@ -42,6 +42,15 @@ type PathProps = {
 
 export const PathPopout: React.FC<PathPopoutProps> = (props) => {
   if (props.pathType === "sourceDefined") {
+    if (props.path) {
+      const text = props.path
+        ? props.isMulti
+          ? props.path.map(pathDisplayName).join(", ")
+          : pathDisplayName(props.path)
+        : "";
+
+      return <>{text}</>;
+    }
     return <>{"<sourceDefined>"}</>;
   }