<h4 i18n="Update progress dialog title" mat-dialog-title>Updater</h4>

<mat-dialog-content>
  @if (updateStatus) {
    <div>
      <div style="margin-bottom: 8px;">
        @if (updateStatus['updating']) {
          <h6>Update in progress</h6>
        }
        @if (!updateStatus['updating'] && updateStatus['error']) {
          <h6>Update failed</h6>
        }
        @if (!updateStatus['updating'] && !updateStatus['error']) {
          <h6>Update succeeded!</h6>
        }
      </div>
      @if (updateStatus['updating']) {
        <mat-progress-bar mode="indeterminate"></mat-progress-bar>
      }
      @if (!updateStatus['updating']) {
        <mat-progress-bar mode="determinate" value="100"></mat-progress-bar>
      }
      @if (updateStatus['details']) {
        <p style="margin-top: 4px; font-size: 13px;">{{updateStatus['details']}}</p>
      }
    </div>
  }
</mat-dialog-content>

<mat-dialog-actions>
  <button mat-button mat-dialog-close><ng-container i18n="Close update progress dialog">Close</ng-container></button>
</mat-dialog-actions>