More cleanup

.editorconfig

@@ -0,0 +1,15 @@
+# SPDX-FileCopyrightText: 2024 Mehdi Benadel <https://mehdibenadel.com/>
+
+# SPDX-License-Identifier: AGPL-3.0-only
+
+root = true
+
+[**.{ts,json,js,css}]
+quote_type = single
+end_of_line = lf
+charset = utf-8
+# Please set your autosave delay to 1 second to avoid getting kicked out of the last line at each input
+trim_trailing_whitespace = true
+insert_final_newline = true
+indent_style = space
+indent_size = 2

client/.eslintrc.json

@@ -5,7 +5,8 @@
         "es6": true
     },
     "extends": [
-      "standard-with-typescript"
+      "standard-with-typescript",
+      "plugin:lit/recommended"
     ],
     "globals": {},
     "parser": "@typescript-eslint/parser",

client/common/configuration/elements/channel-configuration.ts

@@ -18,17 +18,17 @@ import { LivechatElement } from '../../lib/elements/livechat'
 export class ChannelConfigurationElement extends LivechatElement {
   @provide({ context: registerClientOptionsContext })
   @property({ attribute: false })
-  public registerClientOptions: RegisterClientOptions | undefined
+  public registerClientOptions?: RegisterClientOptions
 
   @property({ attribute: false })
-  public channelId: number | undefined
+  public channelId?: number
 
   @provide({ context: channelConfigurationContext })
   @state()
-  public _channelConfiguration: ChannelConfiguration | undefined
+  public _channelConfiguration?: ChannelConfiguration
 
   @provide({ context: channelDetailsServiceContext })
-  private _channelDetailsService: ChannelDetailsService | undefined
+  private _channelDetailsService?: ChannelDetailsService
 
   @state()
   public _formStatus: boolean | any = undefined
@@ -43,19 +43,22 @@ export class ChannelConfigurationElement extends LivechatElement {
     args: () => [this.registerClientOptions]
   })
 
-  private readonly _saveConfig = (ev?: Event): void => {
+  private readonly _saveConfig = (event?: Event): void => {
-    ev?.preventDefault()
+    event?.preventDefault()
     if (this._channelDetailsService && this._channelConfiguration) {
       this._channelDetailsService.saveOptions(this._channelConfiguration.channel.id,
         this._channelConfiguration.configuration)
         .then(() => {
           this._formStatus = { success: true }
-          console.log('Configuration has been updated')
+          this.registerClientOptions
+            ?.peertubeHelpers.notifier.info('Livechat configuration has been properly updated.')
           this.requestUpdate('_formStatus')
         })
-        .catch((error) => {
+        .catch((error: Error) => {
-          this._formStatus = error
+          console.error(`An error occurred. ${error.name}: ${error.message}`)
-          console.log(`An error occurred : ${JSON.stringify(this._formStatus)}`)
+          this.registerClientOptions
+            ?.peertubeHelpers.notifier.error(
+              `An error occurred. ${(error.name && error.message) ? `${error.name}: ${error.message}` : ''}`)
           this.requestUpdate('_formStatus')
         })
     }
@@ -342,18 +345,6 @@ export class ChannelConfigurationElement extends LivechatElement {
             <div class="form-group mt-5">
               <input type="submit" class="peertube-button-link orange-button" value=${ptTr(LOC_SAVE)} />
             </div>
-            ${(this._formStatus && this._formStatus.success === undefined)
-            ? html`<div class="alert alert-warning" role="alert">
-              An error occurred : ${JSON.stringify(this._formStatus)}
-            </div>`
-              : ''
-            }
-            ${(this._formStatus && this._formStatus.success === true)
-            ? html`<div class="alert alert-success" role="alert">
-              Configuration has been updated
-            </div>`
-              : ''
-            }
           </form>
         </div>`
     })

client/common/configuration/elements/channel-home.ts

@@ -18,13 +18,13 @@ import { LivechatElement } from '../../lib/elements/livechat'
 export class ChannelHomeElement extends LivechatElement {
   @provide({ context: registerClientOptionsContext })
   @property({ attribute: false })
-  public registerClientOptions: RegisterClientOptions | undefined
+  public registerClientOptions?: RegisterClientOptions
 
   @state()
-  public _channels: ChannelLiveChatInfos[] | undefined
+  public _channels?: ChannelLiveChatInfos[]
 
   @provide({ context: channelDetailsServiceContext })
-  private _channelDetailsService: ChannelDetailsService | undefined
+  private _channelDetailsService?: ChannelDetailsService
 
   @state()
   public _formStatus: boolean | any = undefined

client/common/lib/elements/dynamic-table-form.ts

@@ -380,7 +380,7 @@ export class DynamicTableFormElement extends LivechatElement {
     />
     ${(propertySchema.datalist)
 ? html`<datalist id=${inputId + '-datalist'}>
-      ${(propertySchema.datalist ?? []).map((value) => html`<option value=${value} />`)}
+      ${(propertySchema.datalist ?? []).map((value) => html`<option value=${value}>`)}
     </datalist>`
 : nothing}
     `

client/common/lib/elements/help-button.ts

@@ -18,7 +18,7 @@ import { LivechatElement } from './livechat'
 @customElement('livechat-help-button')
 export class HelpButtonElement extends LivechatElement {
   @consume({ context: registerClientOptionsContext, subscribe: true })
-  public registerClientOptions: RegisterClientOptions | undefined
+  public registerClientOptions?: RegisterClientOptions
 
   @property({ attribute: false })
   public buttonTitle: string | DirectiveResult = ptTr(LOC_ONLINE_HELP)

package-lock.json

@@ -42,6 +42,7 @@
         "eslint-config-standard": "^16.0.3",
         "eslint-config-standard-with-typescript": "^20.0.0",
         "eslint-plugin-import": "^2.25.2",
+        "eslint-plugin-lit": "^1.13.0",
         "eslint-plugin-node": "^11.1.0",
         "eslint-plugin-promise": "^5.1.1",
         "eslint-plugin-standard": "^5.0.0",
@@ -6726,6 +6727,23 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/eslint-plugin-lit": {
+      "version": "1.13.0",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-lit/-/eslint-plugin-lit-1.13.0.tgz",
+      "integrity": "sha512-vKc67q6YQ+naYO1QuFpqMoTs3535yp8+0WB/8bzZRLr5NSOb4C6vZrD4se7S9XZtym5TxSVlIqa9QTWYISykQg==",
+      "dev": true,
+      "dependencies": {
+        "parse5": "^6.0.1",
+        "parse5-htmlparser2-tree-adapter": "^6.0.1",
+        "requireindex": "^1.2.0"
+      },
+      "engines": {
+        "node": ">= 12"
+      },
+      "peerDependencies": {
+        "eslint": ">= 5"
+      }
+    },
     "node_modules/eslint-plugin-node": {
       "version": "11.1.0",
       "resolved": "https://registry.npmjs.org/eslint-plugin-node/-/eslint-plugin-node-11.1.0.tgz",
@@ -9851,6 +9869,21 @@
         "parse-torrent": "bin/cmd.js"
       }
     },
+    "node_modules/parse5": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/parse5/-/parse5-6.0.1.tgz",
+      "integrity": "sha512-Ofn/CTFzRGTTxwpNEs9PP93gXShHcTq255nzRYSKe8AkVpZY7e1fpmTfOyoIvjP5HG7Z2ZM7VS9PPhQGW2pOpw==",
+      "dev": true
+    },
+    "node_modules/parse5-htmlparser2-tree-adapter": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/parse5-htmlparser2-tree-adapter/-/parse5-htmlparser2-tree-adapter-6.0.1.tgz",
+      "integrity": "sha512-qPuWvbLgvDGilKc5BoicRovlT4MtYT6JfJyBOMDsKoiT+GiuP5qyrPCnR9HcPECIJJmZh5jRndyNThnhhb/vlA==",
+      "dev": true,
+      "dependencies": {
+        "parse5": "^6.0.1"
+      }
+    },
     "node_modules/parseurl": {
       "version": "1.3.3",
       "resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.3.tgz",
@@ -10426,6 +10459,15 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/requireindex": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/requireindex/-/requireindex-1.2.0.tgz",
+      "integrity": "sha512-L9jEkOi3ASd9PYit2cwRfyppc9NoABujTP8/5gFcbERmo5jUoAKovIC3fsF17pkTnGsrByysqX+Kxd2OTNI1ww==",
+      "dev": true,
+      "engines": {
+        "node": ">=0.10.5"
+      }
+    },
     "node_modules/requires-port": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz",
@@ -17703,6 +17745,17 @@
         }
       }
     },
