Add configurable lookup path for chart options

[marisawallace]

Here's my use case:

I want to extend EmberChart to create individual components in my app with hardcoded defaults depending on the chart type, display options, etc.

At the moment, there's no way to do this without changing the API of those components (which would be confusing), since, as far as I know, there's no clean way to add a layer of indirection between the 'options' attr set on the component, and what EmberChart sees when it goes to render the chart.

By providing an 'optionsPath' option, I can change where EmberChart looks up the options, and create a computed property in my subclass at that path, like the following:

  optionsPath: 'modifiedOptions',

  modifiedOptions: Ember.computed('options', function() {
    const options = _.clone(this.get('options'));
    // Do something with the options passed in via the template...
    return options;
  }),

[aomran]

Maybe I'm not understanding the use-case but can't you set a computed property somewhere and pass it to the component? In the tests and dummy app for example you'll see that there are a few computed properties that give us dynamic "data".

[marisawallace]

@aomran thanks for the reply! I took a look at the dummy app in the repo. To the best of my understanding:

Yes, I could set a computed property somewhere and pass it to the Component. But then I need to manage that CP outside the Component.

Here's what I'd like to do:

import EmberChart from 'shearwater/components/ember-chart';

export default EmberChart.extend({

  optionsPath: 'modifiedOptions',

  modifiedOptions: Ember.computed('options', function() {
    const options = _.clone(this.get('options'));
    // Do something with the options passed in via the template...
    return options;
  }),

});

Right now, the EmberChart Component reads from the 'options' attr directly. I can't create a CP at that path within a subclass of the EmberChart Component because it will be overwritten by whatever gets passed in as 'options' for the Component.

I want to add a layer of indirection within the Component itself, while preserving the same API.

Right now, I need to create a wrapper Component around ember-chart, which then just uses ember-chart in its template. Does that make senese?