Top level product added via Extension with imported icon doesn't have the proper alignment in the top level menu

rancher / dashboard

The Rancher UI

https://rancher.com

Apache License 2.0

463 stars 261 forks source link

Top level product added via Extension with imported icon doesn't have the proper alignment in the top level menu #11368

Closed aalves08 closed 4 months ago

aalves08 commented 4 months ago

Setup

Rancher version: 2.8.4 and 2.9
Rancher UI Extensions:
Browser type & version:

Describe the bug

Top level product added via Extension with imported icon doesn't have the proper alignment in the top level menu

To Reproduce

clone Stackstate extension to your machine https://github.com/StackVista/rancher-extension-stackstate
do yarn install to install dependencies
do yarn build-pkg stackstate to create a local build of the stackstate extension
do yarn serve-pkgs to serve up those built assets
On Rancher, Extensions page, do a developer load of the stackstate extension (copy and paste url generated by serve-pkgs) https://extensions.rancher.io/extensions/extensions-getting-started#test-built-extension-by-doing-a-developer-load
check that icon displays with the correct alignment

Result icon doesn't have the proper alignment in the top level menu

Expected Result

icon should have the proper alignment

Screenshots

Additional context

yonasberhe23 commented 4 months ago

@aalves08 is this something that could be automated? if not, could you provide repo steps for manual validation please?

aalves08 commented 4 months ago

@yonasberhe23 updated repro steps in the issue. This is more of a pain to automate rather to manual test it, since the stackstate code at this point is mutable. I had put this as QA/none, but the project's automation removed the label...

yonasberhe23 commented 4 months ago

@yonasberhe23 updated repro steps in the issue. This is more of a pain to automate rather to manual test it, since the stackstate code at this point is mutable. I had put this as QA/none, but the project's automation removed the label...

@aalves08 ah i didn't catch what the project's automation did. thanks for pointing that out and thank you for the repro steps!

caliskanugur commented 4 months ago

Setup

Rancher version: v2.9-3c4ccdc5bc9fde3510089153b5ad58fdbe604880-head
Rancher UI Extensions: master 00e9eb2
Browser type & version: Chrome Version 126.0.6478.62 (Official Build) (arm64)
Extension built from: main 937a829e9c59c5fe76672f27d1316481bc4311ee

Result

Icon has the proper alignment in the top-level menu, but I am unsure about the color of it, it might be an extension build issue on my end

Expected Result

The icon should have the proper alignment

yonasberhe23 commented 4 months ago

@aalves08 from the looks of it, the Observability logo is not visible in dark mode (unless the menu item is selected). shouldn't the logo be blue?

aalves08 commented 4 months ago

Yes, but we don't control the icon... It's stackstate that needs to provide an icon with the correct colors, afaik. I've already let them know. Their extension is still in a WIP phase. 🤷