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
. 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 