Auto merge of #2037 - Turbo87:x-select, r=locks

Replace `<XSelect>` component with regular `<select>` element

We've only been using `XSelect` in one specific place and v3 of the addon was causing deprecation warnings due to their use of the `this.$()` API.

Since we were not using any of the more advanced features from `XSelect` it was relatively straight-forward to replace with just a regular `<select>` element.

r? @locks

Author: bors

app/controllers/crates.js

@@ -25,4 +25,10 @@ export default Controller.extend(PaginationMixin, {
       return 'Alphabetical';
     }
   }),
+
+  actions: {
+    handleSelection(event) {
+      this.set('letter', event.target.value);
+    },
+  },
 });

app/helpers/eq.js

@@ -0,0 +1,7 @@
+import { helper } from '@ember/component/helper';
+
+export function eq([a, b]) {
+  return a === b;
+}
+
+export default helper(eq);

app/templates/crates.hbs

@@ -17,12 +17,12 @@
     </LinkTo>
   {{/each}}
 
-  <XSelect @value={{letter}} @action={{action (mut letter)}} as |xs|>
+  <select {{on "change" (action "handleSelection")}}>
     <option>Filter by the letter...</option>
     {{#each alphabet as |letter|}}
-      <xs.option @value={{letter}}>{{ letter }}</xs.option>
+      <option value={{letter}} selected={{eq letter this.letter}}>{{ letter }}</option>
     {{/each}}
-  </XSelect>
+  </select>
 </div>
 
 <div id='results'>

package-lock.json

@@ -73,7 +73,6 @@
     "ember-svg-jar": "^2.2.3",
     "ember-test-selectors": "^3.0.0",
     "ember-web-app": "^3.0.1",
-    "emberx-select": "^3.1.1",
     "eslint": "^6.8.0",
     "eslint-config-prettier": "^6.7.0",
     "eslint-plugin-ember": "^7.7.2",