Hide inserter's block preview when searching #23827
Conversation
ntsekouras
added
[Type] Bug
|
I wonder if the right fix is more "call setHoveredItem( null )" when the hovered element gets "unmounted" as searching is just one way of unmounting the block element. That said, I'm not sure how simple is it to implement. |
|
Size Change: +16 B (0%) Total Size: 1.14 MB
ℹ️ View Unchanged
|
|
Hey @youknowriad ! If we start typing, even if the previous block is still in the filtered list, it doesn't help us on selecting it, since the block has no focus and we cannot select it ( by pressing We can only select a block by clicking it or with So in general I'm not sure if there is any value to the user to see a previous hovered block's Preview. What do you think? |
|
I agree that when searching, even if we're hovering the block, it's not that important to show the preview but I'm more thinking if there are other interactions where the preview can linger because the "onMouseOut" event don't trigger. For example:
|
You are right about that! I'll look into it |
ntsekouras
force-pushed
the
fix/hide-inserter-block-preview-when-typing
branch
from
bcdf0c7 to
e8456ff
Compare
|
Hey @youknowriad! What do you think of this approach? |
| @@ -106,6 +108,9 @@ export function BlockTypesTab( { | |||
| return result; | |||
| }, [ filteredItems, collections ] ); | |||
|
|
|||
| // hide block preview on unmount | |||
| useEffect( () => () => onUnmount(), [] ); | |||
There was a problem hiding this comment.
Shouldn't we just call onHover( null ) here instead of a new prop?
There was a problem hiding this comment.
Yes! Thank you @youknowriad. I was thinking at first to have a handler for unMount, but since it can be achieved internally, there is no need for the extra prop for now.
Description
Fixes #23596
When searching for blocks to use, from the inserter menu, hovering over a block button shows a preview.
If we start typing/searching, the preview stays visible and If no blocks are found, there's no way to reset the hovered item, so the preview can't close.
Details steps to reproduce are in the related issue #23596
Checklist: