Front-End Architecture: Question About What's Possible

[MFBrewster]

Here's what my app looks like:

The product boxes on the left are displayed by a component which is called by a nested route. The box on the right will be where I display my data and line items for each sale/order.

My desired UI is for the user to be able to open a new sale by clicking on a button in the right box, then add products to that sale by clicking on products in the left box. What is the best way to do this? To use helpers? Services? Some kind of global variable declared in the parent route?

Or is this a fool's errand, meaning I will need to refactor my project so that my product data can interact with my order data and line-item data? Any help would be appreciated.

---

This is the parent route template:

{{outlet}}

{{order-window}}

With {{outlet}} displaying different components depending on which nested route is being called. {{outlet}} corresponds to the box on the left in the image above.

[faetea]

https://github.com/funkensturm/ember-local-storage this was the example we were just looking at:

// app/components/like-item.js
import Ember from 'ember';
import { storageFor } from 'ember-local-storage';

export default Ember.Component.extend({
  anonymousLikes: storageFor('anonymous-likes'),

  isLiked: computed('id', function() {
    return this.get('anonymousLikes').contains(this.get('id'));
  }),

  actions: {
    like: function(id) {
      this.get('anonymousLikes').addObject(id);
    }
  }
});

[MFBrewster]

I am going to take a spin with using a new service/storage and seeing where I can get with that. Thank you Allie!

[faetea]

You currently have a storage for Authentication.

Now you need to generate a storage for Cart:

ember g storage anonymous-likes
// will generate a localStorage