fleet/frontend/components/TableContainer
Jacob Shandling 5445559c76
UI: Address tooltip in headers spacing bug (#10792)
## Addresses #9988

* Adjust copy in tooltips to take up less width
* Refactor table headers to take an optional "isLastColumn" property
that is set to true when that header is in the last column.
* Use above property in conjunction with presence of TooltipWrapper as a
value for the header cell to add a class specific to that state.
* Use that class to adjust the location of the tooltip text and the
min-width of the column to avoid the bug.

The 3 states which exhibited this bug, now fixed:
<img width="1496" alt="Screenshot 2023-03-27 at 4 36 01 PM"
src="https://user-images.githubusercontent.com/61553566/228091971-4d5d034d-55c5-4921-955a-4946119f7785.png">
<img width="1496" alt="Screenshot 2023-03-27 at 4 36 12 PM"
src="https://user-images.githubusercontent.com/61553566/228091968-adf90b32-8fd2-45d9-b56d-a64c654151ef.png">
<img width="1496" alt="Screenshot 2023-03-27 at 4 36 24 PM"
src="https://user-images.githubusercontent.com/61553566/228091962-ff626daa-b13d-4093-b34f-de704b820161.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>
2023-04-04 10:25:07 -07:00
..
DataTable UI: Address tooltip in headers spacing bug (#10792) 2023-04-04 10:25:07 -07:00
_styles.scss Fleet UI: Fix table button icons misalignment (#9513) 2023-01-27 14:16:03 -05:00
index.ts Add new feature: Software page (#3923) 2022-01-31 16:24:20 -06:00
TableContainer.tsx Feat/disk encryption page (#10288) 2023-03-14 13:03:02 -07:00
TableContainerUtils.ts Fix hosts table search and pagination (#2494) 2021-10-13 13:36:17 -05:00