import '@operato/attachment/ox-attachment-list.js'

import { css, html } from 'lit'

import { i18next, localize } from '@things-factory/i18n-base'
import { PageView } from '@things-factory/shell'

export class AttachmentListPage extends localize(i18next)(PageView) {
  static get styles() {
    return [
      css`
        :host {
          display: flex;
        }

        attachment-selector {
          flex: 1;
        }
      `
    ]
  }

  static get properties() {
    return {}
  }

  get context() {
    return {
      title: 'attachment list',
      board_topmenu: true
    }
  }

  languageUpdated(i18next) {
    const attachmentList = this.renderRoot.querySelector('ox-attachment-list')
    attachmentList.requestUpdate()
  }

  async pageInitialized() {
    await this.updateComplete

    this.renderRoot.querySelector('ox-attachment-list').refreshAttachments()
  }

  render() {
    return html` <ox-attachment-list .creatable=${true}></ox-attachment-list> `
  }
}

customElements.define('attachment-list-page', AttachmentListPage)
