EvanDAppWrapperComponent

Source dapp-wrapper

top-bar wrapper for DApps that enables:

  • back navigation
  • url routing has as title (dynamic)
  • mailbox alerts
  • queue status

Back navigation is configured within the routes data object. Have a look at routesbuilder buildModule routes.

Outpus

  1. refreshing - EventEmitter<any>: Emitted when the routing data refresh property is set and the reload button is clicked, so the parent module can reload the current component content.

Example

Reference Implementation: Favorites DApp root component

Use the evan-content attribute to specify, which html data should be displayed within the wrapper.

<evan-loading *ngIf="loading" delayLoading="500"></evan-loading>
<dapp-wrapper *ngIf="!loading" #dappWrapper>
  <div evan-content [@routerTransition]="o?.activatedRouteData?.state">
    <router-outlet #o="outlet"></router-outlet>
  </div>
</dapp-wrapper>

View Example

../../_images/dapp-wrapper.png