Last active
February 14, 2021 01:35
-
-
Save neborn/c9bd399953af7f106d5079ce51422c5d to your computer and use it in GitHub Desktop.
Passing Complex Action Arguments
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import Component from '@glimmer/component'; | |
| import { action } from '@ember/object'; | |
| import { inject as service } from '@ember/service'; | |
| export default class ContainerComponent extends Component { | |
| @service | |
| api; | |
| @action | |
| performAsyncAction(willSucceed) { | |
| // This function would likely include additional request and response decoration logic, along with possibly its own side effects. | |
| return this.api.makeCall(willSucceed); | |
| } | |
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import Component from '@glimmer/component'; | |
| import { action } from '@ember/object'; | |
| import { tracked } from '@glimmer/tracking'; | |
| export default class extends Component { | |
| @tracked | |
| buttonEnabled = true; | |
| @tracked | |
| errorMessage = ''; | |
| @tracked | |
| successMessage = ''; | |
| @action | |
| async handleClick(resolve = true) { | |
| this.errorMessage = ''; | |
| this.successMessage = ''; | |
| this.buttonEnabled = false; | |
| try { | |
| await this.args.onClick(resolve); | |
| } catch (e) { | |
| if (!this.isDestroying && !this.isDestroyed) { | |
| this.errorMessage = 'All your error are belong to us'; | |
| } | |
| return; | |
| } finally { | |
| if (!this.isDestroying && !this.isDestroyed) { | |
| this.buttonEnabled = true; | |
| } | |
| } | |
| if (this.isDestroying || this.isDestroyed) { | |
| return; | |
| } | |
| this.successMessage = 'It worked!'; | |
| } | |
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import Service from '@ember/service'; | |
| import { action } from '@ember/object'; | |
| const TIMEOUT = 1000; | |
| export default class ApiService extends Service { | |
| @action | |
| makeCall(willSucceed) { | |
| return new Promise((resolve, reject) => { | |
| const callback = willSucceed ? | |
| () => resolve([true, 200]) : | |
| () => reject([false, 500]); | |
| setTimeout(callback, TIMEOUT); | |
| }); | |
| } | |
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| { | |
| "version": "0.17.1", | |
| "EmberENV": { | |
| "FEATURES": {}, | |
| "_TEMPLATE_ONLY_GLIMMER_COMPONENTS": false, | |
| "_APPLICATION_TEMPLATE_WRAPPER": true, | |
| "_JQUERY_INTEGRATION": true | |
| }, | |
| "options": { | |
| "use_pods": false, | |
| "enable-testing": false | |
| }, | |
| "dependencies": { | |
| "jquery": "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.js", | |
| "ember": "3.18.1", | |
| "ember-template-compiler": "3.18.1", | |
| "ember-testing": "3.18.1" | |
| }, | |
| "addons": { | |
| "@glimmer/component": "1.0.0" | |
| } | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment