{first}
{rest.length > 0 && (
<>
{open && pos && (
<>
{
setOpen(false);
setPos(null);
}}
style={{ position: 'fixed', inset: 0, zIndex: 9998 }}
/>
All standards ({list.length})
{list.map((s, i) => (
{s}
))}
)}
)}
);
}
// ─── Signed document chip — click opens it, same flow as audit report ──
function SignedDocCell({
row,
onOpen,
}: {
row: ClientRow;
onOpen: (row: ClientRow) => void;
}) {
const name = signedDocName(row);
if (!hasSignedDoc(row) || !name) {
// Surveillance rows / clients without an upload — that's the data.
return
—;
}
return (
);
}
function renderCell(
col: ColumnConfig,
row: ClientRow,
value: any,
onOpenSignedDoc: (row: ClientRow) => void,
) {
// ── Company name + source chip ──
if (col.key === 'company_name') {
const name = row.company_name ?? '—';
const src = CLIENT_SOURCE_CONFIG[row.source];
return (
);
}
// ── Code ──
if (col.key === 'client_code') {
return (
{clientCode(row)}
);
}
// ── Record type ──
if (col.key === 'client_type') {
const cfg = CLIENT_TYPE_CONFIG[row.client_type];
return (
{cfg.icon} {cfg.label}
);
}
// ── Source on its own ──
if (col.key === 'source') {
const src = CLIENT_SOURCE_CONFIG[row.source];
return (
{src.label}
);
}
// ── Contact + designation ──
if (col.key === 'contact_primary') {
return (
{row.contact_primary ?? '—'}
{row.designationpr && (
{row.designationpr}
)}
);
}
// ── Standards ──
if (col.key === 'standard_name') {
return
;
}
// ── Signed document — name shown, click opens (audit-report style) ──
if (col.key === 'signeddocsname' || col.key === 'signed_docs') {
return
;
}
// ── Email + phone ──
if (col.key === 'email_id') {
return (
{row.email_id ? (
{row.email_id}
) : (
—
)}
{(row.mobile_no || row.telephone) && (
{row.mobile_no || row.telephone}
)}
);
}
// ── Status ──
if (col.key === 'status') {
const st = getStatusMeta(row.status);
return (
{st.label}
);
}
// ── Dates ──
if (col.key === 'created_at' || col.key === 'updated_at') {
const d = formatDateWithHint(value);
return (
{d.main}
{d.hint &&
{d.hint}
}
);
}
// ── Default text cell ──
return (
{value ?? '—'}
);
}
export default function DynamicClientRow({
row,
visibleColumns,
rowButtons,
hasActionsColumn,
mapColumnKeyToValue,
onView,
onEdit,
onDelete,
onAuditRequest,
onExportRow,
onOpenSignedDoc,
}: Props) {
const [open, setOpen] = useState(false);
const [menuPos, setMenuPos] = useState({ top: 0, bottom: 0, right: 0, left: 0 });
const [openUp, setOpenUp] = useState(false);
const btnRef = useRef
(null);
const toggleMenu = () => {
if (!open && btnRef.current) {
const r = btnRef.current.getBoundingClientRect();
const spaceBelow = window.innerHeight - r.bottom;
setOpenUp(spaceBelow < 240);
setMenuPos({ top: r.top, bottom: r.bottom, right: r.right, left: r.left });
}
setOpen((v) => !v);
};
const handle = (key: string) => {
setOpen(false);
switch (key) {
case 'view':
case 'view-all':
return onView(row);
case 'edit':
return onEdit(row);
case 'delete':
return onDelete(row);
case 'audit-request':
return onAuditRequest(row);
case 'export':
return onExportRow(row);
case 'signed-doc':
return onOpenSignedDoc(row);
}
};
const dataColumns = visibleColumns.filter((c) => c.key !== 'actions');
// Hide the "Signed doc" menu item on rows that have nothing uploaded
// (all surveillance rows, plus clients without a doc).
const effectiveButtons = rowButtons.filter(
(b) => b.key !== 'signed-doc' || hasSignedDoc(row),
);
return (
(e.currentTarget.style.background = '#f8fafc')}
onMouseLeave={(e) => (e.currentTarget.style.background = 'transparent')}
>
{dataColumns.map((col) => (
|
{renderCell(col, row, mapColumnKeyToValue(col.key, row), onOpenSignedDoc)}
|
))}
{hasActionsColumn && (
{open && (
<>
setOpen(false)}
style={{ position: 'fixed', inset: 0, zIndex: 990 }}
/>
{effectiveButtons.length === 0 && (
No actions
)}
{effectiveButtons.map((btn) => {
const meta = ACTION_META[btn.key];
if (!meta) return null;
return (
);
})}
)}
|
)}
);
}