<form
  [formGroup]="domainForm"
  [bitSubmit]="data.orgDomain ? verifyDomain : saveDomain"
  [allowDisabledFormSubmit]="true"
>
  <bit-dialog [dialogSize]="'default'" [disablePadding]="false">
    <span bitDialogTitle>
      <span *ngIf="!data.orgDomain">{{ "newDomain" | i18n }}</span>
      <span *ngIf="data.orgDomain">
        {{ "claimDomain" | i18n }}
      </span>

      <span *ngIf="data?.orgDomain && !data.orgDomain?.verifiedDate" bitBadge variant="warning">
        {{ "domainStatusPending" | i18n }}
      </span>
      <span *ngIf="data?.orgDomain && data?.orgDomain?.verifiedDate" bitBadge variant="success">
        {{ "domainStatusClaimed" | i18n }}
      </span>
    </span>
    <div bitDialogContent>
      <div *ngIf="data?.orgDomain && !data?.orgDomain?.verifiedDate" class="tw-space-y-2 tw-pb-4">
        <p bitTypography="body1">{{ "automaticDomainClaimProcess1" | i18n }}</p>
        <p bitTypography="body1">
          {{ "automaticDomainClaimProcess2" | i18n }}
          <a
            bitLink
            target="_blank"
            rel="noreferrer"
            href="https://bitwarden.com/help/claimed-accounts/"
            class="tw-inline-flex tw-items-center tw-gap-1"
          >
            {{ "accountOwnershipChange" | i18n }}
            <i class="bwi bwi-external-link tw-text-xs" aria-hidden="true"></i>
          </a>
          {{ "automaticDomainClaimProcessEnd" | i18n }}
        </p>
      </div>
      <bit-form-field>
        <bit-label>{{ "domainName" | i18n }}</bit-label>
        <input bitInput appAutofocus formControlName="domainName" [showErrorsWhenDisabled]="true" />
      </bit-form-field>

      <bit-form-field *ngIf="data?.orgDomain">
        <bit-label>{{ "dnsTxtRecord" | i18n }}</bit-label>
        <input bitInput formControlName="txt" />
        <bit-hint>{{ "dnsTxtRecordInputHint" | i18n }}</bit-hint>
        <button
          type="button"
          bitSuffix
          bitIconButton="bwi-clone"
          label="{{ 'copyDnsTxtRecord' | i18n }}"
          (click)="copyDnsTxt()"
        ></button>
      </bit-form-field>
    </div>
    <ng-container bitDialogFooter>
      <button type="submit" bitButton bitFormButton buttonType="primary">
        <span *ngIf="!data?.orgDomain">{{ "next" | i18n }}</span>
        <span *ngIf="data?.orgDomain && !data?.orgDomain?.verifiedDate">{{
          "claimDomain" | i18n
        }}</span>
        <span *ngIf="data?.orgDomain?.verifiedDate">{{ "reclaimDomain" | i18n }}</span>
      </button>
      <button bitButton buttonType="secondary" (click)="dialogRef.close()" type="button">
        {{ "cancel" | i18n }}
      </button>

      <button
        *ngIf="data.orgDomain"
        class="tw-ml-auto"
        bitIconButton="bwi-trash"
        buttonType="danger"
        size="default"
        label="{{ 'delete' | i18n }}"
        [bitAction]="deleteDomain"
        type="submit"
        bitFormButton
      ></button>
    </ng-container>
  </bit-dialog>
</form>
