From c4ffcc1a2fd93458aad71c405b18c5991f7199ed Mon Sep 17 00:00:00 2001
From: tealjulia <teal@airbyte.io>
Date: Fri, 14 Oct 2022 14:22:10 -0400
Subject: [PATCH 1/6] show schema update error

---
 .../src/components/CreateConnection/SchemaError.tsx        | 2 +-
 .../src/components/CreateConnection/TryAfterErrorBlock.tsx | 7 ++++++-
 .../services/ConnectionForm/ConnectionFormService.tsx      | 3 ++-
 airbyte-webapp/src/locales/en.json                         | 1 +
 4 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/airbyte-webapp/src/components/CreateConnection/SchemaError.tsx b/airbyte-webapp/src/components/CreateConnection/SchemaError.tsx
index bfa7fc2d00ee6..d49f791d92853 100644
--- a/airbyte-webapp/src/components/CreateConnection/SchemaError.tsx
+++ b/airbyte-webapp/src/components/CreateConnection/SchemaError.tsx
@@ -12,7 +12,7 @@ export const SchemaError = ({ schemaError }: { schemaError: SchemaErrorType }) =
   const { refreshSchema } = useConnectionFormService();
   return (
     <Card>
-      <TryAfterErrorBlock onClick={refreshSchema} />
+      <TryAfterErrorBlock onClick={refreshSchema} message={schemaError?.message} />
       {job && <JobItem job={job} />}
     </Card>
   );
