[ui] adding new page accessible by header nav

Rancher 1.x
1

Hello,

I’m new to Emberjs and i’m not sure to understand how to customize the UI of rancher.
I’d like to add a custom page accessible by header navigation. As I can read it is recommended to use ember-cli addon instead of forking project and i do agree for this.
The point is I dont figure out how to add an entry to the router, then to the app/components/page-header/template.hbs

Any kind of help is welcome ( example, documentation, … ).
Thanks in advance.

2

There isn’t really any built-in extensibility, so anything you want to customize generally needs a hook to be added to rancher/ui. We will take PRs for generally-useful customization hooks.

I snuck one in for adding arbitrary routes, so you can do that in master or 1.0.1 with an initializer in your addon:

# app/initializers/my-addon-initializer.js
import { addRoutes } from 'ui/utils/additional-routes';

export function initialize(/*container, application*/) {
  addRoutes(function() {
    this.route('hello');
    this.route('foo', function() {
      this.route('bar', function() {
        this.route('baz', function() {
        });
      });
    });
  });
}

export default {
  name: 'my-addon-initializer',
  initialize: initialize
};

Altering the header is not as simple…

3

Thanks a lot, I tried that and it almost work for me.

The problem I encounter is I’d like to stay in the project template level like help page for example and keep header and footer.
I tried a lot of manner to work arround it but it seems the only way to do so is to move the applyRoutes(this); inside this.route('project', {path: '/env/:project_id'}, function() { ... });

My question here is am I right ? and is there a way to do so ?

For the question of the header do you think there is a way to modify the template to read a model or something that i can alter inside my addon. May be we can discuss on the best way to do it then make a PR ?