Search panel closes with transition when clicking "X" but not when pressing Escape

[robertknight]

The search panel (currently behind a flag) can be closing by pressing Esc when the panel has focus or via the "X" button on the right. Clicking the "X" on the right results in the panel hiding with a transition. Pressing Esc causes the panel to instantly disappear with no transition.

The expected behavior is that there should be a transition in both cases.

The reason for the difference is that when clicking the "X", the Dialog component internally initiates the transition before notifying its parent via onClose. When pressing Esc however we immediately update state to close the sidebar panel, which prevents Dialog from getting a chance to initiate the transition. A possible solution would be for Dialog to expose a handle with a close method that triggers the close transition in the normal way.

[acelaya]

The root cause is the same causing #5520

A possible solution would be for Dialog to expose a handle with a close method that triggers the close transition in the normal way.

We considered this some time ago hypothesis/frontend-shared#1178

I think I even created a POC, but I guess I had to park it due to other priorities.

[victuseze]

Hi robertKnight, I would like to work on this.

[mustafaazad03]

Hi @robertknight & @acelaya, Can I try to solve this issue?

[acelaya]

Thanks for the interest!

This issue is a bit more complex than it might seem and has some implications. We need to put a bit more thinking on it to see where it fits in the grand scheme of things, before we can prioritize it.

We'll share more information as soon as we have it.