e4dcfc49aa
Tests / Import Check (Python 3.13) (push) Has been cancelled
Tests / Import Check (Python 3.14) (push) Has been cancelled
Tests / Python Tests (Python 3.11) (push) Has been cancelled
Tests / Python Tests (Python 3.12) (push) Has been cancelled
Tests / Python Tests (Python 3.14) (push) Has been cancelled
Tests / Test Summary (push) Has been cancelled
Tests / Lint and Format (push) Has been cancelled
Tests / Web Node Tests (push) Has been cancelled
Tests / Import Check (Python 3.11) (push) Has been cancelled
Tests / Import Check (Python 3.12) (push) Has been cancelled
Tests / Python Tests (Python 3.13) (push) Has been cancelled
589 lines
21 KiB
TypeScript
589 lines
21 KiB
TypeScript
"use client";
|
|
|
|
import { useCallback, useEffect, useMemo, useState } from "react";
|
|
import { useTranslation } from "react-i18next";
|
|
import {
|
|
Check,
|
|
ChevronDown,
|
|
ChevronRight,
|
|
Folder,
|
|
FolderPlus,
|
|
Loader2,
|
|
MoveRight,
|
|
PanelLeftClose,
|
|
PanelLeftOpen,
|
|
RefreshCw,
|
|
Trash2,
|
|
X,
|
|
} from "lucide-react";
|
|
import { invalidateClientCache } from "@/lib/client-cache";
|
|
import {
|
|
createKbFolder,
|
|
deleteKbFile,
|
|
listKnowledgeBaseFiles,
|
|
moveKbFile,
|
|
type KnowledgeBaseFile,
|
|
} from "@/lib/knowledge-api";
|
|
import { docIconFor, formatBytes } from "@/lib/doc-attachments";
|
|
|
|
interface KbDocumentListProps {
|
|
kbName: string;
|
|
/** Refresh trigger: bumping this prop forces a re-fetch (e.g. after upload). */
|
|
refreshKey?: number;
|
|
selectedFile: string | null;
|
|
onSelect: (file: KnowledgeBaseFile | null) => void;
|
|
collapsed: boolean;
|
|
onToggleCollapsed: () => void;
|
|
}
|
|
|
|
interface TreeNode {
|
|
name: string; // segment label
|
|
path: string; // full POSIX path relative to raw/
|
|
type: "file" | "folder";
|
|
file?: KnowledgeBaseFile;
|
|
children: TreeNode[];
|
|
}
|
|
|
|
function parentOf(path: string): string {
|
|
const idx = path.lastIndexOf("/");
|
|
return idx === -1 ? "" : path.slice(0, idx);
|
|
}
|
|
|
|
function buildTree(entries: KnowledgeBaseFile[]): {
|
|
root: TreeNode[];
|
|
folderPaths: string[];
|
|
} {
|
|
const folders = new Map<string, TreeNode>();
|
|
const root: TreeNode[] = [];
|
|
const folderPaths: string[] = [];
|
|
|
|
const ensureFolder = (path: string): TreeNode => {
|
|
const existing = folders.get(path);
|
|
if (existing) return existing;
|
|
const node: TreeNode = {
|
|
name: path.slice(path.lastIndexOf("/") + 1),
|
|
path,
|
|
type: "folder",
|
|
children: [],
|
|
};
|
|
folders.set(path, node);
|
|
folderPaths.push(path);
|
|
const parent = parentOf(path);
|
|
if (parent) ensureFolder(parent).children.push(node);
|
|
else root.push(node);
|
|
return node;
|
|
};
|
|
|
|
// Folders first so a file's parent always exists, and empty folders show.
|
|
for (const entry of entries) {
|
|
if (entry.type === "folder") ensureFolder(entry.name);
|
|
}
|
|
for (const entry of entries) {
|
|
if (entry.type === "folder") continue;
|
|
const node: TreeNode = {
|
|
name: entry.name.slice(entry.name.lastIndexOf("/") + 1),
|
|
path: entry.name,
|
|
type: "file",
|
|
file: entry,
|
|
children: [],
|
|
};
|
|
const parent = parentOf(entry.name);
|
|
if (parent) ensureFolder(parent).children.push(node);
|
|
else root.push(node);
|
|
}
|
|
|
|
const sortNodes = (nodes: TreeNode[]) => {
|
|
nodes.sort((a, b) => {
|
|
if (a.type !== b.type) return a.type === "folder" ? -1 : 1;
|
|
return a.name.toLowerCase().localeCompare(b.name.toLowerCase());
|
|
});
|
|
nodes.forEach((n) => n.children.length && sortNodes(n.children));
|
|
};
|
|
sortNodes(root);
|
|
folderPaths.sort((a, b) => a.toLowerCase().localeCompare(b.toLowerCase()));
|
|
return { root, folderPaths };
|
|
}
|
|
|
|
export default function KbDocumentList({
|
|
kbName,
|
|
refreshKey = 0,
|
|
selectedFile,
|
|
onSelect,
|
|
collapsed,
|
|
onToggleCollapsed,
|
|
}: KbDocumentListProps) {
|
|
const { t } = useTranslation();
|
|
const [files, setFiles] = useState<KnowledgeBaseFile[]>([]);
|
|
const [loading, setLoading] = useState(true);
|
|
const [error, setError] = useState<string | null>(null);
|
|
const [expanded, setExpanded] = useState<Set<string>>(new Set());
|
|
const [newFolderOpen, setNewFolderOpen] = useState(false);
|
|
const [newFolderName, setNewFolderName] = useState("");
|
|
const [moveMenuFor, setMoveMenuFor] = useState<string | null>(null);
|
|
const [confirmDeleteFor, setConfirmDeleteFor] = useState<string | null>(null);
|
|
const [dragPath, setDragPath] = useState<string | null>(null);
|
|
const [dropTarget, setDropTarget] = useState<string | null>(null);
|
|
const [busy, setBusy] = useState(false);
|
|
|
|
const load = useCallback(
|
|
async (force = false) => {
|
|
setLoading(true);
|
|
setError(null);
|
|
try {
|
|
if (force) invalidateClientCache(`knowledge:files:${kbName}`);
|
|
const next = await listKnowledgeBaseFiles(kbName, { force });
|
|
setFiles(next);
|
|
// Default-expand every folder so files are visible without digging.
|
|
setExpanded(
|
|
new Set(next.filter((e) => e.type === "folder").map((e) => e.name)),
|
|
);
|
|
} catch (err) {
|
|
setError(err instanceof Error ? err.message : String(err));
|
|
} finally {
|
|
setLoading(false);
|
|
}
|
|
},
|
|
[kbName],
|
|
);
|
|
|
|
useEffect(() => {
|
|
void load(refreshKey > 0);
|
|
}, [load, refreshKey]);
|
|
|
|
const { root, folderPaths } = useMemo(() => buildTree(files), [files]);
|
|
const fileEntries = useMemo(
|
|
() => files.filter((e) => e.type !== "folder"),
|
|
[files],
|
|
);
|
|
|
|
const toggleFolder = (path: string) =>
|
|
setExpanded((prev) => {
|
|
const next = new Set(prev);
|
|
if (next.has(path)) next.delete(path);
|
|
else next.add(path);
|
|
return next;
|
|
});
|
|
|
|
const handleCreateFolder = async () => {
|
|
const name = newFolderName.trim();
|
|
if (!name) return;
|
|
setBusy(true);
|
|
try {
|
|
await createKbFolder(kbName, name);
|
|
setNewFolderName("");
|
|
setNewFolderOpen(false);
|
|
await load(true);
|
|
} catch (err) {
|
|
setError(err instanceof Error ? err.message : String(err));
|
|
} finally {
|
|
setBusy(false);
|
|
}
|
|
};
|
|
|
|
const handleMove = async (source: string, destFolder: string) => {
|
|
setMoveMenuFor(null);
|
|
setDropTarget(null);
|
|
setDragPath(null);
|
|
if (parentOf(source) === destFolder) return; // already there
|
|
setBusy(true);
|
|
try {
|
|
await moveKbFile(kbName, source, destFolder);
|
|
const basename = source.slice(source.lastIndexOf("/") + 1);
|
|
const newPath = destFolder ? `${destFolder}/${basename}` : basename;
|
|
await load(true);
|
|
// Keep the preview pointed at the moved file if it was selected.
|
|
if (selectedFile === source) {
|
|
const moved = files.find((f) => f.name === source);
|
|
onSelect({
|
|
...(moved ?? { name: newPath }),
|
|
name: newPath,
|
|
type: "file",
|
|
});
|
|
}
|
|
} catch (err) {
|
|
setError(err instanceof Error ? err.message : String(err));
|
|
} finally {
|
|
setBusy(false);
|
|
}
|
|
};
|
|
|
|
const handleDelete = async (path: string) => {
|
|
setConfirmDeleteFor(null);
|
|
setBusy(true);
|
|
try {
|
|
await deleteKbFile(kbName, path);
|
|
// Drop the preview if the deleted file was the one being shown.
|
|
if (selectedFile === path) onSelect(null);
|
|
await load(true);
|
|
} catch (err) {
|
|
setError(err instanceof Error ? err.message : String(err));
|
|
} finally {
|
|
setBusy(false);
|
|
}
|
|
};
|
|
|
|
if (collapsed) {
|
|
return (
|
|
<aside className="flex h-full w-[44px] shrink-0 flex-col items-center gap-1 border-r border-[var(--border)] bg-[var(--card)]/40 py-2">
|
|
<button
|
|
type="button"
|
|
onClick={onToggleCollapsed}
|
|
title={t("Expand")}
|
|
aria-label={t("Expand")}
|
|
className="flex h-7 w-7 items-center justify-center rounded-md text-[var(--muted-foreground)] transition-colors hover:bg-[var(--muted)] hover:text-[var(--foreground)]"
|
|
>
|
|
<PanelLeftOpen size={13} strokeWidth={1.7} />
|
|
</button>
|
|
<div className="my-1 h-px w-6 bg-[var(--border)]/60" />
|
|
<div className="flex w-full flex-1 flex-col items-center gap-0.5 overflow-y-auto pb-2">
|
|
{fileEntries.map((file) => {
|
|
const spec = docIconFor(file.name);
|
|
const Icon = spec.Icon;
|
|
const active = selectedFile === file.name;
|
|
return (
|
|
<button
|
|
key={file.name}
|
|
type="button"
|
|
onClick={() => onSelect(file)}
|
|
title={file.name}
|
|
aria-label={file.name}
|
|
className={`relative flex h-8 w-8 shrink-0 items-center justify-center rounded-md transition-colors ${
|
|
active
|
|
? "bg-[var(--primary)]/12 ring-1 ring-[var(--primary)]/40"
|
|
: "hover:bg-[var(--muted)]/60"
|
|
}`}
|
|
>
|
|
{active && (
|
|
<span className="absolute -left-1 top-1/2 h-4 w-[2.5px] -translate-y-1/2 rounded-full bg-[var(--primary)]" />
|
|
)}
|
|
<Icon size={13} strokeWidth={1.6} className={spec.tint} />
|
|
</button>
|
|
);
|
|
})}
|
|
</div>
|
|
</aside>
|
|
);
|
|
}
|
|
|
|
const renderNode = (node: TreeNode, depth: number): React.ReactNode => {
|
|
const indent = { paddingLeft: `${depth * 12 + 8}px` };
|
|
if (node.type === "folder") {
|
|
const open = expanded.has(node.path);
|
|
const isDrop = dropTarget === node.path;
|
|
return (
|
|
<li key={`d:${node.path}`}>
|
|
<div
|
|
onClick={() => toggleFolder(node.path)}
|
|
onDragOver={(e) => {
|
|
e.preventDefault();
|
|
e.stopPropagation();
|
|
setDropTarget(node.path);
|
|
}}
|
|
onDragLeave={() =>
|
|
setDropTarget((cur) => (cur === node.path ? null : cur))
|
|
}
|
|
onDrop={(e) => {
|
|
e.preventDefault();
|
|
e.stopPropagation();
|
|
const src = e.dataTransfer.getData("text/plain");
|
|
if (src) void handleMove(src, node.path);
|
|
}}
|
|
style={indent}
|
|
className={`flex cursor-pointer items-center gap-1 rounded-md py-1.5 pr-2 text-left transition-colors ${
|
|
isDrop
|
|
? "bg-[var(--primary)]/15 ring-1 ring-[var(--primary)]/40"
|
|
: "hover:bg-[var(--muted)]/50"
|
|
}`}
|
|
>
|
|
{open ? (
|
|
<ChevronDown className="h-3 w-3 shrink-0 text-[var(--muted-foreground)]" />
|
|
) : (
|
|
<ChevronRight className="h-3 w-3 shrink-0 text-[var(--muted-foreground)]" />
|
|
)}
|
|
<Folder className="h-3.5 w-3.5 shrink-0 text-[var(--muted-foreground)]" />
|
|
<span className="truncate text-[12px] font-medium text-[var(--foreground)]">
|
|
{node.name}
|
|
</span>
|
|
</div>
|
|
{open && node.children.length > 0 && (
|
|
<ul className="space-y-px">
|
|
{node.children.map((child) => renderNode(child, depth + 1))}
|
|
</ul>
|
|
)}
|
|
</li>
|
|
);
|
|
}
|
|
|
|
const spec = docIconFor(node.name);
|
|
const Icon = spec.Icon;
|
|
const active = selectedFile === node.path;
|
|
const file = node.file!;
|
|
return (
|
|
<li key={`f:${node.path}`} className="group/row relative">
|
|
<div
|
|
draggable
|
|
onDragStart={(e) => {
|
|
e.dataTransfer.setData("text/plain", node.path);
|
|
e.dataTransfer.effectAllowed = "move";
|
|
setDragPath(node.path);
|
|
}}
|
|
onDragEnd={() => setDragPath(null)}
|
|
style={indent}
|
|
className={`flex items-center gap-2 rounded-md py-1.5 pr-1 text-left transition-colors ${
|
|
active
|
|
? "bg-[var(--primary)]/10 text-[var(--foreground)]"
|
|
: "hover:bg-[var(--muted)]/50"
|
|
} ${dragPath === node.path ? "opacity-50" : ""}`}
|
|
>
|
|
<button
|
|
type="button"
|
|
onClick={() => onSelect(file)}
|
|
title={node.path}
|
|
className="flex min-w-0 flex-1 items-center gap-2 text-left"
|
|
>
|
|
<Icon
|
|
size={13}
|
|
strokeWidth={1.6}
|
|
className={`shrink-0 ${spec.tint}`}
|
|
/>
|
|
<div className="min-w-0 flex-1">
|
|
<div className="truncate text-[12px] font-medium text-[var(--foreground)]">
|
|
{node.name}
|
|
</div>
|
|
<div className="truncate text-[10px] text-[var(--muted-foreground)]">
|
|
{file.size ? formatBytes(file.size) : ""}
|
|
{file.modified ? ` · ${formatRelative(file.modified)}` : ""}
|
|
</div>
|
|
</div>
|
|
</button>
|
|
{confirmDeleteFor === node.path ? (
|
|
<div className="flex shrink-0 items-center gap-0.5 pr-0.5">
|
|
<span className="px-0.5 text-[10px] font-medium text-red-600 dark:text-red-400">
|
|
{t("Delete?")}
|
|
</span>
|
|
<button
|
|
type="button"
|
|
onClick={() => void handleDelete(node.path)}
|
|
disabled={busy}
|
|
title={t("Confirm delete")}
|
|
aria-label={t("Confirm delete")}
|
|
className="rounded p-1 text-red-600 transition-colors hover:bg-red-50 disabled:opacity-40 dark:text-red-400 dark:hover:bg-red-950/40"
|
|
>
|
|
<Check className="h-3.5 w-3.5" />
|
|
</button>
|
|
<button
|
|
type="button"
|
|
onClick={() => setConfirmDeleteFor(null)}
|
|
title={t("Cancel")}
|
|
aria-label={t("Cancel")}
|
|
className="rounded p-1 text-[var(--muted-foreground)] transition-colors hover:bg-[var(--muted)] hover:text-[var(--foreground)]"
|
|
>
|
|
<X className="h-3.5 w-3.5" />
|
|
</button>
|
|
</div>
|
|
) : (
|
|
<div className="flex shrink-0 items-center opacity-0 transition-opacity group-hover/row:opacity-100">
|
|
<button
|
|
type="button"
|
|
onClick={() => {
|
|
setConfirmDeleteFor(null);
|
|
setMoveMenuFor((cur) =>
|
|
cur === node.path ? null : node.path,
|
|
);
|
|
}}
|
|
title={t("Move to…")}
|
|
aria-label={t("Move to…")}
|
|
className="rounded p-1 text-[var(--muted-foreground)] transition-colors hover:bg-[var(--muted)] hover:text-[var(--foreground)]"
|
|
>
|
|
<MoveRight className="h-3.5 w-3.5" />
|
|
</button>
|
|
<button
|
|
type="button"
|
|
onClick={() => {
|
|
setMoveMenuFor(null);
|
|
setConfirmDeleteFor(node.path);
|
|
}}
|
|
title={t("Delete file")}
|
|
aria-label={t("Delete file")}
|
|
className="rounded p-1 text-[var(--muted-foreground)] transition-colors hover:bg-red-50 hover:text-red-600 dark:hover:bg-red-950/40 dark:hover:text-red-400"
|
|
>
|
|
<Trash2 className="h-3.5 w-3.5" />
|
|
</button>
|
|
</div>
|
|
)}
|
|
</div>
|
|
|
|
{moveMenuFor === node.path && (
|
|
<>
|
|
<div
|
|
className="fixed inset-0 z-10"
|
|
onClick={() => setMoveMenuFor(null)}
|
|
/>
|
|
<div className="absolute right-1 top-8 z-20 max-h-60 w-44 overflow-y-auto rounded-lg border border-[var(--border)] bg-[var(--card)] py-1 shadow-lg">
|
|
<div className="px-2.5 py-1 text-[10px] uppercase tracking-wide text-[var(--muted-foreground)]">
|
|
{t("Move to")}
|
|
</div>
|
|
{parentOf(node.path) !== "" && (
|
|
<button
|
|
type="button"
|
|
onClick={() => void handleMove(node.path, "")}
|
|
className="block w-full truncate px-2.5 py-1.5 text-left text-[12px] text-[var(--foreground)] transition-colors hover:bg-[var(--muted)]/60"
|
|
>
|
|
/ {t("Root")}
|
|
</button>
|
|
)}
|
|
{folderPaths
|
|
.filter((p) => p !== parentOf(node.path))
|
|
.map((p) => (
|
|
<button
|
|
key={p}
|
|
type="button"
|
|
onClick={() => void handleMove(node.path, p)}
|
|
className="block w-full truncate px-2.5 py-1.5 text-left text-[12px] text-[var(--foreground)] transition-colors hover:bg-[var(--muted)]/60"
|
|
>
|
|
{p}
|
|
</button>
|
|
))}
|
|
{folderPaths.length === 0 && parentOf(node.path) === "" && (
|
|
<div className="px-2.5 py-1.5 text-[11px] text-[var(--muted-foreground)]">
|
|
{t("No folders yet")}
|
|
</div>
|
|
)}
|
|
</div>
|
|
</>
|
|
)}
|
|
</li>
|
|
);
|
|
};
|
|
|
|
return (
|
|
<aside className="flex h-full w-[220px] shrink-0 flex-col border-r border-[var(--border)] bg-[var(--card)]/40">
|
|
<div className="flex items-center justify-between gap-1 px-2.5 pb-1.5 pt-2.5">
|
|
<div className="flex min-w-0 items-center gap-1.5">
|
|
<span className="text-[12px] font-medium text-[var(--foreground)]">
|
|
{t("Files")}
|
|
</span>
|
|
<span className="rounded-full bg-[var(--muted)] px-1.5 py-0 text-[10px] text-[var(--muted-foreground)]">
|
|
{fileEntries.length}
|
|
</span>
|
|
</div>
|
|
<div className="flex shrink-0 items-center gap-0.5">
|
|
<button
|
|
type="button"
|
|
onClick={() => {
|
|
setNewFolderOpen((v) => !v);
|
|
setNewFolderName("");
|
|
}}
|
|
title={t("New folder")}
|
|
aria-label={t("New folder")}
|
|
className="rounded-md p-1 text-[var(--muted-foreground)] transition-colors hover:bg-[var(--muted)] hover:text-[var(--foreground)]"
|
|
>
|
|
<FolderPlus size={13} strokeWidth={1.7} />
|
|
</button>
|
|
<button
|
|
type="button"
|
|
onClick={() => void load(true)}
|
|
title={t("Refresh")}
|
|
aria-label={t("Refresh")}
|
|
disabled={loading || busy}
|
|
className="rounded-md p-1 text-[var(--muted-foreground)] transition-colors hover:bg-[var(--muted)] hover:text-[var(--foreground)] disabled:opacity-40"
|
|
>
|
|
{loading ? (
|
|
<Loader2 className="h-3 w-3 animate-spin" />
|
|
) : (
|
|
<RefreshCw className="h-3 w-3" />
|
|
)}
|
|
</button>
|
|
<button
|
|
type="button"
|
|
onClick={onToggleCollapsed}
|
|
title={t("Collapse")}
|
|
aria-label={t("Collapse")}
|
|
className="rounded-md p-1 text-[var(--muted-foreground)] transition-colors hover:bg-[var(--muted)] hover:text-[var(--foreground)]"
|
|
>
|
|
<PanelLeftClose size={12} strokeWidth={1.7} />
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
{newFolderOpen && (
|
|
<div className="flex items-center gap-1 px-2.5 pb-1.5">
|
|
<input
|
|
value={newFolderName}
|
|
onChange={(e) => setNewFolderName(e.target.value)}
|
|
onKeyDown={(e) => {
|
|
if (e.key === "Enter") void handleCreateFolder();
|
|
if (e.key === "Escape") setNewFolderOpen(false);
|
|
}}
|
|
autoFocus
|
|
placeholder={t("Folder name")}
|
|
className="min-w-0 flex-1 rounded-md border border-[var(--border)] bg-[var(--background)] px-2 py-1 text-[12px] text-[var(--foreground)] outline-none focus:border-[var(--foreground)]/25"
|
|
/>
|
|
<button
|
|
type="button"
|
|
onClick={() => void handleCreateFolder()}
|
|
disabled={busy || !newFolderName.trim()}
|
|
className="shrink-0 rounded-md bg-[var(--primary)] px-2 py-1 text-[11px] font-medium text-[var(--primary-foreground)] transition-opacity hover:opacity-90 disabled:opacity-40"
|
|
>
|
|
{t("Add")}
|
|
</button>
|
|
</div>
|
|
)}
|
|
|
|
<div
|
|
className="flex-1 overflow-y-auto px-1.5 pb-2.5"
|
|
onDragOver={(e) => {
|
|
e.preventDefault();
|
|
setDropTarget("");
|
|
}}
|
|
onDrop={(e) => {
|
|
e.preventDefault();
|
|
const src = e.dataTransfer.getData("text/plain");
|
|
if (src) void handleMove(src, "");
|
|
}}
|
|
>
|
|
{error ? (
|
|
<div className="rounded-md border border-red-200 bg-red-50 px-2.5 py-2 text-[11px] text-red-700 dark:border-red-900 dark:bg-red-950/30 dark:text-red-300">
|
|
{error}
|
|
<button
|
|
type="button"
|
|
onClick={() => void load(true)}
|
|
className="ml-1 underline"
|
|
>
|
|
{t("Retry")}
|
|
</button>
|
|
</div>
|
|
) : loading && !files.length ? (
|
|
<div className="space-y-1">
|
|
{[0, 1, 2].map((i) => (
|
|
<div
|
|
key={i}
|
|
className="h-8 rounded-md bg-[var(--muted)]/40 animate-pulse"
|
|
/>
|
|
))}
|
|
</div>
|
|
) : fileEntries.length === 0 && folderPaths.length === 0 ? (
|
|
<div className="px-2 py-6 text-center text-[11px] text-[var(--muted-foreground)]">
|
|
<Folder className="mx-auto mb-1.5 h-3.5 w-3.5 opacity-50" />
|
|
{t("No files yet. Add one using the Add Documents tab.")}
|
|
</div>
|
|
) : (
|
|
<ul className="space-y-px">{root.map((n) => renderNode(n, 0))}</ul>
|
|
)}
|
|
</div>
|
|
</aside>
|
|
);
|
|
}
|
|
|
|
function formatRelative(unixSeconds: number): string {
|
|
const ts = unixSeconds * 1000;
|
|
const diff = Date.now() - ts;
|
|
if (diff < 60_000) return "just now";
|
|
if (diff < 60 * 60_000) return `${Math.floor(diff / 60_000)}m ago`;
|
|
if (diff < 24 * 60 * 60_000)
|
|
return `${Math.floor(diff / (60 * 60_000))}h ago`;
|
|
if (diff < 30 * 24 * 60 * 60_000)
|
|
return `${Math.floor(diff / (24 * 60 * 60_000))}d ago`;
|
|
return new Date(ts).toLocaleDateString();
|
|
}
|