How to use @uirouter/core - 10 common examples

beforeEach(function() {
    jasmine.addCustomEqualityTester(equalityTester);
    jasmine.DEFAULT_TIMEOUT_INTERVAL = 1000;

    router = new UIRouter();
    router.plugin(servicesPlugin);
    router.plugin(memoryLocationPlugin);
    $stickyState = router.plugin(StickyStatesPlugin);
    router.urlService.rules.otherwise('/');

    // ui-router-core doesn't have a default views builder
    router.stateRegistry.decorator('views', function(state, parentFn) {
      if (isObject(state.views)) {
        return Object.keys(state.views).map(
          key => ({ $name: key, $uiViewName: key, $uiViewContextAnchor: state.name, $type: 'core', $context: state }),
          []
        );
      }

      return [
        {

export function routerConfigFn(router: UIRouter): void {
	router.trace.enable(Category.TRANSITION);
	// Enable UI-Router visualizer here if needed (for development purposes only)
	// if (ENV === "development") {
	// 	router.plugin(Visualizer);  // Visualizer should be imported from "@uirouter/visualizer"
	// }
}

export function routerConfigFn(router: UIRouter): void {
	router.trace.enable(Category.TRANSITION);
	// Enable UI-Router visualizer here if needed (for development purposes only)
	// if (ENV === "development") {
	// 	router.plugin(Visualizer);  // Visualizer should be imported from "@uirouter/visualizer"
	// }
}

onTransitionError(transition: Transition) {
        // Clear state loading bar. Ignore parent states (type is SUPERSEDED) as child states will load next.
        if (transition.error().type !== RejectType.SUPERSEDED) {
            clearTimeout(this.stateLoaderTimeout);
            this.stateLoaderTimeout = null;
            this.loadingService.resolveAll(STATE_LOADER);
        }
    }
}

onTransitionError(transition: Transition) {
        // Clear state loading bar. Ignore parent states (type is SUPERSEDED) as child states will load next.
        if (transition.error().type !== RejectType.SUPERSEDED) {
            clearTimeout(this.stateLoaderTimeout);
            this.stateLoaderTimeout = null;
            this.loadingService.resolveAll(STATE_LOADER);
        }
    }
}

You may obtain a copy of the License at

 http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.

*/

import * as routerCore from '@uirouter/core';
import {dedupingMixin} from '@polymer/polymer/lib/utils/mixin.js';

let uirouter = new routerCore.UIRouter();
uirouter.viewService.uiviewcount = 0;
uirouter.viewService.viewconfigcount = 0;

// Create an internal ViewConfig representation from a state.views object
function viewConfigFactory(pathnodes, viewDeclaration) {
    let config = {
        $id: uirouter.viewService.viewconfigcount++,
        path: pathnodes,
        viewDecl: viewDeclaration,
        loaded: true,
        load: function () {
            return Promise.resolve()
        }
    };

    return [config];

forEach(viewsDefinitionObject, function(config, name) {
    name = name || '$default'; // Account for views: { "": { template... } }
    if (Object.keys(config).length == 0) return;

    config.$type = 'react';
    config.$context = state;
    config.$name = name;

    let normalized = ViewService.normalizeUIViewTarget(config.$context, config.$name);
    config.$uiViewName = normalized.uiViewName;
    config.$uiViewContextAnchor = normalized.uiViewContextAnchor;

    views[name] = config;
  });
  return views;

forEach(viewsDefinitionObject, function(config, name) {
    name = name || '$default'; // Account for views: { "": { template... } }
    if (Object.keys(config).length == 0) return;

    config.$type = 'react';
    config.$context = state;
    config.$name = name;

    let normalized = ViewService.normalizeUIViewTarget(
      config.$context,
      config.$name,
    );
    config.$uiViewName = normalized.uiViewName;
    config.$uiViewContextAnchor = normalized.uiViewContextAnchor;

    views[name] = config;
  });
  return views;

let views = {},
    viewsDefinitionObject;
  if (!state.views) {
    viewsDefinitionObject = { $default: pick(state, ['component']) };
  } else {
    viewsDefinitionObject = map(
      state.views,
      (val: any, key) => {
        if (val.component) return val;
        return { component: val };
      },
      viewsDefinitionObject,
    );
  }

  forEach(viewsDefinitionObject, function(config, name) {
    name = name || '$default'; // Account for views: { "": { template... } }
    if (Object.keys(config).length == 0) return;

    config.$type = 'react';
    config.$context = state;
    config.$name = name;

    let normalized = ViewService.normalizeUIViewTarget(
      config.$context,
      config.$name,
    );
    config.$uiViewName = normalized.uiViewName;
    config.$uiViewContextAnchor = normalized.uiViewContextAnchor;

    views[name] = config;
  });

export function reactViewsBuilder(state: StateObject) {
  let views = {},
    viewsDefinitionObject;
  if (!state.views) {
    viewsDefinitionObject = { $default: pick(state, ['component']) };
  } else {
    viewsDefinitionObject = map(state.views, (val: any, key) => {
      if (val.component) return val;
      return { component: val };
    });
  }

  forEach(viewsDefinitionObject, function(config, name) {
    name = name || '$default'; // Account for views: { "": { template... } }
    if (Object.keys(config).length == 0) return;

    config.$type = 'react';
    config.$context = state;
    config.$name = name;

    let normalized = ViewService.normalizeUIViewTarget(config.$context, config.$name);
    config.$uiViewName = normalized.uiViewName;
    config.$uiViewContextAnchor = normalized.uiViewContextAnchor;

    views[name] = config;
  });
  return views;
}