Infrastructure/logto
0
Fork 0
mirror of https://github.com/logto-io/logto.git synced 2025-02-17 22:04:19 -05:00
Code Issues Activity

refactor(console): useConnectorInUse hook (#2812)

Browse source
This commit is contained in:
Xiao Yijun 2023-01-03 18:53:43 +08:00 • committed by GitHub
parent db71cc11ac
commit fb9c967389
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 46 additions and 45 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

56
packages/console/src/hooks/use-connector-in-use.ts
View file

@ -1,41 +1,41 @@
import type { SignInExperience } from '@logto/schemas';
import type { ConnectorResponse, SignInExperience } from '@logto/schemas';
import { SignInIdentifier, ConnectorType } from '@logto/schemas';
import { useCallback } from 'react';
import useSWR from 'swr';
import type { RequestError } from './use-api';
const useConnectorInUse = (type?: ConnectorType, target?: string): boolean | undefined => {
const { data } = useSWR<SignInExperience, RequestError>(target && type && '/api/sign-in-exp');
const useConnectorInUse = () => {
const { data } = useSWR<SignInExperience, RequestError>('/api/sign-in-exp');
if (!data) {
return;
}
const isConnectorInUse = useCallback(
(connector?: ConnectorResponse) => {
if (!connector || !data) {
return false;
}
if (type === ConnectorType.Email) {
return (
data.signIn.methods.some(
({ identifier, verificationCode }) =>
verificationCode && identifier === SignInIdentifier.Email
) ||
(data.signUp.identifiers.includes(SignInIdentifier.Email) && data.signUp.verify)
);
}
const { type, target } = connector;
if (type === ConnectorType.Sms) {
return (
data.signIn.methods.some(
({ identifier, verificationCode }) =>
verificationCode && identifier === SignInIdentifier.Sms
) ||
(data.signUp.identifiers.includes(SignInIdentifier.Sms) && data.signUp.verify)
);
}
if (type === ConnectorType.Social) {
return data.socialSignInConnectorTargets.includes(target);
}
if (!target) {
return;
}
const relatedIdentifier =
type === ConnectorType.Email ? SignInIdentifier.Email : SignInIdentifier.Sms;
return data.socialSignInConnectorTargets.includes(target);
return (
data.signIn.methods.some(
({ identifier, verificationCode }) => verificationCode && identifier === relatedIdentifier
) ||
(data.signUp.identifiers.includes(relatedIdentifier) && data.signUp.verify)
);
},
[data]
);
return {
isConnectorInUse,
};
};
export default useConnectorInUse;

15
packages/console/src/pages/ConnectorDetails/index.tsx
View file

@ -52,7 +52,8 @@ const ConnectorDetails = () => {
const { data: connectorFactory } = useSWR<ConnectorFactoryResponse>(
data?.isStandard && `/api/connector-factories/${data.connectorId}`
);
const inUse = useConnectorInUse(data?.type, data?.target);
const { isConnectorInUse } = useConnectorInUse();
const inUse = isConnectorInUse(data);
const isLoading = !data && !error;
const api = useApi();
const navigate = useNavigate();
@ -124,13 +125,11 @@ const ConnectorDetails = () => {
<div className={styles.verticalBar} />
</>
)}
{inUse !== undefined && (
<Status status={inUse ? 'enabled' : 'disabled'} variant="outlined">
{t('connectors.connector_status', {
context: inUse ? 'in_use' : 'not_in_use',
})}
</Status>
)}
<Status status={inUse ? 'enabled' : 'disabled'} variant="outlined">
{t('connectors.connector_status', {
context: inUse ? 'in_use' : 'not_in_use',
})}
</Status>
<div className={styles.verticalBar} />
<div className={styles.text}>ID</div>
<CopyToClipboard value={data.id} />

20
packages/console/src/pages/Connectors/components/ConnectorRow/index.tsx
View file

@ -24,7 +24,8 @@ type Props = {
const ConnectorRow = ({ type, connectors, onClickSetup }: Props) => {
const { t } = useTranslation(undefined, { keyPrefix: 'admin_console' });
const firstConnector = connectors[0];
const inUse = useConnectorInUse(type, firstConnector?.target);
const { isConnectorInUse } = useConnectorInUse();
const inUse = isConnectorInUse(firstConnector);
const navigate = useNavigate();
const showSetupButton = type !== ConnectorType.Social && !firstConnector;
@ -67,14 +68,15 @@ const ConnectorRow = ({ type, connectors, onClickSetup }: Props) => {
</td>
<td>{connectorTypeColumn}</td>
<td>
{inUse !== undefined && (
<Status status={inUse ? 'enabled' : 'disabled'}>
{t('connectors.connector_status', {
context: inUse ? 'in_use' : 'not_in_use',
})}
</Status>
)}
{inUse === undefined && !connectors[0] && '-'}
{conditional(
firstConnector && (
<Status status={inUse ? 'enabled' : 'disabled'}>
{t('connectors.connector_status', {
context: inUse ? 'in_use' : 'not_in_use',
})}
</Status>
)
) ?? '-'}
</td>
</tr>
);