27 lines
1.1 KiB
TypeScript
Executable File
27 lines
1.1 KiB
TypeScript
Executable File
import { Table, TableBody, TableCell, TableRow } from "./ui/table";
|
|
|
|
export function PopupAttribute({ popupData }: { popupData: Record<string, unknown>[] }) {
|
|
const keys = popupData.length > 0 ? Object.keys(popupData[0]) : [];
|
|
|
|
return (
|
|
<>
|
|
<div className="max-w-[460px] max-h-[300px] overflow-y-auto overflow-x-auto">
|
|
<Table className="mt-1 w-full text-[12px] ">
|
|
<TableBody>
|
|
{keys.map((k) => (
|
|
<TableRow key={k} className="even:bg-gray-50">
|
|
<TableCell className="py-2 align-top font-semibold text-zinc-800 whitespace-normal break-words pr-4 min-w-[120px]">{k}</TableCell>
|
|
{popupData.map((row, idx) => (
|
|
<TableCell key={idx} className="py-2 align-top whitespace-normal break-words max-w-[300px] text-zinc-700">
|
|
{row[k] === null ? "—" : Array.isArray(row[k]) ? (row[k] as unknown[]).join(", ") : typeof row[k] === "object" ? JSON.stringify(row[k]) : String(row[k] ?? "")}
|
|
</TableCell>
|
|
))}
|
|
</TableRow>
|
|
))}
|
|
</TableBody>
|
|
</Table>
|
|
</div>
|
|
</>
|
|
);
|
|
}
|