64 lines
2.3 KiB
TypeScript
64 lines
2.3 KiB
TypeScript
return (
|
|
<div className="space-y-3">
|
|
<div>
|
|
<input
|
|
value={localQuery}
|
|
onChange={(e) => {
|
|
setLocalQuery(e.currentTarget.value);
|
|
onQueryChange?.(e.currentTarget.value);
|
|
})}
|
|
placeholder="Search by title, owner, material, model…"
|
|
className="w-full border rounded px-3 py-2"
|
|
/>
|
|
</div>
|
|
|
|
{loading ? (
|
|
<p>Loading…</p>
|
|
) : (
|
|
<div className="overflow-x-auto">
|
|
<table className="w-full table-fixed text-sm">
|
|
<thead className="sticky top-0">
|
|
<tr className="border-b">
|
|
<th className="px-2 py-2 text-left w-[30%]">Title</th>
|
|
<th className="px-2 py-2 text-left w-[14%]">Owner</th>
|
|
<th className="px-2 py-2 text-left w-[14%]">Material</th>
|
|
<th className="px-2 py-2 text-left w-[14%]">Coating</th>
|
|
<th className="px-2 py-2 text-left w-[14%]">Model</th>
|
|
<th className="px-2 py-2 text-left w-[10%]">Field</th>
|
|
<th className="px-2 py-2 text-left w-[4%]">Edit</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody className="divide-y">
|
|
{filtered.map((s) => {
|
|
const mine = isMine(s.owner);
|
|
const ownerText = ownerLabel(s.owner) + (mine ? " (you)" : "");
|
|
return (
|
|
<tr key={s.submission_id} className="hover:bg-muted/40">
|
|
<td className="px-2 py-2 truncate">
|
|
<a href={linkFor(s.submission_id)} className="underline">
|
|
{s.setting_title || "Untitled"}
|
|
</a>
|
|
</td>
|
|
<td className="px-2 py-2 truncate">{ownerText}</td>
|
|
<td className="px-2 py-2 truncate">{s.mat?.name || "—"}</td>
|
|
<td className="px-2 py-2 truncate">{s.mat_coat?.name || "—"}</td>
|
|
<td className="px-2 py-2 truncate">{s.source?.model || "—"}</td>
|
|
<td className="px-2 py-2 truncate">{s.lens?.field_size || "—"}</td>
|
|
<td className="px-2 py-2">
|
|
{mine ? (
|
|
<a href={linkFor(s.submission_id, { edit: true })} className="underline">
|
|
Edit
|
|
</a>
|
|
) : (
|
|
<span className="opacity-50">—</span>
|
|
)}
|
|
</td>
|
|
</tr>
|
|
);
|
|
})}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
)}
|
|
</div>
|
|
);
|