Update "Move Page" interface to allow efficient keyboard navigation

[Biepa]

Describe the feature you'd like
1.) After a click on "Move Page" (I'm using another language, if this isn't the correct translation) a new page opens, where a book etc. can be chosen. I think it would be a good idea, to set the focus on

a) the search field, so you can start searching by typing and then
aa) press enter to confirm, if only one result is displayed
ab) press tab to get to the results and choose with arrow keys

b) the overview under the search field, so maybe the arrow keys could be used to select a book and confirm with enter (The present implementation is using the arrow keys to scroll up or down, but I think, that using the arrow keys for scrolling and then you have to take the mouse to click the book isn't the preferred workflow, for most users)

---

Edit by ssddanbrown: This part has been discussed and re-scoped to #2067 as per comments below.

2.) Moving/Organizing multiple pages isn't that user friendly at the moment, because
a) it's only possible to move one page at a time.
b) after every movement, the moved page is opened and shown at the target location.

It would be nice to move multiple pages and/or set another behavior, after a page was moved.
Maybe show the Book or Chapter, the page was in, before it got moved.

---

If my descriptions are unclear somewhere, please let me know.

Describe the benefits this feature would bring to BookStack users
Improved and faster workflow.

[ssddanbrown]

Thanks for the suggestions @Biepa.

In regards to 1, I agree this view could do with better keyboard navigation. I'm planning on maybe updating many of the JavaScript-driven components soon to might sneak this into that.

For 2, I don't think I'd want to land the user back in the old "parent" location, as that "Move" action revolves around that specific page/chapter, not its parent. Since you've opened #2065 I'm assuming you're aware of the book-sort page? This is generally the location/interface that's intended to make wider-scale/batch changes.

[Biepa]

I just realised, that it's possible to show a second book to drag and drop pages. Never used it before 😅
Of course that's better than the way I was doing it before.

Maybe put the two books side by side or allow multi-select (for "multi-site moving").

[ssddanbrown]

😄

Maybe put the two books side by side or allow multi-select (for "multi-site moving").

Side-by-side would be troublesome since you can actually add as many books as you want to the view, does not need to be just two. Multi-select could work, I'll have a look and see if the underlying drag-n-drop libraries supports multi-select for quick implementation.

Edit, Looks like it does: https://github.com/SortableJS/Sortable/tree/master/plugins/MultiDrag

[ssddanbrown]

Gif kind of messed up so looks strange but this gives an idea:

Can Ctrl+Click for focused multi-select or Shift+Click for ranges.
Will be part of the next patch release.

@Biepa With the above being implemented, Are you okay for me to update the title of this issue to focus on keyboard navigation for the "Move" interface?

[Biepa]

Looks good. Of course edit the title.

[ssddanbrown]

I've updated the move-page component in f36e6d9.

The search bar will now auto-focus and you can use arrow keys to move up/down, enter to select an item, and Ctrl+Enter to submit the form. Item focus has been much more visible for this list to aid this keyboard navigation.

This will be part of the next feature release.