Adds date localization to the charts on the analytics page. In doing so,
I have extracted the default locales that we allow the user to set into
constants, so that we can reference it from other places. I have also
sorted the list and added my personal favorite format (ja) to it.
Because we have multiple charts on the analytics page, it felt weird
that only one chart should follow your preferred format. It also aligns
the existing charts' tooltip date format with the new one (`P` instead
of `PPP`).
In short: previously, the charts would show you only your system locale
(I think), which for me defaults to en-US, regardless of what setting
you'd set in your profile. Now we respect your setting as long as it's
one of the default ones.
Before (date formatting is en-US):
<img width="1444" height="1658" alt="image"
src="https://github.com/user-attachments/assets/99a893c7-efb6-4e55-b47c-9df66bf97636"
/>
After (date formatting is sv-SE):
<img width="1383" height="1653" alt="image"
src="https://github.com/user-attachments/assets/d408afd9-a8a7-46f3-8c13-9f7fde608cc4"
/>
Makes it easier to understand what piece of data you're looking at. The
raw date isn't available directly, but we have the formatted version for
the tooltip, so we'll display that.
This PR changes the format to be more in line with the UX sketches (just
numbers and separators instead of words). In theory, it should also be
possible to [adjust the
locale](https://www.npmjs.com/package/chartjs-adapter-date-fns#locale-support-via-scale-options)
(in this case, it should be to the user's chosen locale), but I can't
seem to make that option work. I don't want to spend more time on that
right now, unless we get feedback on it. However, _yes_ the format is
american, and _yes_, that puts months ahead of days. However, you also
have the date in longer form on the x axis, so I think you'll be able to
work it out.
Before:
<img width="279" height="139" alt="image"
src="https://github.com/user-attachments/assets/5c71e708-9d9f-412a-acbb-7d28e5071d5a"
/>
After:
<img width="246" height="154" alt="image"
src="https://github.com/user-attachments/assets/13a4f5b3-281b-4003-8aae-a248578fead8"
/>
The tooltip should show you the ratio of the group and the numbers for
both archived and created.
The tooltip's position is averaged between all the bars in the group.
<img width="335" height="262" alt="image"
src="https://github.com/user-attachments/assets/d62a4bdc-ba07-4eea-8cbf-6e42793804b2"
/>
This still throws the same errors as before. Not sure exactly what's
going on with the custom tooltip, but I'll investigate it in a
follow-up.
Closes 1-4017.
On insights and project status, we would like to show "technica debt"
instead of "health". New value is that of `1/health`, or simplified:
`healthy flags / total flags`
We're migrating to ESM, which will allow us to import the latest
versions of our dependencies.
Co-Authored-By: Christopher Kolstad <chriswk@getunleash.io>
This PR updates the tooltips for the health chart to also include
information on how healthy flags there are. The user could make this
calculation themselves before, but it'd require them to subtract the sum
of stale and potentially stale flags from the total. This makes it so
that they don't have to do the calculation.
I've also included a bar for the healthy flags in the overview, so that
it's easier to see how large a portion it is compared to the others.
Also: clean up some uses of the now-deprecated VFC.
Loading state for
- charts (placeholder data, animation)
- user stats - loading skeleton animation
- empty flags stats
- kept other "stat" widgets as-is, usually not visible
Fills datasets that do not have all the datapoints with 0 so that every
line in the graph starts at the beginning and ends at the end of graph.
Closes #
[1-2256](https://linear.app/unleash/issue/1-2256/fill-the-data-with-0s-so-that-all-x-axis-labels-have-values)
---------
Signed-off-by: andreas-unleash <andreas@getunleash.ai>
Co-authored-by: Tymoteusz Czech <2625371+Tymek@users.noreply.github.com>
