Fixes a bug where project status modal links wouldn't work.
The reason they didn't work is because we modified the query params on
modal close, and because we manually close the modal when you click a
link (because otherwise it'd stay open when you navigated to other
project pages), we inadverdently reset the URL.
I'm not entirely sure why setting the search params would modify the URL
itself, but I'm guessing that's related to the implementation.
One way to solve this is to indicate whether we're closing the modal
because a link was clicked or not, and only modify the query params if
that is not the case.
Hides owner avatars in cases where the owner type is "system". Touches
dashboard and project card owners.
Back when all projects required owners, we introduced the new project
cards that have the owner listed in the footer. Because, theoretically,
you weren’t allowed to create projects without owners, the only project
that should ever be without an owner was the default project. So we
thought it made sense to say that it was owned by the system.
But now that owners are optional, that doesn't necessarily make sense
anymore. As such, we'll just hide their avatars to begin with.
<img width="726" alt="image"
src="https://github.com/user-attachments/assets/950cd909-c891-48f1-9ef7-fd74922a5990"
/>
<img width="1497" alt="image"
src="https://github.com/user-attachments/assets/f4d213f5-febb-46f8-89f0-899e77652e07"
/>
Because the components expected the avatars to be there, we now need to
set an explicit min-height on them, so that they don't collapse.
Luckily, we can use the default avatar height (and also force that so
that they change in tandem) and use that in both places.
Updates the link from the project dashboard page to take you to the
project status modal instead of the old insights page.
We didn't have a way to auto-open the modal before, so I added a query
param to control it.
This PR refactors the color picker so we stick to one set of colors
instead of changing available colors when theme changes. Colors picked
also work in dark theme and is aligned with UX.
This is exposing information we already have about permissions in a UI
that should help users have an overview of the permissions of a user
with regards to projects and environments
Adds focus styles to the env accordion header only when the focus is on
the header itself (not on the env toggle inside the header). The focus
style is consistent with what we do for other accordions (dashboard,
milestones).
Middle one is focused:
Focus is on the toggle inside the top one (yeh, we should have better
focus styles for toggles; but that's not for now):
Open and focused:
Getting the consistent background for the header when it's open is a
little tricky because the accordion container and summary are split into
different files. ~~This first iteration used a class name for the
specific header (because envs can have multiple accordion headers inside
them, e.g. release plans) and setting a CSS variable in the summary, so
that the background matches.~~ I found out that I only need to set it in
the parent anyway 😄
Without it, you get this (notice that there is a little white outside
the lower corners):
Makes two small changes to the release template UI based on walkthrough
feedback with UX
1) The how-to descriptions for creating release plans won't get hidden
when the user has created release plans. We think too much is better
than too little. At a later point we'll push users to documentation more
aggressively
2) The warning for when the user taps the "Use template" button now has
a line break to give it some breathing room and will render anchored to
the bottom left of the originating button rather than covering it
Implements the drag-n-drop tooltip the first time the user sees a
strategy drag handle on the feature env overview. It uses React Joyride,
which is the same system we use for the demo.
The design is a little different from the sketches because I couldn't
find a quick way to move the content (and the arrow) to be shifted
correctly.
If the demo is also active the first time a user visits a strategy page,
it'll render both the demo steps and this, but this tooltip doesn't
prevent the user from finishing the tour. It might be possible to avoid
that through checking state in localstorage, but I'd like to get this
approved first.
The tooltip uses the auth splash system to decide whether to show the
tooltip, meaning it's stored per user in the DB. To avoid it
re-rendering before you refetch from the back end, we also use a
temporary variable to check whether the user has closed it.
Rendered:
If the tour is also active:
Adds a new dialog option for whats in new in Unleash items. This can be
tiggerred by setting `popout` to true when configuring the items.
To do this without setting fire to the code, I've also needed to
refactor the NewInUnleash components:
- NewInUnleashItem becomes a dumb item that decides if a dialog or
tooltip should be rendered and controls that render state
- The child item in NewInUnleashItem has been moved out into
NewInUnleashSideBarItem, which feels a bit better since that is a
distinct UI element from the popup
- NewInUnleashDialog now exists, which is a dialog version of the popup.
Meaningfully different to ask for a new component
## Screenshots
