mirror of https://github.com/MHSanaei/3x-ui.git synced 2026-06-05 12:44:22 +00:00

History

MHSanaei a7166988ca feat(frontend): complete outbound sockopt section with remaining knobs Add the four remaining SockoptStreamSettings fields that were edit-via-JSON-only after the initial outbound modal rewrite: - TCP keep-alive idle (s) — tcpKeepAliveIdle, time before sending the first probe on an idle TCP connection. - TCP max segment — tcpMaxSeg, override the default MSS. - TCP window clamp — tcpWindowClamp, cap the TCP receive window. - Trusted X-Forwarded-For — trustedXForwardedFor, list of trusted proxy hostnames/CIDRs whose XFF headers Xray will honor. The outbound sockopt section now exposes all 17 SockoptStreamSettings fields from the schema. The InboundFormModal's sockopt section has its own field list (closer to the legacy class) and is unchanged.		2026-05-26 13:47:09 +02:00
..
public	feat(frontend): TanStack Query + React Router migration & in-panel API docs (#4541 )	2026-05-24 21:34:52 +02:00
scripts	refactor(frontend): port api-docs/endpoints to TypeScript	2026-05-25 15:29:26 +02:00
src	feat(frontend): complete outbound sockopt section with remaining knobs	2026-05-26 13:47:09 +02:00
.gitignore	Vue3 migration (#4198 )	2026-05-09 17:47:35 +02:00
eslint.config.js	chore(frontend): enforce no-explicit-any: error + add typecheck/test to CI	2026-05-26 12:31:01 +02:00
index.html	feat(inbound): Advanced XHTTP and external TLS proxy settings (#4491 )	2026-05-24 21:54:26 +02:00
login.html	Frontend rewrite: React + TypeScript with AntD v6 (#4498 )	2026-05-23 15:21:45 +02:00
package-lock.json	test(frontend): vitest harness with golden-file fixtures for inbound protocols	2026-05-25 23:22:12 +02:00
package.json	test(frontend): vitest harness with golden-file fixtures for inbound protocols	2026-05-25 23:22:12 +02:00
README.md	Frontend rewrite: React + TypeScript with AntD v6 (#4498 )	2026-05-23 15:21:45 +02:00
subpage.html	Frontend rewrite: React + TypeScript with AntD v6 (#4498 )	2026-05-23 15:21:45 +02:00
tsconfig.json	Frontend rewrite: React + TypeScript with AntD v6 (#4498 )	2026-05-23 15:21:45 +02:00
vite.config.js	fix(vite): bypass es-toolkit CJS shim for recharts deep imports	2026-05-25 17:33:20 +02:00
vitest.config.ts	refactor(frontend): extract genVmessLink to lib/xray/inbound-link.ts	2026-05-26 00:07:36 +02:00

README.md

3x-ui frontend

React 19 + Ant Design 6 + TypeScript + Vite 8. Multi-page app — one HTML entry per panel route — built into ../web/dist/ and embedded into the Go binary via embed.FS.

Dev

npm install
npm run dev

Vite serves on http://localhost:5173/. API calls and /panel/* routes proxy to the Go panel at http://localhost:2053/, so start the Go panel first (go run main.go) and then Vite.

The proxy auto-rewrites /panel, /panel/settings, /panel/inbounds, /panel/xray to the matching Vite-served HTML in dev mode (see MIGRATED_ROUTES in vite.config.js), so the sidebar's production-style links work without round-tripping through Go.

Production build

npm run build

Outputs to ../web/dist/ (HTML at the root, hashed JS/CSS under assets/). The Go binary embeds this directory at compile time and web/controller/dist.go serves the per-page HTML.

Type check and lint

npm run typecheck
npm run lint

tsc --noEmit against tsconfig.json (strict mode, jsx: "react-jsx", @/* → src/* alias). ESLint 10 with eslint.config.js (flat config) — @eslint/js recommended plus typescript-eslint and eslint-plugin-react-hooks rules.

Layout

frontend/
├── *.html                 # Vite entry HTML, one per panel route
├── tsconfig.json
├── eslint.config.js
├── vite.config.js
└── src/
    ├── entries/           # Per-page bootstrap (createRoot + render)
    ├── pages/             # One folder per route, each with the page
    │   ├── index/         # component + helpers + sub-components
    │   ├── login/
    │   ├── inbounds/
    │   ├── clients/
    │   ├── xray/
    │   ├── nodes/
    │   ├── settings/
    │   ├── api-docs/
    │   └── sub/
    ├── components/        # Cross-page React components
    ├── hooks/             # Reusable hooks (useTheme, useWebSocket, …)
    ├── api/               # Axios setup, CSRF interceptor, WebSocket
    ├── i18n/              # react-i18next init (locales live in web/translation/)
    ├── models/            # Inbound, Outbound, Status, … domain classes
    ├── styles/            # Shared CSS modules (page-cards, …)
    └── utils/             # HttpUtil, ObjectUtil, LanguageManager, …

Adding a new page

Add frontend/<page>.html referencing /src/entries/<page>.tsx.
Add src/entries/<page>.tsx that imports the page component and mounts it with createRoot(...).render(...).
Add the page component under src/pages/<page>/.
Register the entry in rollupOptions.input in vite.config.js.
If the page is reachable from the sidebar at /panel/<route>, add it to MIGRATED_ROUTES so the dev proxy serves the Vite HTML.
Wire the Go controller to serveDistPage(c, "<page>.html").