-
Recent runs
-
- All runs
-
+
0 ? "@4xl:grid-cols-3" : ""}`}>
+
0 ? "@4xl:col-span-2" : ""}>
+
{recent.length === 0 ? (
-
- No runs yet — start one from
Train.
-
-
-
- | Run |
- Model |
- Method |
- Status |
- Loss |
- Curve |
-
-
-
- {recent.map((r) => (
- (window.location.hash = `#runs/${r.job_id}`)}>
- | {r.name?.trim() || r.job_id.slice(0, 10)} |
- {(r.base_model || "").split("/").pop()} |
- {r.method ?? "?"} |
- |
-
- {r.final_loss != null ? r.final_loss.toFixed(4) : "—"}
- |
-
-
-
-
- |
-
- ))}
-
-
+
+
+
+
+ Run
+ Model
+ Method
+ Status
+ Loss
+ Curve
+
+
+
+ {recent.map((r) => (
+ (window.location.hash = `#runs/${r.job_id}`)}>
+
+ {r.name?.trim() || r.job_id.slice(0, 10)}
+
+ {(r.base_model || "").split("/").pop()}
+ {r.method ?? "?"}
+
+
+ {r.final_loss != null ? r.final_loss.toFixed(4) : "—"}
+
+
+
+
+
+
+
+ ))}
+
+
+
+
+ {workers.length > 0 && (
+
+
+ Machines
+ {online} of {workers.length} online
+
+
+
+
+
+ {workers.map((w) => (
+ -
+
+
+
{w.name}
+
+ {w.backend} · {w.gpu_name || w.device}
+ {w.vram_gb ? ` · ${w.vram_gb} GB` : ""}
+
+
+ ))}
+
+
+ )}
);
diff --git a/frontend/src/pages/Datasets.tsx b/frontend/src/pages/Datasets.tsx
index ae78f35..6647567 100644
--- a/frontend/src/pages/Datasets.tsx
+++ b/frontend/src/pages/Datasets.tsx
@@ -1,25 +1,33 @@
// Dataset library — upload JSONL, or reference a HuggingFace dataset (with a
// streamed preview before you add it). Both become trainable by reference.
import { useEffect, useRef, useState } from "react";
-import { Database, Search, Upload } from "lucide-react";
+import { ChevronDown, ChevronRight, Database, LoaderCircle, Search, Upload } from "lucide-react";
import {
addHFDataset, createDataset, deleteDataset, getDataset, getDatasets, hfInfo, previewHF,
-} from "../api";
-import type { DatasetMeta, HFPreview } from "../api";
-import { Modal, ModalHeader, PageHeader, btnGhost, btnPrimary } from "../ui";
+} from "@/api";
+import type { DatasetMeta, HFPreview } from "@/api";
+import { EmptyState, Field, Mono, PageHeader } from "@/components/common";
+import { Badge } from "@/components/ui/badge";
+import { Button } from "@/components/ui/button";
+import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from "@/components/ui/dialog";
+import { Input } from "@/components/ui/input";
+import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@/components/ui/table";
+import { Textarea } from "@/components/ui/textarea";
+import { cn } from "@/lib/utils";
const FORMAT_COLORS: Record
= {
- chat: "bg-primary/10 text-primary border-primary/30",
- sharegpt: "bg-primary/10 text-primary border-primary/30",
- instruction: "bg-warning/10 text-warning border-warning/30",
- preference: "bg-success/10 text-success border-success/30",
- text: "bg-muted text-muted-foreground border-border",
+ chat: "border-primary/20 bg-primary/10 text-primary",
+ sharegpt: "border-primary/20 bg-primary/10 text-primary",
+ instruction: "border-warning/25 bg-warning/10 text-warning",
+ preference: "border-good/30 bg-good/10 text-good",
+ text: "text-muted-foreground",
};
-function Badge({ format }: { format: string }) {
+function FormatBadge({ format }: { format: string }) {
return (
- {format}
+
+ {format}
+
);
}
@@ -72,116 +80,134 @@ export default function Datasets() {
return (
<>
-
-
+
+
}
/>
- {tab === "upload" && (
- setTab("none")}>
- setTab("none")} />
+
- )}
- {tab === "hf" && (
- setTab("none")}>
- setTab("none")} />
+
+
+
- )}
+
+
-
-
- {(["mine", "explore"] as const).map((v) => (
-
- ))}
+
+ {(["mine", "explore"] as const).map((v) => (
+
+ ))}
+
+ {view === "explore" && (
+
+ Popular open datasets — curated starting points. Use to train picks one.
+
+ )}
+
+
+
+ setSearch(e.target.value)}
+ placeholder="Search datasets…" className="pl-8" />
- {view === "explore" && (
-
- Popular open datasets — curated starting points. Click Use to train to pick one.
-
- )}
-
-
-
- setSearch(e.target.value)}
- placeholder="Search datasets…" className="w-full pl-9 pr-3 py-2 text-sm" />
-
-
- {filtered.length} of {list.length} datasets
-
+
+ {filtered.length} of {list.length} datasets
+
-
-
-
Name
Source
Format
-
Actions
-
- {filtered.length === 0 && (
-
- no datasets yet — upload one, or add a HuggingFace dataset
-
- )}
- {filtered.map((d) => (
-
-
-
-
-
{d.name}
-
- {d.source === "hf"
- ? `${d.subset}/${d.split}${d.eval_split ? ` · eval: ${d.eval_split}` : ""}`
- : `${d.dataset_id}${d.rows != null ? ` · ${d.rows.toLocaleString()} rows` : ""}`}
-
-
-
-
- {d.source === "hf" ? "🤗 hub" : "upload"}
-
-
-
-
-
-
-
-
- ))}
+ {filtered.length === 0 ? (
+
+ Upload one, or add a Hugging Face dataset.
+
+ ) : (
+
+
+
+
+ Name
+ Source
+ Format
+ Actions
+
+
+
+ {filtered.map((d) => (
+
+
+
+
+
+
{d.name}
+
+ {d.source === "hf"
+ ? `${d.subset}/${d.split}${d.eval_split ? ` · eval: ${d.eval_split}` : ""}`
+ : `${d.dataset_id}${d.rows != null ? ` · ${d.rows.toLocaleString()} rows` : ""}`}
+
+
+
+
+
+
+
+
+
+ ))}
+
+
+ )}
- {rowPreview && (
-
setRowPreview(null)}>
- setRowPreview(null)} />
-
-
- )}
-
+
);
}
@@ -207,15 +233,21 @@ function UploadForm({ onDone }: { onDone: () => void }) {
}
return (
-