ember-computed-promise-monitor
TypeScript icon, indicating that this package has built-in type declarations

0.4.0 • Public • Published

ember-computed-promise-monitor

Build Status Ember Observer Score

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.

Dependencies (4)

Dev Dependencies (33)

Package Sidebar

Install

npm i ember-computed-promise-monitor

Weekly Downloads

0

Version

0.4.0

License

MIT

Unpacked Size

15.1 kB

Total Files

15

Last publish

Collaborators

  • nullvoxpopuli