search

patternfly / virtual-assistant

This repo contains the code for the PatternFly virtual assistant extension
MIT License
0 stars 18 forks source link

v6 chatbot - Chatbot is showing two scrollbars #119

Closed divyanshiGupta closed 2 weeks ago

divyanshiGupta commented 1 month ago

Chatbot should have only one scrollbar, preferably on the MessageBox component.

https://github.com/user-attachments/assets/2348af66-4bc7-49cb-8a96-ec635beb05c0

asuwebdesign commented 3 weeks ago

Ansible team has also replicated this issue. They're seeing it in Linux/Chrome.

rebeccaalpert commented 3 weeks ago

@asuwebdesign pointed me to the Ansible team's repo. I was able to pull it down and run it, and saw the double scrollbar issue. They also had buttons, etc. that were not the right shape. I adjusted their imports so these were the very last set of imports in their index.tsx file and the second scrollbar went away:

import '@patternfly/react-core/dist/styles/base.css';
import '@patternfly/patternfly/patternfly-addons.css';

// Add your extension CSS below
import '@patternfly/virtual-assistant/dist/css/main.css';

I'll try to meet with @divyanshiGupta or Rohit next week and see if their issue is the same or has a different cause.

rebeccaalpert commented 3 weeks ago

I met with Rohit and @divyanshiGupta this morning and they have a different issue. Divyanshi reports that the extra scrollbar is on .pf-chatbot__content. I'm meeting with Karthik on Thursday to see if I can run Developer Hub Lightspeed locally to debug this on their side.

rebeccaalpert commented 2 weeks ago

@divyanshiGupta - I think this should be fixed on 2.0.0-alpha.37. I pulled this into Lightspeed locally and it looks better to me (some other things look weird though - so I would appreciate it if you guys could let us know if this doesn't work on your side):

https://github.com/user-attachments/assets/009628d8-d912-4098-b67e-f2f78c2e073c

Thanks for onboarding me!

The release is available on:

GitHub release npm package (@alpha dist-tag)

rebeccaalpert commented 2 weeks ago

I think this is ultimately being caused by https://github.com/patternfly/virtual-assistant/issues/175. Going to close this for now since the immediate issue is resolved, but I think CSS problems will continue to get worse for RHDH as this gets more complex.