html: fix eslint warnings

html/.eslintrc.json

@@ -1,6 +1,12 @@
 {
   "extends": "./node_modules/gts/",
   "overrides": [
+    {
+      "files": ["**/*.ts", "**/*.tsx"],
+      "parserOptions": {
+        "jsxPragma": "h"
+      }
+    },
     {
       "files": ["gulpfile.js", "webpack.config.js"],
       "rules": {

html/package.json

@@ -11,7 +11,7 @@
   "license": "MIT",
   "scripts": {
     "prestart": "gulp clean",
-    "start": "webpack serve",
+    "start": "NODE_ENV=development && webpack serve",
     "build": "NODE_ENV=production webpack && gulp",
     "inline": "NODE_ENV=production webpack && gulp inline",
     "check": "gts check",

html/src/components/app.tsx

@@ -4,10 +4,6 @@ import { ITerminalOptions, ITheme } from 'xterm';
 import { ClientOptions, FlowControl } from './terminal/xterm';
 import { Terminal } from './terminal';
 
-if ((module as any).hot) {
-    require('preact/debug');
-}
-
 const protocol = window.location.protocol === 'https:' ? 'wss:' : 'ws:';
 const path = window.location.pathname.replace(/[/]+$/, '');
 const wsUrl = [protocol, '//', window.location.host, path, '/ws', window.location.search].join('');

html/src/components/terminal/xterm/addons/overlay.ts

@@ -59,15 +59,15 @@ position: absolute;
         if (this.overlayTimeout) clearTimeout(this.overlayTimeout);
         if (!timeout) return;
 
-        this.overlayTimeout = setTimeout(() => {
+        this.overlayTimeout = window.setTimeout(() => {
             overlayNode.style.opacity = '0';
-            this.overlayTimeout = setTimeout(() => {
+            this.overlayTimeout = window.setTimeout(() => {
                 if (overlayNode.parentNode) {
                     overlayNode.parentNode.removeChild(overlayNode);
                 }
                 this.overlayTimeout = undefined;
                 overlayNode.style.opacity = '0.75';
-            }, 200) as any;
-        }, timeout || 1500) as any;
+            }, 200);
+        }, timeout || 1500);
     }
 }

html/src/components/terminal/xterm/addons/zmodem.ts

@@ -43,7 +43,8 @@ export class ZmodemAddon implements ITerminalAddon {
                 this.sentry.consume(data);
             }
         } catch (e) {
-            this.handleError(e, 'consume');
+            console.error('[ttyd] zmodem consume: ', e);
+            this.reset();
         }
     }
 
@@ -53,12 +54,6 @@ export class ZmodemAddon implements ITerminalAddon {
         this.terminal.focus();
     }
 
-    @bind
-    private handleError(e: any, reason: string) {
-        console.error(`[ttyd] zmodem ${reason}: `, e);
-        this.reset();
-    }
-
     @bind
     private trzszInit() {
         const { terminal } = this;
@@ -100,12 +95,12 @@ export class ZmodemAddon implements ITerminalAddon {
 
     @bind
     private zmodemDetect(detection: Zmodem.Detection): void {
-        const { terminal, receiveFile, reset } = this;
+        const { terminal, receiveFile } = this;
         terminal.options.disableStdin = true;
 
         this.denier = () => detection.deny();
         this.session = detection.confirm();
-        this.session.on('session_end', () => reset());
+        this.session.on('session_end', () => this.reset());
 
         if (this.session.type === 'send') {
             this.options.onSend();
@@ -116,17 +111,17 @@ export class ZmodemAddon implements ITerminalAddon {
 
     @bind
     public sendFile(files: FileList) {
-        const { session, writeProgress, handleError } = this;
+        const { session, writeProgress } = this;
         Zmodem.Browser.send_files(session, files, {
             on_progress: (_, offer) => writeProgress(offer),
         })
             .then(() => session.close())
-            .catch(e => handleError(e, 'send'));
+            .catch(() => this.reset());
     }
 
     @bind
     private receiveFile() {
-        const { session, writeProgress, handleError } = this;
+        const { session, writeProgress } = this;
 
         session.on('offer', offer => {
             offer.on('input', () => writeProgress(offer));
@@ -136,7 +131,7 @@ export class ZmodemAddon implements ITerminalAddon {
                     const blob = new Blob(payloads, { type: 'application/octet-stream' });
                     saveAs(blob, offer.get_details().name);
                 })
-                .catch(e => handleError(e, 'receive'));
+                .catch(() => this.reset());
         });
 
         session.start();
@@ -154,6 +149,7 @@ export class ZmodemAddon implements ITerminalAddon {
         this.options.writer(`${name} ${percent}% ${bytesHuman(offset, 2)}/${bytesHuman(size, 2)}\r`);
     }
 
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     private bytesHuman(bytes: any, precision: number): string {
         if (!/^([-+])?|(\.\d+)(\d+(\.\d+)?|(\d+\.)|Infinity)$/.test(bytes)) {
             return '-';

html/src/components/terminal/xterm/index.ts

@@ -129,14 +129,15 @@ export class Xterm {
     }
 
     @bind
-    private onWindowUnload(event: BeforeUnloadEvent): any {
+    private onWindowUnload(event: BeforeUnloadEvent) {
+        event.preventDefault();
         const { socket } = this;
         if (socket && socket.readyState === WebSocket.OPEN) {
             const message = 'Close terminal? this will also terminate the command.';
             event.returnValue = message;
             return message;
         }
-        event.preventDefault();
+        return undefined;
     }
 
     @bind

html/src/index.tsx

@@ -1,3 +1,6 @@
+if (process.env.NODE_ENV === 'development') {
+    require('preact/debug');
+}
 import 'whatwg-fetch';
 import { h, render } from 'preact';
 import { App } from './components/app';