import { Component } from '@angular/core';
import { FormBuilder, Validators } from '@angular/forms';
import { ApplicationService, ApplicationType } from '@c8y/client';
import { AlertService, WizardComponent } from '@c8y/ngx-components';
import * as i0 from "@angular/core";
import * as i1 from "@c8y/client";
import * as i2 from "@angular/forms";
import * as i3 from "@c8y/ngx-components";
import * as i4 from "@angular/common";
export class AddExternalApplicationComponent {
    constructor(applicationService, formBuilder, alertService, wizardComponent) {
        this.applicationService = applicationService;
        this.formBuilder = formBuilder;
        this.alertService = alertService;
        this.wizardComponent = wizardComponent;
    }
    ngOnInit() {
        this.initForm();
    }
    back() {
        this.wizardComponent.reset();
    }
    cancel() {
        this.wizardComponent.close();
    }
    done() {
        this.wizardComponent.close();
    }
    async save(app) {
        const appToSave = {
            manifest: {},
            externalUrl: app.externalUrl,
            type: ApplicationType.EXTERNAL,
            name: app.name,
            key: app.key
        };
        try {
            this.createdApp = await this.applicationService.create(appToSave);
        }
        catch (ex) {
            this.alertService.addServerFailure(ex);
        }
    }
    initForm() {
        this.formGroup = this.formBuilder.group({
            name: ['', [Validators.required, Validators.maxLength(120)]],
            key: ['', [Validators.required, Validators.maxLength(120)]],
            externalUrl: ['', Validators.required]
        });
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: AddExternalApplicationComponent, deps: [{ token: i1.ApplicationService }, { token: i2.FormBuilder }, { token: i3.AlertService }, { token: i3.WizardComponent }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.9", type: AddExternalApplicationComponent, selector: "c8y-add-external-application", ngImport: i0, template: "<form *ngIf=\"!createdApp; else appCreated\" [formGroup]=\"formGroup\" novalidate>\n  <c8y-wizard-header>\n    <i [c8yIcon]=\"'cloud-link'\"></i>\n    <h4 translate id=\"modal-title\">Add external application</h4>\n  </c8y-wizard-header>\n\n  <c8y-wizard-body>\n    <p class=\"p-16 text-medium text-center bg-level-0 separator-bottom sticky-top\">\n      {{ 'Provide external application details' | translate }}\n    </p>\n    <div class=\"modal-body p-t-8\" id=\"modal-body\">\n      <c8y-form-group>\n        <label style=\"text-align: left\">{{ 'Name' | translate }}</label>\n        <input\n          class=\"form-control\"\n          formControlName=\"name\"\n          name=\"name\"\n          placeholder=\"{{ 'e.g. My application' | translate }}\"\n          required\n          type=\"text\"\n        />\n      </c8y-form-group>\n\n      <c8y-form-group>\n        <label style=\"text-align: left\">{{ 'Application key' | translate }}</label>\n        <input\n          class=\"form-control\"\n          formControlName=\"key\"\n          name=\"key\"\n          placeholder=\"{{ 'e.g. my-external-application-key' | translate }}\"\n          required\n          type=\"text\"\n        />\n      </c8y-form-group>\n\n      <c8y-form-group>\n        <label style=\"text-align: left\">{{ 'External URL' | translate }}</label>\n        <input\n          [pattern]=\"'^(?!javascript:).+'\"\n          class=\"form-control\"\n          formControlName=\"externalUrl\"\n          name=\"externalUrl\"\n          placeholder=\"{{ 'e.g.' | translate }} https://www.example.com\"\n          required\n          type=\"url\"\n        />\n      </c8y-form-group>\n    </div>\n  </c8y-wizard-body>\n\n  <c8y-wizard-footer>\n    <button\n      (click)=\"back()\"\n      class=\"btn btn-default\"\n      title=\"{{ 'Back' | translate }}\"\n      translate\n      type=\"button\"\n    >\n      Back\n    </button>\n    <button (click)=\"cancel()\" class=\"btn btn-default\" title=\"{{ 'Cancel' | translate }}\" translate>\n      Cancel\n    </button>\n    <button\n      (click)=\"save(formGroup.value)\"\n      [disabled]=\"formGroup.invalid || formGroup.pristine\"\n      class=\"btn btn-primary btn-form\"\n      title=\"{{ 'Add application' | translate }}\"\n      type=\"button\"\n    >\n      {{ 'Add application' | translate }}\n    </button>\n  </c8y-wizard-footer>\n</form>\n<ng-template #appCreated>\n  <c8y-wizard-body>\n    <div class=\"d-flex d-col j-c-center a-i-center\" style=\"min-height: 324px\">\n      <c8y-operation-result\n        text=\"{{ 'Application created' | translate }}\"\n        [size]=\"84\"\n        [vertical]=\"true\"\n        type=\"success\"\n        class=\"lead\"\n      ></c8y-operation-result>\n    </div>\n  </c8y-wizard-body>\n  <c8y-wizard-footer>\n    <button (click)=\"done()\" class=\"btn btn-default\" title=\"{{ 'Done' | translate }}\" translate>\n      Done\n    </button>\n    <a\n      (click)=\"$event.stopPropagation()\"\n      [href]=\"formGroup.value.externalUrl\"\n      target=\"_blank\"\n      rel=\"noopener noreferrer\"\n      class=\"btn btn-primary\"\n      title=\"{{ 'Open' | translate }}\"\n    >\n      <i c8yIcon=\"external-link\" class=\"m-r-4\"></i>\n      {{ 'Open' | translate }}\n    </a>\n  </c8y-wizard-footer>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i3.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i3.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.OperationResultComponent, selector: "c8y-operation-result", inputs: ["text", "vertical", "size", "type"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "component", type: i3.FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "directive", type: i3.RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "component", type: i3.WizardHeaderComponent, selector: "c8y-wizard-header" }, { kind: "component", type: i3.WizardBodyComponent, selector: "c8y-wizard-body" }, { kind: "component", type: i3.WizardFooterComponent, selector: "c8y-wizard-footer" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i3.C8yTranslatePipe, name: "translate" }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: AddExternalApplicationComponent, decorators: [{
            type: Component,
            args: [{ selector: 'c8y-add-external-application', template: "<form *ngIf=\"!createdApp; else appCreated\" [formGroup]=\"formGroup\" novalidate>\n  <c8y-wizard-header>\n    <i [c8yIcon]=\"'cloud-link'\"></i>\n    <h4 translate id=\"modal-title\">Add external application</h4>\n  </c8y-wizard-header>\n\n  <c8y-wizard-body>\n    <p class=\"p-16 text-medium text-center bg-level-0 separator-bottom sticky-top\">\n      {{ 'Provide external application details' | translate }}\n    </p>\n    <div class=\"modal-body p-t-8\" id=\"modal-body\">\n      <c8y-form-group>\n        <label style=\"text-align: left\">{{ 'Name' | translate }}</label>\n        <input\n          class=\"form-control\"\n          formControlName=\"name\"\n          name=\"name\"\n          placeholder=\"{{ 'e.g. My application' | translate }}\"\n          required\n          type=\"text\"\n        />\n      </c8y-form-group>\n\n      <c8y-form-group>\n        <label style=\"text-align: left\">{{ 'Application key' | translate }}</label>\n        <input\n          class=\"form-control\"\n          formControlName=\"key\"\n          name=\"key\"\n          placeholder=\"{{ 'e.g. my-external-application-key' | translate }}\"\n          required\n          type=\"text\"\n        />\n      </c8y-form-group>\n\n      <c8y-form-group>\n        <label style=\"text-align: left\">{{ 'External URL' | translate }}</label>\n        <input\n          [pattern]=\"'^(?!javascript:).+'\"\n          class=\"form-control\"\n          formControlName=\"externalUrl\"\n          name=\"externalUrl\"\n          placeholder=\"{{ 'e.g.' | translate }} https://www.example.com\"\n          required\n          type=\"url\"\n        />\n      </c8y-form-group>\n    </div>\n  </c8y-wizard-body>\n\n  <c8y-wizard-footer>\n    <button\n      (click)=\"back()\"\n      class=\"btn btn-default\"\n      title=\"{{ 'Back' | translate }}\"\n      translate\n      type=\"button\"\n    >\n      Back\n    </button>\n    <button (click)=\"cancel()\" class=\"btn btn-default\" title=\"{{ 'Cancel' | translate }}\" translate>\n      Cancel\n    </button>\n    <button\n      (click)=\"save(formGroup.value)\"\n      [disabled]=\"formGroup.invalid || formGroup.pristine\"\n      class=\"btn btn-primary btn-form\"\n      title=\"{{ 'Add application' | translate }}\"\n      type=\"button\"\n    >\n      {{ 'Add application' | translate }}\n    </button>\n  </c8y-wizard-footer>\n</form>\n<ng-template #appCreated>\n  <c8y-wizard-body>\n    <div class=\"d-flex d-col j-c-center a-i-center\" style=\"min-height: 324px\">\n      <c8y-operation-result\n        text=\"{{ 'Application created' | translate }}\"\n        [size]=\"84\"\n        [vertical]=\"true\"\n        type=\"success\"\n        class=\"lead\"\n      ></c8y-operation-result>\n    </div>\n  </c8y-wizard-body>\n  <c8y-wizard-footer>\n    <button (click)=\"done()\" class=\"btn btn-default\" title=\"{{ 'Done' | translate }}\" translate>\n      Done\n    </button>\n    <a\n      (click)=\"$event.stopPropagation()\"\n      [href]=\"formGroup.value.externalUrl\"\n      target=\"_blank\"\n      rel=\"noopener noreferrer\"\n      class=\"btn btn-primary\"\n      title=\"{{ 'Open' | translate }}\"\n    >\n      <i c8yIcon=\"external-link\" class=\"m-r-4\"></i>\n      {{ 'Open' | translate }}\n    </a>\n  </c8y-wizard-footer>\n</ng-template>\n" }]
        }], ctorParameters: () => [{ type: i1.ApplicationService }, { type: i2.FormBuilder }, { type: i3.AlertService }, { type: i3.WizardComponent }] });
//# sourceMappingURL=data:application/json;base64, 