diff --git a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/Users.spec.ts b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/Users.spec.ts index 49fe08a6887..a51e2f33866 100644 --- a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/Users.spec.ts +++ b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Pages/Users.spec.ts @@ -505,4 +505,24 @@ test.describe('User Profile Feed Interactions', () => { adminPage.locator('[data-testid="user-display-name"]') ).toHaveText(fullyQualifiedName); }); + + test('Close the profile dropdown after redirecting to user profile page', async ({ + adminPage, + }) => { + await redirectToHomePage(adminPage); + await adminPage.locator('[data-testid="dropdown-profile"] svg').click(); + await adminPage.waitForSelector('[role="menu"].profile-dropdown', { + state: 'visible', + }); + const userResponse = adminPage.waitForResponse( + '/api/v1/users/name/*?fields=*&include=all' + ); + await adminPage.getByTestId('user-name').click(); + await userResponse; + await adminPage.waitForLoadState('networkidle'); + + await expect( + adminPage.locator('.user-profile-dropdown-overlay') + ).not.toBeVisible(); + }); }); diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Settings/Users/UserProfileIcon/UserProfileIcon.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/Settings/Users/UserProfileIcon/UserProfileIcon.component.tsx index 0e7ed41822c..a56911caaa4 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/Settings/Users/UserProfileIcon/UserProfileIcon.component.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/Settings/Users/UserProfileIcon/UserProfileIcon.component.tsx @@ -116,6 +116,7 @@ export const UserProfileIcon = () => { currentUser?.profile?.images ); const [showAllPersona, setShowAllPersona] = useState(false); + const [isDropdownOpen, setIsDropdownOpen] = useState(false); const handleOnImageError = useCallback(() => { setIsImgUrlValid(false); @@ -207,6 +208,10 @@ export const UserProfileIcon = () => { [currentUser] ); + const handleCloseDropdown = useCallback(() => { + setIsDropdownOpen(false); + }, []); + const items: ItemType[] = useMemo( () => [ { @@ -215,7 +220,8 @@ export const UserProfileIcon = () => { label: ( + to={getUserPath(currentUser?.name as string)} + onClick={handleCloseDropdown}> @@ -354,7 +360,10 @@ export const UserProfileIcon = () => { defaultOpenKeys: ['personas', 'roles', 'inheritedRoles', 'teams'], rootClassName: 'profile-dropdown w-68 p-x-md p-y-sm', }} - trigger={['click']}> + open={isDropdownOpen} + overlayClassName="user-profile-dropdown-overlay" + trigger={['click']} + onOpenChange={setIsDropdownOpen}>