Redo some async things.

src/pages/KeyValue/KeyValueNew.ts

@@ -53,13 +53,13 @@ export class KeyValueNewPage extends Page {
     }) as HTMLFormElement;
     setPageContent(this.addKVNewForm);
 
-    this.addKVNewForm.addEventListener("submit", function (e: Event) {
+    this.addKVNewForm.addEventListener("submit", (e: Event) => {
       e.preventDefault();
-      (this as KeyValueNewPage).newKVSecretHandleForm();
-    }.bind(this));
+      void this.newKVSecretHandleForm();
+    });
   }
 
-  newKVSecretHandleForm(): void {
+  async newKVSecretHandleForm(): Promise<void> {
     const formData = new FormData(this.addKVNewForm);
     const path = formData.get("path") as string;
     let keyData = {};
@@ -68,18 +68,20 @@ export class KeyValueNewPage extends Page {
       keyData = { "key": "value" };
     }
 
-    createOrUpdateSecret(
+    try {
+      await createOrUpdateSecret(
         pageState.currentBaseMount,
         pageState.currentMountType,
         pageState.currentSecretPath,
         path,
         keyData
-    ).then(_ => {
+      )
       changePage("KEY_VALUE_VIEW");
-      return;
-    }).catch((e: Error) => {
-      setErrorText(e.message);
-    });
+    } catch (e: unknown) {
+      const error = e as Error;
+      setErrorText(error.message);
+    }
+
   }
 
   get titleSuffix(): string {

src/pages/TOTP/TOTPView.ts

@@ -24,7 +24,7 @@ export class TOTPViewPage extends Page {
   refresher: number;
   totpListElements: Record<string, TOTPListElement>;
 
-  render(): void {
+  async render(): Promise<void> {
     setTitleElement(pageState);
     const totpList = makeElement({ tag: "div" });
     setPageContent(makeElement({
@@ -47,30 +47,33 @@ export class TOTPViewPage extends Page {
     }));
 
 
-    getTOTPKeys(pageState.currentBaseMount).then(res => {
-      res.forEach(function (totpKeyName) {
-        const totpListElement = (this as TOTPViewPage).makeTOTPListElement(totpKeyName);
+    try {
+      const res = await getTOTPKeys(pageState.currentBaseMount);
+      for (const totpKeyName in res.entries()) {
+        const totpListElement = this.makeTOTPListElement(totpKeyName);
         totpList.appendChild(totpListElement);
-        (this as TOTPViewPage).totpListElements[totpKeyName] = totpListElement;
-        void (this as TOTPViewPage).updateTOTPElement(totpKeyName, totpListElement);
-      }, this);
+        this.totpListElements[totpKeyName] = totpListElement;
+        void this.updateTOTPElement(totpKeyName, totpListElement);
+      }
       document.getElementById("loadingText").remove();
-    }).catch((e: Error) => {
-      if (e == DoesNotExistError) {
+    } catch (e: unknown) {
+      const error = e as Error;
+      if (error == DoesNotExistError) {
         const loadingText = document.getElementById("loadingText");
         loadingText.innerText = i18next.t("totp_view_empty");
       } else {
-        setErrorText(e.message);
+        setErrorText(error.message);
+      }
     }
-    });
 
-    const totpRefresher = () => {
-      void Promise.all(Array.from(objectToMap(this.totpListElements)).map((kv: [string, TOTPListElement]) => {
+
+    const totpRefresher = async () => {
+      await Promise.all(Array.from(objectToMap(this.totpListElements)).map((kv: [string, TOTPListElement]) => {
         return this.updateTOTPElement(...kv);
       }))
     }
-    void totpRefresher();
-    this.refresher = setInterval(totpRefresher, 3000) as unknown as number;
+    await totpRefresher();
+    this.refresher = setInterval(() => { void totpRefresher(); }, 3000) as unknown as number;
   }
 
   cleanup(): void {

src/pages/Transit/TransitDecrypt.ts

@@ -71,10 +71,10 @@ export class TransitDecryptPage extends Page {
       ]
     }) as HTMLFormElement;
     setPageContent(this.transitDecryptForm);
-    this.transitDecryptForm.addEventListener("submit", async function (e: Event) {
+    this.transitDecryptForm.addEventListener("submit", (e: Event) => {
       e.preventDefault();
-      await (this as TransitDecryptPage).transitDecryptFormHandler();
-    }.bind(this));
+      void this.transitDecryptFormHandler();
+    });
   }
 
   async transitDecryptFormHandler(): Promise<void> {

src/pages/Transit/TransitEncrypt.ts

@@ -74,10 +74,10 @@ export class TransitEncryptPage extends Page {
     }) as HTMLFormElement;
     setPageContent(this.transitEncryptForm);
 
-    this.transitEncryptForm.addEventListener("submit", async function (e: Event) {
+    this.transitEncryptForm.addEventListener("submit", (e: Event) => {
       e.preventDefault();
-      await (this as TransitEncryptPage).transitEncryptFormHandler();
-    }.bind(this));
+      void this.transitEncryptFormHandler();
+    });
   }
 
   async transitEncryptFormHandler(): Promise<void> {

src/pages/Transit/TransitRewrap.ts

@@ -79,10 +79,11 @@ export class TransitRewrapPage extends Page {
       ]
     }) as HTMLFormElement;
     setPageContent(this.transitRewrapForm);
-    this.transitRewrapForm.addEventListener("submit", async function (e: Event) {
+
+    this.transitRewrapForm.addEventListener("submit", (e: Event) => {
       e.preventDefault();
-      await (this as TransitRewrapPage).transitRewrapFormHandler();
-    }.bind(this));
+      void this.transitRewrapFormHandler();
+    });
   }
 
   async transitRewrapFormHandler(): Promise<void> {

tsconfig.json

@@ -5,8 +5,9 @@
     "allowSyntheticDefaultImports": true,
     "module": "es6",
     "target": "es2019",
-    "jsx": "react",
+    "strictBindCallApply": true,
+    "noImplicitThis": true,
     "allowJs": true,
-    "moduleResolution": "node",
+    "moduleResolution": "node"
   }
 }