From d4692c81e054a78261959b24b23f4c2723db492d Mon Sep 17 00:00:00 2001
From: John Livingston <git@john-livingston.fr>
Date: Wed, 12 Jun 2024 18:51:04 +0200
Subject: [PATCH] Fix lit linting, WIP.

---
 .../templates/channel-configuration.ts        | 12 +++++-----
 client/common/configuration/register.ts       | 14 +++++++----
 .../elements/configuration-section-header.ts  | 23 +++++++++++++------
 3 files changed, 32 insertions(+), 17 deletions(-)

diff --git a/client/common/configuration/elements/templates/channel-configuration.ts b/client/common/configuration/elements/templates/channel-configuration.ts
index d9fd69ff..fb7d5df2 100644
--- a/client/common/configuration/elements/templates/channel-configuration.ts
+++ b/client/common/configuration/elements/templates/channel-configuration.ts
@@ -129,8 +129,8 @@ export function tplChannelConfiguration (el: ChannelConfigurationElement): Templ
 
       <form livechat-configuration-channel-options role="form" @submit=${el.saveConfig}>
         <livechat-configuration-section-header
-          .title=${ptTr(LOC_LIVECHAT_CONFIGURATION_CHANNEL_SLOW_MODE_LABEL)}
-          .description=${ptTr(LOC_LIVECHAT_CONFIGURATION_CHANNEL_SLOW_MODE_DESC, true)}
+          .label=${ptTr(LOC_LIVECHAT_CONFIGURATION_CHANNEL_SLOW_MODE_LABEL)}
+          .description=${ptTr(LOC_LIVECHAT_CONFIGURATION_CHANNEL_SLOW_MODE_DESC)}
           .helpPage=${'documentation/user/streamers/slow_mode'}>
         </livechat-configuration-section-header>
         <div class="form-group">
@@ -164,7 +164,7 @@ export function tplChannelConfiguration (el: ChannelConfigurationElement): Templ
         </div>
 
         <livechat-configuration-section-header
-          .title=${ptTr(LOC_LIVECHAT_CONFIGURATION_CHANNEL_BOT_OPTIONS_TITLE)}
+          .label=${ptTr(LOC_LIVECHAT_CONFIGURATION_CHANNEL_BOT_OPTIONS_TITLE)}
           .description=${''}
           .helpPage=${'documentation/user/streamers/channel'}>
         </livechat-configuration-section-header>
@@ -220,7 +220,7 @@ export function tplChannelConfiguration (el: ChannelConfigurationElement): Templ
           </div>
 
           <livechat-configuration-section-header
-            .title=${ptTr(LOC_LIVECHAT_CONFIGURATION_CHANNEL_FORBIDDEN_WORDS_LABEL)}
+            .label=${ptTr(LOC_LIVECHAT_CONFIGURATION_CHANNEL_FORBIDDEN_WORDS_LABEL)}
             .description=${ptTr(LOC_LIVECHAT_CONFIGURATION_CHANNEL_FORBIDDEN_WORDS_DESC)}
             .helpPage=${'documentation/user/streamers/bot/forbidden_words'}>
           </livechat-configuration-section-header>
@@ -241,7 +241,7 @@ export function tplChannelConfiguration (el: ChannelConfigurationElement): Templ
           ></livechat-dynamic-table-form>
 
           <livechat-configuration-section-header
-            .title=${ptTr(LOC_LIVECHAT_CONFIGURATION_CHANNEL_QUOTE_LABEL)}
+            .label=${ptTr(LOC_LIVECHAT_CONFIGURATION_CHANNEL_QUOTE_LABEL)}
             .description=${ptTr(LOC_LIVECHAT_CONFIGURATION_CHANNEL_QUOTE_DESC)}
             .helpPage=${'documentation/user/streamers/bot/quotes'}>
           </livechat-configuration-section-header>
@@ -262,7 +262,7 @@ export function tplChannelConfiguration (el: ChannelConfigurationElement): Templ
           ></livechat-dynamic-table-form>
 
           <livechat-configuration-section-header
