<!--
  ~ Copyright (C) 2017 Robert Bosch GmbH Copyright (C) 2017 Robert Bosch Manufacturing Solutions GmbH, Germany. All rights reserved.
  -->

<bci-page-content>
  <h2>&#64;bci-web-core/auth: Demo-App</h2>

  <p>This module provides authentication and authorization functionality.</p>
  <h3>Test functionality</h3>

  <button
    bciPrimaryButton
    class="button"
    [disabled]="(demoAuthService?.isAuthenticated$ | async) === true"
    (click)="loginMacma()"
  >
    Login
  </button>
  <button
    (click)="demoAuthService?.logout()"
    [disabled]="(demoAuthService?.isAuthenticated$ | async) === false"
    bciPrimaryButton
  >
    Logout
  </button>

  <h3>Status</h3>

  <p><b>isAuthenticated:</b> {{ demoAuthService?.isAuthenticated$ | async }}</p>
  <p><b>Username:</b> {{ demoAuthService?.username$ | async }}</p>

  <mat-tab-group>
    <mat-tab label="IdToken">
      <p><b>isExpired:</b> {{ demoAuthService?.isExpired$ | async }}</p>
      <p><b>expires:</b> {{ demoAuthService?.expiration$ | async }}</p>
      <pre>{{ stringify(demoAuthService?.idToken$ | async) }}</pre>
    </mat-tab>
    <mat-tab label="AccessToken">
      <p><b>isExpired:</b> {{ demoAuthService?.isExpired$ | async }}</p>
      <p><b>expires:</b> {{ demoAuthService?.expiration$ | async }}</p>
      <pre>{{ stringify(demoAuthService?.accessToken$ | async) }}</pre>
    </mat-tab>
    <mat-tab label="Roles">
      <pre>{{ stringify(demoAuthService?.roles$ | async) }}</pre>
    </mat-tab>
    <mat-tab label="User-Object">
      <pre>{{ stringify(demoAuthService?.user$ | async) }}</pre>
    </mat-tab>
    <mat-tab label="Example requests">
      <button (click)="makeRequest()" bciPrimaryButton>Make Request</button>
      <button (click)="checkAuthorization()" bciPrimaryButton>Check authorization</button>
      <button [disabled]="(canRead | async) === false" bciPrimaryButton>Is read allowed?</button>
      <button [disabled]="(canExecute | async) === false" bciPrimaryButton>Is execute allowed?</button>
    </mat-tab>
  </mat-tab-group>
</bci-page-content>
