46 lines
1.4 KiB
TypeScript
46 lines
1.4 KiB
TypeScript
// SPDX-FileCopyrightText: 2024 Mehdi Benadel <https://mehdibenadel.com>
|
|
//
|
|
// SPDX-License-Identifier: AGPL-3.0-only
|
|
|
|
import { html } from 'lit'
|
|
import { customElement, property, state } from 'lit/decorators.js'
|
|
import { unsafeHTML } from 'lit/directives/unsafe-html.js'
|
|
import { helpButtonSVG } from '../../videowatch/buttons'
|
|
import { Task } from '@lit/task'
|
|
import { localizedHelpUrl } from '../../../utils/help'
|
|
import { ptTr } from '../directives/translation'
|
|
import type { DirectiveResult } from 'lit/directive'
|
|
import { LivechatElement } from './livechat'
|
|
|
|
@customElement('livechat-help-button')
|
|
export class HelpButtonElement extends LivechatElement {
|
|
@property({ attribute: false })
|
|
public buttonTitle: string | DirectiveResult = ptTr(LOC_ONLINE_HELP)
|
|
|
|
@property({ attribute: false })
|
|
public page: string = ''
|
|
|
|
@state()
|
|
public url: URL = new URL('https://lmddgtfy.net/')
|
|
|
|
private readonly _asyncTaskRender = new Task(this, {
|
|
task: async () => {
|
|
this.url = new URL(
|
|
await localizedHelpUrl(this.ptOptions, { page: this.page })
|
|
)
|
|
},
|
|
args: () => []
|
|
})
|
|
|
|
protected override render = (): unknown => {
|
|
return this._asyncTaskRender.render({
|
|
complete: () => html`<a
|
|
href="${this.url.href}"
|
|
target=_blank
|
|
title="${this.buttonTitle}"
|
|
class="orange-button peertube-button-link"
|
|
>${unsafeHTML(helpButtonSVG())}</a>`
|
|
})
|
|
}
|
|
}
|