-            .title=${ptTr(LOC_LIVECHAT_CONFIGURATION_CHANNEL_COMMAND_LABEL)}
+            .label=${ptTr(LOC_LIVECHAT_CONFIGURATION_CHANNEL_COMMAND_LABEL)}
             .description=${ptTr(LOC_LIVECHAT_CONFIGURATION_CHANNEL_COMMAND_DESC)}
             .helpPage=${'documentation/user/streamers/bot/commands'}>
           </livechat-configuration-section-header>
diff --git a/client/common/configuration/register.ts b/client/common/configuration/register.ts
index ce26119d..2dc36d88 100644
--- a/client/common/configuration/register.ts
+++ b/client/common/configuration/register.ts
@@ -28,9 +28,14 @@ async function registerConfiguration (clientOptions: RegisterClientOptions): Pro
     route: 'livechat/configuration/channel',
     onMount: async ({ rootEl }) => {
       const urlParams = new URLSearchParams(window.location.search)
-      const channelId = urlParams.get('channelId') ?? ''
-      render(html`<livechat-channel-configuration .registerClientOptions=${clientOptions}
-                                         .channelId=${channelId}></livechat-channel-configuration>`, rootEl)
+      const channelId = parseInt(urlParams.get('channelId') ?? '')
+      if (isNaN(channelId)) { throw new Error('Invalid channelId parameter') }
+      render(html`
+        <livechat-channel-configuration
+          .registerClientOptions=${clientOptions}
+          .channelId=${channelId}></livechat-channel-configuration
+        ></livechat-channel-configuration>
+      `, rootEl)
     }
   })
 
@@ -38,7 +43,8 @@ async function registerConfiguration (clientOptions: RegisterClientOptions): Pro
     route: 'livechat/configuration/emojis',
     onMount: async ({ rootEl }) => {
       const urlParams = new URLSearchParams(window.location.search)
-      const channelId = urlParams.get('channelId') ?? ''
+      const channelId = parseInt(urlParams.get('channelId') ?? '')
+      if (isNaN(channelId)) { throw new Error('Invalid channelId parameter') }
       render(html`
         <livechat-channel-emojis
           .registerClientOptions=${clientOptions}
diff --git a/client/common/lib/elements/configuration-section-header.ts b/client/common/lib/elements/configuration-section-header.ts
index a0ac92da..4ef36f29 100644
--- a/client/common/lib/elements/configuration-section-header.ts
+++ b/client/common/lib/elements/configuration-section-header.ts
@@ -1,7 +1,9 @@
 // SPDX-FileCopyrightText: 2024 Mehdi Benadel <https://mehdibenadel.com>
+// SPDX-FileCopyrightText: 2024 John Livingston <https://www.john-livingston.fr/>
 //
 // SPDX-License-Identifier: AGPL-3.0-only
 
+import { ptTr } from '../directives/translation'
 import { html } from 'lit'
 import { customElement, property } from 'lit/decorators.js'
 import { LivechatElement } from './livechat'
@@ -9,21 +11,28 @@ import { LivechatElement } from './livechat'
 @customElement('livechat-configuration-section-header')
 export class ConfigurationSectionHeaderElement extends LivechatElement {
   @property({ attribute: false })
-  public override title: string = 'title'
+  public label: string | ReturnType<typeof ptTr> = '???'
 
   @property({ attribute: false })
-  public description: string = 'Here\'s a description'
+  public description?: string | ReturnType<typeof ptTr>
 
   @property({ attribute: false })
-  public helpPage: string = 'documentation'
+  public helpPage?: string
 
   protected override render = (): unknown => {
     return html`
       <h2>
-        ${this.title}
-        <livechat-help-button .page=${this.helpPage}></livechat-help-button>
+        ${this.label}
+        ${
+          this.helpPage === undefined
+            ? ''
+            : html`<livechat-help-button .page=${this.helpPage}></livechat-help-button>`
+        }
       </h2>
-      <p>${this.description}</p>
-      `
+      ${
+        this.description === undefined
+          ? ''
+          : html`<p>${this.description}</p>`
+      }`
   }
 }