Bug 1803657 - Save to Pocket sort tag picket datalist by character input. r=gvn

Differential Revision: https://phabricator.services.mozilla.com/D163637

browser/components/pocket/content/panels/js/components/TagPicker/TagPicker.jsx

@@ -138,9 +138,11 @@ function TagPicker(props) {
                 maxlength="25"
               />
               <datalist id="tag-list">
-                {usedTags.map(item => (
-                  <option key={item} value={item} />
-                ))}
+                {usedTags
+                  .sort((a, b) => a.search(inputValue) - b.search(inputValue))
+                  .map(item => (
+                    <option key={item} value={item} />
+                  ))}
               </datalist>
               <button
                 className="stp_tag_picker_button"

browser/components/pocket/content/panels/js/main.bundle.js

@@ -708,7 +708,7 @@ function TagPicker(props) {
     maxlength: "25"
   }), /*#__PURE__*/react.createElement("datalist", {
     id: "tag-list"
-  }, usedTags.map(item => /*#__PURE__*/react.createElement("option", {
+  }, usedTags.sort((a, b) => a.search(inputValue) - b.search(inputValue)).map(item => /*#__PURE__*/react.createElement("option", {
     key: item,
     value: item
   }))), /*#__PURE__*/react.createElement("button", {