import { defineElement, DiffuseElement, query } from "~/common/element.js";

/**
 * @import {ProxiedActions} from "~/common/worker.d.ts"
 * @import {InputElement} from "~/components/input/types.d.ts"
 * @import {Actions} from "~/components/metadata/types.d.ts"
 */

////////////////////////////////////////////
// ELEMENT
////////////////////////////////////////////

/**
 * @implements {ProxiedActions<Actions>}
 */
class AudioFileMetadata extends DiffuseElement {
  static NAME = "diffuse/metadata/audio-file";
  static WORKER_URL = "components/metadata/audio-file/worker.js";

  constructor() {
    super();

    /** @type {ProxiedActions<Actions>} */
    const p = this.workerProxy();

    this.patch = p.patch;
  }

  // LIFECYCLE

  /** @override */
  async connectedCallback() {
    super.connectedCallback();

    /** @type {InputElement} */
    this.input = query(this, "input-selector");

    await customElements.whenDefined(this.input.localName);
  }

  // WORKERS

  /**
   * @override
   */
  dependencies() {
    if (!this.input) throw new Error("Input element not defined yet");
    return { input: this.input };
  }
}

export default AudioFileMetadata;

////////////////////////////////////////////
// REGISTER
////////////////////////////////////////////

export const CLASS = AudioFileMetadata;
export const NAME = "dm-audio-file";

defineElement(NAME, AudioFileMetadata);