var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
import { UMB_MEDIA_ENTITY_TYPE, UMB_MEDIA_ROOT_ENTITY_TYPE } from '../entity.js';
import { UMB_MEDIA_WORKSPACE_CONTEXT } from '../workspace/media-workspace.context-token.js';
import { UMB_MEDIA_COLLECTION_CONTEXT } from './media-collection.context-token.js';
import { customElement, html, ref, state, when } from '../../../../external/lit/index.js';
import { UmbCollectionDefaultElement } from '../../../core/collection/index.js';
import { UmbRequestReloadChildrenOfEntityEvent } from '../../../core/entity-action/index.js';
import { UMB_ACTION_EVENT_CONTEXT } from '../../../core/action/index.js';
let UmbMediaCollectionElement = class UmbMediaCollectionElement extends UmbCollectionDefaultElement {
    #collectionContext;
    constructor() {
        super();
        this._progress = -1;
        this._unique = null;
        this.consumeContext(UMB_MEDIA_COLLECTION_CONTEXT, (context) => {
            // TODO: stop consuming the context both in the default element and here. Instead make the default able to inform when the context is consumed. Or come up with a better system for the controllers to talk together. [NL]
            this.#collectionContext = context;
        });
        this.consumeContext(UMB_MEDIA_WORKSPACE_CONTEXT, (instance) => {
            this.observe(instance?.unique, (unique) => {
                this._unique = unique ?? null;
            });
        });
    }
    #observeProgressItems(dropzone) {
        if (!dropzone)
            return;
        this.observe(dropzone.progressItems(), (progressItems) => {
            progressItems.forEach((item) => {
                // We do not update folders as it may have children still being uploaded.
                if (item.folder?.name)
                    return;
                this.#collectionContext?.updatePlaceholderStatus(item.unique, item.status);
                this.#collectionContext?.updatePlaceholderProgress(item.unique, item.progress);
            });
        }, '_observeProgressItems');
    }
    async #setupPlaceholders(event) {
        event.preventDefault();
        const placeholders = event.items
            .filter((p) => p.parentUnique === this._unique)
            .map((p) => ({ unique: p.unique, status: p.status, name: p.temporaryFile?.file.name ?? p.folder?.name }));
        this.#collectionContext?.setPlaceholders(placeholders);
    }
    async #onComplete(event) {
        event.preventDefault();
        this._progress = -1;
        const eventContext = await this.getContext(UMB_ACTION_EVENT_CONTEXT);
        if (!eventContext) {
            throw new Error('Could not get event context');
        }
        const reloadEvent = new UmbRequestReloadChildrenOfEntityEvent({
            entityType: this._unique ? UMB_MEDIA_ENTITY_TYPE : UMB_MEDIA_ROOT_ENTITY_TYPE,
            unique: this._unique,
        });
        eventContext.dispatchEvent(reloadEvent);
    }
    #onProgress(event) {
        event.preventDefault();
        this._progress = (event.loaded / event.total) * 100;
        if (this._progress >= 100) {
            this._progress = -1;
        }
    }
    renderToolbar() {
        return html `
			<umb-collection-toolbar slot="header">
				<umb-collection-filter-field></umb-collection-filter-field>
			</umb-collection-toolbar>
			${when(this._progress >= 0, () => html `<uui-loader-bar progress=${this._progress}></uui-loader-bar>`)}
			<umb-dropzone-media
				id="dropzone"
				${ref(this.#observeProgressItems)}
				multiple
				.parentUnique=${this._unique}
				@submitted=${this.#setupPlaceholders}
				@complete=${this.#onComplete}
				@progress=${this.#onProgress}></umb-dropzone-media>
		`;
    }
};
__decorate([
    state()
], UmbMediaCollectionElement.prototype, "_progress", void 0);
__decorate([
    state()
], UmbMediaCollectionElement.prototype, "_unique", void 0);
UmbMediaCollectionElement = __decorate([
    customElement('umb-media-collection')
], UmbMediaCollectionElement);
export { UmbMediaCollectionElement };
export default UmbMediaCollectionElement;
export { UmbMediaCollectionElement as element };
