diff --git a/changes/48125-tooltip-not-showing-idp b/changes/48125-tooltip-not-showing-idp new file mode 100644 index 0000000000..cc7aa71b6c --- /dev/null +++ b/changes/48125-tooltip-not-showing-idp @@ -0,0 +1 @@ +- Fixed an issue where tooltips for full name did not always show. \ No newline at end of file diff --git a/frontend/pages/hosts/details/DeviceUserPage/DeviceUserPage.tsx b/frontend/pages/hosts/details/DeviceUserPage/DeviceUserPage.tsx index 3e1d3b6b85..f933ad1f0b 100644 --- a/frontend/pages/hosts/details/DeviceUserPage/DeviceUserPage.tsx +++ b/frontend/pages/hosts/details/DeviceUserPage/DeviceUserPage.tsx @@ -804,8 +804,6 @@ const DeviceUserPage = ({ className={fullWidthCardClass} canWriteEndUser={false} endUsers={host.end_users ?? []} - disableFullNameTooltip - disableGroupsTooltip /> {isAppleHost && !!deviceCertificates?.certificates.length && ( { + const render = createCustomRenderer(); + describe("IdP data", () => { it("renders the username, full name, groups, and department fields", () => { const endUsers = [createMockHostEndUser()]; @@ -45,6 +48,30 @@ describe("User card", () => { expect(screen.queryByText("Add user")).toBeNull(); expect(screen.getByText("Edit user")).toBeInTheDocument(); }); + + describe("Tooltips", () => { + it.each([ + [ + "Full name (IdP)", + 'This is the "givenName + familyName" from your IdP.', + ], + [ + "Department (IdP)", + 'This is the "department" collected from your IdP.', + ], + ])("always renders the tooltip for %s", async (field, tooltipContent) => { + const { user } = render( + + ); + + await user.hover(screen.getByText(field)); + await waitFor(() => { + const tooltip = screen.getByRole("tooltip"); + expect(tooltip).toBeInTheDocument(); + expect(tooltip.textContent).toBe(tooltipContent); + }); + }); + }); }); describe("My device button", () => { diff --git a/frontend/pages/hosts/details/cards/User/User.tsx b/frontend/pages/hosts/details/cards/User/User.tsx index af38693726..320eb4ddbb 100644 --- a/frontend/pages/hosts/details/cards/User/User.tsx +++ b/frontend/pages/hosts/details/cards/User/User.tsx @@ -14,9 +14,7 @@ import UserValue from "./components/UserValue"; import { generateChromeProfilesValues, generateUsernameValues, - generateFullNameTipContent, generateFullNameValues, - generateGroupsTipContent, generateGroupsValues, generateOtherEmailsValues, } from "./helpers"; @@ -28,8 +26,6 @@ interface IUserProps { endUsers: IHostEndUser[]; canWriteEndUser?: boolean; canViewMyDeviceLink?: boolean; - disableFullNameTooltip?: boolean; - disableGroupsTooltip?: boolean; className?: string; onClickUpdateUser?: ( e: @@ -47,8 +43,6 @@ const User = ({ endUsers, canWriteEndUser = false, canViewMyDeviceLink = false, - disableFullNameTooltip = false, - disableGroupsTooltip = false, className, onClickUpdateUser, onClickMyDevice, @@ -71,7 +65,6 @@ const User = ({ if (endUser?.idp_department) { userDepartment.push(endUser.idp_department); } - const groupsTipContent = generateGroupsTipContent(endUsers); return ( - Full name (IdP) - - ) + + Full name (IdP) + } value={} /> - <>Groups (IdP) - - ) - } + title="Groups (IdP)" value={} /> + Department (IdP) } diff --git a/frontend/pages/hosts/details/cards/User/helpers.tsx b/frontend/pages/hosts/details/cards/User/helpers.tsx index 9f5a6c6c7c..96f6f7c9cf 100644 --- a/frontend/pages/hosts/details/cards/User/helpers.tsx +++ b/frontend/pages/hosts/details/cards/User/helpers.tsx @@ -1,5 +1,3 @@ -import React from "react"; - import { IHostEndUser } from "interfaces/host"; export const generateUsernameValues = (endUsers: IHostEndUser[]) => { @@ -70,39 +68,3 @@ export const generateOtherEmailsValues = (endUsers: IHostEndUser[]) => { return acc; }, []); }; - -export const generateFullNameTipContent = (endUsers: IHostEndUser[]) => { - if (endUsers.length === 0) return null; - - if (endUsers[0].idp_info_updated_at === null) { - return ( - <> - Connect your identity provider to Fleet on the{" "} - - Settings {">"} Integrations {">"} IdP - {" "} - page. - - ); - } - - return <>This is the {'"givenName + familyName"'} from your IdP.; -}; - -export const generateGroupsTipContent = (endUsers: IHostEndUser[]) => { - if (endUsers.length === 0) return null; - - if (endUsers[0].idp_info_updated_at === null) { - return ( - <> - Connect your identity provider to Fleet on the{" "} - - Settings {">"} Integrations {">"} IdP - {" "} - page. - - ); - } - - return null; -};