mirror of
https://github.com/MHSanaei/3x-ui.git
synced 2026-06-05 12:44:22 +00:00
refactor(frontend): extract OutboundFormModal tls/reality security forms
Move the TLS and Reality field blocks into outbounds/security/{tls,reality}.tsx; the none/TLS/Reality Radio.Group selector stays in the modal. Drop now-unused ALPN_OPTIONS/UTLS_OPTIONS imports. OutboundFormModal.tsx down to ~918 lines (from 2238 originally). Verbatim relocation; outbound snapshots unchanged -> no behavior change. typecheck/lint/build green.
This commit is contained in:
parent
543ede63aa
commit
d40f6b9831
4 changed files with 105 additions and 86 deletions
|
|
@ -46,13 +46,11 @@ import { antdRule } from '@/utils/zodForm';
|
||||||
|
|
||||||
import {
|
import {
|
||||||
ADDRESS_PORT_STRATEGY_OPTIONS,
|
ADDRESS_PORT_STRATEGY_OPTIONS,
|
||||||
ALPN_OPTIONS,
|
|
||||||
FLOW_OPTIONS,
|
FLOW_OPTIONS,
|
||||||
HYSTERIA_NETWORK_OPTION,
|
HYSTERIA_NETWORK_OPTION,
|
||||||
NETWORK_OPTIONS,
|
NETWORK_OPTIONS,
|
||||||
PROTOCOL_OPTIONS,
|
PROTOCOL_OPTIONS,
|
||||||
SERVER_PROTOCOLS,
|
SERVER_PROTOCOLS,
|
||||||
UTLS_OPTIONS,
|
|
||||||
} from './outbound-form-constants';
|
} from './outbound-form-constants';
|
||||||
import {
|
import {
|
||||||
buildAddModeValues,
|
buildAddModeValues,
|
||||||
|
|
@ -82,6 +80,7 @@ import {
|
||||||
WsForm,
|
WsForm,
|
||||||
XhttpForm,
|
XhttpForm,
|
||||||
} from './transport';
|
} from './transport';
|
||||||
|
import { RealityForm, TlsForm } from './security';
|
||||||
import './OutboundFormModal.css';
|
import './OutboundFormModal.css';
|
||||||
|
|
||||||
// Pattern A rewrite of OutboundFormModal. Built as a sibling `.new.tsx`
|
// Pattern A rewrite of OutboundFormModal. Built as a sibling `.new.tsx`
|
||||||
|
|
@ -603,91 +602,9 @@ export default function OutboundFormModal({
|
||||||
</Form.Item>
|
</Form.Item>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{security === 'tls' && tlsAllowed && (
|
{security === 'tls' && tlsAllowed && <TlsForm />}
|
||||||
<>
|
|
||||||
<Form.Item
|
|
||||||
label="SNI"
|
|
||||||
name={['streamSettings', 'tlsSettings', 'serverName']}
|
|
||||||
>
|
|
||||||
<Input placeholder={t('pages.xray.outboundForm.serverNamePlaceholder')} />
|
|
||||||
</Form.Item>
|
|
||||||
<Form.Item
|
|
||||||
label="uTLS"
|
|
||||||
name={['streamSettings', 'tlsSettings', 'fingerprint']}
|
|
||||||
>
|
|
||||||
<Select
|
|
||||||
allowClear
|
|
||||||
placeholder={t('none')}
|
|
||||||
options={UTLS_OPTIONS}
|
|
||||||
/>
|
|
||||||
</Form.Item>
|
|
||||||
<Form.Item
|
|
||||||
label="ALPN"
|
|
||||||
name={['streamSettings', 'tlsSettings', 'alpn']}
|
|
||||||
>
|
|
||||||
<Select mode="multiple" options={ALPN_OPTIONS} />
|
|
||||||
</Form.Item>
|
|
||||||
<Form.Item
|
|
||||||
label="ECH"
|
|
||||||
name={['streamSettings', 'tlsSettings', 'echConfigList']}
|
|
||||||
>
|
|
||||||
<Input />
|
|
||||||
</Form.Item>
|
|
||||||
<Form.Item
|
|
||||||
label={t('pages.xray.outboundForm.verifyPeerName')}
|
|
||||||
name={['streamSettings', 'tlsSettings', 'verifyPeerCertByName']}
|
|
||||||
>
|
|
||||||
<Input placeholder="cloudflare-dns.com" />
|
|
||||||
</Form.Item>
|
|
||||||
<Form.Item
|
|
||||||
label={t('pages.xray.outboundForm.pinnedSha256')}
|
|
||||||
name={['streamSettings', 'tlsSettings', 'pinnedPeerCertSha256']}
|
|
||||||
>
|
|
||||||
<Input placeholder="base64 SHA256" />
|
|
||||||
</Form.Item>
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
|
|
||||||
{security === 'reality' && realityAllowed && (
|
{security === 'reality' && realityAllowed && <RealityForm />}
|
||||||
<>
|
|
||||||
<Form.Item
|
|
||||||
label="SNI"
|
|
||||||
name={['streamSettings', 'realitySettings', 'serverName']}
|
|
||||||
>
|
|
||||||
<Input />
|
|
||||||
</Form.Item>
|
|
||||||
<Form.Item
|
|
||||||
label="uTLS"
|
|
||||||
name={['streamSettings', 'realitySettings', 'fingerprint']}
|
|
||||||
>
|
|
||||||
<Select options={UTLS_OPTIONS} />
|
|
||||||
</Form.Item>
|
|
||||||
<Form.Item
|
|
||||||
label={t('pages.xray.outboundForm.shortId')}
|
|
||||||
name={['streamSettings', 'realitySettings', 'shortId']}
|
|
||||||
>
|
|
||||||
<Input />
|
|
||||||
</Form.Item>
|
|
||||||
<Form.Item
|
|
||||||
label={t('pages.inbounds.form.spiderX')}
|
|
||||||
name={['streamSettings', 'realitySettings', 'spiderX']}
|
|
||||||
>
|
|
||||||
<Input />
|
|
||||||
</Form.Item>
|
|
||||||
<Form.Item
|
|
||||||
label={t('pages.inbounds.publicKey')}
|
|
||||||
name={['streamSettings', 'realitySettings', 'publicKey']}
|
|
||||||
>
|
|
||||||
<Input.TextArea autoSize={{ minRows: 2 }} />
|
|
||||||
</Form.Item>
|
|
||||||
<Form.Item
|
|
||||||
label={t('pages.inbounds.form.mldsa65Verify')}
|
|
||||||
name={['streamSettings', 'realitySettings', 'mldsa65Verify']}
|
|
||||||
>
|
|
||||||
<Input.TextArea autoSize={{ minRows: 2 }} />
|
|
||||||
</Form.Item>
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
|
|
||||||
{((streamAllowed && network) || !streamAllowed) && (
|
{((streamAllowed && network) || !streamAllowed) && (
|
||||||
<Form.Item shouldUpdate noStyle>
|
<Form.Item shouldUpdate noStyle>
|
||||||
|
|
|
||||||
2
frontend/src/pages/xray/outbounds/security/index.ts
Normal file
2
frontend/src/pages/xray/outbounds/security/index.ts
Normal file
|
|
@ -0,0 +1,2 @@
|
||||||
|
export { default as TlsForm } from './tls';
|
||||||
|
export { default as RealityForm } from './reality';
|
||||||
48
frontend/src/pages/xray/outbounds/security/reality.tsx
Normal file
48
frontend/src/pages/xray/outbounds/security/reality.tsx
Normal file
|
|
@ -0,0 +1,48 @@
|
||||||
|
import { useTranslation } from 'react-i18next';
|
||||||
|
import { Form, Input, Select } from 'antd';
|
||||||
|
|
||||||
|
import { UTLS_OPTIONS } from '../outbound-form-constants';
|
||||||
|
|
||||||
|
export default function RealityForm() {
|
||||||
|
const { t } = useTranslation();
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Form.Item
|
||||||
|
label="SNI"
|
||||||
|
name={['streamSettings', 'realitySettings', 'serverName']}
|
||||||
|
>
|
||||||
|
<Input />
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item
|
||||||
|
label="uTLS"
|
||||||
|
name={['streamSettings', 'realitySettings', 'fingerprint']}
|
||||||
|
>
|
||||||
|
<Select options={UTLS_OPTIONS} />
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item
|
||||||
|
label={t('pages.xray.outboundForm.shortId')}
|
||||||
|
name={['streamSettings', 'realitySettings', 'shortId']}
|
||||||
|
>
|
||||||
|
<Input />
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item
|
||||||
|
label={t('pages.inbounds.form.spiderX')}
|
||||||
|
name={['streamSettings', 'realitySettings', 'spiderX']}
|
||||||
|
>
|
||||||
|
<Input />
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item
|
||||||
|
label={t('pages.inbounds.publicKey')}
|
||||||
|
name={['streamSettings', 'realitySettings', 'publicKey']}
|
||||||
|
>
|
||||||
|
<Input.TextArea autoSize={{ minRows: 2 }} />
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item
|
||||||
|
label={t('pages.inbounds.form.mldsa65Verify')}
|
||||||
|
name={['streamSettings', 'realitySettings', 'mldsa65Verify']}
|
||||||
|
>
|
||||||
|
<Input.TextArea autoSize={{ minRows: 2 }} />
|
||||||
|
</Form.Item>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
52
frontend/src/pages/xray/outbounds/security/tls.tsx
Normal file
52
frontend/src/pages/xray/outbounds/security/tls.tsx
Normal file
|
|
@ -0,0 +1,52 @@
|
||||||
|
import { useTranslation } from 'react-i18next';
|
||||||
|
import { Form, Input, Select } from 'antd';
|
||||||
|
|
||||||
|
import { ALPN_OPTIONS, UTLS_OPTIONS } from '../outbound-form-constants';
|
||||||
|
|
||||||
|
export default function TlsForm() {
|
||||||
|
const { t } = useTranslation();
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Form.Item
|
||||||
|
label="SNI"
|
||||||
|
name={['streamSettings', 'tlsSettings', 'serverName']}
|
||||||
|
>
|
||||||
|
<Input placeholder={t('pages.xray.outboundForm.serverNamePlaceholder')} />
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item
|
||||||
|
label="uTLS"
|
||||||
|
name={['streamSettings', 'tlsSettings', 'fingerprint']}
|
||||||
|
>
|
||||||
|
<Select
|
||||||
|
allowClear
|
||||||
|
placeholder={t('none')}
|
||||||
|
options={UTLS_OPTIONS}
|
||||||
|
/>
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item
|
||||||
|
label="ALPN"
|
||||||
|
name={['streamSettings', 'tlsSettings', 'alpn']}
|
||||||
|
>
|
||||||
|
<Select mode="multiple" options={ALPN_OPTIONS} />
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item
|
||||||
|
label="ECH"
|
||||||
|
name={['streamSettings', 'tlsSettings', 'echConfigList']}
|
||||||
|
>
|
||||||
|
<Input />
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item
|
||||||
|
label={t('pages.xray.outboundForm.verifyPeerName')}
|
||||||
|
name={['streamSettings', 'tlsSettings', 'verifyPeerCertByName']}
|
||||||
|
>
|
||||||
|
<Input placeholder="cloudflare-dns.com" />
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item
|
||||||
|
label={t('pages.xray.outboundForm.pinnedSha256')}
|
||||||
|
name={['streamSettings', 'tlsSettings', 'pinnedPeerCertSha256']}
|
||||||
|
>
|
||||||
|
<Input placeholder="base64 SHA256" />
|
||||||
|
</Form.Item>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
Loading…
Reference in a new issue