57 lines
2.3 KiB
TypeScript
57 lines
2.3 KiB
TypeScript
import { renderWorkspacePathSegments } from '../utils';
|
|
import type { WorkspaceHoverCardState } from '../types';
|
|
import './WorkspaceOverlay.css';
|
|
|
|
interface WorkspaceHoverCardProps {
|
|
state: WorkspaceHoverCardState | null;
|
|
isZh: boolean;
|
|
formatWorkspaceTime: (raw: string | undefined, isZh: boolean) => string;
|
|
formatBytes: (value: number) => string;
|
|
}
|
|
|
|
export function WorkspaceHoverCard({
|
|
state,
|
|
isZh,
|
|
formatWorkspaceTime,
|
|
formatBytes,
|
|
}: WorkspaceHoverCardProps) {
|
|
if (!state) return null;
|
|
|
|
return (
|
|
<div
|
|
className={`workspace-hover-panel ${state.above ? 'is-above' : ''}`}
|
|
style={{ top: state.top, left: state.left }}
|
|
role="tooltip"
|
|
>
|
|
<div className="workspace-entry-info-row">
|
|
<span className="workspace-entry-info-label">{isZh ? '全称' : 'Name'}</span>
|
|
<span className="workspace-entry-info-value mono">{state.node.name || '-'}</span>
|
|
</div>
|
|
<div className="workspace-entry-info-row">
|
|
<span className="workspace-entry-info-label">{isZh ? '完整路径' : 'Full Path'}</span>
|
|
<span
|
|
className="workspace-entry-info-value workspace-entry-info-path mono"
|
|
title={`/root/.nanobot/workspace/${String(state.node.path || '').replace(/^\/+/, '')}`}
|
|
>
|
|
{renderWorkspacePathSegments(
|
|
`/root/.nanobot/workspace/${String(state.node.path || '').replace(/^\/+/, '')}`,
|
|
'hover-path',
|
|
)}
|
|
</span>
|
|
</div>
|
|
<div className="workspace-entry-info-row">
|
|
<span className="workspace-entry-info-label">{isZh ? '创建时间' : 'Created'}</span>
|
|
<span className="workspace-entry-info-value">{formatWorkspaceTime(state.node.ctime, isZh)}</span>
|
|
</div>
|
|
<div className="workspace-entry-info-row">
|
|
<span className="workspace-entry-info-label">{isZh ? '修改时间' : 'Modified'}</span>
|
|
<span className="workspace-entry-info-value">{formatWorkspaceTime(state.node.mtime, isZh)}</span>
|
|
</div>
|
|
<div className="workspace-entry-info-row">
|
|
<span className="workspace-entry-info-label">{isZh ? '文件大小' : 'Size'}</span>
|
|
<span className="workspace-entry-info-value mono">{Number.isFinite(Number(state.node.size)) ? formatBytes(Number(state.node.size)) : '-'}</span>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|