From 6344c4defbd2a7c1bc734191b6a66ae130372084 Mon Sep 17 00:00:00 2001
From: Gao Sun <gao@silverhand.io>
Date: Sun, 19 Mar 2023 10:21:29 +0800
Subject: [PATCH] refactor(console): turn off auto-complete in connector forms
 (#3494)

---
 .../src/components/DetailsForm/index.tsx        | 17 ++++++++++++++---
 .../components/ConnectorContent.tsx             |  1 +
 .../pages/Connectors/components/Guide/index.tsx |  2 +-
 3 files changed, 16 insertions(+), 4 deletions(-)

diff --git a/packages/console/src/components/DetailsForm/index.tsx b/packages/console/src/components/DetailsForm/index.tsx
index 2f19bac36..20f945685 100644
--- a/packages/console/src/components/DetailsForm/index.tsx
+++ b/packages/console/src/components/DetailsForm/index.tsx
@@ -5,16 +5,27 @@ import SubmitFormChangesActionBar from '../SubmitFormChangesActionBar';
 import * as styles from './index.module.scss';
 
 type Props = {
+  autoComplete?: string;
   isDirty: boolean;
   isSubmitting: boolean;
-  children: ReactNode;
   onSubmit: () => Promise<void>;
   onDiscard: () => void;
+  children: ReactNode;
 };
 
-const DetailsForm = ({ isDirty, isSubmitting, onSubmit, onDiscard, children }: Props) => {
+const DetailsForm = ({
+  autoComplete,
+  isDirty,
+  isSubmitting,
+  onSubmit,
+  onDiscard,
+  children,
+}: Props) => {
   return (
-    <form className={classNames(styles.container, isDirty && styles.withSubmitActionBar)}>
+    <form
+      className={classNames(styles.container, isDirty && styles.withSubmitActionBar)}
+      autoComplete={autoComplete}
+    >
       <div className={styles.fields}>{children}</div>
       <SubmitFormChangesActionBar
         isOpen={isDirty}
diff --git a/packages/console/src/pages/ConnectorDetails/components/ConnectorContent.tsx b/packages/console/src/pages/ConnectorDetails/components/ConnectorContent.tsx
index 96d49c214..5bc7d9920 100644
--- a/packages/console/src/pages/ConnectorDetails/components/ConnectorContent.tsx
+++ b/packages/console/src/pages/ConnectorDetails/components/ConnectorContent.tsx
@@ -101,6 +101,7 @@ const ConnectorContent = ({ isDeleted, connectorData, onConnectorUpdated }: Prop
   return (
     <FormProvider {...methods}>
       <DetailsForm
+        autoComplete="off"
         isDirty={isDirty}
         isSubmitting={isSubmitting}
         onDiscard={reset}
diff --git a/packages/console/src/pages/Connectors/components/Guide/index.tsx b/packages/console/src/pages/Connectors/components/Guide/index.tsx
index 6c1da3844..e5f6753ac 100644
--- a/packages/console/src/pages/Connectors/components/Guide/index.tsx
+++ b/packages/console/src/pages/Connectors/components/Guide/index.tsx
@@ -181,7 +181,7 @@ const Guide = ({ connector, onClose }: Props) => {
           </div>
           <div className={styles.setup}>
             <FormProvider {...methods}>
-              <form onSubmit={onSubmit}>
+              <form autoComplete="off" onSubmit={onSubmit}>
                 {isSocialConnector && (
                   <div className={styles.block}>
                     <div className={styles.blockTitle}>