+    "eslint-plugin-lit": {
+      "version": "1.13.0",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-lit/-/eslint-plugin-lit-1.13.0.tgz",
+      "integrity": "sha512-vKc67q6YQ+naYO1QuFpqMoTs3535yp8+0WB/8bzZRLr5NSOb4C6vZrD4se7S9XZtym5TxSVlIqa9QTWYISykQg==",
+      "dev": true,
+      "requires": {
+        "parse5": "^6.0.1",
+        "parse5-htmlparser2-tree-adapter": "^6.0.1",
+        "requireindex": "^1.2.0"
+      }
+    },
     "eslint-plugin-node": {
       "version": "11.1.0",
       "resolved": "https://registry.npmjs.org/eslint-plugin-node/-/eslint-plugin-node-11.1.0.tgz",
@@ -19859,6 +19912,21 @@
         "simple-sha1": "^3.1.0"
       }
     },
+    "parse5": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/parse5/-/parse5-6.0.1.tgz",
+      "integrity": "sha512-Ofn/CTFzRGTTxwpNEs9PP93gXShHcTq255nzRYSKe8AkVpZY7e1fpmTfOyoIvjP5HG7Z2ZM7VS9PPhQGW2pOpw==",
+      "dev": true
+    },
+    "parse5-htmlparser2-tree-adapter": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/parse5-htmlparser2-tree-adapter/-/parse5-htmlparser2-tree-adapter-6.0.1.tgz",
+      "integrity": "sha512-qPuWvbLgvDGilKc5BoicRovlT4MtYT6JfJyBOMDsKoiT+GiuP5qyrPCnR9HcPECIJJmZh5jRndyNThnhhb/vlA==",
+      "dev": true,
+      "requires": {
+        "parse5": "^6.0.1"
+      }
+    },
     "parseurl": {
       "version": "1.3.3",
       "resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.3.tgz",
@@ -20262,6 +20330,12 @@
       "integrity": "sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw==",
       "dev": true
     },
+    "requireindex": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/requireindex/-/requireindex-1.2.0.tgz",
+      "integrity": "sha512-L9jEkOi3ASd9PYit2cwRfyppc9NoABujTP8/5gFcbERmo5jUoAKovIC3fsF17pkTnGsrByysqX+Kxd2OTNI1ww==",
+      "dev": true
+    },
     "requires-port": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz",

package.json

@@ -66,6 +66,7 @@
     "eslint-config-standard": "^16.0.3",
     "eslint-config-standard-with-typescript": "^20.0.0",
     "eslint-plugin-import": "^2.25.2",
+    "eslint-plugin-lit": "^1.13.0",
     "eslint-plugin-node": "^11.1.0",
     "eslint-plugin-promise": "^5.1.1",
     "eslint-plugin-standard": "^5.0.0",