1
0
mirror of https://github.com/Unleash/unleash.git synced 2025-05-08 01:15:49 +02:00
Commit Graph

12 Commits

Author SHA1 Message Date
Thomas Heartman
4f30ce7155
chore(1-3349): no border for event timeline / dropdowns to the right (#9252)
Removes the border between the accordion summary and its contents for
the event timeline, and moves dropdown selectors to the right to avoid
overcrowding on the left.


![image](https://github.com/user-attachments/assets/b0df4c11-8e61-46f8-b844-349a709bd4e9)
2025-02-07 11:11:54 +01:00
Thomas Heartman
56c9584bb6
feat: move timeline to panel (#9243)
Moves the event timeline to the personal dashboard from the header when
the `frontendHeaderRedesign` flag is active.

When the flag is active, it also:
- hides the event timeline and corresponding button in the header
- renders the environment selector next to the time selector instead of
at the other end of the header


![image](https://github.com/user-attachments/assets/cccd8f07-d42a-4180-807f-20937019442d)

---------

Co-authored-by: Nuno Góis <github@nunogois.com>
2025-02-06 13:55:59 +00:00
Nuno Góis
f669d9622e
fix: console warnings and errors related to event timeline and strategy form (#8692)
Fixes browser console warnings and errors related to the event timeline
and strategy form.

- **Event Timeline**: Addressed a warning where the environment filter
rendered with a default environment value (production) before
environments were fully loaded.
- **Strategy Form**: Resolved an error caused by forwarding the enabled
prop as a boolean.
2024-11-08 08:18:30 +00:00
Nuno Góis
864984e212
chore: better show hide event timeline tooltips (#8379)
https://linear.app/unleash/issue/2-2753/improve-current-showhide-tooltips-to-be-more-specific-about-the

Improves the "show" and "hide" tooltips of this feature to have a
slightly more specific text. This is not just any timeline, this is the
**event timeline**.

- "Hide timeline" -> "Hide event timeline"
- "Show timeline" -> "Show event timeline"
2024-10-07 12:40:47 +01:00
David Leek
0653800cb8
chore: plausible event for event timeline signals tip click (#8349) 2024-10-03 15:35:34 +02:00
Nuno Góis
401425e35c
chore: event timeline help icon (#8345)
https://linear.app/unleash/issue/2-2717/help-icon-in-the-event-timeline-component

Adds an help icon to the event timeline.

<img width="108" alt="image"
src="https://github.com/user-attachments/assets/261fd14a-4d33-4bae-ae2e-92d1dc47db6b">

<img width="332" alt="image"
src="https://github.com/user-attachments/assets/85c827d1-39e9-47ef-9602-7f2ea207e5ea">
2024-10-03 08:45:24 +01:00
David Leek
9b1d9f57d3
chore: timeline plausible tracking (#8338) 2024-10-03 07:58:58 +02:00
Nuno Góis
836adf52a1
chore: event timeline signals tip (#8342)
https://linear.app/unleash/issue/2-2723/add-signals-tip

Adds a tip to the event timeline regarding the usage of signals.

The conditions for it to show up are the following:
- `!signalsSuggestionSeen` - The current user has not closed the tip yet
- `isEnterprise()` - The Unleash instance is an Enterprise instance
(signals are currently Enterprise-only)
- `isAdmin` - The current user is an admin (signals are currently
admin-only)
 - `signalsEnabled` - The signals feature flag is currently enabled
- `!loading` - Signal endpoints have not finished loading (prevents
flickering)
- `signalEndpoints.length === 0` - The Unleash instance currently has
zero configured signal endpoints (signals feature is not being used)


![image](https://github.com/user-attachments/assets/8dd73e62-a341-4d12-97b1-4e011f7891c3)
2024-10-02 14:47:07 +01:00
Nuno Góis
5dae654022
refactor: implement an event timeline context and provider (#8321)
https://linear.app/unleash/issue/2-2730/refactor-the-event-timeline-state-management-to-a-context-and-provider

This PR refactors the state management for the **Event Timeline**
component by introducing a context and provider to improve accessibility
of state across the component tree.
2024-10-01 16:21:31 +01:00
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.


![image](https://github.com/user-attachments/assets/b911696e-1a50-4968-9b73-b01af626d44e)

---------

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;


![image](https://github.com/user-attachments/assets/1716d8c0-e491-47cc-895b-e02d019c9e80)

![image](https://github.com/user-attachments/assets/a1b5c6b9-86d6-43f7-8a36-5661625e41d6)

(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

![image](https://github.com/user-attachments/assets/b0649d7b-c6c2-482f-918f-b35b23184578)
 - Environment

![image](https://github.com/user-attachments/assets/33c788d6-9d76-4afd-b921-3c81eda4e1c5)

Here are a few more screenshots, with the different time spans (zooming
out, since we're increasing the time span):


![image](https://github.com/user-attachments/assets/16003a67-039e-43ad-a4db-617f96ec5650)

![image](https://github.com/user-attachments/assets/6d50b53f-1fc0-4e07-96a6-6843629ecb2d)

![image](https://github.com/user-attachments/assets/e6cc6b10-ff02-44db-82d5-346fba8eb681)

![image](https://github.com/user-attachments/assets/1181b8d7-a951-4e5a-aa5b-bd9fdbd16a7a)

![image](https://github.com/user-attachments/assets/7a43c5a0-c51c-4861-952a-2c09968263d6)

![image](https://github.com/user-attachments/assets/5bfda117-5524-435b-b0d1-a8b1bd446a36)

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