refactor: move constants

This commit is contained in:
Maël Gangloff
2025-02-18 21:42:15 +01:00
parent 58bd2f7559
commit 5e66ba9c35
10 changed files with 89 additions and 95 deletions

View File

@@ -10,10 +10,9 @@ import {providersConfig} from "../../../utils/providers"
export function ConnectorForm({form, onCreate}: { form: FormInstance, onCreate: (values: Connector) => void }) { export function ConnectorForm({form, onCreate}: { form: FormInstance, onCreate: (values: Connector) => void }) {
const [provider, setProvider] = useState<ConnectorProvider>() const [provider, setProvider] = useState<ConnectorProvider>()
const providersConfigList = providersConfig()
const [current, setCurrent] = useState(0) const [current, setCurrent] = useState(0)
const ProviderForm = provider !== undefined ? providersConfigList[provider].form : undefined const ProviderForm = provider !== undefined ? providersConfig[provider].form : undefined
const steps: StepProps[] = [ const steps: StepProps[] = [
{ {
@@ -38,7 +37,7 @@ export function ConnectorForm({form, onCreate}: { form: FormInstance, onCreate:
<> <>
<h2>{t`Choose a registrar`}</h2> <h2>{t`Choose a registrar`}</h2>
<Row gutter={[16, 16]}> <Row gutter={[16, 16]}>
{Object.keys(providersConfigList).map((provider: string) => ( {Object.keys(providersConfig).map((provider: string) => (
<Col key={provider as ConnectorProvider} span={8}> <Col key={provider as ConnectorProvider} span={8}>
<Card <Card
hoverable hoverable

View File

@@ -50,7 +50,7 @@ export function ConnectorsList({connectors, onDelete}: { connectors: ConnectorEl
{t`You can stop using a connector at any time. To delete a connector, you must remove it from each linked Watchlist. {t`You can stop using a connector at any time. To delete a connector, you must remove it from each linked Watchlist.
The creation date corresponds to the date on which you consented to the creation of the connector and on which you declared in particular that you fulfilled the conditions of use of the supplier's API, waived the right of withdrawal and were of the minimum age to consent to these conditions.`} The creation date corresponds to the date on which you consented to the creation of the connector and on which you declared in particular that you fulfilled the conditions of use of the supplier's API, waived the right of withdrawal and were of the minimum age to consent to these conditions.`}
&nbsp; &nbsp;
<Typography.Link href={providersConfig()[connector.provider].tosLink}> <Typography.Link href={providersConfig[connector.provider].tosLink}>
{t`The Providers conditions are accessible by following this hyperlink.`} {t`The Providers conditions are accessible by following this hyperlink.`}
</Typography.Link> </Typography.Link>
</> </>

View File

@@ -269,7 +269,7 @@ export function WatchlistForm({form, connectors, onFinish, isCreation}: {
</> </>
)} )}
</Form.List> </Form.List>
<Form.Item style={{marginTop: '5vh'}}> <Form.Item style={{marginTop: '5em'}}>
<Space> <Space>
<Button type='primary' htmlType='submit'> <Button type='primary' htmlType='submit'>
{isCreation ? t`Create` : t`Update`} {isCreation ? t`Create` : t`Update`}

View File

@@ -4,15 +4,8 @@ import React from 'react'
import type {Connector} from '../../api/connectors' import type {Connector} from '../../api/connectors'
import {ConnectorProvider} from '../../api/connectors' import {ConnectorProvider} from '../../api/connectors'
import {t} from 'ttag' import {t} from 'ttag'
import {DefaultConnectorFormItems} from "./index" import DefaultConnectorFormItems from "./DefaultConnectorFormItems"
import {providersConfig} from "../index" import {formItemLayoutWithOutLabel, providersConfig} from "../index"
const formItemLayoutWithOutLabel = {
wrapperCol: {
xs: {span: 24, offset: 0},
sm: {span: 20, offset: 4}
}
}
export default function AutoDnsConnectorForm({form, onCreate}: { export default function AutoDnsConnectorForm({form, onCreate}: {
form: FormInstance, form: FormInstance,
@@ -97,7 +90,7 @@ export default function AutoDnsConnectorForm({form, onCreate}: {
</Checkbox> </Checkbox>
</Form.Item> </Form.Item>
<DefaultConnectorFormItems tosLink={providersConfig()[ConnectorProvider.AutoDNS].tosLink}/> <DefaultConnectorFormItems tosLink={providersConfig[ConnectorProvider.AutoDNS].tosLink}/>
</Form> </Form>
) )
} }

View File

@@ -2,7 +2,7 @@ import {Button, Checkbox, Form, Input, Typography} from "antd"
import {t} from "ttag" import {t} from "ttag"
import React from "react" import React from "react"
export function DefaultConnectorFormItems({tosLink}: { tosLink: string }) { export default function DefaultConnectorFormItems({tosLink}: { tosLink: string }) {
return <> return <>
<Form.Item name="provider" noStyle> <Form.Item name="provider" noStyle>
<Input type="hidden" /> <Input type="hidden" />
@@ -47,7 +47,7 @@ export function DefaultConnectorFormItems({tosLink}: { tosLink: string }) {
</Form.Item> </Form.Item>
<Form.Item style={{marginTop: '5vh', textAlign: 'center'}}> <Form.Item style={{marginTop: '5em', textAlign: 'center'}}>
<Button type='primary' htmlType='submit'> <Button type='primary' htmlType='submit'>
{t`Create`} {t`Create`}
</Button> </Button>

View File

@@ -4,7 +4,7 @@ import React from 'react'
import type {Connector} from '../../api/connectors' import type {Connector} from '../../api/connectors'
import {ConnectorProvider} from '../../api/connectors' import {ConnectorProvider} from '../../api/connectors'
import {t} from 'ttag' import {t} from 'ttag'
import {DefaultConnectorFormItems} from "./index" import DefaultConnectorFormItems from "./DefaultConnectorFormItems"
import {providersConfig} from "../index" import {providersConfig} from "../index"
const formItemLayoutWithOutLabel = { const formItemLayoutWithOutLabel = {
@@ -48,7 +48,7 @@ export default function GandiConnectorForm({form, onCreate}: {
> >
<Input autoComplete='off' placeholder='xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx'/> <Input autoComplete='off' placeholder='xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx'/>
</Form.Item> </Form.Item>
<DefaultConnectorFormItems tosLink={providersConfig()[ConnectorProvider.Gandi].tosLink}/> <DefaultConnectorFormItems tosLink={providersConfig[ConnectorProvider.Gandi].tosLink}/>
</Form> </Form>
) )

View File

@@ -4,15 +4,8 @@ import React from 'react'
import type {Connector} from '../../api/connectors' import type {Connector} from '../../api/connectors'
import {ConnectorProvider} from '../../api/connectors' import {ConnectorProvider} from '../../api/connectors'
import {t} from 'ttag' import {t} from 'ttag'
import {DefaultConnectorFormItems} from "./index" import DefaultConnectorFormItems from "./DefaultConnectorFormItems"
import {providersConfig} from "../index" import {formItemLayoutWithOutLabel, providersConfig} from "../index"
const formItemLayoutWithOutLabel = {
wrapperCol: {
xs: {span: 24, offset: 0},
sm: {span: 20, offset: 4}
}
}
export default function NamecheapConnectorForm({form, onCreate}: { export default function NamecheapConnectorForm({form, onCreate}: {
form: FormInstance, form: FormInstance,
@@ -43,7 +36,7 @@ export default function NamecheapConnectorForm({form, onCreate}: {
> >
<Input autoComplete='off'/> <Input autoComplete='off'/>
</Form.Item> </Form.Item>
<DefaultConnectorFormItems tosLink={providersConfig()[ConnectorProvider.Namecheap].tosLink}/> <DefaultConnectorFormItems tosLink={providersConfig[ConnectorProvider.Namecheap].tosLink}/>
</Form> </Form>
) )
} }

View File

@@ -4,15 +4,8 @@ import React from 'react'
import type {Connector} from '../../api/connectors' import type {Connector} from '../../api/connectors'
import {ConnectorProvider} from '../../api/connectors' import {ConnectorProvider} from '../../api/connectors'
import {t} from 'ttag' import {t} from 'ttag'
import {DefaultConnectorFormItems} from "./index" import DefaultConnectorFormItems from "./DefaultConnectorFormItems"
import {providersConfig} from "../index" import {formItemLayoutWithOutLabel, providersConfig} from "../index"
const formItemLayoutWithOutLabel = {
wrapperCol: {
xs: {span: 24, offset: 0},
sm: {span: 20, offset: 4}
}
}
export default function NamecomConnectorForm({form, onCreate}: { export default function NamecomConnectorForm({form, onCreate}: {
form: FormInstance, form: FormInstance,
@@ -47,7 +40,7 @@ export default function NamecomConnectorForm({form, onCreate}: {
> >
<Input autoComplete='off'/> <Input autoComplete='off'/>
</Form.Item> </Form.Item>
<DefaultConnectorFormItems tosLink={providersConfig()[ConnectorProvider["Name.com"]].tosLink}/> <DefaultConnectorFormItems tosLink={providersConfig[ConnectorProvider["Name.com"]].tosLink}/>
</Form> </Form>
) )
} }

View File

@@ -5,15 +5,8 @@ import type {FormInstance} from "antd"
import {Form, Input, Popconfirm, Select} from "antd" import {Form, Input, Popconfirm, Select} from "antd"
import type {Connector} from "../../api/connectors" import type {Connector} from "../../api/connectors"
import {ConnectorProvider} from "../../api/connectors" import {ConnectorProvider} from "../../api/connectors"
import {DefaultConnectorFormItems} from "./index" import DefaultConnectorFormItems from "./DefaultConnectorFormItems"
import {providersConfig} from "../index" import {formItemLayoutWithOutLabel, providersConfig} from "../index"
const formItemLayoutWithOutLabel = {
wrapperCol: {
xs: {span: 24, offset: 0},
sm: {span: 20, offset: 4}
}
}
export default function OvhCloudConnectorForm({form, onCreate}: { export default function OvhCloudConnectorForm({form, onCreate}: {
form: FormInstance, form: FormInstance,
@@ -24,20 +17,16 @@ export default function OvhCloudConnectorForm({form, onCreate}: {
form.setFieldValue('provider', ConnectorProvider.OVHcloud) form.setFieldValue('provider', ConnectorProvider.OVHcloud)
const ovhFields = {
appKey: t`Application key`,
appSecret: t`Application secret`,
consumerKey: t`Consumer key`
}
const ovhEndpointList = [ const ovhEndpointList = [
{ {label: t`European Region`, value: 'ovh-eu'},
label: t`European Region`, {label: t`United States Region`, value: 'ovh-us'},
value: 'ovh-eu' {label: t`Canada Region`, value: 'ovh-ca'}
}
] ]
const ovhSubsidiaryList = [...[ const ovhSubsidiaryList = [...[
'CZ', 'DE', 'ES', 'FI', 'FR', 'GB', 'IE', 'IT', 'LT', 'MA', 'NL', 'PL', 'PT', 'SN', 'TN' 'CZ', 'DE', 'ES', 'FI', 'FR', 'GB', 'IE', 'IT', 'LT', 'MA', 'NL', 'PL', 'PT', 'SN', 'TN'
].map(c => ({value: c, label: regionNames.of(c) ?? c})), {value: 'EU', label: t`Europe`}] ].map(c => ({value: c, label: regionNames.of(c) ?? c})), {value: 'EU', label: t`Europe`}]
const ovhPricingMode = [ const ovhPricingMode = [
{value: 'create-default', label: t`The domain is free and at the standard price`}, {value: 'create-default', label: t`The domain is free and at the standard price`},
{ {
@@ -55,16 +44,38 @@ export default function OvhCloudConnectorForm({form, onCreate}: {
wrapperCol={{span: 14}} wrapperCol={{span: 14}}
onFinish={onCreate} onFinish={onCreate}
> >
{ <Form.Item
Object.keys(ovhFields).map(fieldName => <Form.Item label={t`Application key`}
key={ovhFields[fieldName as keyof typeof ovhFields]} name={['authData', 'appKey']}
label={ovhFields[fieldName as keyof typeof ovhFields]} rules={[{required: true, message: t`Required`}]}
name={['authData', fieldName]} >
rules={[{required: true, message: t`Required`}]} <Input autoComplete='off'/>
> </Form.Item>
<Input autoComplete='off'/>
</Form.Item>) <Form.Item
} label={t`Application secret`}
name={['authData', 'appSecret']}
rules={[{required: true, message: t`Required`}]}
>
<Input autoComplete='off'/>
</Form.Item>
<Form.Item
label={t`Consumer key`}
name={['authData', 'consumerKey']}
rules={[{required: true, message: t`Required`}]}
>
<Input autoComplete='off'/>
</Form.Item>
<Form.Item
label={t`Application key`}
name={['authData', 'appKey']}
rules={[{required: true, message: t`Required`}]}
>
<Input autoComplete='off'/>
</Form.Item>
<Form.Item <Form.Item
label={t`OVH Endpoint`} label={t`OVH Endpoint`}
name={['authData', 'apiEndpoint']} name={['authData', 'apiEndpoint']}
@@ -108,7 +119,7 @@ export default function OvhCloudConnectorForm({form, onCreate}: {
/> />
</Popconfirm> </Popconfirm>
</Form.Item> </Form.Item>
<DefaultConnectorFormItems tosLink={providersConfig()[ConnectorProvider.OVHcloud].tosLink}/> <DefaultConnectorFormItems tosLink={providersConfig[ConnectorProvider.OVHcloud].tosLink}/>
</Form> </Form>
) )
} }

View File

@@ -8,38 +8,43 @@ import NamecheapConnectorForm from "./forms/NamecheapConnectorForm"
import AutoDnsConnectorForm from "./forms/AutoDnsConnectorForm" import AutoDnsConnectorForm from "./forms/AutoDnsConnectorForm"
import NamecomConnectorForm from "./forms/NamecomConnectorForm" import NamecomConnectorForm from "./forms/NamecomConnectorForm"
export const formItemLayoutWithOutLabel = {
wrapperCol: {
xs: {span: 24, offset: 0},
sm: {span: 20, offset: 4}
}
}
export type ProviderConfig = { export type ProviderConfig = {
tosLink: string tosLink: string
tokenLink: string tokenLink: string
form: ({form, onCreate}: { form: FormInstance, onCreate: (values: Connector) => void }) => React.ReactElement form: ({form, onCreate}: { form: FormInstance, onCreate: (values: Connector) => void }) => React.ReactElement
} }
export const providersConfig: () => Record<ConnectorProvider, ProviderConfig> = () => { export const providersConfig: Record<ConnectorProvider, ProviderConfig> = {
return { [ConnectorProvider.OVHcloud]: {
[ConnectorProvider.OVHcloud]: { tosLink: 'https://www.ovhcloud.com/en/terms-and-conditions/contracts/',
tosLink: 'https://www.ovhcloud.com/en/terms-and-conditions/contracts/', tokenLink: 'https://api.ovh.com/createToken/?GET=/order/cart&GET=/order/cart/*&POST=/order/cart&POST=/order/cart/*&DELETE=/order/cart/*&GET=/domain/extensions',
tokenLink: 'https://api.ovh.com/createToken/?GET=/order/cart&GET=/order/cart/*&POST=/order/cart&POST=/order/cart/*&DELETE=/order/cart/*&GET=/domain/extensions', form: OvhCloudConnectorForm
form: OvhCloudConnectorForm },
}, [ConnectorProvider.Gandi]: {
[ConnectorProvider.Gandi]: { tosLink: 'https://www.gandi.net/en/contracts/terms-of-service',
tosLink: 'https://www.gandi.net/en/contracts/terms-of-service', tokenLink: 'https://admin.gandi.net/organizations/account/pat',
tokenLink: 'https://admin.gandi.net/organizations/account/pat', form: GandiConnectorForm
form: GandiConnectorForm },
}, [ConnectorProvider.Namecheap]: {
[ConnectorProvider.Namecheap]: { tosLink: 'https://www.namecheap.com/legal/universal/universal-tos/',
tosLink: 'https://www.namecheap.com/legal/universal/universal-tos/', tokenLink: 'https://ap.www.namecheap.com/settings/tools/apiaccess/',
tokenLink: 'https://ap.www.namecheap.com/settings/tools/apiaccess/', form: NamecheapConnectorForm
form: NamecheapConnectorForm },
}, [ConnectorProvider.AutoDNS]: {
[ConnectorProvider.AutoDNS]: { tosLink: 'https://www.internetx.com/agb/',
tosLink: 'https://www.internetx.com/agb/', tokenLink: 'https://en.autodns.com/domain-robot-api/',
tokenLink: 'https://en.autodns.com/domain-robot-api/', form: AutoDnsConnectorForm
form: AutoDnsConnectorForm },
}, [ConnectorProvider["Name.com"]]: {
[ConnectorProvider["Name.com"]]: { tosLink: 'https://www.name.com/policies/',
tosLink: 'https://www.name.com/policies/', tokenLink: 'https://www.name.com/account/settings/api',
tokenLink: 'https://www.name.com/account/settings/api', form: NamecomConnectorForm
form: NamecomConnectorForm
}
} }
} }