Data Architecture Critique

@andrewcallahan wrote:

My app’s layout has a header, main section, and an optional footer.

Here is application.hbs

{{nav-bar}}
<section class="main">
  {{outlet}}
</section>
{{#if displayFooter}}
  {{nav-footer}}
{{/if}}

In the, /company Route, I load a lot of relational data - a company’s employees, a company’s store locations, etc. However, I need to use that data in the header and footer - which being adjacent HTML elements to the company template I can’t easily do. Furthermore, the data needs to be synchronized - if I add or remove a store from the company template, that needs to be reflected in the header and footer too.

I’ve accomplished this by making a navigationService and setting all the queries in the model of /companies Route to the service:

afterModel(resolvedModel, transition){
  this.navigationService.setProperties({
    company: resolvedModel.company,
    employees: resolvedModel.employees,
    stores: resolvedModel.stores,
    ...
  });
}

Then, I use navigationService.company instead of model.company in the company template, and now have access to this data in both the header and footer.

What I’m looking for is a critique of this data architecture. Is there something better I could be doing? Did I make a mistake by putting the header/footer outside the outlet in application.hbs? Am I missing something else? Or is this really the optimal way to do what I’m trying to?

Thanks!

Posts: 3

Participants: 3

Read full topic