// SPDX-FileCopyrightText: 2024 Mehdi Benadel // // SPDX-License-Identifier: AGPL-3.0-only import type { RegisterClientOptions } from '@peertube/peertube-types/client' import { html } from 'lit' import { customElement, property, state } from 'lit/decorators.js' import { ptTr } from '../../lib/directives/translation' import { Task } from '@lit/task' import type { ChannelLiveChatInfos } from 'shared/lib/types' import { ChannelDetailsService } from '../services/channel-details' import { provide } from '@lit/context' import { channelDetailsServiceContext } from '../contexts/channel' import { registerClientOptionsContext } from '../../lib/contexts/peertube' import { LivechatElement } from '../../lib/elements/livechat' @customElement('livechat-channel-home') export class ChannelHomeElement extends LivechatElement { @provide({ context: registerClientOptionsContext }) @property({ attribute: false }) public registerClientOptions?: RegisterClientOptions @state() public _channels?: ChannelLiveChatInfos[] @provide({ context: channelDetailsServiceContext }) private _channelDetailsService?: ChannelDetailsService @state() public _formStatus: boolean | any = undefined private readonly _asyncTaskRender = new Task(this, { task: async ([registerClientOptions]) => { // Getting the current username in localStorage. Don't know any cleaner way to do. const username = window.localStorage.getItem('username') if (!username) { throw new Error('Can\'t get the current username.') } if (registerClientOptions) { this._channelDetailsService = new ChannelDetailsService(registerClientOptions) this._channels = await this._channelDetailsService.fetchUserChannels(username) } }, args: () => [this.registerClientOptions] }) protected override render = (): unknown => { return this._asyncTaskRender.render({ complete: () => html`

${ptTr(LOC_LIVECHAT_CONFIGURATION_TITLE)}

${ptTr(LOC_LIVECHAT_CONFIGURATION_DESC)}

${ptTr(LOC_LIVECHAT_CONFIGURATION_PLEASE_SELECT)}

` }) } }