renderTableCell

The renderTableCell feature offers developers a powerful callback mechanism to handle customizing a cell in a table.

Implementation

<Vizzly.Dashboard 
  renderTableCell={data => {
    if (data.viewId === '<< DEFINED_ID >>') {
        return <div style={{ color: 'green', fontSize: '16px' }}>{data.cell.value}</div>;
    }
    return undefined;
  }}
/>

The definition of the renderTableCell function is;

type renderTableCell = (data: Component.RenderTableCell) => React.ReactNode | string | undefined;
 
type Component.RenderTableCell = {
  // A persisted id for the view.
  viewId: string;
  // Avaiable view types.
  type: 'dataTable' | 'basicTable';
  // Returns the information related to cell.
  fields: { [key: string]: string | number }[];
  cell:
    | ReturnedField
    | {
        grouping?: Array<ReturnedField>;
        value?: ReturnedField;
      };
}
 
 export type ReturnedField = {
    fieldId: string;
    function: string;
    value?: string | number;
    aggregate: string;
  };

`viewId`

The viewId has been deliberately designed to persist consistently, regardless of any actions taken by you or your users within the view.