Archived!

This library is no longer needed in modern projects. For tracking promise state, you may use ember-async-data or trackedFunction

ember-computed-promise-monitor

This provides the ability to manage async behavior with computed properties as a light-weight alternative to, or in conjunction with ember-concurrency.

Compatibility

• Ember.js v2.18 or above
• Ember CLI v2.13 or above

Installation

ember install ember-computed-promise-monitor

Usage

import Component from '@ember/component';
import { PromiseMonitor } from 'ember-computed-promise-monitor';
import { reads } from '@ember-decorators/object/computed';

export default class MyComponent extends Component {
  // all the properties on the PromiseMonitor can be dependent keys of
  // other computed properties
  @reads('postName.isFulfilled') didSucceed;
  @reads('postName.isRejected') didFail;
  @reads('postName.isPending') isPending;
  @reads('postName.error') postNameError;
  @reads('postName.result') theNameOfThePost;
  
  @computed()
  get postName() {
    const promise = (async function() {
      const record = await this.store.findRecord('post', this.someId);

      resolve(record.name);
    })();

    return new PromiseMonitor(promise);
  }
}

{{#if postName.isPending}}
  Loading...
{{else}}
  {{postName.result}}
{{/if}}

or with a decorator:

import { monitor } from 'ember-computed-promise-monitor';

// ...

  @computed()
  @monitor
  get postName() {
    return this.store
      .findRecord('post', this.someId)
      .then(post => post.name);
  }

---

How is this different from PromiseProxy?

You can get similar functionality by using PromiseProxyMixin:

import { resolve } from 'rsvp';
import ObjectProxy from '@ember/object/proxy';
import PromiseProxyMixin from '@ember/object/promise-proxy-mixin';

let ObjectPromiseProxy = ObjectProxy.extend(PromiseProxyMixin);

let proxy = ObjectPromiseProxy.create({
  promise: somePromise.then(data => ({ result: data }))
});

{{#if postName.isPending}}
  Loading...
{{else}}
  {{postName.result}}
{{/if}}

The key differences are that the PromiseProxyMixin:

• proxies all properties to the resolved value
• uses content for the resulting value, which may be confusing (and is undocumented)
• throws an exception on promise rejection. PromiseMonitor sets the error on the error property.

License

This project is licensed under the MIT License.