The right place to put a computed property

I display a list of global events and would like to change an event status icon depending on the following condition:

  • a list of global events is displayed to enable the User to activate/deactivate one or many events for his shop by clicking on one of the list events.
  • the current User has one shop, a Shop has many events. If the event has already been activated by user, its icon should be ‘A’, otherwise the icon should be ‘B’.

I had an initial idea to use a computed property to check if the user’s shop events list contains every of displayed global events by using intersect function. If the choice is correct I wonder what is the right place to put a CP to implement that, - events/index.js controller, event model ? Or may be to use ember-composable-helpers directly in the events/index.hbs template ?

Other solutions and pitfalls ?

Thank you

Anytime you have things that are “global” the first construct that jumps to mind is a service. The global event selection states could be set on the service, you can defined computed properties on a service if you need, etc. Services can also be injected into any controller or component. So if you have a component that renders each current-user-shop-event icon that component could inject the service and use a computed property to look at the service event choices and determine if it is one of them and render the correct icon accordingly.

Basically I think you should keep the “global” event choices on a service and inject it into whatever component /controller is rendering the icons.

1 Like

Thank you, Dan, for the response. Not exactly right :slight_smile:. I never displays Shop events, only global events. The scenario is as follows:

  • a current User clicks on Events link
  • a list of global events is loaded
  • a User’ can already have one or more of these global events selected(activated).
  • when looping on global list events, check if a global event was selected by User. if so, display icon ‘A’, otherwise, display icon ‘B’ for the global event.

I’m not sure if it is clear :slight_smile: