0
Fork 0
mirror of https://github.com/logto-io/logto.git synced 2024-12-16 20:26:19 -05:00

fix(console): dark visible base on initial form data (#2795)

This commit is contained in:
wangsijie 2022-12-30 21:51:06 +08:00 committed by GitHub
parent bd9abaa509
commit aafd2140db
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 24 additions and 7 deletions

View file

@ -103,7 +103,11 @@ const ConnectorContent = ({ isDeleted, connectorData, onConnectorUpdated }: Prop
description="connector_details.settings_description" description="connector_details.settings_description"
learnMoreLink="https://docs.logto.io/docs/references/connectors" learnMoreLink="https://docs.logto.io/docs/references/connectors"
> >
<ConnectorForm connector={connectorData} /> <ConnectorForm
connectorType={connectorData.type}
isStandard={connectorData.isStandard}
isDarkDefaultVisible={Boolean(connectorData.metadata.logoDark)}
/>
{connectorData.type !== ConnectorType.Social && ( {connectorData.type !== ConnectorType.Social && (
<SenderTester <SenderTester
className={styles.senderTest} className={styles.senderTest}

View file

@ -19,19 +19,27 @@ import { SyncProfileMode } from '../../types';
import * as styles from './index.module.scss'; import * as styles from './index.module.scss';
type Props = { type Props = {
connector: ConnectorFactoryResponse; connectorType: ConnectorType;
isStandard: ConnectorFactoryResponse['isStandard'];
configTemplate?: ConnectorFactoryResponse['configTemplate'];
isAllowEditTarget?: boolean; isAllowEditTarget?: boolean;
isDarkDefaultVisible?: boolean;
}; };
const ConnectorForm = ({ connector, isAllowEditTarget }: Props) => { const ConnectorForm = ({
configTemplate,
isStandard,
isAllowEditTarget,
isDarkDefaultVisible,
connectorType,
}: Props) => {
const { t } = useTranslation(undefined, { keyPrefix: 'admin_console' }); const { t } = useTranslation(undefined, { keyPrefix: 'admin_console' });
const { configTemplate, isStandard, logoDark } = connector;
const { const {
control, control,
register, register,
formState: { errors }, formState: { errors },
} = useFormContext<ConnectorFormType>(); } = useFormContext<ConnectorFormType>();
const [darkVisible, setDarkVisible] = useState(Boolean(logoDark)); const [darkVisible, setDarkVisible] = useState(Boolean(isDarkDefaultVisible));
const toggleDarkVisible = () => { const toggleDarkVisible = () => {
setDarkVisible((previous) => !previous); setDarkVisible((previous) => !previous);
@ -141,7 +149,7 @@ const ConnectorForm = ({ connector, isAllowEditTarget }: Props) => {
)} )}
/> />
</FormField> </FormField>
{connector.type === ConnectorType.Social && ( {connectorType === ConnectorType.Social && (
<FormField title="connectors.guide.sync_profile"> <FormField title="connectors.guide.sync_profile">
<Controller <Controller
name="syncProfile" name="syncProfile"

View file

@ -122,7 +122,12 @@ const Guide = ({ connector, onClose }: Props) => {
<div className={styles.title}>{t('connectors.guide.connector_setting')}</div> <div className={styles.title}>{t('connectors.guide.connector_setting')}</div>
<FormProvider {...methods}> <FormProvider {...methods}>
<form onSubmit={onSubmit}> <form onSubmit={onSubmit}>
<ConnectorForm isAllowEditTarget connector={connector} /> <ConnectorForm
isAllowEditTarget
connectorType={connector.type}
configTemplate={connector.configTemplate}
isStandard={connector.isStandard}
/>
{!isSocialConnector && ( {!isSocialConnector && (
<SenderTester <SenderTester
className={styles.tester} className={styles.tester}