From a868c1ff63e8400c57b393262a70de1f83c54987 Mon Sep 17 00:00:00 2001
From: Wang Sijie <wangsijie@silverhand.io>
Date: Mon, 20 Jun 2022 17:02:22 +0800
Subject: [PATCH] fix(console): sms and email connector in use status (#1161)

---
 .../console/src/hooks/use-connector-in-use.ts | 22 ++++++++++++++-----
 .../src/pages/ConnectorDetails/index.tsx      | 11 ++--------
 .../components/ConnectorRow/index.tsx         | 11 +++-------
 3 files changed, 22 insertions(+), 22 deletions(-)

diff --git a/packages/console/src/hooks/use-connector-in-use.ts b/packages/console/src/hooks/use-connector-in-use.ts
index 8bedc14d0..6dc6d07c9 100644
--- a/packages/console/src/hooks/use-connector-in-use.ts
+++ b/packages/console/src/hooks/use-connector-in-use.ts
@@ -1,16 +1,28 @@
-import { SignInExperience } from '@logto/schemas';
+import { ConnectorType, SignInExperience, SignInMethodState } from '@logto/schemas';
 import useSWR from 'swr';
 
 import { RequestError } from './use-api';
 
-const useConnectorInUse = (connectorTarget?: string): boolean | undefined => {
-  const { data } = useSWR<SignInExperience, RequestError>(connectorTarget && '/api/sign-in-exp');
+const useConnectorInUse = (type?: ConnectorType, target?: string): boolean | undefined => {
+  const { data } = useSWR<SignInExperience, RequestError>(target && type && '/api/sign-in-exp');
 
-  if (!data || !connectorTarget) {
+  if (!data) {
     return;
   }
 
-  return data.socialSignInConnectorTargets.includes(connectorTarget);
+  if (type === ConnectorType.Email) {
+    return data.signInMethods.email !== SignInMethodState.Disabled;
+  }
+
+  if (type === ConnectorType.SMS) {
+    return data.signInMethods.sms !== SignInMethodState.Disabled;
+  }
+
+  if (!target) {
+    return;
+  }
+
+  return data.socialSignInConnectorTargets.includes(target);
 };
 
 export default useConnectorInUse;
diff --git a/packages/console/src/pages/ConnectorDetails/index.tsx b/packages/console/src/pages/ConnectorDetails/index.tsx
index 885c4eba0..81c2917b6 100644
--- a/packages/console/src/pages/ConnectorDetails/index.tsx
+++ b/packages/console/src/pages/ConnectorDetails/index.tsx
@@ -43,7 +43,7 @@ const ConnectorDetails = () => {
   const { data, error } = useSWR<ConnectorDTO, RequestError>(
     connectorId && `/api/connectors/${connectorId}`
   );
-  const inUse = useConnectorInUse(data?.type === ConnectorType.Social ? data.target : undefined);
+  const inUse = useConnectorInUse(data?.type, data?.target);
   const isLoading = !data && !error;
   const api = useApi();
   const navigate = useNavigate();
@@ -130,20 +130,13 @@ const ConnectorDetails = () => {
             <div>
               <ConnectorTypeName type={data.type} />
               <div className={styles.verticalBar} />
-              {data.type === ConnectorType.Social && inUse !== undefined && (
+              {inUse !== undefined && (
                 <Status status={inUse ? 'enabled' : 'disabled'} varient="outlined">
                   {t('connectors.connector_status', {
                     context: inUse ? 'in_use' : 'not_in_use',
                   })}
                 </Status>
               )}
-              {data.type !== ConnectorType.Social && (
-                <Status status={data.enabled ? 'enabled' : 'disabled'} varient="outlined">
-                  {t('connectors.connector_status', {
-                    context: data.enabled ? 'in_use' : 'not_in_use',
-                  })}
-                </Status>
-              )}
               <div className={styles.verticalBar} />
               <div className={styles.text}>ID</div>
               <CopyToClipboard value={data.id} />
diff --git a/packages/console/src/pages/Connectors/components/ConnectorRow/index.tsx b/packages/console/src/pages/Connectors/components/ConnectorRow/index.tsx
index 481d4053d..8aec19ca0 100644
--- a/packages/console/src/pages/Connectors/components/ConnectorRow/index.tsx
+++ b/packages/console/src/pages/Connectors/components/ConnectorRow/index.tsx
@@ -19,9 +19,7 @@ type Props = {
 
 const ConnectorRow = ({ type, connectors, onClickSetup }: Props) => {
   const { t } = useTranslation(undefined);
-  const inUse = useConnectorInUse(
-    conditional(type === ConnectorType.Social && connectors[0]?.target)
-  );
+  const inUse = useConnectorInUse(type, connectors[0]?.target);
   const navigate = useNavigate();
   const showSetupButton = type !== ConnectorType.Social && !connectors[0];
 
@@ -40,17 +38,14 @@ const ConnectorRow = ({ type, connectors, onClickSetup }: Props) => {
       </td>
       <td>{t(connectorTitlePlaceHolder[type])}</td>
       <td>
-        {type === ConnectorType.Social && inUse !== undefined && (
+        {inUse !== undefined && (
           <Status status={inUse ? 'enabled' : 'disabled'}>
             {t('admin_console.connectors.connector_status', {
               context: inUse ? 'in_use' : 'not_in_use',
             })}
           </Status>
         )}
-        {type !== ConnectorType.Social && connectors[0] && (
-          <Status status="enabled">{t('admin_console.connectors.connector_status_in_use')}</Status>
-        )}
-        {type !== ConnectorType.Social && !connectors[0] && '-'}
+        {inUse === undefined && !connectors[0] && '-'}
       </td>
     </tr>
   );