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 { UmbUserDetailRepository } from '../../../repository/index.js';
import { UmbUserKind } from '../../../utils/index.js';
import { UMB_CREATE_USER_SUCCESS_MODAL } from './create-user-success-modal.token.js';
import { UmbTextStyles } from '../../../../../core/style/index.js';
import { umbOpenModal, UmbModalBaseElement } from '../../../../../core/modal/index.js';
import { css, html, customElement, query } from '../../../../../../external/lit/index.js';
let UmbCreateUserModalElement = class UmbCreateUserModalElement extends UmbModalBaseElement {
    #userDetailRepository = new UmbUserDetailRepository(this);
    async #onSubmit(e) {
        e.preventDefault();
        const form = e.target;
        if (!form)
            return;
        const isValid = form.checkValidity();
        if (!isValid)
            return;
        const formData = new FormData(form);
        const name = formData.get('name');
        const email = formData.get('email');
        const userGroupPicker = form.querySelector('#userGroups');
        const userGroupReferences = userGroupPicker?.selection.map((unique) => {
            return { unique };
        });
        const { data: userScaffold } = await this.#userDetailRepository.createScaffold();
        if (!userScaffold)
            return;
        userScaffold.kind = this.data?.user.kind ?? UmbUserKind.DEFAULT;
        userScaffold.name = name;
        userScaffold.email = email;
        userScaffold.userName = email;
        userScaffold.userGroupUniques = userGroupReferences;
        // TODO: figure out when to use email or username
        const { data } = await this.#userDetailRepository.create(userScaffold);
        if (data) {
            if (data.kind === UmbUserKind.DEFAULT) {
                this.#openSuccessModal(data.unique);
            }
            else {
                this._submitModal();
            }
        }
    }
    async #openSuccessModal(userUnique) {
        await umbOpenModal(this, UMB_CREATE_USER_SUCCESS_MODAL, {
            data: {
                user: {
                    unique: userUnique,
                },
            },
        })
            .then(() => {
            this._submitModal();
        })
            .catch((reason) => {
            if (reason?.type === 'createAnotherUser') {
                this._form?.reset();
            }
            else {
                this._rejectModal();
            }
        });
    }
    render() {
        return html `<uui-dialog-layout headline=${this.localize.term('user_createUserHeadline', this.data?.user.kind)}>
			<p>${this.localize.term('user_createUserDescription', this.data?.user.kind)}</p>

			${this.#renderForm()}
			<uui-button @click=${this._rejectModal} slot="actions" label="Cancel" look="secondary"></uui-button>
			<uui-button
				form="CreateUserForm"
				slot="actions"
				type="submit"
				label="Create user"
				look="primary"
				color="positive"></uui-button>
		</uui-dialog-layout>`;
    }
    #renderForm() {
        return html ` <uui-form>
			<form id="CreateUserForm" name="form" @submit="${this.#onSubmit}">
				<uui-form-layout-item>
					<uui-label id="nameLabel" slot="label" for="name" required>Name</uui-label>
					<uui-input id="name" label="name" type="text" name="name" required></uui-input>
				</uui-form-layout-item>
				<uui-form-layout-item>
					<uui-label id="emailLabel" slot="label" for="email" required>Email</uui-label>
					<uui-input id="email" label="email" type="email" name="email" required></uui-input>
				</uui-form-layout-item>
				<uui-form-layout-item>
					<uui-label id="userGroupsLabel" slot="label" for="userGroups" required>User group</uui-label>
					<span slot="description">Add groups to assign access and permissions</span>
					<umb-user-group-input id="userGroups" name="userGroups"></umb-user-group-input>
				</uui-form-layout-item>
			</form>
		</uui-form>`;
    }
    static { this.styles = [
        UmbTextStyles,
        css `
			uui-input,
			uui-input-password,
			uui-combobox {
				width: 100%;
			}

			p {
				width: 580px;
			}

			uui-textarea {
				--uui-textarea-min-height: 100px;
			}
		`,
    ]; }
};
__decorate([
    query('#CreateUserForm')
], UmbCreateUserModalElement.prototype, "_form", void 0);
UmbCreateUserModalElement = __decorate([
    customElement('umb-create-user-modal')
], UmbCreateUserModalElement);
export { UmbCreateUserModalElement };
export default UmbCreateUserModalElement;
