<div class="d-flex justify-content-center">
  <div class="col-8">
    @if (emissionFactor()) {
      <div>
        <h2 data-cy="emissionFactorDetailsHeading"><span jhiTranslate="resilientApp.emissionFactor.detail.title">Emission Factor</span></h2>

        <hr />

        <jhi-alert-error></jhi-alert-error>

        <jhi-alert></jhi-alert>

        <dl class="row-md jh-entity-details">
          <dt>
            <span [ngbTooltip]="'resilientApp.emissionFactor.help.year' | translate" jhiTranslate="resilientApp.emissionFactor.year"
              >Year</span
            >
          </dt>
          <dd>
            <span>{{ emissionFactor()!.year }}</span>
          </dd>
          <dt><span jhiTranslate="resilientApp.emissionFactor.variableScope">Variable Scope</span></dt>
          <dd>
            @if (emissionFactor()!.variableScope) {
              <div>
                <a [routerLink]="['/variable-scope', emissionFactor()!.variableScope?.id, 'view']">{{
                  emissionFactor()!.variableScope?.name
                }}</a>
              </div>
            }
          </dd>
          <dt><span jhiTranslate="resilientApp.emissionFactor.variableCategory">Variable Category</span></dt>
          <dd>
            @if (emissionFactor()!.variableCategory) {
              <div>
                <a [routerLink]="['/variable-category', emissionFactor()!.variableCategory?.id, 'view']">{{
                  emissionFactor()!.variableCategory?.name
                }}</a>
              </div>
            }
          </dd>
          <dt>
            <span [ngbTooltip]="'resilientApp.emissionFactor.help.code' | translate" jhiTranslate="resilientApp.emissionFactor.code"
              >Code</span
            >
          </dt>
          <dd>
            <span>{{ emissionFactor()!.code }}</span>
          </dd>
          <dt>
            <span [ngbTooltip]="'resilientApp.emissionFactor.help.name' | translate" jhiTranslate="resilientApp.emissionFactor.name"
              >Name</span
            >
          </dt>
          <dd>
            <span>{{ emissionFactor()!.name }}</span>
          </dd>
          <dt>
            <span [ngbTooltip]="'resilientApp.emissionFactor.help.unit' | translate" jhiTranslate="resilientApp.emissionFactor.unit"
              >Unit</span
            >
          </dt>
          <dd>
            <span>{{ emissionFactor()!.unit }}</span>
          </dd>
          <dt>
            <span [ngbTooltip]="'resilientApp.emissionFactor.help.value' | translate" jhiTranslate="resilientApp.emissionFactor.value"
              >Value</span
            >
          </dt>
          <dd>
            <span>{{ emissionFactor()!.value }}</span>
          </dd>
          <dt>
            <span [ngbTooltip]="'resilientApp.emissionFactor.help.source' | translate" jhiTranslate="resilientApp.emissionFactor.source"
              >Source</span
            >
          </dt>
          <dd>
            <span>{{ emissionFactor()!.source }}</span>
          </dd>
          <dt>
            <span [ngbTooltip]="'resilientApp.emissionFactor.help.comments' | translate" jhiTranslate="resilientApp.emissionFactor.comments"
              >Comments</span
            >
          </dt>
          <dd>
            <span>{{ emissionFactor()!.comments }}</span>
          </dd>
        </dl>

        <button type="submit" (click)="previousState()" class="btn btn-info" data-cy="entityDetailsBackButton">
          <fa-icon icon="arrow-left"></fa-icon>&nbsp;<span jhiTranslate="entity.action.back">Voltar</span>
        </button>

        <button type="button" [routerLink]="['/emission-factor', emissionFactor()!.id, 'edit']" class="btn btn-primary">
          <fa-icon icon="pencil-alt"></fa-icon>&nbsp;<span jhiTranslate="entity.action.edit">Editar</span>
        </button>
        
        <button type="button" [routerLink]="['/emission-factor', emissionFactor()!.id, 'clone']" class="btn btn-primary">
          <fa-icon icon="pencil-alt"></fa-icon>&nbsp;<span jhiTranslate="entity.action.clone">Clonar</span>
        </button>
      </div>
    }
  </div>
</div>
