-
Notifications
You must be signed in to change notification settings - Fork 5
2. Custom Column Integration in Table View #435
Description
Thread customColumns entries through DictionaryTableViewer into SchemaTable and the column definitions, and add a "Columns" visibility control to the toolbar.
Table integration
For each configured entry, generate a TanStack Table column definition according to its mode:
- Path-based entries (
metaPath): the framework callsgetByDotPathto resolve the configured path against theSchemaField, then passes the result toMetaValueRenderer. The developer writes no rendering code; empty cells are produced automatically when the path resolves to nothing. - Component-based entries (
columnComponent): the framework passes the fullSchemaFieldrow as a prop to the supplied component. The component is responsible for its own rendering and for returning nothing when its target property is absent.
Custom columns appear after all four standard columns in the order they are declared in the configuration array.
Given a field structured like this:
{
"name": "submitter_participant_id",
"valueType": "string",
"meta": {
"mappings": {
"FHIR": "Patient.Identifier",
"mCODE.STU3": "Patient.Identifier",
"Phenopacket": "individual.id"
},
"examples": ["90234", "BLD_donor_89", "AML-90"]
}
}A path-based column resolves and renders automatically:
<DictionaryTableViewer
customColumns={[
{ columnHeader: 'FHIR Mapping', metaPath: 'meta.mappings.FHIR' },
{ columnHeader: 'Examples', metaPath: 'meta.examples' },
]}
/>For submitter_participant_id this produces a "FHIR Mapping" cell showing Patient.Identifier and an "Examples" cell showing 90234, BLD_donor_89, AML-90. Fields with nothing at the configured path render an empty cell.
A component-based column receives the full SchemaField row and handles its own rendering:
const AllMappingsCell = ({ field }: { field: SchemaField }) => {
const mappings = field.meta?.mappings;
if (!mappings) return null;
return (
<ul>
{Object.entries(mappings).map(([standard, value]) => (
<li key={standard}><b>{standard}:</b> {value}</li>
))}
</ul>
);
};
<DictionaryTableViewer
customColumns={[
{ columnHeader: 'FHIR Mapping', metaPath: 'meta.mappings.FHIR' },
{ columnHeader: 'All Mappings', columnComponent: AllMappingsCell },
]}
/>
Column visibility toggle
Add a "Columns" control to the toolbar that allows users to show or hide custom columns. The control lists only the configured custom columns, each with a checkbox, in the order they are declared in the customColumns prop. Standard columns (Fields, Attribute, Data Type, Allowed Values) are not included in this control. The control is only rendered when customColumns is configured and non-empty.
Default visibility for each custom column is configurable via a defaultVisible option on each customColumns entry. When defaultVisible is not set, the column is visible on load. Column visibility state persists for the session and resets to configured defaults when the user switches dictionary version.
Acceptance Criteria
- Configured custom columns appear in the table after the Allowed Values column
- Column order matches the order of entries in the
customColumnsarray - For path-based entries, the cell displays the value resolved from
metaPathviagetByDotPath, rendered byMetaValueRenderer; fields with nothing at that path render an empty cell - For component-based entries, the cell renders the output of the configured component, which receives the full
SchemaFieldrow as a prop - Custom columns appear in every schema table in the dictionary, not just the first
- Removing
customColumnsfrom the prop restores the original four-column table with no visual difference - The "Columns" control appears in the toolbar when and only when
customColumnsis configured and non-empty - The control lists only custom columns, each with a checkbox, in the configured order
- Checking a column makes it visible in the table immediately; unchecking it removes it immediately
- A custom column with
defaultVisible: falseis unchecked on initial load and on dictionary version change - A custom column with no
defaultVisiblespecified is unchecked on initial load - Switching dictionary version resets all custom column visibility to the configured defaults
- Standard columns are unaffected by this control
Dependencies
Ticket 1