refactor(frontend): consolidate features & components into single tree
把 components/admin/* 和 components/platform/* 共 11 个文件
移到对应 features/<name>/ 下,components/ 只保留跨特性共享的
common/ 子目录(features/admin/* 之前和 components/admin/* 同名
共存,迫使 features/admin/AdminPages.tsx 出现 barrel,顺带消除了
barrel 副作用 CSS 丢失的隐患)。
新的目录约定:
- features/<name>/ = 特性模块,所有页面 / Modal / state / hooks
/ routes 都在内,无 components/<name>/ 并列
- components/common/ = 仅放 ≥2 个特性共用的 widgets
(Icon、Sidebar、Toast、Topbar、WelcomePanel)
改动:
- 11 文件 git mv (components/{admin,platform}/* → features/*)
- 8 文件的 Icon 相对路径 '../common/Icon' → '../../components/common/Icon'
- 2 文件补 admin.css side-effect import(UserManagementPage /
ProjectManagementPage 之前依赖 AdminPages barrel)
- 3 文件(引用方)更新 import:SystemAdminPage、DashboardRoute、
ScriptsPage
- 删除 features/admin/AdminPages.tsx barrel(无消费者)
- 删除空目录 components/admin、components/platform
验证:
- pnpm typecheck 通过
- pnpm build 通过,CSS 体积 35.11 kB 与重构前一致(无样式增减)
- routes.ts / routes/platform.tsx 路径未动,route id 不变
踩坑:
第一轮把 '../common/Icon' 错改成 '../../../components/common/Icon',
typecheck 报 11 个 Cannot find module。原因:features/admin/ 和
components/admin/ 都是 depth 2,'../../X' 在两边都解析到 app/X,
只有 '../X' 才需要多一层。正确改法是 '../../components/common/Icon'。
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
tao.chen
co-authored by
Claude Fable 5
Claude Fable 5
parent
e9d9bcfc97
commit
c3947d6066
@@ -0,0 +1,181 @@
|
||||
import Icon from "../../components/common/Icon";
|
||||
import type { ScriptItem, ScriptType } from "../../services/api";
|
||||
|
||||
type ContextMenuState = {
|
||||
x: number;
|
||||
y: number;
|
||||
kind: "root" | "directory" | "file";
|
||||
path: string;
|
||||
script?: ScriptItem;
|
||||
};
|
||||
|
||||
type TreeContextMenuProps = {
|
||||
contextMenu: ContextMenuState | null;
|
||||
onOpenScript: (scriptId: string) => void;
|
||||
onRemoveScript: (script: ScriptItem) => void;
|
||||
onToggleLock: (script: ScriptItem) => void;
|
||||
onOpenCreateDialog: (parentPath: string, scriptType: ScriptType) => void;
|
||||
onOpenFolderDialog: (parentPath: string) => void;
|
||||
onChooseUpload: (parentPath: string) => void;
|
||||
onRemoveDirectory: (path: string) => void;
|
||||
onCopyResourcePath?: (jupyterPath: string) => void;
|
||||
onRemoveResource?: (resourceId: string) => void;
|
||||
onClose: () => void;
|
||||
};
|
||||
|
||||
export function TreeContextMenu({
|
||||
contextMenu,
|
||||
onOpenScript,
|
||||
onRemoveScript,
|
||||
onToggleLock,
|
||||
onOpenCreateDialog,
|
||||
onOpenFolderDialog,
|
||||
onChooseUpload,
|
||||
onRemoveDirectory,
|
||||
onCopyResourcePath,
|
||||
onRemoveResource,
|
||||
onClose,
|
||||
}: TreeContextMenuProps) {
|
||||
if (!contextMenu) return null;
|
||||
|
||||
const width = 188;
|
||||
const height = contextMenu.kind === "file" ? 124 : 190;
|
||||
const isDataResource = !!contextMenu.script?.script_id.startsWith("data:");
|
||||
|
||||
return (
|
||||
<div
|
||||
className="tree-context-menu"
|
||||
role="menu"
|
||||
style={{
|
||||
left: contextMenu.x,
|
||||
top: contextMenu.y,
|
||||
position: "fixed",
|
||||
zIndex: 1000,
|
||||
}}
|
||||
onPointerDown={(event) => event.stopPropagation()}
|
||||
>
|
||||
{contextMenu.kind === "file" && contextMenu.script ? (
|
||||
<>
|
||||
{isDataResource ? (
|
||||
<>
|
||||
<button
|
||||
type="button"
|
||||
role="menuitem"
|
||||
onClick={() => {
|
||||
if (onCopyResourcePath) {
|
||||
onCopyResourcePath(contextMenu.script!.relative_path);
|
||||
}
|
||||
onClose();
|
||||
}}
|
||||
>
|
||||
<Icon name="database" size={16} />
|
||||
复制 Jupyter 路径
|
||||
</button>
|
||||
{onRemoveResource && (
|
||||
<button
|
||||
className="is-danger"
|
||||
type="button"
|
||||
role="menuitem"
|
||||
onClick={() => {
|
||||
const id = contextMenu.script!.script_id.replace(/^data:/, "");
|
||||
onRemoveResource(id);
|
||||
onClose();
|
||||
}}
|
||||
>
|
||||
<Icon name="close" size={16} />
|
||||
删除资源
|
||||
</button>
|
||||
)}
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<button
|
||||
type="button"
|
||||
role="menuitem"
|
||||
onClick={() => {
|
||||
onOpenScript(contextMenu.script!.script_id);
|
||||
onClose();
|
||||
}}
|
||||
>
|
||||
<Icon name="script" size={16} />
|
||||
打开文件
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
role="menuitem"
|
||||
onClick={() => {
|
||||
onToggleLock(contextMenu.script!);
|
||||
onClose();
|
||||
}}
|
||||
>
|
||||
<Icon
|
||||
name={contextMenu.script.is_locked ? "unlock" : "lock"}
|
||||
size={16}
|
||||
/>
|
||||
{contextMenu.script.is_locked ? "解锁文件" : "锁定文件"}
|
||||
</button>
|
||||
<button
|
||||
className="is-danger"
|
||||
type="button"
|
||||
role="menuitem"
|
||||
onClick={() => onRemoveScript(contextMenu.script!)}
|
||||
>
|
||||
<Icon name="close" size={16} />
|
||||
删除文件
|
||||
</button>
|
||||
</>
|
||||
)}
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<button
|
||||
type="button"
|
||||
role="menuitem"
|
||||
onClick={() => onOpenCreateDialog(contextMenu.path, "notebook")}
|
||||
>
|
||||
<Icon name="notebook" size={16} />
|
||||
新建 Notebook
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
role="menuitem"
|
||||
onClick={() => onOpenCreateDialog(contextMenu.path, "python")}
|
||||
>
|
||||
<Icon name="python" size={16} />
|
||||
新建 Python 文件
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
role="menuitem"
|
||||
onClick={() => onOpenFolderDialog(contextMenu.path)}
|
||||
>
|
||||
<Icon name="folder" size={16} />
|
||||
新建文件夹
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
role="menuitem"
|
||||
onClick={() => onChooseUpload(contextMenu.path)}
|
||||
>
|
||||
<Icon name="upload" size={16} />
|
||||
上传到此处
|
||||
</button>
|
||||
{contextMenu.kind === "directory" && (
|
||||
<>
|
||||
<span className="tree-context-menu__separator" />
|
||||
<button
|
||||
className="is-danger"
|
||||
type="button"
|
||||
role="menuitem"
|
||||
onClick={() => onRemoveDirectory(contextMenu.path)}
|
||||
>
|
||||
<Icon name="close" size={16} />
|
||||
删除文件夹
|
||||
</button>
|
||||
</>
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user