You can modify this app directly by editing index.html in the Files and versions tab.
-- Also don't forget to check the - Spaces documentation. -
-
+ Collaborate with your agent
+ + Point your coding agent at this logbook. It reads a compact, + token-efficient version β and if you've given it write access to this + Space, it can add findings that sync back automatically. +
+${c}`);
+ t = t.replace(/\*\*([^*]+)\*\*/g, (_, c) => `${c}`);
+ t = t.replace(/\[([^\]]+)\]\(([^)]+)\)/g, (_, txt, url) => {
+ const safe = esc(url);
+ const attrs = /^https?:/.test(url) ? ' target="_blank" rel="noopener"' : "";
+ const item = /^https?:/.test(url) ? classifyResource(url) : null;
+ const data = item
+ ? ` class="res-link" data-res-url="${esc(item.url)}"`
+ : "";
+ return `${txt}`;
+ });
+ t = t.replace(/(^|[\s(])(https?:\/\/[^\s<>)"'`]+)/g, (m, pre, url) => {
+ let rest = "";
+ const cut = url.search(/"|'|<|>/);
+ if (cut !== -1) {
+ rest = url.slice(cut);
+ url = url.slice(0, cut);
+ }
+ const trailing = (url.match(/[.,;:!?`]+$/) || [""])[0];
+ const clean = trailing ? url.slice(0, -trailing.length) : url;
+ if (!clean) return m;
+ const item = classifyResource(clean);
+ if (item) return `${pre}${resChipHtml(item)}${trailing}${rest}`;
+ return `${pre}${clean}${trailing}${rest}`;
+ });
+ return t;
+ }
+
+ function resChipHtml(item) {
+ return (
+ `` +
+ `${RESOURCE_ICONS[item.kind]}` +
+ `${esc(item.id)}`
+ );
+ }
+
+ const URL_ONLY = /^(https?:\/\/[^\s]+)$/;
+ const DETECTED_URL =
+ /(https?:\/\/[^\s<>)\]"'`]+|trackio-local-dashboard:\/\/[^\s<>)\]"'`]+|trackio-artifact:\/\/[^\s<>)\]"'`]+|trackio-local-path:\/\/[^\s<>)\]"'`]+)/g;
+
+ function renderMarkdown(md, container) {
+ const cellRe = /(^|\n)---\n\n([\s\S]*?)(?=\n---\n/g, "").split("\n");
+ let i = 0;
+ let para = [];
+
+ function flushPara() {
+ if (!para.length) return;
+ const joined = para.join(" ").trim();
+ para = [];
+ if (!joined) return;
+ if (/^trackio-artifact:\/\/\S+$/.test(joined)) return;
+ if (/^trackio-local-path:\/\/\S+$/.test(joined)) return;
+ if (joined.indexOf("π¦ Artifact") !== -1) {
+ const div = document.createElement("div");
+ div.className = "artifact-chip";
+ div.innerHTML = ARTIFACT_ICON_IMG + inline(joined.replace(/π¦\s*/, ""));
+ container.appendChild(div);
+ return;
+ }
+ if (URL_ONLY.test(joined) || IMG_PATH.test(joined)) {
+ const el = renderStandaloneUrl(joined);
+ if (el) container.appendChild(el);
+ return;
+ }
+ const p = document.createElement("p");
+ p.innerHTML = inline(joined);
+ container.appendChild(p);
+ }
+
+ while (i < lines.length) {
+ const line = lines[i];
+ const trimmed = line.trim();
+
+ if (trimmed === "") {
+ flushPara();
+ i++;
+ continue;
+ }
+ const fence = trimmed.match(/^(`{3,}|~{3,})(.*)$/);
+ if (fence) {
+ flushPara();
+ const marker = fence[1][0];
+ const closeRe = new RegExp("^" + marker + "{" + fence[1].length + ",}\\s*$");
+ const info = fence[2].trim();
+ const buf = [];
+ i++;
+ while (i < lines.length && !closeRe.test(lines[i].trim())) {
+ buf.push(lines[i]);
+ i++;
+ }
+ i++;
+ const lang = (info.split(/\s+/)[0] || "").toLowerCase();
+ const tm = info.match(/title=(\S+)/);
+ container.appendChild(
+ renderCode(buf.join("\n"), lang, tm ? tm[1] : null)
+ );
+ continue;
+ }
+ if (trimmed === "---") {
+ flushPara();
+ container.appendChild(document.createElement("hr"));
+ i++;
+ continue;
+ }
+ const h = trimmed.match(/^(#{1,4})\s+(.*)$/);
+ if (h) {
+ flushPara();
+ const el = document.createElement("h" + h[1].length);
+ el.innerHTML = inline(h[2]);
+ container.appendChild(el);
+ i++;
+ continue;
+ }
+ if (
+ trimmed.startsWith("|") &&
+ i + 1 < lines.length &&
+ /^\|?[\s:|-]*-{2,}[\s:|-]*\|?$/.test(lines[i + 1].trim())
+ ) {
+ flushPara();
+ const rows = [];
+ while (i < lines.length && lines[i].trim().startsWith("|")) {
+ rows.push(parseRow(lines[i].trim()));
+ i++;
+ }
+ renderTable(rows, container);
+ continue;
+ }
+ if (trimmed.startsWith("> ")) {
+ flushPara();
+ const bq = document.createElement("blockquote");
+ bq.innerHTML = inline(trimmed.slice(2));
+ container.appendChild(bq);
+ i++;
+ continue;
+ }
+ if (/^`[^`]+`$/.test(trimmed)) {
+ flushPara();
+ const el = document.createElement("div");
+ el.className = "ts";
+ el.textContent = trimmed.replace(/`/g, "");
+ container.appendChild(el);
+ i++;
+ continue;
+ }
+ if (trimmed.startsWith("- ")) {
+ flushPara();
+ const items = [];
+ while (i < lines.length && lines[i].trim().startsWith("- ")) {
+ items.push(lines[i].trim().slice(2).trim());
+ i++;
+ }
+ renderList(items, container);
+ continue;
+ }
+ para.push(trimmed);
+ i++;
+ }
+ flushPara();
+ }
+
+ function renderCell(meta, body, container, artifacts) {
+ const cell = document.createElement("section");
+ cell.className = `cell ${meta.type || "markdown"}`;
+ if (meta.id) cell.dataset.cellId = meta.id;
+ if (isPinned(meta)) cell.classList.add("pinned-source");
+
+ const head = document.createElement("div");
+ head.className = "cell-head";
+ const rawTitle = (meta.title || "").trim();
+ const title = rawTitle && rawTitle.toLowerCase() !== "untitled" ? esc(rawTitle) : "";
+ const when = meta.created_at ? `${esc(formatTime(meta.created_at))}` : "";
+ head.innerHTML =
+ (title ? `
`;
+ const DASHBOARD_ICON_IMG = `
`;
+
+ const RESOURCE_DESC = {
+ dashboard: "Dashboard",
+ model: "Model",
+ dataset: "Dataset",
+ space: "Space",
+ artifact: "Artifact β in Bucket",
+ paper: "Paper",
+ repo: "Repository",
+ job: "Job β status & logs",
+ bucket: "Bucket β artifacts & data",
+ };
+
+ const HF_NON_MODEL_PREFIX =
+ /^(datasets|spaces|jobs|buckets|papers|blog|docs|api|posts|collections|organizations|settings|new|join|login|pricing|tasks|learn|chat|models)(\/|$)/;
+
+ function hfId(url, marker) {
+ return url.split(marker)[1].split(/[?#]/)[0].replace(/\/$/, "");
+ }
+
+ function classifyResource(url) {
+ if (IMG_URL.test(url)) {
+ return null;
+ }
+ let m;
+ if (url.startsWith("trackio-local-dashboard://")) {
+ return {
+ kind: "dashboard",
+ id: url.slice("trackio-local-dashboard://".length),
+ url,
+ local: true,
+ };
+ }
+ if (url.startsWith("trackio-artifact://")) {
+ return {
+ kind: "artifact",
+ id: url.slice("trackio-artifact://".length),
+ url,
+ local: true,
+ };
+ }
+ if (url.startsWith("trackio-local-path://")) {
+ return {
+ kind: "artifact",
+ id: url.slice("trackio-local-path://".length),
+ url,
+ local: true,
+ };
+ }
+ if ((m = url.match(/huggingface\.co\/buckets\/[^#\s]+#(.+)/))) {
+ return { kind: "artifact", id: decodeURIComponent(m[1]), url };
+ }
+ if (/huggingface\.co\/datasets\/[^/]+\/[^/]+/.test(url)) {
+ return { kind: "dataset", id: hfId(url, "/datasets/"), url };
+ }
+ if (/huggingface\.co\/spaces\/[^/]+\/[^/]+/.test(url)) {
+ return { kind: "space", id: hfId(url, "/spaces/"), url };
+ }
+ if (/huggingface\.co\/jobs\//.test(url)) {
+ const parts = hfId(url, "/jobs/").split("/");
+ const jid = parts[1] || "";
+ return {
+ kind: "job",
+ id: parts[0] + (jid ? ` Β· ${jid.slice(0, 12)}${jid.length > 12 ? "β¦" : ""}` : ""),
+ url,
+ };
+ }
+ if (/huggingface\.co\/buckets\//.test(url)) {
+ return { kind: "bucket", id: hfId(url, "/buckets/"), url };
+ }
+ if (/huggingface\.co\/papers\//.test(url)) {
+ return { kind: "paper", id: `Paper ${hfId(url, "/papers/")}`, url };
+ }
+ if ((m = url.match(/arxiv\.org\/(?:abs|pdf)\/([^?#\s]+)/))) {
+ return { kind: "paper", id: `arXiv:${m[1].replace(/\.pdf$/, "")}`, url };
+ }
+ if ((m = url.match(/github\.com\/([^/?#]+\/[^/?#]+)/))) {
+ return { kind: "repo", id: m[1], url };
+ }
+ if ((m = url.match(/huggingface\.co\/([^?#]+)/))) {
+ const rest = m[1].replace(/\/$/, "");
+ if (/^[^/]+\/[^/]+$/.test(rest) && !HF_NON_MODEL_PREFIX.test(rest)) {
+ return { kind: "model", id: rest, url };
+ }
+ }
+ return null;
+ }
+
+ async function fillRailMeta(item, el) {
+ if (item.local) return;
+ const meta = el.querySelector(".rail-meta");
+ const set = (parts) => {
+ const text = parts.filter(Boolean).join(" Β· ");
+ if (text) meta.textContent = text;
+ };
+ if (item.kind === "model") {
+ const d = await getJSON(`https://huggingface.co/api/models/${item.id}`);
+ if (d) set([d.pipeline_tag, `β ${fmt(d.downloads)}`, `β₯ ${fmt(d.likes)}`]);
+ } else if (item.kind === "dataset") {
+ const d = await getJSON(`https://huggingface.co/api/datasets/${item.id}`);
+ if (d) set([`β ${fmt(d.downloads)}`, `β₯ ${fmt(d.likes)}`]);
+ } else if (item.kind === "space" || item.kind === "dashboard") {
+ const d = await getJSON(`https://huggingface.co/api/spaces/${item.id}`);
+ if (d) set([d.sdk, `β₯ ${fmt(d.likes)}`]);
+ } else if (item.kind === "repo") {
+ const d = await getJSON(`https://api.github.com/repos/${item.id}`);
+ if (d) set([`β
${fmt(d.stargazers_count)}`, d.language]);
+ } else if (item.kind === "paper") {
+ const m = item.id.match(/^(?:arXiv:|Paper )(.+)$/);
+ if (!m) return;
+ const arxivId = m[1].replace(/v\d+$/, "");
+ const d = await getJSON(`https://huggingface.co/api/papers/${arxivId}`);
+ if (d && d.id) {
+ if (el.href) el.href = `https://huggingface.co/papers/${d.id}`;
+ const title =
+ d.title && d.title.length > 70 ? `${d.title.slice(0, 69)}β¦` : d.title;
+ set([title, d.upvotes ? `β² ${fmt(d.upvotes)}` : null]);
+ }
+ }
+ }
+
+ const BARE_ID_SKIP_DIRS = new Set([
+ "scripts",
+ "configs",
+ "config",
+ "results",
+ "figures",
+ "data",
+ "datasets",
+ "src",
+ "tests",
+ "test",
+ "examples",
+ "pages",
+ "assets",
+ "docs",
+ "outputs",
+ "output",
+ "checkpoints",
+ "models",
+ "utils",
+ "lib",
+ "bin",
+ "tmp",
+ "node_modules",
+ "dist",
+ "build",
+ ]);
+ const FILE_EXT_RE =
+ /\.(py|pyc|js|ts|jsx|tsx|json|jsonl|yaml|yml|csv|tsv|md|txt|sh|bash|html|css|png|jpe?g|svg|gif|webp|ipynb|toml|cfg|ini|lock|pdf|whl|gz|zip|tar|pt|pth|bin|safetensors|db|sqlite)$/i;
+
+ async function detectBareModelIds(text, groups) {
+ const stripped = text.replace(DETECTED_URL, " ");
+ DETECTED_URL.lastIndex = 0;
+ const seen = new Set();
+ const candidates = [];
+ const re = /(^|[\s"'`(=[])([A-Za-z0-9][\w.-]*\/[A-Za-z0-9][\w.-]*)/g;
+ let m;
+ while ((m = re.exec(stripped)) && candidates.length < 15) {
+ const id = m[2].replace(/[.:,]+$/, "");
+ if (seen.has(id)) continue;
+ seen.add(id);
+ if (FILE_EXT_RE.test(id)) continue;
+ if (BARE_ID_SKIP_DIRS.has(id.split("/")[0].toLowerCase())) continue;
+ candidates.push(id);
+ }
+ const results = await Promise.all(
+ candidates.map((id) => getJSON(`https://huggingface.co/api/models/${id}`))
+ );
+ let added = false;
+ const confirmed = [];
+ results.forEach((d, i) => {
+ if (!d || !d.id) return;
+ const id = candidates[i];
+ confirmed.push(id);
+ const url = `https://huggingface.co/${id}`;
+ if (!groups.has("model")) groups.set("model", new Map());
+ if (!groups.get("model").has(url)) {
+ groups.get("model").set(url, { kind: "model", id, url });
+ added = true;
+ }
+ });
+ return { added, confirmed };
+ }
+
+ function chipifyBareIds(ids, container) {
+ if (!ids.length) return;
+ const escaped = ids.map((id) => id.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"));
+ const pattern = new RegExp("(" + escaped.join("|") + ")");
+ const splitter = new RegExp(pattern.source, "g");
+ container
+ .querySelectorAll(".cell.markdown .cell-body")
+ .forEach((body) => {
+ const walker = document.createTreeWalker(body, NodeFilter.SHOW_TEXT, {
+ acceptNode(node) {
+ if (!pattern.test(node.nodeValue)) return NodeFilter.FILTER_REJECT;
+ for (
+ let el = node.parentElement;
+ el && el !== body;
+ el = el.parentElement
+ ) {
+ if (["A", "CODE", "PRE", "BUTTON"].indexOf(el.tagName) !== -1) {
+ return NodeFilter.FILTER_REJECT;
+ }
+ }
+ return NodeFilter.FILTER_ACCEPT;
+ },
+ });
+ const nodes = [];
+ while (walker.nextNode()) nodes.push(walker.currentNode);
+ nodes.forEach((node) => {
+ const frag = document.createDocumentFragment();
+ node.nodeValue.split(splitter).forEach((part) => {
+ if (ids.indexOf(part) !== -1) {
+ const holder = document.createElement("span");
+ holder.innerHTML = resChipHtml({
+ kind: "model",
+ id: part,
+ url: `https://huggingface.co/${part}`,
+ });
+ frag.appendChild(holder.firstChild);
+ } else if (part) {
+ frag.appendChild(document.createTextNode(part));
+ }
+ });
+ node.parentNode.replaceChild(frag, node);
+ });
+ });
+ }
+
+ let RAIL_TOKEN = 0;
+ const RAIL_EXCLUDE_KINDS = new Set(["paper", "repo", "artifact", "dashboard"]);
+
+ function railDashboardItem(it) {
+ return {
+ kind: "dashboard",
+ id: it.id,
+ url: it.local ? it.resUrl : it.url || it.resUrl,
+ local: it.local,
+ railLabel: "Dashboard",
+ };
+ }
+
+ function promoteTrackioSpacesInRail(groups, dashResUrls, body, rail, token) {
+ const spaceGroup = groups.get("space");
+ if (!spaceGroup || !spaceGroup.size) return;
+ spaceGroup.forEach((item, url) => {
+ getJSON(`https://huggingface.co/api/spaces/${item.id}`)
+ .then((d) => {
+ if (rail.dataset.renderToken !== token) return;
+ const tags = (d && d.tags) || [];
+ if (!tags.some((t) => String(t).toLowerCase() === "trackio")) return;
+ if (dashResUrls.has(url)) return;
+ spaceGroup.delete(url);
+ if (!spaceGroup.size) groups.delete("space");
+ if (!groups.has("dashboard")) groups.set("dashboard", new Map());
+ groups.get("dashboard").set(url, {
+ kind: "dashboard",
+ id: item.id,
+ url: item.url,
+ local: false,
+ railLabel: "Dashboard",
+ });
+ dashResUrls.add(url);
+ paintRail(groups, body, rail);
+ })
+ .catch(() => {});
+ });
+ }
+
+ function renderRail(md, body, rail) {
+ const token = String(++RAIL_TOKEN);
+ rail.dataset.renderToken = token;
+ const scanText = md.replace(
+ /(`{3,4}|~{3,4})(html|raw)[^\n]*\n[\s\S]*?\n\1/g,
+ " "
+ );
+ const groups = new Map();
+ const dashMap = new Map();
+ const dashResUrls = new Set();
+ cellDashboardItems(md).forEach((it) => {
+ if (dashMap.has(it.resUrl)) return;
+ dashMap.set(it.resUrl, railDashboardItem(it));
+ dashResUrls.add(it.resUrl);
+ });
+ if (dashMap.size) groups.set("dashboard", dashMap);
+ extractUrls(scanText).forEach((url) => {
+ const item = classifyResource(url);
+ if (!item) return;
+ if (RAIL_EXCLUDE_KINDS.has(item.kind)) return;
+ if (dashResUrls.has(url)) return;
+ if (!groups.has(item.kind)) groups.set(item.kind, new Map());
+ groups.get(item.kind).set(item.url, item);
+ });
+ const artMap = new Map();
+ cellArtifactItems(md).forEach((it) => {
+ if (artMap.has(it.resUrl)) return;
+ const label = it.type
+ ? it.type.charAt(0).toUpperCase() + it.type.slice(1)
+ : "Artifact";
+ artMap.set(it.resUrl, {
+ kind: "artifact",
+ id: it.name,
+ url: it.local ? it.resUrl : it.url || it.resUrl,
+ local: it.local,
+ railLabel: label,
+ size: it.size,
+ });
+ });
+ if (artMap.size) groups.set("artifact", artMap);
+ paintRail(groups, body, rail);
+ promoteTrackioSpacesInRail(groups, dashResUrls, body, rail, token);
+ detectBareModelIds(scanText, groups)
+ .then((result) => {
+ if (rail.dataset.renderToken !== token) return;
+ chipifyBareIds(result.confirmed, body);
+ if (result.added) paintRail(groups, body, rail);
+ })
+ .catch(() => {});
+ }
+
+ function paintRail(groups, body, rail) {
+ rail.innerHTML = "";
+ RESOURCE_SECTIONS.forEach(([kind, label, icon]) => {
+ const group = groups.get(kind);
+ if (!group || !group.size) return;
+ group.forEach((item) => {
+ const el = document.createElement(item.local ? "div" : "a");
+ el.className = item.local ? "rail-item rail-local" : "rail-item";
+ if (!item.local) {
+ el.href = item.url;
+ el.target = "_blank";
+ el.rel = "noopener";
+ }
+ el.dataset.resUrl = item.url;
+ let desc;
+ if (kind === "artifact") {
+ const state = item.local ? "publish to share" : "Open β";
+ desc = item.size ? `${item.size} Β· ${state}` : state;
+ } else if (kind === "dashboard") {
+ desc = item.local ? "publish to share" : "Open β";
+ } else {
+ desc = item.local ? "publish to share" : RESOURCE_DESC[kind];
+ }
+ const kindLabel = item.railLabel || label.replace(/s$/, "");
+ const iconHtml =
+ kind === "artifact"
+ ? ARTIFACT_ICON_IMG
+ : kind === "dashboard"
+ ? DASHBOARD_ICON_IMG
+ : `${icon}`;
+ el.innerHTML =
+ `