xinyin025/3x-ui
1
0
Fork 0
mirror of https://github.com/MHSanaei/3x-ui.git synced 2026-08-14 15:20:59 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor(forms): modernize random buttons in client + outbound modals

Browse Source 
Replace the last holdouts of the old random-affordance patterns:
- ClientFormModal's five "↻" text buttons (email / subId / auth /
  password / uuid) now use <Button icon={<ReloadOutlined />} /> so
  they match the icon-based actions elsewhere in the form.
- OutboundFormModal's WireGuard private-key SyncOutlined-in-label
  becomes a real button inside a Space.Compact next to the key
  field — same pattern the inbound side already uses.

The shared .random-icon CSS class has no remaining consumers after
this and the previous inbound-form pass, so drop it from utils.css.
This commit is contained in:
MHSanaei
2026-05-27 13:43:35 +02:00
parent 9d2a4f217e
commit 43288e6686
3 changed files with 21 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/pages/clients/ClientFormModal.tsx
+6 -5
View File
@@ -14,6 +14,7 @@ import {
Tag,
message,
} from 'antd';
import { ReloadOutlined } from '@ant-design/icons';
import dayjs from 'dayjs';
import type { Dayjs } from 'dayjs';
@@ -369,7 +370,7 @@ export default function ClientFormModal({
style={{ flex: 1 }}
onChange={(e) => update('email', e.target.value)}
/>
<Button onClick={() => update('email', RandomUtil.randomLowerAndNum(12))}>↻</Button>
<Button icon={<ReloadOutlined />} onClick={() => update('email', RandomUtil.randomLowerAndNum(12))} />
</Space.Compact>
</Form.Item>
</Col>
@@ -377,7 +378,7 @@ export default function ClientFormModal({
<Form.Item label={t('pages.clients.subId')}>
<Space.Compact style={{ display: 'flex' }}>
<Input value={form.subId} style={{ flex: 1 }} onChange={(e) => update('subId', e.target.value)} />
<Button onClick={() => update('subId', RandomUtil.randomLowerAndNum(16))}>↻</Button>
<Button icon={<ReloadOutlined />} onClick={() => update('subId', RandomUtil.randomLowerAndNum(16))} />
</Space.Compact>
</Form.Item>
</Col>
@@ -388,7 +389,7 @@ export default function ClientFormModal({
<Form.Item label={t('pages.clients.hysteriaAuth')}>
<Space.Compact style={{ display: 'flex' }}>
<Input value={form.auth} style={{ flex: 1 }} onChange={(e) => update('auth', e.target.value)} />
<Button onClick={() => update('auth', RandomUtil.randomLowerAndNum(16))}>↻</Button>
<Button icon={<ReloadOutlined />} onClick={() => update('auth', RandomUtil.randomLowerAndNum(16))} />
</Space.Compact>
</Form.Item>
</Col>
@@ -396,7 +397,7 @@ export default function ClientFormModal({
<Form.Item label={t('pages.clients.password')}>
<Space.Compact style={{ display: 'flex' }}>
<Input value={form.password} style={{ flex: 1 }} onChange={(e) => update('password', e.target.value)} />
<Button onClick={() => update('password', RandomUtil.randomLowerAndNum(16))}>↻</Button>
<Button icon={<ReloadOutlined />} onClick={() => update('password', RandomUtil.randomLowerAndNum(16))} />
</Space.Compact>
</Form.Item>
</Col>
@@ -407,7 +408,7 @@ export default function ClientFormModal({
<Form.Item label={t('pages.clients.uuid')}>
<Space.Compact style={{ display: 'flex' }}>
<Input value={form.uuid} style={{ flex: 1 }} onChange={(e) => update('uuid', e.target.value)} />
<Button onClick={() => update('uuid', RandomUtil.randomUUID())}>↻</Button>
<Button icon={<ReloadOutlined />} onClick={() => update('uuid', RandomUtil.randomUUID())} />
</Space.Compact>
</Form.Item>
</Col>