Consider using ui-router for application state

[jniles]

The application has never handled state well. For simple cases (do we have a primary cashbox or not?), the controller has often just used an ng-if directly in the HTML to show/hide components. For more complex cases, the controller uses an ng-switch (create/update/success/failure). Admin modules are good examples of these. In the most complex cases, sometimes an ng-switch is coupled with an ng-include and even a new controller is templated in. Receipts is a good example of this condition.

One solution is to use the router to manage state. Our current router (ngRouter) is limited to only directly mapping URLs to individual templates and controllers, 1-1-1. A different project, ui-router allows you to nest controllers and views, so that child states can inherit properties of the parent states, and you can have multiple views on a single page (we currently only have on ng-view).

Advantages of ui-router:

1. Can create easily compose separate states for create/update/views for common CRUD modules (e.g. users, projects, enterprises, locations, etc, ...).
2. Easily nest states (/patients <- /patients/:id <- /patients/:id/groups) to reduce the need for services and extra $http requests.
3. Multiple views!
4. No longer have to depend on the URL to change to switch controllers -- allows us to better encapsulate complex pages.

Dis-advantages of ui-router:

1. No idea how it will compose with Angular 2. They are working on it though.

link.

[DedrickEnc]

@jniles what is the label for this issue?

[jniles]

Not sure. Proposal? Design? Discussion? Something like that.

[sfount]

@IMA-WorldHealth/local-contributors I will investigate what it would mean to transition to UI-router today and report back in this thread.