feat(pragma): consume annoucement

[kimanhou]

Done

• Use Pragma's Annoucement instead of Notification in instance configuration > Devices > GPU

Both Notification and Announcement are displayed to easily compare them.

QA

1. Run the LXD-UI:
   • On the demo server via the link posted by @webteam-app below. This is only available for PRs created by collaborators of the repo. Ask @Kxiru or @edlerd for access.
   • With a local copy of this branch, build and run as described in the docs.
2. Perform the following QA steps:
   • Go to an instance configuration > Devices > GPU

Screenshots

[webteam-app]

Demo

Jenkins

demos.haus

[edlerd]

The light theme looks ok, though a little sad and boring with the thick border. Especially compared to the previous version right above:

After switching to the dark theme, the component does not adjust to it properly:

FYI @advl

[diana-stanciulescu]

Hi this is the current WIP styling for "announcement" . We are going for a background color - but we felt atm it's too intense so we are still looking at a possible lighter shade. https://www.figma.com/design/WGHcOmGMEUF9hMAEoRafL8/%F0%9F%93%95-Pragma---documentation-visuals?node-id=3102-3204&t=7GnSWYgZltNgvzJo-1

and dark mode:

[edlerd]

Hi this is the current WIP styling for "announcement" . We are going for a background color - but we felt atm it's too intense so we are still looking at a possible lighter shade.

Thanks for the reply. I see now that the announcement in storybook is still under experimental. @kimanhou should we treat this as an experiment not to be merged atm then? Did you communicate the problems that made the custom styling necessary?

[diana-stanciulescu]

@edlerd FYI many components in storybook lack the styling layer and are yet to go through design QA > best way to find the source of truth is in coda, where we embedded links to the styling instructions (where available).

[kimanhou]

@edlerd

should we treat this as an experiment not to be merged atm then?

Yes, of course. This PR should not be merged.

@advl @diana-stanciulescu
Importing the styles and the library was easy with bun. However, there are two main issues:

• bun breaks the CI because we don't use it in LXD UI
• I had to add "@canonical/styles-old": "npm:@canonical/styles@0.24.0" in resolutions in package.json