From 8b52ac3b8bd5007afb6f85806f03ef27fd80eafb Mon Sep 17 00:00:00 2001
From: Arya Khochare <91268931+Aryakoste@users.noreply.github.com>
Date: Mon, 1 Jul 2024 14:18:42 +0530
Subject: [PATCH] [MM-58509] Migrate tooltips of
 "components/admin_console/user_grid/user_grid_role_dropdown.tsx" to
 WithTooltip (#27242)

---
 .../user_grid/user_grid_role_dropdown.tsx     | 26 +++++++------------
 1 file changed, 10 insertions(+), 16 deletions(-)

diff --git a/webapp/channels/src/components/admin_console/user_grid/user_grid_role_dropdown.tsx b/webapp/channels/src/components/admin_console/user_grid/user_grid_role_dropdown.tsx
index f39e13acfc..8a15da2c3d 100644
--- a/webapp/channels/src/components/admin_console/user_grid/user_grid_role_dropdown.tsx
+++ b/webapp/channels/src/components/admin_console/user_grid/user_grid_role_dropdown.tsx
@@ -8,13 +8,11 @@ import type {ChannelMembership} from '@mattermost/types/channels';
 import type {TeamMembership} from '@mattermost/types/teams';
 import type {UserProfile} from '@mattermost/types/users';
 
-import OverlayTrigger from 'components/overlay_trigger';
-import Tooltip from 'components/tooltip';
 import DropdownIcon from 'components/widgets/icons/fa_dropdown_icon';
 import Menu from 'components/widgets/menu/menu';
 import MenuWrapper from 'components/widgets/menu/menu_wrapper';
+import WithTooltip from 'components/with_tooltip';
 
-import {Constants} from 'utils/constants';
 import * as Utils from 'utils/utils';
 
 export type BaseMembership = {
@@ -133,27 +131,23 @@ export default class UserGridRoleDropdown extends React.PureComponent<Props> {
         const ariaLabel = this.getAriaLabel();
 
         if (currentRole === 'shared_member') {
-            const sharedTooltip = (
-                <Tooltip id='sharedTooltip'>
-                    <FormattedMessage
-                        id='shared_user_indicator.tooltip'
-                        defaultMessage='From trusted organizations'
-                    />
-                </Tooltip>
-            );
-
             return (
                 <div className='more-modal__shared-actions'>
-                    <OverlayTrigger
-                        delayShow={Constants.OVERLAY_TIME_DELAY}
+                    <WithTooltip
+                        id='userGridDropdown.sharedUserIndicator.tooltip'
                         placement='bottom'
-                        overlay={sharedTooltip}
+                        title={
+                            <FormattedMessage
+                                id='shared_user_indicator.tooltip'
+                                defaultMessage='From trusted organizations'
+                            />
+                        }
                     >
                         <span>
                             {localizedRole}
                             <i className='shared-user-icon icon-circle-multiple-outline'/>
                         </span>
-                    </OverlayTrigger>
+                    </WithTooltip>
                 </div>
             );
         }