@c8y/ngx-components
Version:
Angular modules for Cumulocity IoT applications
50 lines • 8.19 kB
JavaScript
import { Component } from '@angular/core';
import { UserService } from '@c8y/client';
import { AlertService } from '../alert/alert.service';
import { gettext } from '../i18n';
import * as i0 from "@angular/core";
import * as i1 from "@c8y/client";
import * as i2 from "../alert/alert.service";
import * as i3 from "../i18n/c8y-translate.directive";
import * as i4 from "@angular/common";
import * as i5 from "angularx-qrcode";
export class TotpSetupComponent {
get qrCodeImage() {
return this.totpSecret ? this.totpSecret.secretQrUrl : '';
}
get secret() {
return this.totpSecret ? this.totpSecret.rawSecret : '';
}
get qrData() {
// TODO: waiting for BE:, now we need extract it from secretQrUrl
// https://cumulocity.atlassian.net/browse/MTM-36387
// return this.totpSecret ? this.totpSecret.qrData : '';
const url = new URL(this.qrCodeImage);
const otpAuth = url.searchParams.get('chl') || url.searchParams.get('data');
if (!otpAuth) {
this.alert.danger(gettext('Failed to generate a QR code.'));
return '';
}
return decodeURIComponent(otpAuth);
}
constructor(user, alert) {
this.user = user;
this.alert = alert;
}
async ngOnInit() {
try {
const { data } = await this.user.generateTotpSecret();
this.totpSecret = data;
}
catch (ex) {
this.alert.addServerFailure(ex);
}
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TotpSetupComponent, deps: [{ token: i1.UserService }, { token: i2.AlertService }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: TotpSetupComponent, selector: "c8y-totp-setup", ngImport: i0, template: "<div class=\"text-center\">\n <p\n class=\"m-24 m-t-16 m-b-0\"\n translate\n >\n Scan this QR code with your smartphone using the authenticator application.\n </p>\n\n <div class=\"d-flex j-c-center\">\n <qrcode\n [width]=\"180\"\n *ngIf=\"totpSecret\"\n [qrdata]=\"qrData\"\n [errorCorrectionLevel]=\"'M'\"\n [elementType]=\"'svg'\"\n ></qrcode>\n </div>\n <p class=\"text-center text-muted\">\n {{ secret }}\n </p>\n</div>\n", dependencies: [{ kind: "directive", type: i3.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.QRCodeComponent, selector: "qrcode", inputs: ["allowEmptyString", "colorDark", "colorLight", "cssClass", "elementType", "errorCorrectionLevel", "imageSrc", "imageHeight", "imageWidth", "margin", "qrdata", "scale", "version", "width", "alt", "ariaLabel", "title"], outputs: ["qrCodeURL"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TotpSetupComponent, decorators: [{
type: Component,
args: [{ selector: 'c8y-totp-setup', template: "<div class=\"text-center\">\n <p\n class=\"m-24 m-t-16 m-b-0\"\n translate\n >\n Scan this QR code with your smartphone using the authenticator application.\n </p>\n\n <div class=\"d-flex j-c-center\">\n <qrcode\n [width]=\"180\"\n *ngIf=\"totpSecret\"\n [qrdata]=\"qrData\"\n [errorCorrectionLevel]=\"'M'\"\n [elementType]=\"'svg'\"\n ></qrcode>\n </div>\n <p class=\"text-center text-muted\">\n {{ secret }}\n </p>\n</div>\n" }]
}], ctorParameters: () => [{ type: i1.UserService }, { type: i2.AlertService }] });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidG90cC1zZXR1cC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9jb3JlL2F1dGhlbnRpY2F0aW9uL3RvdHAtc2V0dXAuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vY29yZS9hdXRoZW50aWNhdGlvbi90b3RwLXNldHVwLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQVUsTUFBTSxlQUFlLENBQUM7QUFDbEQsT0FBTyxFQUFTLFdBQVcsRUFBRSxNQUFNLGFBQWEsQ0FBQztBQUNqRCxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0sd0JBQXdCLENBQUM7QUFDdEQsT0FBTyxFQUFFLE9BQU8sRUFBRSxNQUFNLFNBQVMsQ0FBQzs7Ozs7OztBQU1sQyxNQUFNLE9BQU8sa0JBQWtCO0lBRzdCLElBQUksV0FBVztRQUNiLE9BQU8sSUFBSSxDQUFDLFVBQVUsQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLFVBQVUsQ0FBQyxXQUFXLENBQUMsQ0FBQyxDQUFDLEVBQUUsQ0FBQztJQUM1RCxDQUFDO0lBRUQsSUFBSSxNQUFNO1FBQ1IsT0FBTyxJQUFJLENBQUMsVUFBVSxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDLFNBQVMsQ0FBQyxDQUFDLENBQUMsRUFBRSxDQUFDO0lBQzFELENBQUM7SUFFRCxJQUFJLE1BQU07UUFDUixpRUFBaUU7UUFDakUsb0RBQW9EO1FBQ3BELHdEQUF3RDtRQUN4RCxNQUFNLEdBQUcsR0FBRyxJQUFJLEdBQUcsQ0FBQyxJQUFJLENBQUMsV0FBVyxDQUFDLENBQUM7UUFDdEMsTUFBTSxPQUFPLEdBQUcsR0FBRyxDQUFDLFlBQVksQ0FBQyxHQUFHLENBQUMsS0FBSyxDQUFDLElBQUksR0FBRyxDQUFDLFlBQVksQ0FBQyxHQUFHLENBQUMsTUFBTSxDQUFDLENBQUM7UUFDNUUsSUFBSSxDQUFDLE9BQU8sRUFBRSxDQUFDO1lBQ2IsSUFBSSxDQUFDLEtBQUssQ0FBQyxNQUFNLENBQUMsT0FBTyxDQUFDLCtCQUErQixDQUFDLENBQUMsQ0FBQztZQUM1RCxPQUFPLEVBQUUsQ0FBQztRQUNaLENBQUM7UUFDRCxPQUFPLGtCQUFrQixDQUFDLE9BQU8sQ0FBQyxDQUFDO0lBQ3JDLENBQUM7SUFFRCxZQUNVLElBQWlCLEVBQ2pCLEtBQW1CO1FBRG5CLFNBQUksR0FBSixJQUFJLENBQWE7UUFDakIsVUFBSyxHQUFMLEtBQUssQ0FBYztJQUMxQixDQUFDO0lBRUosS0FBSyxDQUFDLFFBQVE7UUFDWixJQUFJLENBQUM7WUFDSCxNQUFNLEVBQUUsSUFBSSxFQUFFLEdBQUcsTUFBTSxJQUFJLENBQUMsSUFBSSxDQUFDLGtCQUFrQixFQUFFLENBQUM7WUFDdEQsSUFBSSxDQUFDLFVBQVUsR0FBRyxJQUFJLENBQUM7UUFDekIsQ0FBQztRQUFDLE9BQU8sRUFBRSxFQUFFLENBQUM7WUFDWixJQUFJLENBQUMsS0FBSyxDQUFDLGdCQUFnQixDQUFDLEVBQUUsQ0FBQyxDQUFDO1FBQ2xDLENBQUM7SUFDSCxDQUFDOytHQXBDVSxrQkFBa0I7bUdBQWxCLGtCQUFrQixzRENUL0IsOGRBcUJBOzs0RkRaYSxrQkFBa0I7a0JBSjlCLFNBQVM7K0JBQ0UsZ0JBQWdCIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBPbkluaXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IElUb3RwLCBVc2VyU2VydmljZSB9IGZyb20gJ0BjOHkvY2xpZW50JztcbmltcG9ydCB7IEFsZXJ0U2VydmljZSB9IGZyb20gJy4uL2FsZXJ0L2FsZXJ0LnNlcnZpY2UnO1xuaW1wb3J0IHsgZ2V0dGV4dCB9IGZyb20gJy4uL2kxOG4nO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdjOHktdG90cC1zZXR1cCcsXG4gIHRlbXBsYXRlVXJsOiAnLi90b3RwLXNldHVwLmNvbXBvbmVudC5odG1sJ1xufSlcbmV4cG9ydCBjbGFzcyBUb3RwU2V0dXBDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xuICB0b3RwU2VjcmV0OiBJVG90cDtcblxuICBnZXQgcXJDb2RlSW1hZ2UoKSB7XG4gICAgcmV0dXJuIHRoaXMudG90cFNlY3JldCA/IHRoaXMudG90cFNlY3JldC5zZWNyZXRRclVybCA6ICcnO1xuICB9XG5cbiAgZ2V0IHNlY3JldCgpIHtcbiAgICByZXR1cm4gdGhpcy50b3RwU2VjcmV0ID8gdGhpcy50b3RwU2VjcmV0LnJhd1NlY3JldCA6ICcnO1xuICB9XG5cbiAgZ2V0IHFyRGF0YSgpIHtcbiAgICAvLyBUT0RPOiB3YWl0aW5nIGZvciBCRTosIG5vdyB3ZSBuZWVkIGV4dHJhY3QgaXQgZnJvbSBzZWNyZXRRclVybFxuICAgIC8vIGh0dHBzOi8vY3VtdWxvY2l0eS5hdGxhc3NpYW4ubmV0L2Jyb3dzZS9NVE0tMzYzODdcbiAgICAvLyByZXR1cm4gdGhpcy50b3RwU2VjcmV0ID8gdGhpcy50b3RwU2VjcmV0LnFyRGF0YSA6ICcnO1xuICAgIGNvbnN0IHVybCA9IG5ldyBVUkwodGhpcy5xckNvZGVJbWFnZSk7XG4gICAgY29uc3Qgb3RwQXV0aCA9IHVybC5zZWFyY2hQYXJhbXMuZ2V0KCdjaGwnKSB8fCB1cmwuc2VhcmNoUGFyYW1zLmdldCgnZGF0YScpO1xuICAgIGlmICghb3RwQXV0aCkge1xuICAgICAgdGhpcy5hbGVydC5kYW5nZXIoZ2V0dGV4dCgnRmFpbGVkIHRvIGdlbmVyYXRlIGEgUVIgY29kZS4nKSk7XG4gICAgICByZXR1cm4gJyc7XG4gICAgfVxuICAgIHJldHVybiBkZWNvZGVVUklDb21wb25lbnQob3RwQXV0aCk7XG4gIH1cblxuICBjb25zdHJ1Y3RvcihcbiAgICBwcml2YXRlIHVzZXI6IFVzZXJTZXJ2aWNlLFxuICAgIHByaXZhdGUgYWxlcnQ6IEFsZXJ0U2VydmljZVxuICApIHt9XG5cbiAgYXN5bmMgbmdPbkluaXQoKSB7XG4gICAgdHJ5IHtcbiAgICAgIGNvbnN0IHsgZGF0YSB9ID0gYXdhaXQgdGhpcy51c2VyLmdlbmVyYXRlVG90cFNlY3JldCgpO1xuICAgICAgdGhpcy50b3RwU2VjcmV0ID0gZGF0YTtcbiAgICB9IGNhdGNoIChleCkge1xuICAgICAgdGhpcy5hbGVydC5hZGRTZXJ2ZXJGYWlsdXJlKGV4KTtcbiAgICB9XG4gIH1cbn1cbiIsIjxkaXYgY2xhc3M9XCJ0ZXh0LWNlbnRlclwiPlxuICA8cFxuICAgIGNsYXNzPVwibS0yNCBtLXQtMTYgbS1iLTBcIlxuICAgIHRyYW5zbGF0ZVxuICA+XG4gICAgU2NhbiB0aGlzIFFSIGNvZGUgd2l0aCB5b3VyIHNtYXJ0cGhvbmUgdXNpbmcgdGhlIGF1dGhlbnRpY2F0b3IgYXBwbGljYXRpb24uXG4gIDwvcD5cblxuICA8ZGl2IGNsYXNzPVwiZC1mbGV4IGotYy1jZW50ZXJcIj5cbiAgICA8cXJjb2RlXG4gICAgICBbd2lkdGhdPVwiMTgwXCJcbiAgICAgICpuZ0lmPVwidG90cFNlY3JldFwiXG4gICAgICBbcXJkYXRhXT1cInFyRGF0YVwiXG4gICAgICBbZXJyb3JDb3JyZWN0aW9uTGV2ZWxdPVwiJ00nXCJcbiAgICAgIFtlbGVtZW50VHlwZV09XCInc3ZnJ1wiXG4gICAgPjwvcXJjb2RlPlxuICA8L2Rpdj5cbiAgPHAgY2xhc3M9XCJ0ZXh0LWNlbnRlciB0ZXh0LW11dGVkXCI+XG4gICAge3sgc2VjcmV0IH19XG4gIDwvcD5cbjwvZGl2PlxuIl19