Add example page for demonstrate implementations

src/app/app-routing.module.ts

@@ -33,6 +33,7 @@ import { LoginComponent } from './connect/login/login';
 import { CreateProfileComponent } from './connect/create/create';
 import { EditorBadgesComponent } from './editor-badges/editor';
 import { BadgeComponent } from './badge/badge';
+import { ExampleComponent } from './example/example';
 
 const routes: Routes = [
   {
@@ -245,7 +246,7 @@ const routes: Routes = [
   },
   {
     path: 'about',
-    loadChildren: () => import('./about/about.module').then(m => m.AboutModule)
+    loadChildren: () => import('./about/about.module').then((m) => m.AboutModule),
     // component: AboutComponent,
     // canActivate: [AuthGuard],
     // resolve: {
@@ -284,6 +285,14 @@ const routes: Routes = [
       data: LoadingResolverService,
     },
   },
+  {
+    path: 'example',
+    component: ExampleComponent,
+    canActivate: [AuthGuard],
+    resolve: {
+      data: LoadingResolverService,
+    },
+  },
   {
     path: 'queue',
     component: QueueComponent,

src/app/app.html

@@ -111,6 +111,10 @@
           <mat-icon>construction</mat-icon>
           <span *ngIf="displayLabels">Development</span>
         </a>
+        <a [routerLink]="['/example']" mat-menu-item (click)="toggleMenu()" [routerLinkActiveOptions]="{ exact: true }" routerLinkActive="active">
+          <mat-icon>construction</mat-icon>
+          <span *ngIf="displayLabels">Example</span>
+        </a>
         <a [routerLink]="['/relays']" mat-menu-item (click)="toggleMenu()" [routerLinkActiveOptions]="{ exact: true }" routerLinkActive="active">
           <mat-icon>dns</mat-icon>
           <span *ngIf="displayLabels">{{ 'App.Relays' | translate }}</span>

src/app/example/example.html

@@ -0,0 +1,7 @@
+<div class="feed-page">
+  <p>This example demonstrates how to do sorting, filtering, virtual scrolling, dynamic updates of complex data within Blockcore Notes.</p>
+</div>
+
+<div>
+
+</div>

src/app/example/example.ts

@@ -0,0 +1,14 @@
+import { Component, OnInit } from '@angular/core';
+import { ApplicationState } from '../services/applicationstate';
+
+@Component({
+  selector: 'app-example',
+  templateUrl: 'example.html',
+})
+export class ExampleComponent implements OnInit {
+  constructor(private appState: ApplicationState) {}
+
+  ngOnInit() {
+    this.appState.updateTitle('Example');
+  }
+}