mirror of
https://github.com/MHSanaei/3x-ui.git
synced 2026-07-08 13:46: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.
80 lines
2.6 KiB
TypeScript
80 lines
2.6 KiB
TypeScript
'use client';
|
|
|
|
import { useState } from 'react';
|
|
import Link from 'next/link';
|
|
import { Sparkles } from 'lucide-react';
|
|
import {
|
|
recommend,
|
|
type UseCase,
|
|
type CensorshipLevel,
|
|
type ClientSupport,
|
|
} from '@/lib/xray/protocols';
|
|
import { ToolFrame } from './tool-frame';
|
|
import { SelectField } from './shared/fields';
|
|
|
|
const cap = (s: string) => s.charAt(0).toUpperCase() + s.slice(1);
|
|
|
|
export function ProtocolWizard() {
|
|
const [useCase, setUseCase] = useState<UseCase>('general');
|
|
const [censorship, setCensorship] = useState<CensorshipLevel>('medium');
|
|
const [clientSupport, setClientSupport] = useState<ClientSupport>('modern');
|
|
|
|
const result = recommend({ useCase, censorship, clientSupport });
|
|
|
|
return (
|
|
<ToolFrame
|
|
title="Protocol wizard"
|
|
description="Answer a few questions to get a recommended protocol and transport."
|
|
>
|
|
<div className="grid grid-cols-1 gap-4 sm:grid-cols-3">
|
|
<SelectField
|
|
label="Primary goal"
|
|
value={cap(useCase)}
|
|
onChange={(v) => setUseCase(v.toLowerCase() as UseCase)}
|
|
options={['Censorship', 'General', 'Speed']}
|
|
/>
|
|
<SelectField
|
|
label="Censorship level"
|
|
value={cap(censorship)}
|
|
onChange={(v) => setCensorship(v.toLowerCase() as CensorshipLevel)}
|
|
options={['High', 'Medium', 'Low']}
|
|
/>
|
|
<SelectField
|
|
label="Client support"
|
|
value={cap(clientSupport)}
|
|
onChange={(v) => setClientSupport(v.toLowerCase() as ClientSupport)}
|
|
options={['Modern', 'Broad']}
|
|
/>
|
|
</div>
|
|
|
|
<div className="mt-4 rounded-xl border bg-fd-background p-4">
|
|
<div className="flex items-center gap-2 text-brand">
|
|
<Sparkles className="size-4" aria-hidden />
|
|
<span className="text-sm font-medium">Recommended</span>
|
|
</div>
|
|
<div className="mt-2 flex flex-wrap gap-2">
|
|
<Badge>{result.protocol}</Badge>
|
|
<Badge>{result.transport}</Badge>
|
|
<Badge>{result.security}</Badge>
|
|
</div>
|
|
<p className="mt-3 text-sm text-fd-muted-foreground">{result.rationale}</p>
|
|
<div className="mt-3 flex flex-wrap gap-3 text-sm">
|
|
{result.links.map((link) => (
|
|
<Link key={link.href} href={link.href} className="text-fd-primary hover:underline">
|
|
{link.title} →
|
|
</Link>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</ToolFrame>
|
|
);
|
|
}
|
|
|
|
function Badge({ children }: { children: React.ReactNode }) {
|
|
return (
|
|
<span className="rounded-lg bg-brand/10 px-2.5 py-1 text-sm font-medium text-brand">
|
|
{children}
|
|
</span>
|
|
);
|
|
}
|