3 Commits

Author	SHA1	Message	Date
David Leek	729acfd318	chore: timeline ux alignment (#8283) ... https://linear.app/unleash/issue/2-2703/align-with-ux Timeline UI/UX improvements after sync with UX, including: - Added some spacing between each event in the grouping tooltip - Aligned the x events occurred header with filter dropdown - Improved the strategy icon somewhat so it doesn't look as off center - New timeline icon - Improve icon position relative to timestamp on each event in the grouping tooltip - Changed text color in dropdowns to a lighter gray - Removed bold formatting in tooltip - Adjusted paddings and margins - Added close button - Added shadow - Added left border There are a few details missing, which will be tackled in separate PRs.  --------- Co-authored-by: Nuno Góis <github@nunogois.com>	2024-10-01 14:32:54 +01:00
Nuno Góis	a95c8d183f	chore: event timeline persistent state (#8240) ... https://linear.app/unleash/issue/2-2700/persist-timeline-state-in-local-storage Implements persistent state management for the event timeline using local storage. I believe this improves UX by persisting both the timeline toggle (visibility) state and applied filters across page refreshes. Includes some scouting/refactoring and some workarounds to prevent the timeline from animating on page load (in most cases).	2024-09-25 11:20:27 +01:00
Nuno Góis	205b59ddee	chore: event timeline (#8176) ... https://linear.app/unleash/issue/2-2657/implement-a-first-iteration-of-an-horizontal-event-timeline This implements the very first iteration of our event timeline. This is behind a feature flag, which when enabled shows the new timeline at the top of our event log page. It is missing some features, like: - Placement: It should show up as an option in the header, not in the event log; - Tooltip: It should show proper tooltips for all the events that we're displaying; - Grouping: It should group together events that occurred in a short span of time; - Signals: It should show signals along with the events; Here's how it currently looks like, with some example events, in order from left to right: - A flag was disabled more than 30 min ago; - A flag was then enabled; - A segment was updated (didn't have an icon for segments, so I picked one); - A strategy was updated; - A flag was created;   (Time passed since I took the first screenshot, so you can see the events "moved" to the left slightly in the dark theme screenshot) I have some concerns about the low contrast of `neutral` variant events, especially in dark mode. Maybe we should consider using `error` instead, for red? Or maybe add a border to our event circles? I specifically changed my environment to be "development" for the screenshots. The default selection is the first enabled environment that is `type=production`, which in my case is "production". Here are our filters: - Time Span  - Environment  Here are a few more screenshots, with the different time spans (zooming out, since we're increasing the time span):       Again, when zooming out, some events should be grouped together, but that's a task for later.	2024-09-19 12:14:10 +01:00