-
Notifications
You must be signed in to change notification settings - Fork 4.5k
Description
We have a lot of similar issues, all around improving the inserter for mobile. Having one issue we can focus on will help get this solved.
The mobile experience for inserting right now has a number of issues and one solution is to reduce this to a single inserter. There are a number of tickets to reflect on for this:
- Adding block is impossible when window width is less than 780px Adding block is impossible when window witdh is less than 780px #2471
- Inserter block takes over screen Inserter block takes over screen #2672
- Blocks Menu Opens Incorrectly on iOS Portrait Blocks Menu Opens Incorrectly on iOS Portrait #1280
- Cannot insert new blocks in iOS Safari Cannot insert new blocks in iOS Safari #2602
(Note: closing those tickets to focus here)
Technical issues around this are summarised [here] by @aduth (#2602 (comment)):
It's a tricky problem to solve because the Popover component has built-in logic to try to flip itself when exceeding bounds, but doesn't yet have the ability to know how to handle the case where there is no suitable position to open.
In my mind, I'm thinking one or more of:
The inserter menu probably shouldn't have offset 100vh height for the content inserter
If we encounter the case where no suitable position exists, we should at least set a max height/width of the popover to ensure it doesn't go offscreen, then allow remaining content to be scrollable
Edit: Another, perhaps more preferable option, is to treat the inserter as a full-page modal in mobile contexts, not "attached" to the specific anchor node.
Ultimately, we need a solution that solves all these issues. My thoughts are a single inserter is the way to go. I would recommend it being the top one, but discussion and ideas are important around this. We are not going to get far in mobile testing without this being fixed.