Update syntax for ember-concurrency tasks; convert search service to native class

Author: kategengler

app/components/search-input.js

@@ -2,7 +2,7 @@ import { inject as service } from '@ember/service';
 import Component from '@glimmer/component';
 import { get } from '@ember/object';
 import { isPresent } from '@ember/utils';
-import { task, timeout } from 'ember-concurrency';
+import { restartableTask, task, timeout } from 'ember-concurrency';
 import { action } from '@ember/object';
 import { tracked } from '@glimmer/tracking';
 
@@ -32,8 +32,8 @@ export default class SearchInput extends Component {
     return isPresent(this.query);
   }
 
-  @task({ restartable: true }) *search(query) {
-    yield timeout(SEARCH_DEBOUNCE_PERIOD);
+  search = restartableTask(async (query) => {
+    await timeout(SEARCH_DEBOUNCE_PERIOD);
 
     this.query = query;
 
@@ -46,14 +46,14 @@ export default class SearchInput extends Component {
     // ensure search results are visible if the menu was previously closed above
     this._focused = true;
 
-    yield get(this, 'searchService.search').perform(query);
-  }
+    await get(this, 'searchService.search').perform(query);
+  });
 
-  @task *closeMenu() {
-    yield timeout(SEARCH_CLOSE_PERIOD);
+  closeMenu = task(async () => {
+    await timeout(SEARCH_CLOSE_PERIOD);
 
     this._focused = false;
-  }
+  });
 
   @action onfocus() {
     if (this.query.length > 0 && this.searchService.hasStaleResults()) {

app/services/search.js

@@ -1,20 +1,22 @@
 import Service, { inject as service } from '@ember/service';
-import { task } from 'ember-concurrency';
+import { restartableTask } from 'ember-concurrency';
 import { set } from '@ember/object';
 import { A as emberArray } from '@ember/array';
+// eslint-disable-next-line ember/no-computed-properties-in-native-classes
 import { alias } from '@ember/object/computed';
 
-export default Service.extend({
-  _algoliaService: service('algolia'),
-  _projectService: service('project'),
-  _projectVersion: alias('_projectService.version'),
+export default class SearchService extends Service {
+  @service('algolia') _algoliaService;
+  @service('project') _projectService;
+
+  @alias('_projectService.version') _projectVersion;
 
   /** @type {?string} */
-  _lastQueriedProjectVersion: null,
+  _lastQueriedProjectVersion = null;
 
-  results: emberArray(),
+  results = emberArray();
 
-  search: task(function* (query) {
+  search = restartableTask(async (query) => {
     const projectVersion = this._projectVersion;
 
     const params = {
@@ -35,14 +37,14 @@ export default Service.extend({
 
     this._lastQueriedProjectVersion = projectVersion;
 
-    return set(this, 'results', yield this.doSearch(searchObj, params));
-  }).restartable(),
+    return set(this, 'results', await this.doSearch(searchObj, params));
+  });
 
   doSearch(searchObj, params) {
     return this._algoliaService
       .search(searchObj, params)
       .then((results) => results.hits);
-  },
+  }
 
   /**
    * Whenever the version changes in service:project, the results in this
@@ -55,9 +57,9 @@ export default Service.extend({
       this._lastQueriedProjectVersion !== null &&
       this._projectVersion !== this._lastQueriedProjectVersion
     );
-  },
+  }
 
   clearResults() {
     set(this, 'results', emberArray());
-  },
-});
+  }
+}

ember-cli-build.js

@@ -30,7 +30,15 @@ module.exports = function (defaults) {
     },
     'ember-cli-babel': {
       includePolyfill: true,
-    }
+    },
+    babel: {
+      plugins: [
+        // ... any other plugins
+        require.resolve('ember-concurrency/async-arrow-task-transform'),
+
+        // NOTE: put any code coverage plugins last, after the transform.
+      ],
+    },
   });
 
   const { Webpack } = require('@embroider/webpack');