microsoft-graph-toolkit icon indicating copy to clipboard operation
microsoft-graph-toolkit copied to clipboard

Published 20 hours ago • verified publisher icon microsoftgraph

[BUG] [MGT-CHAT] Profile icons in Chat are being rendered on top of an open Profile card

Open MattBillFred opened this issue 4 months ago • 4 comments

Describe the bug When using the chat component, received messages will show a profile icon of the user you are communication with. Clicking on this profile icon will open a profile card containing details about that user. The problem is that any other profile icons will be incorrectly rendered above the profile card. (See screenshots section)

To Reproduce

  1. Go to the MGT Chat Test Harness.
  2. Receive multiple messages from another user in succession.
  3. Click on the profile icon of the first message received.

Expected behavior The Profile card should appear above all other elements of chat.

Screenshots image

Environment (please complete the following information):

  • OS: Windows 10
  • Browser: Chrome
  • Framework: React
  • Context: Web
  • Version: MGT 4
  • Provider: Msal2Provider

Additional context

MattBillFred avatar Feb 28 '24 14:02 MattBillFred

@musale I thought we'd addressed this issue?

gavinbarron avatar Feb 28 '24 16:02 gavinbarron

@musale I thought we'd addressed this issue?

We did. I'm not sure what could've re-introduced it. I'll drill down on it tomorrow.

musale avatar Feb 29 '24 14:02 musale

There's a new CSS class css-176 setting the z-index: 2 for the avatar. A solution to unset or set this to 0 should suffice.

image

musale avatar Mar 06 '24 15:03 musale

Ca we identify a more sustainable solution? As these classes are dynamically generated, it would be great to have a way to avoid this.

sebastienlevert avatar Mar 07 '24 15:03 sebastienlevert