File

src/lib/open-api-http-response-error/open-api-http-response-error.component.ts

Implements

IErrorDialogComponent

Metadata

Index

Properties

Properties

Public Readonly error
Type : OpenApiHttpResponseErrorDialogData
Default value : inject(RXAP_ERROR_DIALOG_ERROR)
Public Readonly isProduction
Type : boolean
Default value : inject(RXAP_ENVIRONMENT, { optional: true })?.production ?? false
import { CommonModule } from '@angular/common';
import {
  ChangeDetectionStrategy,
  Component,
  inject,
} from '@angular/core';
import {
  CopyToClipboardComponent,
  JsonViewerComponent,
} from '@rxap/components';
import {
  DataGridCellDefDirective,
  DataGridComponent,
  DataGridRowDefDirective,
} from '@rxap/data-grid';
import { RXAP_ENVIRONMENT } from '@rxap/environment';
import { IErrorDialogComponent } from '../error-dialog/error-dialog.component';
import { RXAP_ERROR_DIALOG_ERROR } from '../tokens';
import { OpenApiHttpResponseErrorDialogData } from './open-api-http-response-error-dialog-data';

@Component({
    selector: 'rxap-open-api-http-response-error',
    imports: [
        CommonModule, CopyToClipboardComponent, DataGridCellDefDirective, DataGridComponent,
        DataGridRowDefDirective, JsonViewerComponent,
    ],
    templateUrl: './open-api-http-response-error.component.html',
    styleUrl: './open-api-http-response-error.component.scss',
    changeDetection: ChangeDetectionStrategy.OnPush
})
export class OpenApiHttpResponseErrorComponent implements IErrorDialogComponent<OpenApiHttpResponseErrorDialogData> {

  public readonly isProduction: boolean = inject(RXAP_ENVIRONMENT, { optional: true })?.production ?? false;

  public readonly error: OpenApiHttpResponseErrorDialogData = inject(RXAP_ERROR_DIALOG_ERROR);
}
<rxap-data-grid [data]="error">
  <ng-container rxapDataGridRowDef="name"></ng-container>
  <ng-container rxapDataGridRowDef="timestamp">
    <td *rxapDataGridCellDef="let value">{{ value | date:'HH:mm:ss' }}</td>
  </ng-container>
  <ng-container rxapDataGridRowDef="method"></ng-container>
  <ng-container rxapDataGridRowDef="url"></ng-container>
  <ng-container rxapDataGridRowDef="status"></ng-container>
  <ng-container rxapDataGridRowDef="statusText"></ng-container>
  <ng-container rxapDataGridRowDef="message"></ng-container>
  <ng-container rxapDataGridRowDef="headers">
    <td *rxapDataGridCellDef="let value">
      <rxap-data-grid [data]="value">
        <ng-container *ngFor="let entry of value | keyvalue" [rxapDataGridRowDef]="$any(entry.key)">
          <td *rxapDataGridCellDef="let value">
            <ng-container *ngIf="value.length > 1">
              <ul>
                <li *ngFor="let item of value">{{ item }}</li>
              </ul>
            </ng-container>
            <ng-container *ngIf="value.length === 1">{{ value[0] }}</ng-container>
            <ng-container *ngIf="value.length === 0">NONE</ng-container>
          </td>
        </ng-container>
      </rxap-data-grid>
    </td>
  </ng-container>
  <ng-container *ngIf="!isProduction" rxapDataGridRowDef="error">
    <td *rxapDataGridCellDef="let value">
      <ng-container *ngIf="value">
        <rxap-copy-to-clipboard [value]="value | json">Copy Response Body</rxap-copy-to-clipboard>
        <div class="body">
          <rxap-json-viewer [expanded]="false" [json]="value"></rxap-json-viewer>
        </div>
      </ng-container>
      <ng-container *ngIf="!value">NONE</ng-container>
    </td>
  </ng-container>
  <ng-container *ngIf="!isProduction" rxapDataGridRowDef="body">
    <td *rxapDataGridCellDef="let value">
      <ng-container *ngIf="value">
        <rxap-copy-to-clipboard [value]="value | json">Copy Request Body</rxap-copy-to-clipboard>
        <div class="body">
          <rxap-json-viewer [expanded]="false" [json]="value"></rxap-json-viewer>
        </div>
      </ng-container>
      <ng-container *ngIf="!value">NONE</ng-container>
    </td>
  </ng-container>
</rxap-data-grid>
Legend
Html element
Component
Html element with directive

results matching ""

    No results matching ""