mirror of
https://github.com/fleetdm/fleet
synced 2026-04-25 23:47:25 +00:00
bac97cea7b
# Addresses #10038 - Add logic to ensure consistent light-grey coloring of text cells using DEFAULT_EMPTY_VALUE <img width="622" alt="Screenshot 2023-03-22 at 4 06 30 PM" src="https://user-images.githubusercontent.com/61553566/227058308-2c35e0b3-7017-4a0d-9e60-d03d46194f55.png"> # Checklist for submitter If some of the following don't apply, delete the relevant line. - [x] Changes file added for user-visible changes in `changes/` - [x] Manual QA for all new/changed functionality --------- Co-authored-by: Jacob Shandling <jacob@fleetdm.com>
32 lines
778 B
TypeScript
32 lines
778 B
TypeScript
import React from "react";
|
|
import { DEFAULT_EMPTY_CELL_VALUE } from "utilities/constants";
|
|
|
|
interface ITextCellProps {
|
|
value?: string | number | boolean | { timeString: string };
|
|
formatter?: (val: any) => JSX.Element | string; // string, number, or null
|
|
greyed?: boolean;
|
|
classes?: string;
|
|
}
|
|
|
|
const TextCell = ({
|
|
value,
|
|
formatter = (val) => val, // identity function if no formatter is provided
|
|
greyed,
|
|
classes = "w250",
|
|
}: ITextCellProps): JSX.Element => {
|
|
let val = value;
|
|
|
|
if (typeof value === "boolean") {
|
|
val = value.toString();
|
|
}
|
|
if (!val) {
|
|
greyed = true;
|
|
}
|
|
return (
|
|
<span className={`text-cell ${classes} ${greyed && "grey-cell"}`}>
|
|
{formatter(val) || DEFAULT_EMPTY_CELL_VALUE}
|
|
</span>
|
|
);
|
|
};
|
|
|
|
export default TextCell;
|