learning_ai_notes/web/src/components/ArtifactPanel.tsx

22 lines
1.1 KiB
TypeScript

import type { ArtifactSummary } from "@/lib/types";
export function ArtifactPanel({ artifacts }: { artifacts: ArtifactSummary[] }) {
return (
<section className="surface-card" style={{ padding: "var(--ml-space-5)", display: "grid", gap: "var(--ml-space-3)" }}>
<div style={{ display: "flex", justifyContent: "space-between", gap: "var(--ml-space-3)", alignItems: "center" }}>
<div style={{ fontWeight: 700 }}>Artifacts</div>
<span className="badge">upload deferred</span>
</div>
{artifacts.map((artifact) => (
<div key={artifact.id} className="surface-muted" style={{ padding: "var(--ml-space-3)", display: "flex", justifyContent: "space-between", gap: "var(--ml-space-3)", alignItems: "center" }}>
<div style={{ display: "grid", gap: 4 }}>
<strong>{artifact.name}</strong>
<span style={{ color: "var(--ml-text-secondary)" }}>{artifact.type}</span>
</div>
<span style={{ color: "var(--ml-text-secondary)" }}>{artifact.status}</span>
</div>
))}
</section>
);
}