@keycloakify/keycloak-account-ui/resources/ShareTheResource.js

<p align="center"> <img src="https://github.com/user-attachments/assets/e31c4910-7205-441c-9a35-e134b806b3a8"> </p> <p align="center"> <i>Repackaged Keycloak Account UI</i> <br> <br> <a href="https://github.com/keycloakify/keycloak-a

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Button, Chip, ChipGroup, Form, FormGroup, InputGroup, InputGroupItem, Modal, TextInput, ValidatedOptions, } from "@patternfly/react-core";
import { useEffect } from "react";
import { FormProvider, useFieldArray, useForm, useWatch, } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { FormErrorText, SelectControl, useAlerts, useEnvironment, } from "../ui-shared";
import { updateRequest } from "../api";
import { SharedWith } from "../resources/SharedWith";
export const ShareTheResource = ({ resource, permissions, open, onClose, }) => {
    const { t } = useTranslation();
    const context = useEnvironment();
    const { addAlert, addError } = useAlerts();
    const form = useForm();
    const { control, register, reset, formState: { errors, isValid }, setError, clearErrors, handleSubmit, } = form;
    const { fields, append, remove } = useFieldArray({
        control,
        name: "usernames",
    });
    useEffect(() => {
        if (fields.length === 0) {
            append({ value: "" });
        }
    }, [fields]);
    const watchFields = useWatch({
        control,
        name: "usernames",
        defaultValue: [],
    });
    const isDisabled = watchFields.every(({ value }) => value.trim().length === 0);
    const addShare = async ({ usernames, permissions }) => {
        try {
            await Promise.all(usernames
                .filter(({ value }) => value !== "")
                .map(({ value: username }) => updateRequest(context, resource._id, username, permissions)));
            addAlert(t("shareSuccess"));
            onClose();
        }
        catch (error) {
            addError(t("shareError", { error }).toString());
        }
        reset({});
    };
    const validateUser = async () => {
        const userOrEmails = fields.map((f) => f.value).filter((f) => f !== "");
        const userPermission = permissions === null || permissions === void 0 ? void 0 : permissions.map((p) => [p.username, p.email]).flat();
        const hasUsers = userOrEmails.length > 0;
        const alreadyShared = userOrEmails.filter((u) => userPermission === null || userPermission === void 0 ? void 0 : userPermission.includes(u)).length !== 0;
        if (!hasUsers || alreadyShared) {
            setError("usernames", {
                message: !hasUsers ? t("required") : t("resourceAlreadyShared"),
            });
        }
        else {
            clearErrors();
        }
        return hasUsers && !alreadyShared;
    };
    return (_jsx(Modal, { title: t("shareTheResource", { name: resource.name }), variant: "medium", isOpen: open, onClose: onClose, actions: [
            _jsx(Button, { variant: "primary", "data-testid": "done", isDisabled: !isValid, type: "submit", form: "share-form", children: t("done") }, "confirm"),
            _jsx(Button, { variant: "link", onClick: onClose, children: t("cancel") }, "cancel"),
        ], children: _jsxs(Form, { id: "share-form", onSubmit: handleSubmit(addShare), children: [_jsxs(FormGroup, { label: t("shareUser"), type: "string", fieldId: "users", isRequired: true, children: [_jsxs(InputGroup, { children: [_jsx(InputGroupItem, { children: _jsx(TextInput, Object.assign({ id: "users", "data-testid": "users", placeholder: t("usernamePlaceholder"), validated: errors.usernames
                                            ? ValidatedOptions.error
                                            : ValidatedOptions.default }, register(`usernames.${fields.length - 1}.value`, {
                                        validate: validateUser,
                                    }))) }), _jsx(InputGroupItem, { children: _jsx(Button, { variant: "primary", "data-testid": "add", onClick: () => append({ value: "" }), isDisabled: isDisabled, children: t("add") }, "add-user") })] }), fields.length > 1 && (_jsx(ChipGroup, { categoryName: t("shareWith"), children: fields.map((field, index) => index !== fields.length - 1 && (_jsx(Chip, { onClick: () => remove(index), children: field.value }, field.id))) })), errors.usernames && (_jsx(FormErrorText, { message: errors.usernames.message }))] }), _jsx(FormProvider, Object.assign({}, form, { children: _jsx(FormGroup, { label: "", fieldId: "permissions-selected", "data-testid": "permissions", children: _jsx(SelectControl, { name: "permissions", variant: "typeaheadMulti", controller: { defaultValue: [] }, options: resource.scopes.map(({ name, displayName }) => ({
                                key: name,
                                value: displayName || name,
                            })) }) }) })), _jsx(FormGroup, { children: _jsx(SharedWith, { permissions: permissions }) })] }) }));
};
//# sourceMappingURL=ShareTheResource.js.map