import { __decorate, __metadata } from "tslib";
import { Component, Input } from '@angular/core';
import { memoize } from '@c8y/ngx-components';
import { pull } from 'lodash-es';
import { ControlContainer, NgForm } from '@angular/forms';
import * as i0 from "@angular/core";
import * as i1 from "@angular/forms";
import * as i2 from "@c8y/ngx-components";
import * as i3 from "@angular/common";
export class RequestConfigurationComponent {
    constructor(controlContainer) {
        this.controlContainer = controlContainer;
    }
    shouldShow(field) {
        return field in this.templateModel;
    }
    get requestConfiguration() {
        return this.templateModel[this.requestType];
    }
    addCustomValue(array) {
        const customValue = {
            key: '',
            value: ''
        };
        array.push(customValue);
    }
    removeCustomValue(array, customValue) {
        pull(array, customValue);
        this.controlContainer.control.markAsDirty();
    }
    get showBody() {
        return this.requestConfiguration.method === 'POST' && this.requestType !== 'logoutRequest';
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RequestConfigurationComponent, deps: [{ token: i1.ControlContainer }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: RequestConfigurationComponent, selector: "c8y-request-configuration", inputs: { templateModel: "templateModel", requestName: "requestName", requestType: "requestType" }, ngImport: i0, template: "<fieldset\n  class=\"p-24\"\n  ngModelGroup=\"{{ requestName }}\"\n  id=\"{{ requestType }}\"\n>\n  <div class=\"row\">\n    <div\n      class=\"col-xs-12 col-sm-3 col-md-2 m-b-xs-8\"\n      *ngIf=\"requestType !== 'tokenValidationRequest'\"\n    >\n      <div class=\"h4 text-normal text-right text-left-xs\">\n        {{ requestName }}\n      </div>\n    </div>\n\n    <div\n      [ngClass]=\"\n        requestType !== 'tokenValidationRequest' ? 'col-xs-12 col-sm-9 col-md-10 col-lg-9' : ''\n      \"\n      *ngIf=\"templateModel\"\n    >\n      <fieldset [ngClass]=\"requestType === 'tokenValidationRequest' ? 'c8y-fieldset p-24' : ''\">\n        <legend *ngIf=\"requestType === 'tokenValidationRequest'\">\n          {{ requestName }}\n        </legend>\n\n        <c8y-form-group>\n          <label\n            [for]=\"requestType + 'url'\"\n            class=\"control-label\"\n            translate\n          >\n            URL\n          </label>\n          <input\n            type=\"url\"\n            class=\"form-control\"\n            name=\"url\"\n            [id]=\"requestType + 'url'\"\n            [(ngModel)]=\"requestConfiguration.url\"\n            [placeholder]=\"'e.g. {{ example }}' | translate: { example: 'http://www.example.com/' }\"\n            c8yDefaultValidation=\"httpUrl\"\n            [required]=\"requestType !== 'logoutRequest'\"\n          />\n        </c8y-form-group>\n\n        <c8y-form-group *ngIf=\"showBody\">\n          <label\n            [for]=\"requestType + 'body'\"\n            class=\"control-label\"\n            translate\n          >\n            Body\n          </label>\n          <input\n            type=\"text\"\n            class=\"form-control\"\n            name=\"body\"\n            [id]=\"requestType + 'body'\"\n            [(ngModel)]=\"requestConfiguration.body\"\n            required\n          />\n        </c8y-form-group>\n      </fieldset>\n\n      <fieldset\n        class=\"c8y-fieldset p-24\"\n        *ngIf=\"requestType !== 'logoutRequest'\"\n      >\n        <legend translate>Headers</legend>\n        <div\n          class=\"tight-grid visible-md visible-lg\"\n          *ngIf=\"requestConfiguration.headers.length > 0\"\n        >\n          <div class=\"col-md-6\">\n            <p class=\"text-medium\">\n              {{ 'Key' | translate }}\n            </p>\n          </div>\n          <div class=\"col-md-5\">\n            <p class=\"text-medium\">\n              {{ 'Value' | translate }}\n            </p>\n          </div>\n        </div>\n        <div\n          class=\"tight-grid\"\n          data-cy=\"c8y-authentication-single-sign-on--request-header\"\n          *ngFor=\"let header of requestConfiguration.headers; index as headerIndex\"\n        >\n          <div class=\"col-md-6\">\n            <c8y-form-group>\n              <label\n                [for]=\"requestType + 'headerKey' + headerIndex\"\n                class=\"visible-sm visible-xs\"\n                translate\n              >\n                Key\n              </label>\n              <input\n                class=\"form-control\"\n                [name]=\"'headerKey' + headerIndex\"\n                [id]=\"requestType + 'headerKey' + headerIndex\"\n                [(ngModel)]=\"header.key\"\n                [placeholder]=\"'e.g. {{ example }}' | translate: { example: 'Authorization' }\"\n                required\n              />\n            </c8y-form-group>\n          </div>\n          <div class=\"col-md-5\">\n            <c8y-form-group>\n              <label\n                [for]=\"requestType + 'headerValue' + headerIndex\"\n                class=\"visible-sm visible-xs\"\n                translate\n              >\n                Value\n              </label>\n              <input\n                class=\"form-control\"\n                [name]=\"'headerValue' + headerIndex\"\n                [id]=\"requestType + 'headerValue' + headerIndex\"\n                [(ngModel)]=\"header.value\"\n                [placeholder]=\"\n                  'e.g. {{ example }}' | translate: { example: 'Basic USY7jW9jb2RlX2=' }\n                \"\n                required\n              />\n            </c8y-form-group>\n          </div>\n          <div class=\"col-md-1\">\n            <c8y-form-group>\n              <button\n                class=\"btn btn-link hidden-xs hidden-sm\"\n                type=\"button\"\n                title=\"{{ 'Remove' | translate }}\"\n                (click)=\"removeCustomValue(requestConfiguration.headers, header)\"\n              >\n                <i\n                  c8yIcon=\"minus-circle\"\n                  class=\"text-danger\"\n                ></i>\n              </button>\n              <button\n                class=\"btn btn-danger btn-block btn-sm visible-xs visible-sm\"\n                title=\"{{ 'Remove' | translate }}\"\n                type=\"button\"\n                (click)=\"removeCustomValue(requestConfiguration.headers, header)\"\n              >\n                <i c8yIcon=\"minus-circle\"></i>\n                <span translate>Remove</span>\n              </button>\n            </c8y-form-group>\n          </div>\n        </div>\n        <button\n          class=\"btn btn-default m-t-8\"\n          type=\"button\"\n          title=\"{{ 'Add header' | translate }}\"\n          (click)=\"addCustomValue(requestConfiguration.headers)\"\n        >\n          <i\n            c8yIcon=\"plus-circle\"\n            class=\"m-r-4\"\n          ></i>\n          <span translate>Add header</span>\n        </button>\n      </fieldset>\n\n      <fieldset class=\"c8y-fieldset p-24\">\n        <legend translate>Request parameters</legend>\n        <div\n          class=\"tight-grid visible-md visible-lg\"\n          *ngIf=\"requestConfiguration.requestParams.length > 0\"\n        >\n          <div class=\"col-md-6\">\n            <p class=\"text-medium\">\n              {{ 'Key' | translate }}\n            </p>\n          </div>\n          <div class=\"col-md-5\">\n            <p class=\"text-medium\">\n              {{ 'Value' | translate }}\n            </p>\n          </div>\n        </div>\n        <div\n          class=\"tight-grid\"\n          data-cy=\"c8y-authentication-single-sign-on--request-parameter\"\n          *ngFor=\"let requestParam of requestConfiguration.requestParams; index as paramIndex\"\n        >\n          <div class=\"col-md-6\">\n            <c8y-form-group>\n              <label\n                [for]=\"requestType + 'paramKey' + paramIndex\"\n                class=\"visible-sm visible-xs\"\n                translate\n              >\n                Key\n              </label>\n              <input\n                class=\"form-control\"\n                [name]=\"'paramKey' + paramIndex\"\n                [id]=\"requestType + 'paramKey' + paramIndex\"\n                [(ngModel)]=\"requestParam.key\"\n                [placeholder]=\"'e.g. {{ example }}' | translate: { example: 'client_id' }\"\n                required\n              />\n            </c8y-form-group>\n          </div>\n\n          <div class=\"col-md-5\">\n            <c8y-form-group>\n              <label\n                [for]=\"requestType + 'paramValue' + paramIndex\"\n                class=\"visible-sm visible-xs\"\n                translate\n              >\n                Value\n              </label>\n              <input\n                class=\"form-control\"\n                [name]=\"'paramValue' + paramIndex\"\n                [id]=\"requestType + 'paramValue' + paramIndex\"\n                [(ngModel)]=\"requestParam.value\"\n                [placeholder]=\"'e.g. {{ example }}' | translate: { example: '${clientId}' }\"\n                required\n              />\n            </c8y-form-group>\n          </div>\n\n          <div class=\"col-md-1\">\n            <c8y-form-group>\n              <button\n                class=\"btn btn-link hidden-xs hidden-sm\"\n                type=\"button\"\n                title=\"{{ 'Remove' | translate }}\"\n                (click)=\"removeCustomValue(requestConfiguration.requestParams, requestParam)\"\n              >\n                <i\n                  c8yIcon=\"minus-circle\"\n                  class=\"text-danger\"\n                ></i>\n              </button>\n\n              <button\n                class=\"btn btn-danger btn-block btn-sm visible-xs visible-sm\"\n                type=\"button\"\n                title=\"{{ 'Remove' | translate }}\"\n                (click)=\"removeCustomValue(requestConfiguration.requestParams, requestParam)\"\n              >\n                <i c8yIcon=\"minus-circle\"></i>\n                <span translate>Remove</span>\n              </button>\n            </c8y-form-group>\n          </div>\n        </div>\n\n        <button\n          class=\"btn btn-default m-t-8\"\n          type=\"button\"\n          title=\"{{ 'Add request parameter' | translate }}\"\n          (click)=\"addCustomValue(requestConfiguration.requestParams)\"\n        >\n          <i\n            c8yIcon=\"plus-circle\"\n            class=\"m-r-4\"\n          ></i>\n          <span translate>Add request parameter</span>\n        </button>\n      </fieldset>\n    </div>\n  </div>\n</fieldset>\n", dependencies: [{ kind: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.DefaultValidationDirective, selector: "[c8yDefaultValidation]", inputs: ["c8yDefaultValidation"] }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1.NgModelGroup, selector: "[ngModelGroup]", inputs: ["ngModelGroup"], exportAs: ["ngModelGroup"] }, { kind: "component", type: i2.FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "directive", type: i2.RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }] }); }
}
__decorate([
    memoize(),
    __metadata("design:type", Function),
    __metadata("design:paramtypes", [String]),
    __metadata("design:returntype", void 0)
], RequestConfigurationComponent.prototype, "shouldShow", null);
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RequestConfigurationComponent, decorators: [{
            type: Component,
            args: [{ selector: 'c8y-request-configuration', viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], template: "<fieldset\n  class=\"p-24\"\n  ngModelGroup=\"{{ requestName }}\"\n  id=\"{{ requestType }}\"\n>\n  <div class=\"row\">\n    <div\n      class=\"col-xs-12 col-sm-3 col-md-2 m-b-xs-8\"\n      *ngIf=\"requestType !== 'tokenValidationRequest'\"\n    >\n      <div class=\"h4 text-normal text-right text-left-xs\">\n        {{ requestName }}\n      </div>\n    </div>\n\n    <div\n      [ngClass]=\"\n        requestType !== 'tokenValidationRequest' ? 'col-xs-12 col-sm-9 col-md-10 col-lg-9' : ''\n      \"\n      *ngIf=\"templateModel\"\n    >\n      <fieldset [ngClass]=\"requestType === 'tokenValidationRequest' ? 'c8y-fieldset p-24' : ''\">\n        <legend *ngIf=\"requestType === 'tokenValidationRequest'\">\n          {{ requestName }}\n        </legend>\n\n        <c8y-form-group>\n          <label\n            [for]=\"requestType + 'url'\"\n            class=\"control-label\"\n            translate\n          >\n            URL\n          </label>\n          <input\n            type=\"url\"\n            class=\"form-control\"\n            name=\"url\"\n            [id]=\"requestType + 'url'\"\n            [(ngModel)]=\"requestConfiguration.url\"\n            [placeholder]=\"'e.g. {{ example }}' | translate: { example: 'http://www.example.com/' }\"\n            c8yDefaultValidation=\"httpUrl\"\n            [required]=\"requestType !== 'logoutRequest'\"\n          />\n        </c8y-form-group>\n\n        <c8y-form-group *ngIf=\"showBody\">\n          <label\n            [for]=\"requestType + 'body'\"\n            class=\"control-label\"\n            translate\n          >\n            Body\n          </label>\n          <input\n            type=\"text\"\n            class=\"form-control\"\n            name=\"body\"\n            [id]=\"requestType + 'body'\"\n            [(ngModel)]=\"requestConfiguration.body\"\n            required\n          />\n        </c8y-form-group>\n      </fieldset>\n\n      <fieldset\n        class=\"c8y-fieldset p-24\"\n        *ngIf=\"requestType !== 'logoutRequest'\"\n      >\n        <legend translate>Headers</legend>\n        <div\n          class=\"tight-grid visible-md visible-lg\"\n          *ngIf=\"requestConfiguration.headers.length > 0\"\n        >\n          <div class=\"col-md-6\">\n            <p class=\"text-medium\">\n              {{ 'Key' | translate }}\n            </p>\n          </div>\n          <div class=\"col-md-5\">\n            <p class=\"text-medium\">\n              {{ 'Value' | translate }}\n            </p>\n          </div>\n        </div>\n        <div\n          class=\"tight-grid\"\n          data-cy=\"c8y-authentication-single-sign-on--request-header\"\n          *ngFor=\"let header of requestConfiguration.headers; index as headerIndex\"\n        >\n          <div class=\"col-md-6\">\n            <c8y-form-group>\n              <label\n                [for]=\"requestType + 'headerKey' + headerIndex\"\n                class=\"visible-sm visible-xs\"\n                translate\n              >\n                Key\n              </label>\n              <input\n                class=\"form-control\"\n                [name]=\"'headerKey' + headerIndex\"\n                [id]=\"requestType + 'headerKey' + headerIndex\"\n                [(ngModel)]=\"header.key\"\n                [placeholder]=\"'e.g. {{ example }}' | translate: { example: 'Authorization' }\"\n                required\n              />\n            </c8y-form-group>\n          </div>\n          <div class=\"col-md-5\">\n            <c8y-form-group>\n              <label\n                [for]=\"requestType + 'headerValue' + headerIndex\"\n                class=\"visible-sm visible-xs\"\n                translate\n              >\n                Value\n              </label>\n              <input\n                class=\"form-control\"\n                [name]=\"'headerValue' + headerIndex\"\n                [id]=\"requestType + 'headerValue' + headerIndex\"\n                [(ngModel)]=\"header.value\"\n                [placeholder]=\"\n                  'e.g. {{ example }}' | translate: { example: 'Basic USY7jW9jb2RlX2=' }\n                \"\n                required\n              />\n            </c8y-form-group>\n          </div>\n          <div class=\"col-md-1\">\n            <c8y-form-group>\n              <button\n                class=\"btn btn-link hidden-xs hidden-sm\"\n                type=\"button\"\n                title=\"{{ 'Remove' | translate }}\"\n                (click)=\"removeCustomValue(requestConfiguration.headers, header)\"\n              >\n                <i\n                  c8yIcon=\"minus-circle\"\n                  class=\"text-danger\"\n                ></i>\n              </button>\n              <button\n                class=\"btn btn-danger btn-block btn-sm visible-xs visible-sm\"\n                title=\"{{ 'Remove' | translate }}\"\n                type=\"button\"\n                (click)=\"removeCustomValue(requestConfiguration.headers, header)\"\n              >\n                <i c8yIcon=\"minus-circle\"></i>\n                <span translate>Remove</span>\n              </button>\n            </c8y-form-group>\n          </div>\n        </div>\n        <button\n          class=\"btn btn-default m-t-8\"\n          type=\"button\"\n          title=\"{{ 'Add header' | translate }}\"\n          (click)=\"addCustomValue(requestConfiguration.headers)\"\n        >\n          <i\n            c8yIcon=\"plus-circle\"\n            class=\"m-r-4\"\n          ></i>\n          <span translate>Add header</span>\n        </button>\n      </fieldset>\n\n      <fieldset class=\"c8y-fieldset p-24\">\n        <legend translate>Request parameters</legend>\n        <div\n          class=\"tight-grid visible-md visible-lg\"\n          *ngIf=\"requestConfiguration.requestParams.length > 0\"\n        >\n          <div class=\"col-md-6\">\n            <p class=\"text-medium\">\n              {{ 'Key' | translate }}\n            </p>\n          </div>\n          <div class=\"col-md-5\">\n            <p class=\"text-medium\">\n              {{ 'Value' | translate }}\n            </p>\n          </div>\n        </div>\n        <div\n          class=\"tight-grid\"\n          data-cy=\"c8y-authentication-single-sign-on--request-parameter\"\n          *ngFor=\"let requestParam of requestConfiguration.requestParams; index as paramIndex\"\n        >\n          <div class=\"col-md-6\">\n            <c8y-form-group>\n              <label\n                [for]=\"requestType + 'paramKey' + paramIndex\"\n                class=\"visible-sm visible-xs\"\n                translate\n              >\n                Key\n              </label>\n              <input\n                class=\"form-control\"\n                [name]=\"'paramKey' + paramIndex\"\n                [id]=\"requestType + 'paramKey' + paramIndex\"\n                [(ngModel)]=\"requestParam.key\"\n                [placeholder]=\"'e.g. {{ example }}' | translate: { example: 'client_id' }\"\n                required\n              />\n            </c8y-form-group>\n          </div>\n\n          <div class=\"col-md-5\">\n            <c8y-form-group>\n              <label\n                [for]=\"requestType + 'paramValue' + paramIndex\"\n                class=\"visible-sm visible-xs\"\n                translate\n              >\n                Value\n              </label>\n              <input\n                class=\"form-control\"\n                [name]=\"'paramValue' + paramIndex\"\n                [id]=\"requestType + 'paramValue' + paramIndex\"\n                [(ngModel)]=\"requestParam.value\"\n                [placeholder]=\"'e.g. {{ example }}' | translate: { example: '${clientId}' }\"\n                required\n              />\n            </c8y-form-group>\n          </div>\n\n          <div class=\"col-md-1\">\n            <c8y-form-group>\n              <button\n                class=\"btn btn-link hidden-xs hidden-sm\"\n                type=\"button\"\n                title=\"{{ 'Remove' | translate }}\"\n                (click)=\"removeCustomValue(requestConfiguration.requestParams, requestParam)\"\n              >\n                <i\n                  c8yIcon=\"minus-circle\"\n                  class=\"text-danger\"\n                ></i>\n              </button>\n\n              <button\n                class=\"btn btn-danger btn-block btn-sm visible-xs visible-sm\"\n                type=\"button\"\n                title=\"{{ 'Remove' | translate }}\"\n                (click)=\"removeCustomValue(requestConfiguration.requestParams, requestParam)\"\n              >\n                <i c8yIcon=\"minus-circle\"></i>\n                <span translate>Remove</span>\n              </button>\n            </c8y-form-group>\n          </div>\n        </div>\n\n        <button\n          class=\"btn btn-default m-t-8\"\n          type=\"button\"\n          title=\"{{ 'Add request parameter' | translate }}\"\n          (click)=\"addCustomValue(requestConfiguration.requestParams)\"\n        >\n          <i\n            c8yIcon=\"plus-circle\"\n            class=\"m-r-4\"\n          ></i>\n          <span translate>Add request parameter</span>\n        </button>\n      </fieldset>\n    </div>\n  </div>\n</fieldset>\n" }]
        }], ctorParameters: () => [{ type: i1.ControlContainer }], propDecorators: { templateModel: [{
                type: Input
            }], requestName: [{
                type: Input
            }], requestType: [{
                type: Input
            }], shouldShow: [] } });
//# sourceMappingURL=data:application/json;base64, 