Add typing to TOTPView.ts.
This commit is contained in:
parent
22824d4b90
commit
5971ae7bd8
|
@ -12,7 +12,7 @@ import { Page } from "./types/Page";
|
||||||
import { PwGenPage } from "./pages/PwGen";
|
import { PwGenPage } from "./pages/PwGen";
|
||||||
import { SetLanguagePage } from "./pages/SetLanguage";
|
import { SetLanguagePage } from "./pages/SetLanguage";
|
||||||
import { SetVaultURLPage } from "./pages/SetVaultURL";
|
import { SetVaultURLPage } from "./pages/SetVaultURL";
|
||||||
import { TOTPViewPage } from "./pages/TOTP/TOTPView.js";
|
import { TOTPViewPage } from "./pages/TOTP/TOTPView";
|
||||||
import { TransitDecryptPage } from "./pages/Transit/TransitDecrypt.js";
|
import { TransitDecryptPage } from "./pages/Transit/TransitDecrypt.js";
|
||||||
import { TransitEncryptPage } from "./pages/Transit/TransitEncrypt.js";
|
import { TransitEncryptPage } from "./pages/Transit/TransitEncrypt.js";
|
||||||
import { TransitViewPage } from "./pages/Transit/TransitView.js";
|
import { TransitViewPage } from "./pages/Transit/TransitView.js";
|
||||||
|
|
|
@ -6,18 +6,27 @@ import { getTOTPCode } from "../../api/getTOTPCode";
|
||||||
import { getTOTPKeys } from "../../api/getTOTPKeys";
|
import { getTOTPKeys } from "../../api/getTOTPKeys";
|
||||||
import { makeElement } from "../../htmlUtils";
|
import { makeElement } from "../../htmlUtils";
|
||||||
import { objectToMap } from "../../utils";
|
import { objectToMap } from "../../utils";
|
||||||
import { pageState } from "../../globalPageState.ts";
|
import { pageState } from "../../globalPageState";
|
||||||
import i18next from 'i18next';
|
import i18next from 'i18next';
|
||||||
|
|
||||||
|
export interface TOTPListElement extends HTMLElement {
|
||||||
|
setCode(code: string): void;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
export class TOTPViewPage extends Page {
|
export class TOTPViewPage extends Page {
|
||||||
constructor() {
|
constructor() {
|
||||||
super();
|
super();
|
||||||
this.refresher = undefined;
|
this.refresher = undefined;
|
||||||
this.totpListElements = {};
|
this.totpListElements = {};
|
||||||
}
|
}
|
||||||
async render() {
|
|
||||||
|
refresher: number;
|
||||||
|
totpListElements: Record<string, TOTPListElement>;
|
||||||
|
|
||||||
|
async render(): Promise<void> {
|
||||||
setTitleElement(pageState);
|
setTitleElement(pageState);
|
||||||
let totpList = makeElement({ tag: "div" });
|
const totpList = makeElement({ tag: "div" });
|
||||||
setPageContent(makeElement({
|
setPageContent(makeElement({
|
||||||
tag: "div",
|
tag: "div",
|
||||||
children: [
|
children: [
|
||||||
|
@ -38,9 +47,9 @@ export class TOTPViewPage extends Page {
|
||||||
}));
|
}));
|
||||||
|
|
||||||
|
|
||||||
getTOTPKeys(pageState.currentBaseMount, pageState.currentSecretPath).then(res => {
|
getTOTPKeys(pageState.currentBaseMount).then(res => {
|
||||||
res.forEach(async function (totpKeyName) {
|
res.forEach(async function (totpKeyName) {
|
||||||
let totpListElement = this.makeTOTPListElement(totpKeyName);
|
const totpListElement = this.makeTOTPListElement(totpKeyName);
|
||||||
totpList.appendChild(totpListElement);
|
totpList.appendChild(totpListElement);
|
||||||
this.totpListElements[totpKeyName] = totpListElement;
|
this.totpListElements[totpKeyName] = totpListElement;
|
||||||
await this.updateTOTPElement(totpKeyName, totpListElement);
|
await this.updateTOTPElement(totpKeyName, totpListElement);
|
||||||
|
@ -48,46 +57,47 @@ export class TOTPViewPage extends Page {
|
||||||
document.getElementById("loadingText").remove();
|
document.getElementById("loadingText").remove();
|
||||||
}).catch(e => {
|
}).catch(e => {
|
||||||
if (e == DoesNotExistError) {
|
if (e == DoesNotExistError) {
|
||||||
let loadingText = document.getElementById("loadingText");
|
const loadingText = document.getElementById("loadingText");
|
||||||
loadingText.innerText = i18next.t("totp_view_empty");
|
loadingText.innerText = i18next.t("totp_view_empty");
|
||||||
} else {
|
} else {
|
||||||
setErrorText(e.message);
|
setErrorText(e.message);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
let totpRefresher = async () => {
|
const totpRefresher = async () => {
|
||||||
await Promise.all(Array.from(objectToMap(this.totpListElements)).map((kv) => {
|
await Promise.all(Array.from(objectToMap(this.totpListElements)).map((kv) => {
|
||||||
return this.updateTOTPElement(...kv);
|
return this.updateTOTPElement(...kv);
|
||||||
}))
|
}))
|
||||||
}
|
}
|
||||||
await totpRefresher();
|
await totpRefresher();
|
||||||
this.refresher = setInterval(totpRefresher, 3000);
|
this.refresher = setInterval(totpRefresher, 3000) as unknown as number;
|
||||||
}
|
}
|
||||||
|
|
||||||
cleanup() {
|
cleanup(): void {
|
||||||
clearInterval(this.refresher);
|
clearInterval(this.refresher);
|
||||||
this.totpListElements = {};
|
this.totpListElements = {};
|
||||||
}
|
}
|
||||||
|
|
||||||
async updateTOTPElement(totpKeyName, totpListElement) {
|
async updateTOTPElement(totpKeyName: string, totpListElement: TOTPListElement): Promise<void> {
|
||||||
totpListElement.setCode(await getTOTPCode(pageState.currentBaseMount, totpKeyName));
|
totpListElement.setCode(await getTOTPCode(pageState.currentBaseMount, totpKeyName));
|
||||||
}
|
}
|
||||||
|
|
||||||
makeTOTPListElement(totpKeyName) {
|
makeTOTPListElement(totpKeyName: string): TOTPListElement {
|
||||||
let totpKeyBox = CopyableInputBox(totpKeyName, false);
|
const totpKeyBox = CopyableInputBox(totpKeyName, false);
|
||||||
let totpValueBox = CopyableInputBox(i18next.t("totp_view_loading_box"));
|
const totpValueBox = CopyableInputBox(i18next.t("totp_view_loading_box"));
|
||||||
|
|
||||||
let gridElement = makeElement({
|
const gridElement = makeElement({
|
||||||
tag: "div",
|
tag: "div",
|
||||||
class: ["uk-grid", "uk-grid-small", "uk-text-expand"],
|
class: ["uk-grid", "uk-grid-small", "uk-text-expand"],
|
||||||
children: [totpKeyBox, totpValueBox]
|
children: [totpKeyBox, totpValueBox]
|
||||||
});
|
}) as TOTPListElement;
|
||||||
|
|
||||||
gridElement.setCode = totpValueBox.setText;
|
gridElement.setCode = totpValueBox.setText;
|
||||||
|
|
||||||
return gridElement;
|
return gridElement;
|
||||||
}
|
}
|
||||||
get name() {
|
|
||||||
|
get name(): string {
|
||||||
return i18next.t("totp_view_title");
|
return i18next.t("totp_view_title");
|
||||||
}
|
}
|
||||||
}
|
}
|
Loading…
Reference in a new issue