2026-08-10 04:38:41 +08:00
|
|
|
|
import { Cloud, Laptop, ShieldCheck, X } from 'lucide-react';
|
2026-08-10 05:01:32 +08:00
|
|
|
|
import { projectDomainConnectionSteps, projectDomainTrustSource, type DomainAccessProjection } from '../domain-connection';
|
2026-08-10 04:38:41 +08:00
|
|
|
|
|
|
|
|
|
|
interface Props {
|
|
|
|
|
|
access: DomainAccessProjection;
|
|
|
|
|
|
open: boolean;
|
|
|
|
|
|
onClose: () => void;
|
|
|
|
|
|
onEnterRuntime: () => void;
|
|
|
|
|
|
onOpenCodeChannel: () => void;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
export function DomainConnectionSheet({ access, open, onClose, onEnterRuntime, onOpenCodeChannel }: Props) {
|
|
|
|
|
|
if (!open) return null;
|
|
|
|
|
|
const steps = projectDomainConnectionSteps(access);
|
|
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
|
<div className="storage-sheet-backdrop" role="presentation" onMouseDown={event => {
|
|
|
|
|
|
if (event.target === event.currentTarget) onClose();
|
|
|
|
|
|
}}>
|
|
|
|
|
|
<section className="storage-sheet domain-connection-sheet" role="dialog" aria-modal="true" aria-labelledby="domain-connection-title">
|
|
|
|
|
|
<header className="storage-sheet-header">
|
|
|
|
|
|
<div>
|
|
|
|
|
|
<small>DOM-FIFTH-0001</small>
|
|
|
|
|
|
<h2 id="domain-connection-title">接入第五域 · 光湖本源域</h2>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<button className="icon-button" onClick={onClose} aria-label="关闭域接入状态"><X aria-hidden="true" /></button>
|
|
|
|
|
|
</header>
|
|
|
|
|
|
|
|
|
|
|
|
<p className="domain-connection-lead">进入域不是切换页面。系统必须验证账户、登记节点、目标域授权、会话能力和在线回执。</p>
|
2026-08-10 05:01:32 +08:00
|
|
|
|
<p className="domain-connection-boundary">{projectDomainTrustSource(access)}</p>
|
2026-08-10 04:38:41 +08:00
|
|
|
|
|
|
|
|
|
|
<div className="domain-node-modes" aria-label="支持的节点类型">
|
|
|
|
|
|
<article><Laptop aria-hidden="true" /><span><strong>本地终端节点</strong><small>使用当前联网电脑承载本地工作；正式节点登记尚未开放。</small></span></article>
|
|
|
|
|
|
<article><Cloud aria-hidden="true" /><span><strong>云常驻节点</strong><small>服务器可持续在线；代码频道登录不等于取得域运行权限。</small></span></article>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<ol className="domain-connection-steps">
|
|
|
|
|
|
{steps.map((step, index) => (
|
|
|
|
|
|
<li key={step.id} data-state={step.state}>
|
|
|
|
|
|
<span>{step.state === 'verified' ? <ShieldCheck aria-hidden="true" /> : index + 1}</span>
|
|
|
|
|
|
<div><strong>{step.label}</strong><small>{step.detail}</small></div>
|
|
|
|
|
|
<em>{step.state === 'verified' ? '已验证' : step.state === 'checking' ? '核对中' : '待完成'}</em>
|
|
|
|
|
|
</li>
|
|
|
|
|
|
))}
|
|
|
|
|
|
</ol>
|
|
|
|
|
|
|
|
|
|
|
|
<p className="domain-connection-boundary">代码频道账号只用于仓库与同步，是节点身份的辅助证明之一，不能单独签发第五域权限。</p>
|
|
|
|
|
|
|
|
|
|
|
|
<footer className="storage-sheet-footer">
|
|
|
|
|
|
<button className="secondary-button" onClick={onOpenCodeChannel}>代码频道与同步设置</button>
|
|
|
|
|
|
<span />
|
|
|
|
|
|
<button className="secondary-button" onClick={onClose}>返回门厅</button>
|
|
|
|
|
|
<button className="primary-button" onClick={onEnterRuntime} disabled={!access.runtimeReady}>
|
|
|
|
|
|
{access.runtimeReady ? '进入第五域运行体' : '等待可信域接入'}
|
|
|
|
|
|
</button>
|
|
|
|
|
|
</footer>
|
|
|
|
|
|
</section>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
);
|
|
|
|
|
|
}
|
