mirror of
https://github.com/Tria-plc/edr-platform.git
synced 2026-09-08 10:08:21 +00:00
a48d77aff8
The reviewer approving a role had no way to see which business it claims to operate as, so there was nothing to check the uploaded licence document against. The Role profiles table now carries a column with the trade name, the licensed activity (does it actually cover this role?), the licence number (the only unambiguous handle — trade names repeat across a TIN's licences) and the renewal date. A role with nothing attached reads as a yellow "Not attached" rather than a blank: it is a review finding. Yellow, not red, because a co-operative or investment-licence company legitimately has none. Two fixes alongside it: - The profile reference was already rendered but is minted only on approval, so every pending role drew an empty line. It now says so. - `TableCard` gained an optional header section, so padding sits per section and the table runs edge to edge. The header stays outside the scroll region — inside, a title slides away from its own table.
52 lines
1.7 KiB
TypeScript
52 lines
1.7 KiB
TypeScript
import { Box, Card } from "@mantine/core";
|
|
import type { ReactNode } from "react";
|
|
|
|
export interface TableCardProps {
|
|
children: ReactNode;
|
|
/**
|
|
* Optional heading row (title, chips, actions). Rendered in its own padded
|
|
* section above the table and OUTSIDE the scroll region — a header inside it
|
|
* would slide away from its own table on a narrow viewport.
|
|
*/
|
|
header?: ReactNode;
|
|
/**
|
|
* Minimum width (px) the table is forced to occupy. The Mantine `Table` is
|
|
* always `width: 100%`, so without a floor it can never overflow its
|
|
* container and the horizontal scroll never engages. Setting a floor lets
|
|
* columns keep a sensible width and the card scroll horizontally on narrow
|
|
* viewports instead of squishing.
|
|
*/
|
|
minWidth?: number;
|
|
}
|
|
|
|
/**
|
|
* Flush card shell for a `DataTable`: a padding-less card whose table region
|
|
* runs edge to edge. Padding is applied per section rather than to the card, so
|
|
* the optional {@link TableCardProps.header} is inset like any other card
|
|
* content while the table's own rows and header cells reach both edges.
|
|
*
|
|
* Pair with the table's `containerClassName="border-0 shadow-none bg-transparent"`
|
|
* so every table on the customer pages reads identically (same surface, same
|
|
* scroll behaviour).
|
|
*/
|
|
export function TableCard({
|
|
children,
|
|
minWidth = 860,
|
|
header,
|
|
}: TableCardProps) {
|
|
return (
|
|
<Card p={0}>
|
|
{header && (
|
|
<Box p="md" style={{ borderBottom: "1px solid var(--mantine-color-edr-border-0)" }}>
|
|
{header}
|
|
</Box>
|
|
)}
|
|
<Box style={{ overflowX: "auto" }} w="100%">
|
|
<Box miw={minWidth}>{children}</Box>
|
|
</Box>
|
|
</Card>
|
|
);
|
|
}
|
|
|
|
export default TableCard;
|