mirror of
https://github.com/MHSanaei/3x-ui.git
synced 2026-07-08 21:56:08 +00:00
MHSanaei
9b91f0f42e
Fold the standalone 3x-ui-docs project (Next.js 16 + Fumadocs, deployed to docs.sanaei.dev) into docs/ so the panel and its documentation share a single source of truth, the way sing-box keeps its docs in-tree. The old repo becomes redundant and can be retired. - Import the full site under docs/ (app, components, content, lib, public, scripts, config). The self-contained pnpm project sits alongside the existing engineering notes with no filename collisions. - Re-point "Edit on GitHub" links from MHSanaei/3x-ui-docs to this repo's docs/content/docs path (docs/lib/shared.ts, docs/app/.../page.tsx). - Add docs-ci.yml and docs-deploy.yml under .github/workflows/, scoped to docs/** and run with working-directory: docs, since GitHub only runs workflows from the repo-root .github/. deploy-static.yml's GitHub Pages publish (CNAME docs.sanaei.dev) carries over unchanged. Follow-up (outside this commit): attach the docs.sanaei.dev custom domain to this repository's Pages (or set the Vercel project's root directory to docs), confirm the site is live from the monorepo, then delete MHSanaei/3x-ui-docs.
77 lines
2.7 KiB
TypeScript
77 lines
2.7 KiB
TypeScript
'use client';
|
|
|
|
import { useId, useState } from 'react';
|
|
import { buildCurl, buildFetchSnippet, type ApiRequestInput, type HttpMethod } from '@/lib/xray/api-client';
|
|
import { ToolFrame } from './tool-frame';
|
|
import { TextField, SelectField } from './shared/fields';
|
|
import { OutputBlock } from './shared/output-block';
|
|
|
|
const METHODS: readonly HttpMethod[] = ['GET', 'POST', 'PUT', 'DELETE'];
|
|
|
|
export function ApiRequestBuilder() {
|
|
const [baseUrl, setBaseUrl] = useState('https://panel.example.com:2053');
|
|
const [token, setToken] = useState('');
|
|
const [path, setPath] = useState('/panel/api/inbounds/list');
|
|
const [method, setMethod] = useState<HttpMethod>('GET');
|
|
const [body, setBody] = useState('');
|
|
const bodyId = useId();
|
|
|
|
const showBody = method === 'POST' || method === 'PUT';
|
|
const input: ApiRequestInput = { baseUrl, token: token || '<token>', path, method, body };
|
|
|
|
function reset() {
|
|
setBaseUrl('https://panel.example.com:2053');
|
|
setToken('');
|
|
setPath('/panel/api/inbounds/list');
|
|
setMethod('GET');
|
|
setBody('');
|
|
}
|
|
|
|
return (
|
|
<ToolFrame
|
|
title="API request builder"
|
|
description="Build an authenticated cURL command or fetch() snippet for any 3x-ui panel API endpoint under /panel/api/*."
|
|
onReset={reset}
|
|
>
|
|
<div className="grid grid-cols-1 gap-4 sm:grid-cols-2">
|
|
<TextField label="Panel base URL" value={baseUrl} onChange={setBaseUrl} />
|
|
<TextField
|
|
label="API token (Bearer)"
|
|
value={token}
|
|
onChange={setToken}
|
|
placeholder="Settings → Security → API Token"
|
|
/>
|
|
<TextField label="Endpoint path" value={path} onChange={setPath} />
|
|
<SelectField
|
|
label="Method"
|
|
value={method}
|
|
onChange={(v) => setMethod(v as HttpMethod)}
|
|
options={METHODS}
|
|
/>
|
|
</div>
|
|
|
|
{showBody ? (
|
|
<div className="mt-4 flex flex-col gap-1.5">
|
|
<label htmlFor={bodyId} className="text-sm font-medium">
|
|
Request body (JSON)
|
|
</label>
|
|
<textarea
|
|
id={bodyId}
|
|
dir="ltr"
|
|
value={body}
|
|
onChange={(e) => setBody(e.target.value)}
|
|
rows={4}
|
|
placeholder='{"id": 1}'
|
|
className="rounded-lg border bg-fd-background px-3 py-2 font-mono text-sm outline-none transition-colors focus-visible:border-fd-primary focus-visible:ring-2 focus-visible:ring-fd-ring/30"
|
|
/>
|
|
</div>
|
|
) : null}
|
|
|
|
<div className="mt-4 grid grid-cols-1 gap-4">
|
|
<OutputBlock label="cURL" value={buildCurl(input)} />
|
|
<OutputBlock label="fetch()" value={buildFetchSnippet(input)} />
|
|
</div>
|
|
</ToolFrame>
|
|
);
|
|
}
|