domain-watchdog/assets/utils/providers/forms/EppConnectorForm.tsx
2025-03-23 16:12:10 +01:00

286 lines
12 KiB
TypeScript

import React from "react"
import {t} from "ttag"
import {Alert, Card, Col, Form, Input, InputNumber, Row, Select, Space, Switch} from "antd"
import {
CloseOutlined,
DatabaseOutlined,
DollarOutlined,
FieldTimeOutlined,
IdcardOutlined,
KeyOutlined,
LockOutlined,
PlusOutlined,
SignatureOutlined,
ToolOutlined,
UserOutlined,
ShopOutlined,
ShoppingOutlined
} from "@ant-design/icons"
const DynamicKeyValueList = ({name, label, initialValue, keyPlaceholder, valuePlaceholder}: {
name: string[],
label: string,
initialValue: { [key: string]: string }[],
keyPlaceholder: string,
valuePlaceholder: string
}) => <Form.Item label={label}>
<Form.List name={name} initialValue={initialValue}>
{(subFields, subOpt) => (
<>
{subFields.map((subField, index) => (
<Row key={subField.key} gutter={[16, 16]}>
<Col span={10}>
<Form.Item name={[subField.name, 'key']}>
<Input placeholder={keyPlaceholder}/>
</Form.Item>
</Col>
<Col span={10}>
<Form.Item name={[subField.name, 'value']}>
<Input placeholder={valuePlaceholder}/>
</Form.Item>
</Col>
<Col span={4}>
<Space>
<CloseOutlined
onClick={() => subOpt.remove(subField.name)}
/>
{index === subFields.length - 1 && <PlusOutlined onClick={() => subOpt.add()}/>}
</Space>
</Col>
</Row>
))}
</>
)}
</Form.List>
</Form.Item>
export default function EppConnectorForm() {
return <>
<Alert
message={t`This connector is experimental and its implementation has not been fully tested. Please submit an issue for any issues related to it.`}
type='warning'
style={{marginBottom: '1em'}}
/>
<Alert
message={t`The EPP connector is a special type of connector. Be careful.`}
type='info'
style={{marginBottom: '2em'}}
/>
<Card size="small" title={t`Server configuration`} bordered={false}>
<Form.Item label={t`Protocol`}>
<Row gutter={16}>
<Col span={12}>
<Form.Item
help={t`Version`}
name={['authData', 'version']}
initialValue='1.0'
hasFeedback
rules={[{required: true, message: t`Required`}]}
>
<Input autoComplete='off' required/>
</Form.Item>
</Col>
<Col span={12}>
<Form.Item
help={t`Language`}
name={['authData', 'language']}
initialValue='en'
hasFeedback
rules={[{required: true, message: t`Required`}]}
>
<Input autoComplete='off' required/>
</Form.Item>
</Col>
</Row>
</Form.Item>
<Form.Item
label={t`Server`}
name={['authData', 'hostname']}
hasFeedback
rules={[{required: true, message: t`Required`}]}>
<Input prefix={<DatabaseOutlined/>} addonAfter={
<Form.Item
name={['authData', 'port']}
hasFeedback
noStyle
initialValue={700}
rules={[{required: true, message: t`Required`}]}
>
<InputNumber autoComplete='off' required/>
</Form.Item>
} placeholder='ssl://epp.nic.tld' autoComplete='off' required/>
</Form.Item>
</Card>
<Card size="small" title={t`Authentication`} bordered={false}>
<Form.Item label={t`Credentials`}>
<Row gutter={16}>
<Col span={12}>
<Form.Item
name={['authData', 'auth', 'username']}
hasFeedback
rules={[{required: true, message: t`Required`}]}
>
<Input prefix={<UserOutlined/>} placeholder={t`Username`} autoComplete='off' required/>
</Form.Item>
</Col>
<Col span={12}>
<Form.Item
name={['authData', 'auth', 'password']}
hasFeedback
rules={[{required: true, message: t`Required`}]}
>
<Input prefix={<LockOutlined/>} placeholder={t`Password`} autoComplete='off' required/>
</Form.Item>
</Col>
</Row>
</Form.Item>
<Form.Item label={t`TLS client certificate`}>
<Row gutter={16}>
<Col span={12}>
<Form.Item
hasFeedback
name={['authData', 'certificate_pem']}>
<Input.TextArea rows={5} placeholder={`-----BEGIN CERTIFICATE-----
...
-----END CERTIFICATE-----`}/>
</Form.Item>
</Col>
<Col span={12}>
<Form.Item name={['authData', 'certificate_key']}>
<Input.TextArea rows={5} placeholder={`-----BEGIN ENCRYPTED PRIVATE KEY-----
...
-----END ENCRYPTED PRIVATE KEY-----`}/>
</Form.Item>
<Form.Item name={['authData', 'auth', 'ssl', 'passphrase']}>
<Input prefix={<KeyOutlined/>} placeholder={t`Private key passphrase (optional)`}
autoComplete='off'/>
</Form.Item>
</Col>
</Row>
</Form.Item>
<Form.Item label={t`TLS configuration`}>
<Row gutter={16}>
<Col span={8}>
<Form.Item
initialValue={true}
help={t`Verify peer`}
name={['authData', 'auth', 'ssl', 'verify_peer']}
>
<Switch/>
</Form.Item>
</Col>
<Col span={8}>
<Form.Item
initialValue={true}
help={t`Verify peer name`}
name={['authData', 'auth', 'ssl', 'verify_peer_name']}
>
<Switch/>
</Form.Item>
</Col>
<Col span={8}>
<Form.Item
initialValue={false}
help={t`Allow self-signed certificates`}
name={['authData', 'auth', 'ssl', 'allow_self_signed']}
>
<Switch/>
</Form.Item>
</Col>
</Row>
</Form.Item>
</Card>
<Card size="small" title={t`Domain configuration`} bordered={false}>
<Form.Item
label={t`Registration period`}
initialValue={1}
hasFeedback
rules={[{
required: true,
message: t`Required`,
validator: (_, v: number) => v > 0 && v < 100 ? Promise.resolve() : Promise.reject()
}]}
name={['authData', 'domain', 'period']}
>
<InputNumber prefix={<FieldTimeOutlined/>} addonAfter={
<Form.Item name={['authData', 'domain', 'unit']} noStyle initialValue={'y'}>
<Select style={{width: 100}}>
<Select.Option value="y">{t`Year`}</Select.Option>
<Select.Option value="m">{t`Month`}</Select.Option>
</Select>
</Form.Item>
} required/>
</Form.Item>
<Form.Item
label={t`Auth-Info Code`}
hasFeedback
rules={[{required: true, message: t`Required`}]}
name={['authData', 'domain', 'password']}
>
<Input prefix={<LockOutlined/>} required/>
</Form.Item>
<Form.Item label={t`NIC Handle`}>
<Row gutter={16}>
<Col span={4}>
<Form.Item
hasFeedback
required
rules={[{required: true, message: t`Required`}]}
name={['authData', 'domain', 'registrant']}>
<Input prefix={<SignatureOutlined/>} placeholder={t`Registrant`} required/>
</Form.Item>
</Col>
<Col span={4}>
<Form.Item name={['authData', 'domain', 'contacts', 'admin']}>
<Input prefix={<IdcardOutlined/>} placeholder={t`Administrative`}/>
</Form.Item>
</Col>
<Col span={4}>
<Form.Item name={['authData', 'domain', 'contacts', 'tech']}>
<Input prefix={<ToolOutlined/>} placeholder={t`Technical`}/>
</Form.Item>
</Col>
<Col span={4}>
<Form.Item name={['authData', 'domain', 'contacts', 'billing']}>
<Input prefix={<DollarOutlined/>} placeholder={t`Billing`}/>
</Form.Item>
</Col>
<Col span={4}>
<Form.Item name={['authData', 'domain', 'contacts', 'onsite']}>
<Input prefix={<ShopOutlined />} placeholder={t`Onsite`}/>
</Form.Item>
</Col>
<Col span={4}>
<Form.Item name={['authData', 'domain', 'contacts', 'reseller']}>
<Input prefix={<ShoppingOutlined />} placeholder={t`Reseller`}/>
</Form.Item>
</Col>
</Row>
</Form.Item>
</Card>
<Card size="small" title={t`Protocol configuration`} bordered={false}>
<DynamicKeyValueList name={['objURI']} label={t`Services`} initialValue={[
{key: 'urn:ietf:params:xml:ns:host-1.0', value: 'host'},
{key: 'urn:ietf:params:xml:ns:contact-1.0', value: 'contact'},
{key: 'urn:ietf:params:xml:ns:domain-1.0', value: 'domain'}
]} keyPlaceholder='urn:ietf:params:xml:ns:host-1.0' valuePlaceholder='host'/>
<DynamicKeyValueList name={['extURI']} label={t`Extensions`} initialValue={[
{key: 'urn:ietf:params:xml:ns:rgp-1.0', value: 'rgp'}
]} keyPlaceholder='urn:ietf:params:xml:ns:rgp-1.0' valuePlaceholder='rgp'/>
</Card>
</>
}