From 6f63e7699069f2e9b19b3acb65d73732d079852e Mon Sep 17 00:00:00 2001 From: Edmundo Ruiz Ghanem <168664+edmundito@users.noreply.github.com> Date: Mon, 12 Dec 2022 12:02:21 -0500 Subject: [PATCH] =?UTF-8?q?=F0=9F=AA=9F=20=F0=9F=8E=89=20Re-validate=20con?= =?UTF-8?q?nection=20edit=20form=20after=20schema=20refresh=20to=20highlig?= =?UTF-8?q?ht=20any=20missing=20keys=20or=20cursors=20(#20327)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * Re-validate form after schema refresh to highlight any missing keys or cursors * Update ValidateFormOnSchemaRefresh to only set syncCatalog to touched --- .../ConnectionReplicationTab.tsx | 18 ++++++++++++++++-- 1 file changed, 16 insertions(+), 2 deletions(-) diff --git a/airbyte-webapp/src/pages/ConnectionPage/pages/ConnectionItemPage/ConnectionReplicationTab.tsx b/airbyte-webapp/src/pages/ConnectionPage/pages/ConnectionItemPage/ConnectionReplicationTab.tsx index 138b95ca0aba..c0fb0dbed2d7 100644 --- a/airbyte-webapp/src/pages/ConnectionPage/pages/ConnectionItemPage/ConnectionReplicationTab.tsx +++ b/airbyte-webapp/src/pages/ConnectionPage/pages/ConnectionItemPage/ConnectionReplicationTab.tsx @@ -1,5 +1,5 @@ -import { Form, Formik, FormikHelpers } from "formik"; -import React, { useCallback, useState } from "react"; +import { Form, Formik, FormikHelpers, useFormikContext } from "formik"; +import React, { useCallback, useEffect, useState } from "react"; import { FormattedMessage, useIntl } from "react-intl"; import { useUnmount } from "react-use"; @@ -31,6 +31,19 @@ import { import styles from "./ConnectionReplicationTab.module.scss"; import { ResetWarningModal } from "./ResetWarningModal"; +const ValidateFormOnSchemaRefresh: React.FC = () => { + const { schemaHasBeenRefreshed } = useConnectionEditService(); + const { setTouched } = useFormikContext(); + + useEffect(() => { + if (schemaHasBeenRefreshed) { + setTouched({ syncCatalog: true }, true); + } + }, [setTouched, schemaHasBeenRefreshed]); + + return null; +}; + export const ConnectionReplicationTab: React.FC = () => { const allowAutoDetectSchemaChanges = useFeature(FeatureItem.AllowAutoDetectSchemaChanges); const analyticsService = useAnalyticsService(); @@ -181,6 +194,7 @@ export const ConnectionReplicationTab: React.FC = () => { > {({ values, isSubmitting, isValid, dirty, resetForm, status }) => (
+