Files
UHD_Media_Tool/apps/web/app/components/files/dir-picker.tsx
T
rootandClaude Opus 5.5 cf364435eb feat(web): 存储设置与文件管理的 Alist 存储切换
- 设置 → 媒体库与目录 → 存储:登记 Alist / OpenList(令牌 / 账号密码 / 访客、路径密码、限速与监控选项),
  测试连接显示版本、用户与容量;媒体库目录可选存储
- 文件管理左栏多一组「Alist 存储」,路径显示「存储名:/路径」;移动 / 复制目标可选 Alist 存储;
  上传按钮;Alist 根点刷新才让 Alist 刷新目录缓存
- 运行状态的挂载根列出存储实例(令牌失效单独提示)

Co-Authored-By: Claude Opus 5.5 <[email protected]>
Claude-Session: https://claude.ai/code/session_01Cxwgnn2pbzQ7rXv3rq7fei
2026-10-06 23:57:33 +08:00

52 lines
1.6 KiB
TypeScript

import type { FileRef, FileRoot } from "~/api/files.ts";
import { cn } from "~/lib/utils.ts";
import { DirTree } from "./dir-tree.tsx";
/** 可选的目标根:可写、在线的媒体库;移动 / 复制还可以放进 Alist 存储(includeStorage),整理「指定目录」与还原只能选媒体库 */
export function pickableRoots<T extends Pick<FileRoot, "kind" | "writable" | "health">>(
roots: T[],
includeStorage = false,
): T[] {
return roots.filter(
(r) => (r.kind === "library" || (includeStorage && r.kind === "storage")) && r.writable && r.health !== "offline",
);
}
/**
* 目录选择器(§14 DirPicker):基于 DirTree,只能选可写库根下的目录。
* 移动/复制到…、回收站"还原到…"、整理向导"指定目录"共用。
*/
export function DirPicker({
roots,
value,
onChange,
className,
includeStorage = false,
}: {
roots: FileRoot[];
value: FileRef | null;
onChange: (ref: FileRef) => void;
className?: string;
includeStorage?: boolean;
}) {
const writable = pickableRoots(roots, includeStorage);
return (
<div className={cn("overflow-y-auto rounded-xl border border-border p-1.5", className)}>
{writable.length ? (
<DirTree
roots={writable}
current={value}
pickOnly
paginate
defaultOpen={value ? [value.root] : writable.slice(0, 1).map((r) => r.id)}
onSelect={onChange}
/>
) : (
<p className="px-2 py-3 text-caption text-muted-foreground">
没有可写入的{includeStorage ? "目录" : "媒体库目录"}。先在设置里添加。
</p>
)}
</div>
);
}