<bit-dialog dialogSize="large" background="alt" [loading]="performingInitialLoad">
  <span bitDialogTitle aria-live="polite">
    {{ title }}
  </span>

  @if (isCipherArchived && !params.isAdminConsoleAction && (archiveFlagEnabled$ | async)) {
    <span bitBadge bitDialogHeaderEnd> {{ "archived" | i18n }} </span>
  }

  <div bitDialogContent #dialogContent>
    @if (showCipherView) {
      <app-cipher-view
        [cipher]="cipher"
        [collections]="collections"
        [isAdminConsole]="formConfig.isAdminConsole"
      ></app-cipher-view>
    }

    @if (loadForm) {
      <vault-cipher-form
        formId="cipherForm"
        [config]="formConfig"
        [submitBtn]="submitBtn"
        (formReady)="onFormReady()"
        (cipherSaved)="onCipherSaved($event)"
        (formStatusChange$)="formStatusChanged($event)"
      >
        <bit-item slot="attachment-button">
          <button
            [disabled]="attachmentsButtonDisabled"
            bit-item-content
            type="button"
            (click)="openAttachmentsDialog()"
          >
            <div class="tw-flex tw-items-center tw-gap-2">
              {{ "attachments" | i18n }}
              <app-premium-badge></app-premium-badge>
            </div>
            <i slot="end" class="bwi bwi-angle-right" aria-hidden="true"></i>
          </button>
        </bit-item>
      </vault-cipher-form>
    }
  </div>
  <ng-container bitDialogFooter>
    @if (showRestore) {
      <button [bitAction]="restore" bitButton buttonType="primary" type="button">
        {{ "restore" | i18n }}
      </button>
    }

    @if (showEdit) {
      <button
        bitButton
        [bitAction]="switchToEdit"
        buttonType="primary"
        type="button"
        [disabled]="disableEdit"
      >
        {{ "edit" | i18n }}
      </button>
    }

    <button
      bitButton
      type="submit"
      form="cipherForm"
      buttonType="primary"
      #submitBtn
      [hidden]="showCipherView || showRestore"
    >
      {{ submitButtonText$ | async }}
    </button>

    @if (showCancel) {
      <button bitButton type="button" buttonType="secondary" (click)="cancel()">
        {{ "cancel" | i18n }}
      </button>
    }

    @if (showClose) {
      <button bitButton type="button" buttonType="secondary" (click)="cancel()">
        {{ "close" | i18n }}
      </button>
    }

    @if (showActionButtons) {
      <div class="tw-ml-auto">
        @if (showArchiveOptions) {
          @if (showUnarchiveBtn) {
            <button
              type="button"
              class="tw-mr-1"
              [bitAction]="unarchive"
              bitIconButton="bwi-unarchive"
              [label]="'unArchive' | i18n"
            ></button>
          }
          @if (showArchiveBtn) {
            <button
              type="button"
              class="tw-mr-1"
              [bitAction]="archive"
              bitIconButton="bwi-archive"
              [label]="'archiveVerb' | i18n"
            ></button>
          }
        }
        @if (cipher) {
          <button
            bitIconButton="bwi-trash"
            type="button"
            buttonType="danger"
            [label]="'delete' | i18n"
            [bitAction]="delete"
            [disabled]="!canDelete"
            data-testid="delete-cipher-btn"
          ></button>
        }
      </div>
    }
  </ng-container>
</bit-dialog>
