From b649738718fb62632574530392299f9aa9bbf53b Mon Sep 17 00:00:00 2001
From: Dan Brown <ssddanbrown@googlemail.com>
Date: Fri, 27 Jan 2023 17:06:39 +0000
Subject: [PATCH] Made book-sort changes based on screen reader testing

- Removed having sort items in tabbing order since they have no action.
- Updated "show other books" list to add upon single selection since it
  was not clear how these were added (double press) without then seeing
the add button, and even then the add button would be after the scroll
list.
---
 resources/js/components/book-sort.js                   |  7 +++++--
 resources/js/components/entity-selector.js             | 10 ----------
 resources/sass/styles.scss                             |  7 -------
 resources/views/books/parts/sort-box-actions.blade.php |  1 +
 resources/views/books/parts/sort-box.blade.php         |  4 ++--
 resources/views/books/sort.blade.php                   |  2 +-
 resources/views/entities/selector.blade.php            |  6 ------
 7 files changed, 9 insertions(+), 28 deletions(-)

diff --git a/resources/js/components/book-sort.js b/resources/js/components/book-sort.js
index e8ecd49a4..6e56e43a5 100644
--- a/resources/js/components/book-sort.js
+++ b/resources/js/components/book-sort.js
@@ -158,7 +158,7 @@ export class BookSort extends Component {
         this.setupSortPresets();
         this.setupMoveActions();
 
-        window.$events.listen('entity-select-confirm', this.bookSelect.bind(this));
+        window.$events.listen('entity-select-change', this.bookSelect.bind(this));
     }
 
     /**
@@ -260,7 +260,10 @@ export class BookSort extends Component {
                 animation: 150,
                 fallbackOnBody: true,
                 swapThreshold: 0.65,
-                onSort: this.updateMapInput.bind(this),
+                onSort: () => {
+                    this.updateMapInput();
+                    this.updateMoveActionStateForAll();
+                },
                 dragClass: 'bg-white',
                 ghostClass: 'primary-background-light',
                 multiDrag: true,
diff --git a/resources/js/components/entity-selector.js b/resources/js/components/entity-selector.js
index 1384b33a9..09d14b233 100644
--- a/resources/js/components/entity-selector.js
+++ b/resources/js/components/entity-selector.js
@@ -15,7 +15,6 @@ export class EntitySelector extends Component {
         this.searchInput = this.$refs.search;
         this.loading = this.$refs.loading;
         this.resultsContainer = this.$refs.results;
-        this.addButton = this.$refs.add;
 
         this.search = '';
         this.lastClick = 0;
@@ -43,15 +42,6 @@ export class EntitySelector extends Component {
             if (event.keyCode === 13) event.preventDefault();
         });
 
-        if (this.addButton) {
-            this.addButton.addEventListener('click', event => {
-                if (this.selectedItemData) {
-                    this.confirmSelection(this.selectedItemData);
-                    this.unselectAll();
-                }
-            });
-        }
-
         // Keyboard navigation
         onChildEvent(this.$el, '[data-entity-type]', 'keydown', (e, el) => {
             if (e.ctrlKey && e.code === 'Enter') {
diff --git a/resources/sass/styles.scss b/resources/sass/styles.scss
index 398d16fac..e50a2f96a 100644
--- a/resources/sass/styles.scss
+++ b/resources/sass/styles.scss
@@ -187,13 +187,6 @@ $loadingSize: 10px;
     height: 400px;
     padding-top: $-l;
   }
-  .entity-selector-add button {
-    margin: 0;
-    display: block;
-    width: 100%;
-    border: 0;
-    border-top: 1px solid #DDD;
-  }
   &.compact {
     font-size: 10px;
     .entity-item-snippet {
diff --git a/resources/views/books/parts/sort-box-actions.blade.php b/resources/views/books/parts/sort-box-actions.blade.php
index cd5a59e15..3796ffafb 100644
--- a/resources/views/books/parts/sort-box-actions.blade.php
+++ b/resources/views/books/parts/sort-box-actions.blade.php
@@ -5,6 +5,7 @@
             title="{{ trans('entities.books_sort_move_down') }}">@icon('chevron-down')</button>
     <div class="dropdown-container" component="dropdown">
         <button refs="dropdown@toggle"
+                type="button"
                 title="{{ trans('common.more') }}"
                 class="icon-button p-xs text-bigger"
                 aria-haspopup="true"
diff --git a/resources/views/books/parts/sort-box.blade.php b/resources/views/books/parts/sort-box.blade.php
index ca034a880..03998e261 100644
--- a/resources/views/books/parts/sort-box.blade.php
+++ b/resources/views/books/parts/sort-box.blade.php
@@ -26,7 +26,7 @@
                 data-name="{{ $bookChild->name }}"
                 data-created="{{ $bookChild->created_at->timestamp }}"
                 data-updated="{{ $bookChild->updated_at->timestamp }}"
-                tabindex="0">
+                tabindex="-1">
                 <div class="flex-container-row items-center">
                     <div class="text-muted sort-list-handle px-s py-m">@icon('grip')</div>
                     <div class="entity-list-item px-none no-hover">
@@ -47,7 +47,7 @@
                                 data-id="{{$page->id}}" data-type="page"
                                 data-name="{{ $page->name }}" data-created="{{ $page->created_at->timestamp }}"
                                 data-updated="{{ $page->updated_at->timestamp }}"
-                                tabindex="0">
+                                tabindex="-1">
                                 <div class="text-muted sort-list-handle px-s py-m">@icon('grip')</div>
                                 <div class="entity-list-item px-none no-hover">
                                     <span>@icon('page')</span>
diff --git a/resources/views/books/sort.blade.php b/resources/views/books/sort.blade.php
index b778398a8..c82ad4e3b 100644
--- a/resources/views/books/sort.blade.php
+++ b/resources/views/books/sort.blade.php
@@ -41,7 +41,7 @@
                     <h2 class="list-heading">{{ trans('entities.books_sort_show_other') }}</h2>
                     <p class="text-muted">{{ trans('entities.books_sort_show_other_desc') }}</p>
 
-                    @include('entities.selector', ['name' => 'books_list', 'selectorSize' => 'compact', 'entityTypes' => 'book', 'entityPermission' => 'update', 'showAdd' => true])
+                    @include('entities.selector', ['name' => 'books_list', 'selectorSize' => 'compact', 'entityTypes' => 'book', 'entityPermission' => 'update'])
 
                 </main>
             </div>
diff --git a/resources/views/entities/selector.blade.php b/resources/views/entities/selector.blade.php
index 45fae4707..a9f5b932c 100644
--- a/resources/views/entities/selector.blade.php
+++ b/resources/views/entities/selector.blade.php
@@ -8,11 +8,5 @@
         <input refs="entity-selector@search" type="text" placeholder="{{ trans('common.search') }}" @if($autofocus ?? false) autofocus @endif>
         <div class="text-center loading" refs="entity-selector@loading">@include('common.loading-icon')</div>
         <div refs="entity-selector@results"></div>
-        @if($showAdd ?? false)
-            <div class="entity-selector-add">
-                <button refs="entity-selector@add" type="button"
-                        class="button outline">@icon('add'){{ trans('common.add') }}</button>
-            </div>
-        @endif
     </div>
 </div>
\ No newline at end of file