@if (startupDataLoaded) {
  @if (licenceProblem && !freeTier) {
    <div
      class="alert alert-app-level alert-danger"
      id="demo-banner"
      role="alert"
    >
      <div class="alert-items">
        <div class="alert-item static">
          <div class="alert-icon-wrapper">
            <cds-icon class="alert-icon" shape="warning-standard"></cds-icon>
          </div>
          <div class="alert-text">Problem with the licence key.</div>
        </div>
      </div>
      <a (click)="openProblem(licenceProblem)" class="update-key cursor-pointer"
        >More details</a
      >
    </div>
  } @else if (freeTier) {
    <div
      class="alert alert-app-level alert-warning"
      id="demo-banner"
      role="alert"
    >
      @if (licenceProblem === null) {
        <div class="alert-items">
          <div class="alert-item static">
            <div class="alert-icon-wrapper">
              <cds-icon class="alert-icon" shape="warning-standard"></cds-icon>
            </div>
            <div class="alert-text">
              Data Controller (FREE Tier) - to upgrade contact
              <contact-link classes="color-white" />
            </div>
          </div>
        </div>
        <a routerLink="/licensing/update" class="update-key"
          >Update Licence Key</a
        >
      }
      @if (licenceProblem !== null) {
        <div class="alert-items">
          <div class="alert-item static">
            <div class="alert-icon-wrapper">
              <cds-icon class="alert-icon" shape="warning-standard"></cds-icon>
            </div>
            <div class="alert-text">
              Data Controller (FREE Tier) - Problem with licence
            </div>
          </div>
        </div>
        <a
          (click)="openProblem(licenceProblem)"
          class="update-key cursor-pointer"
          >More details</a
        >
      }
    </div>
  } @else if (overCapacity) {
    <div
      class="alert alert-app-level alert-danger"
      id="demo-banner"
      role="alert"
    >
      <div class="alert-items">
        <div class="alert-item static">
          <div class="alert-icon-wrapper">
            <cds-icon class="alert-icon" shape="warning-standard"></cds-icon>
          </div>
          <div class="alert-text">
            The registered number of users exceeds the limit specified for your
            license. Please contact
            <contact-link classes="color-white" />
            or your reseller to arrange additional licence for site id
            {{ siteId }}.
          </div>
        </div>
      </div>
      <a routerLink="/licensing/limit" class="update-key">Licence details</a>
    </div>
  } @else if (appActive === false) {
    <div
      class="alert alert-app-level alert-warning"
      id="demo-banner"
      role="alert"
    >
      <div class="alert-items">
        <div class="alert-item static">
          <div class="alert-icon-wrapper">
            <cds-icon class="alert-icon" shape="warning-standard"></cds-icon>
          </div>
          @if (canRegister) {
            <div class="alert-text">
              Data Controller is not registered for this user. Accept the terms
              to register and use your licence on this site.
            </div>
          } @else {
            <div class="alert-text">
              The registered number of users has reached the limit for this
              licence. Please contact
              <contact-link classes="color-white" />
              or your reseller to arrange additional licence for site id
              {{ siteId }}.
            </div>
          }
        </div>
      </div>
      @if (canRegister) {
        <a routerLink="/licensing/register" class="update-key">Register</a>
      } @else {
        <a routerLink="/licensing/limit" class="update-key">Licence details</a>
      }
    </div>
  } @else if (expiringDays) {
    <div
      class="alert alert-app-level alert-danger"
      id="demo-banner"
      role="alert"
    >
      <div class="alert-items">
        <div class="alert-item static">
          <div class="alert-icon-wrapper">
            <cds-icon class="alert-icon" shape="warning-standard"></cds-icon>
          </div>
          <div class="alert-text">
            This license key will expire in {{ expiringDays }}
            {{ expiringDays === 1 ? 'day' : 'days' }}. Please contact
            <contact-link classes="color-white" />
            or your reseller to arrange additional licence for site id
            {{ siteId }}.
          </div>
        </div>
      </div>
      <a routerLink="/licensing/update" class="update-key"
        >Update Licence Key</a
      >
    </div>
  }
}