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>` + }` } }