From 0f1871ec7464b88b1916a1693d43884bae18243a Mon Sep 17 00:00:00 2001
From: webreflection <andrea.giammarchi@gmail.com>
Date: Mon, 15 May 2023 19:09:17 +0200
Subject: [PATCH] [chore] Improve current Error extends

---
 pyscriptjs/src/exceptions.ts | 48 ++++++++++++------------------------
 1 file changed, 16 insertions(+), 32 deletions(-)

diff --git a/pyscriptjs/src/exceptions.ts b/pyscriptjs/src/exceptions.ts
index 6201be0ba27..ef45e3ab3f3 100644
--- a/pyscriptjs/src/exceptions.ts
+++ b/pyscriptjs/src/exceptions.ts
@@ -2,15 +2,10 @@ const CLOSEBUTTON = `<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'
 
 type MessageType = 'text' | 'html';
 
-/*
-These error codes are used to identify the type of error that occurred.
-The convention is:
-* PY0 - errors that occur when fetching
-* PY1 - errors that occur in config
-* Py2 - errors that occur in plugins
-* PY9 - Deprecation errors
-*/
-
+/**
+ * These error codes are used to identify the type of error that occurred.
+ * @see https://docs.pyscript.net/latest/reference/exceptions.html?highlight=errors
+ */
 export enum ErrorCode {
     GENERIC = 'PY0000', // Use this only for development then change to a more specific error code
     FETCH_ERROR = 'PY0001',
@@ -29,26 +24,20 @@ export enum ErrorCode {
 }
 
 export class UserError extends Error {
-    messageType: MessageType;
-    errorCode: ErrorCode;
     /**
      * `isinstance` doesn't work correctly across multiple realms.
      * Hence, `$$isUserError` flag / marker is used to identify a `UserError`.
      */
     $$isUserError: boolean;
 
-    constructor(errorCode: ErrorCode, message: string, t: MessageType = 'text') {
-        super(message);
-        this.errorCode = errorCode;
+    constructor(public errorCode: ErrorCode, message: string, public messageType: MessageType = 'text') {
+        super(`(${errorCode}): ${message}`);
         this.name = 'UserError';
-        this.messageType = t;
-        this.message = `(${errorCode}): ${message}`;
         this.$$isUserError = true;
     }
 }
 
 export class FetchError extends UserError {
-    errorCode: ErrorCode;
     constructor(errorCode: ErrorCode, message: string) {
         super(errorCode, message);
         this.name = 'FetchError';
@@ -56,7 +45,6 @@ export class FetchError extends UserError {
 }
 
 export class InstallError extends UserError {
-    errorCode: ErrorCode;
     constructor(errorCode: ErrorCode, message: string) {
         super(errorCode, message);
         this.name = 'InstallError';
@@ -78,25 +66,21 @@ export function _createAlertBanner(
             break;
     }
 
-    const banner = document.createElement('div');
-    banner.className = `alert-banner py-${level}`;
-
-    if (messageType === 'html') {
-        banner.innerHTML = message;
-    } else {
-        banner.textContent = message;
-    }
+    const content = messageType === 'html' ? 'innerHTML' : 'textContent';
+    const banner = Object.assign(document.createElement('div'), {
+        className: `alert-banner py-${level}`,
+        [content]: message,
+    });
 
     if (level === 'warning') {
-        const closeButton = document.createElement('button');
+        const closeButton = Object.assign(document.createElement('button'), {
+            id: 'alert-close-button',
+            innerHTML: CLOSEBUTTON,
+        });
 
-        closeButton.id = 'alert-close-button';
-        closeButton.addEventListener('click', () => {
+        banner.appendChild(closeButton).addEventListener('click', () => {
             banner.remove();
         });
-        closeButton.innerHTML = CLOSEBUTTON;
-
-        banner.appendChild(closeButton);
     }
 
     document.body.prepend(banner);