File Icon

import { FileIcon } from "@/components/ui/file-icon"

const files = [
  "zgi-workflow.md",
  "customer-records.csv",
  "agent-runtime.json",
  "brief.pdf",
  "voice-sample.mp3",
  "prototype.png",
]

export function FileIconDemo() {
  return (
    <div className="grid w-full max-w-md gap-2">
      {files.map((file) => (
        <div
          key={file}
          className="bg-card flex items-center gap-3 rounded-lg border px-3 py-2"
        >
          <FileIcon filename={file} />
          <span className="truncate text-sm font-medium">{file}</span>
        </div>
      ))}
    </div>
  )
}