diff --git a/airbyte-webapp/src/components/CreateConnection/TryAfterErrorBlock.tsx b/airbyte-webapp/src/components/CreateConnection/TryAfterErrorBlock.tsx
index 276bf1364494b..f7c93e771db55 100644
--- a/airbyte-webapp/src/components/CreateConnection/TryAfterErrorBlock.tsx
+++ b/airbyte-webapp/src/components/CreateConnection/TryAfterErrorBlock.tsx
@@ -16,8 +16,13 @@ export const TryAfterErrorBlock: React.FC<TryAfterErrorBlockProps> = ({ message,
   <div className={styles.container}>
     <StatusIcon big />
     <Text as="p" size="lg" centered className={styles.message}>
-      {message || <FormattedMessage id="form.schemaFailed" />}
+      <FormattedMessage id="form.schemaFailed" />
     </Text>
+    {message && (
+      <Text as="p" size="lg" centered className={styles.message}>
+        <FormattedMessage id="form.error" />: {message}
+      </Text>
+    )}
     <Button className={styles.retryButton} onClick={onClick} variant="danger">
       <FormattedMessage id="form.tryAgain" />
     </Button>
diff --git a/airbyte-webapp/src/hooks/services/ConnectionForm/ConnectionFormService.tsx b/airbyte-webapp/src/hooks/services/ConnectionForm/ConnectionFormService.tsx
index b1856cec5a062..b30616a37f777 100644
--- a/airbyte-webapp/src/hooks/services/ConnectionForm/ConnectionFormService.tsx
+++ b/airbyte-webapp/src/hooks/services/ConnectionForm/ConnectionFormService.tsx
@@ -50,12 +50,13 @@ export const tidyConnectionFormValues = (
   return formValues;
 };
 
-const useConnectionForm = ({ connection, mode, schemaError, refreshSchema }: ConnectionServiceProps) => {
+const useConnectionForm = ({ connection, mode, refreshSchema }: ConnectionServiceProps) => {
   const destDefinition = useGetDestinationDefinitionSpecification(connection.destination.destinationDefinitionId);
   const initialValues = useInitialValues(connection, destDefinition, mode !== "create");
   const { formatMessage } = useIntl();
   const [submitError, setSubmitError] = useState<FormError | null>(null);
   const formId = useUniqueFormId();
+  const schemaError = { name: "hi", status: "401", message: "bad bad thing happened", response: "oh no" };
 
   const getErrorMessage = useCallback(
     (formValid: boolean, connectionDirty: boolean) =>
diff --git a/airbyte-webapp/src/locales/en.json b/airbyte-webapp/src/locales/en.json
index 63560c4c801fc..27c092918036c 100644
--- a/airbyte-webapp/src/locales/en.json
+++ b/airbyte-webapp/src/locales/en.json
@@ -24,6 +24,7 @@
   "sidebar.recipes": "Tutorials - Use cases",
 
   "form.continue": "Continue",
+  "form.error": "Error",
   "form.yourEmail": "Your email",
   "form.email.placeholder": "you@company.com",
   "form.email.error": "Enter a valid email",

From 8ec6ff9f9fadaa7f33f0777aaf1295eee5fb492d Mon Sep 17 00:00:00 2001
From: tealjulia <teal@airbyte.io>
Date: Fri, 14 Oct 2022 14:27:13 -0400
Subject: [PATCH 2/6] remove test code

---
 .../hooks/services/ConnectionForm/ConnectionFormService.tsx    | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/airbyte-webapp/src/hooks/services/ConnectionForm/ConnectionFormService.tsx b/airbyte-webapp/src/hooks/services/ConnectionForm/ConnectionFormService.tsx
index b30616a37f777..b1856cec5a062 100644
--- a/airbyte-webapp/src/hooks/services/ConnectionForm/ConnectionFormService.tsx
+++ b/airbyte-webapp/src/hooks/services/ConnectionForm/ConnectionFormService.tsx
@@ -50,13 +50,12 @@ export const tidyConnectionFormValues = (
   return formValues;
 };
 
-const useConnectionForm = ({ connection, mode, refreshSchema }: ConnectionServiceProps) => {
+const useConnectionForm = ({ connection, mode, schemaError, refreshSchema }: ConnectionServiceProps) => {
   const destDefinition = useGetDestinationDefinitionSpecification(connection.destination.destinationDefinitionId);
   const initialValues = useInitialValues(connection, destDefinition, mode !== "create");
   const { formatMessage } = useIntl();
   const [submitError, setSubmitError] = useState<FormError | null>(null);
   const formId = useUniqueFormId();
-  const schemaError = { name: "hi", status: "401", message: "bad bad thing happened", response: "oh no" };
 
   const getErrorMessage = useCallback(
     (formValid: boolean, connectionDirty: boolean) =>

From fd004f45e98b27000f9c7d06894f7ce1ab04c2dd Mon Sep 17 00:00:00 2001
From: tealjulia <teal@airbyte.io>
Date: Tue, 18 Oct 2022 11:51:50 -0500
Subject: [PATCH 3/6] use i18n for error message label and string

---
 .../CreateConnection/TryAfterErrorBlock.tsx   | 32 ++++++++++---------
 airbyte-webapp/src/locales/en.json            |  2 +-
 2 files changed, 18 insertions(+), 16 deletions(-)

diff --git a/airbyte-webapp/src/components/CreateConnection/TryAfterErrorBlock.tsx b/airbyte-webapp/src/components/CreateConnection/TryAfterErrorBlock.tsx
index f7c93e771db55..4bb6a7a091bf0 100644
--- a/airbyte-webapp/src/components/CreateConnection/TryAfterErrorBlock.tsx
+++ b/airbyte-webapp/src/components/CreateConnection/TryAfterErrorBlock.tsx
@@ -8,23 +8,25 @@ import { Text } from "components/ui/Text";
 import styles from "./TryAfterErrorBlock.module.scss";
 
 interface TryAfterErrorBlockProps {
-  message?: React.ReactNode;
+  message?: string;
   onClick: () => void;
 }
 
-export const TryAfterErrorBlock: React.FC<TryAfterErrorBlockProps> = ({ message, onClick }) => (
-  <div className={styles.container}>
-    <StatusIcon big />
-    <Text as="p" size="lg" centered className={styles.message}>
-      <FormattedMessage id="form.schemaFailed" />
-    </Text>
-    {message && (
+export const TryAfterErrorBlock: React.FC<TryAfterErrorBlockProps> = ({ message, onClick }) => {
+  return (
+    <div className={styles.container}>
+      <StatusIcon big />
       <Text as="p" size="lg" centered className={styles.message}>
-        <FormattedMessage id="form.error" />: {message}
+        <FormattedMessage id="form.schemaFailed" />
       </Text>
-    )}
-    <Button className={styles.retryButton} onClick={onClick} variant="danger">
-      <FormattedMessage id="form.tryAgain" />
-    </Button>
-  </div>
-);
+      {message && (
+        <Text as="p" size="lg" centered className={styles.message}>
+          <FormattedMessage id="form.error" values={{ message }} />
+        </Text>
+      )}
+      <Button className={styles.retryButton} onClick={onClick} variant="danger">
+        <FormattedMessage id="form.tryAgain" />
+      </Button>
+    </div>
+  );
+};
diff --git a/airbyte-webapp/src/locales/en.json b/airbyte-webapp/src/locales/en.json
index 27c092918036c..139d2f135aa18 100644
--- a/airbyte-webapp/src/locales/en.json
+++ b/airbyte-webapp/src/locales/en.json
@@ -24,7 +24,7 @@
   "sidebar.recipes": "Tutorials - Use cases",
 
   "form.continue": "Continue",
-  "form.error": "Error",
+  "form.error": "Error: {value}",
   "form.yourEmail": "Your email",
   "form.email.placeholder": "you@company.com",
   "form.email.error": "Enter a valid email",

From 5335d30823586bf931aa181193cd737fb9456eb3 Mon Sep 17 00:00:00 2001
From: tealjulia <teal@airbyte.io>
Date: Tue, 18 Oct 2022 13:36:08 -0500
Subject: [PATCH 4/6] update snapshot of create connection

---
 .../__snapshots__/CreateConnectionForm.test.tsx.snap         | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/airbyte-webapp/src/components/CreateConnection/__snapshots__/CreateConnectionForm.test.tsx.snap b/airbyte-webapp/src/components/CreateConnection/__snapshots__/CreateConnectionForm.test.tsx.snap
index 19aca020b0a17..9b026a1c923ea 100644
--- a/airbyte-webapp/src/components/CreateConnection/__snapshots__/CreateConnectionForm.test.tsx.snap
+++ b/airbyte-webapp/src/components/CreateConnection/__snapshots__/CreateConnectionForm.test.tsx.snap
@@ -996,6 +996,11 @@ exports[`CreateConnectionForm should render with an error 1`] = `
         >
           Failed to fetch schema. Please try again
         </p>
+        <p
+          class="<removed-for-snapshot-test>"
+        >
+          Error: {value}
+        </p>
         <button
           class="<removed-for-snapshot-test>"
         >

From ee21d64f3cf6773fa1a6feebbca3128d9ef852cc Mon Sep 17 00:00:00 2001
From: tealjulia <teal@airbyte.io>
Date: Tue, 18 Oct 2022 16:36:32 -0500
Subject: [PATCH 5/6] fix intl string parsing

---
 airbyte-webapp/src/locales/en.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/airbyte-webapp/src/locales/en.json b/airbyte-webapp/src/locales/en.json
index 139d2f135aa18..f466912d47391 100644
--- a/airbyte-webapp/src/locales/en.json
+++ b/airbyte-webapp/src/locales/en.json
@@ -24,7 +24,7 @@
   "sidebar.recipes": "Tutorials - Use cases",
 
   "form.continue": "Continue",
-  "form.error": "Error: {value}",
+  "form.error": "Error: {message}",
   "form.yourEmail": "Your email",
   "form.email.placeholder": "you@company.com",
   "form.email.error": "Enter a valid email",

From 4d5bbce1eb5d51b984dacd3e31711a58cbd39100 Mon Sep 17 00:00:00 2001
From: tealjulia <teal@airbyte.io>
Date: Tue, 18 Oct 2022 16:37:23 -0500
Subject: [PATCH 6/6] update snapshot

---
 .../__snapshots__/CreateConnectionForm.test.tsx.snap            | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/airbyte-webapp/src/components/CreateConnection/__snapshots__/CreateConnectionForm.test.tsx.snap b/airbyte-webapp/src/components/CreateConnection/__snapshots__/CreateConnectionForm.test.tsx.snap
index 9b026a1c923ea..bcb658201f491 100644
--- a/airbyte-webapp/src/components/CreateConnection/__snapshots__/CreateConnectionForm.test.tsx.snap
+++ b/airbyte-webapp/src/components/CreateConnection/__snapshots__/CreateConnectionForm.test.tsx.snap
@@ -999,7 +999,7 @@ exports[`CreateConnectionForm should render with an error 1`] = `
         <p
           class="<removed-for-snapshot-test>"
         >
-          Error: {value}
+          Error: Test Error
         </p>
         <button
           class="<removed-for-snapshot-test>"