Entity selector: Fixed initial load overwriting initial search

This changes how initial searches can be handled via config rather than
specific action so they can be considered in how the initial data load
is done, to prevent the default empty state loading and overwriting the
search data if it lands later (which was commonly likely).

For #4778

Author: ssddanbrown

resources/js/components/entity-selector-popup.js

@@ -18,18 +18,13 @@ export class EntitySelectorPopup extends Component {
     /**
      * Show the selector popup.
      * @param {Function} callback
-     * @param {String} searchText
      * @param {EntitySelectorSearchOptions} searchOptions
      */
-    show(callback, searchText = '', searchOptions = {}) {
+    show(callback, searchOptions = {}) {
         this.callback = callback;
         this.getSelector().configureSearchOptions(searchOptions);
         this.getPopup().show();
 
-        if (searchText) {
-            this.getSelector().searchText(searchText);
-        }
-
         this.getSelector().focusSearch();
     }
 

resources/js/components/entity-selector.js

@@ -6,6 +6,7 @@ import {Component} from './component';
  * @property entityTypes string
  * @property entityPermission string
  * @property searchEndpoint string
+ * @property initialValue string
  */
 
 /**
@@ -25,6 +26,7 @@ export class EntitySelector extends Component {
             entityTypes: this.$opts.entityTypes || 'page,book,chapter',
             entityPermission: this.$opts.entityPermission || 'view',
             searchEndpoint: this.$opts.searchEndpoint || '',
+            initialValue: this.searchInput.value || '',
         };
 
         this.search = '';
@@ -44,6 +46,7 @@ export class EntitySelector extends Component {
     configureSearchOptions(options) {
         Object.assign(this.searchOptions, options);
         this.reset();
+        this.searchInput.value = this.searchOptions.initialValue;
     }
 
     setupListeners() {
@@ -108,11 +111,6 @@ export class EntitySelector extends Component {
         this.searchInput.focus();
     }
 
-    searchText(queryText) {
-        this.searchInput.value = queryText;
-        this.searchEntities(queryText);
-    }
-
     showLoading() {
         this.loading.style.display = 'block';
         this.resultsContainer.style.display = 'none';
@@ -128,6 +126,11 @@ export class EntitySelector extends Component {
             throw new Error('Search endpoint not set for entity-selector load');
         }
 
+        if (this.searchOptions.initialValue) {
+            this.searchEntities(this.searchOptions.initialValue);
+            return;
+        }
+
         window.$http.get(this.searchUrl()).then(resp => {
             this.resultsContainer.innerHTML = resp.data;
             this.hideLoading();

resources/js/components/page-picker.js

@@ -35,7 +35,8 @@ export class PagePicker extends Component {
         const selectorPopup = window.$components.first('entity-selector-popup');
         selectorPopup.show(entity => {
             this.setValue(entity.id, entity.name);
-        }, '', {
+        }, {
+            initialValue: '',
             searchEndpoint: this.selectorEndpoint,
             entityTypes: 'page',
             entityPermission: 'view',

resources/js/markdown/actions.js

@@ -73,7 +73,8 @@ export class Actions {
             const selectedText = selectionText || entity.name;
             const newText = `[${selectedText}](${entity.link})`;
             this.#replaceSelection(newText, newText.length, selectionRange);
-        }, selectionText, {
+        }, {
+            initialValue: selectionText,
             searchEndpoint: '/search/entity-selector',
             entityTypes: 'page,book,chapter,bookshelf',
             entityPermission: 'view',

resources/js/wysiwyg/config.js

@@ -85,7 +85,8 @@ function filePickerCallback(callback, value, meta) {
                 text: entity.name,
                 title: entity.name,
             });
-        }, selectionText, {
+        }, {
+            initialValue: selectionText,
             searchEndpoint: '/search/entity-selector',
             entityTypes: 'page,book,chapter,bookshelf',
             entityPermission: 'view',

resources/js/wysiwyg/shortcuts.js

@@ -58,7 +58,8 @@ export function register(editor) {
 
             editor.selection.collapse(false);
             editor.focus();
-        }, selectionText, {
+        }, {
+            initialValue: selectionText,
             searchEndpoint: '/search/entity-selector',
             entityTypes: 'page,book,chapter,bookshelf',
             entityPermission: 'view',