import { __awaiter } from "tslib";
import { jsx as _jsx } from "@emotion/react/jsx-runtime";
import { Box, FormControl, VStack, Select } from "@chakra-ui/react";
import React from "react";
import useSWR from "swr";
import qore from "@qorebase/app-runtime/src/hooks/qore";
import { ComponentPropertyEditorContainer } from "@qorebase/app-runtime/src/components/ComponentPropertyEditorContainer";
import { useHumanize } from "@qorebase/app-runtime/src/utils/humanizeString";
const RolePropertyEditor = (props) => {
    const qoreClient = qore.useClient();
    const { data: roles = [] } = useSWR(["roles"], () => __awaiter(void 0, void 0, void 0, function* () {
        var _a;
        const resp = yield qoreClient.project.axios.get("/v1/roles");
        return (_a = resp.data) === null || _a === void 0 ? void 0 : _a.roles;
    }));
    const registerRoles = React.useMemo(() => roles.filter((role) => !["admin", "public"].includes(role.name)), [roles]);
    React.useEffect(() => {
        if (!props.value && registerRoles.length) {
            props.onChange(registerRoles[0].id);
        }
    }, [props.value, props.onChange, registerRoles]);
    const humanizedPropName = useHumanize(props.propName);
    return (_jsx(Box, { children: _jsx(ComponentPropertyEditorContainer, Object.assign({ title: humanizedPropName }, { children: _jsx(Box, Object.assign({ w: "100%" }, { children: _jsx(VStack, { children: _jsx(FormControl, { children: _jsx(Select, Object.assign({ size: "sm", value: props.value, placeholder: "Field in this context", onChange: (e) => {
                                props.onChange(e.currentTarget.value);
                            } }, { children: registerRoles.map((role) => (_jsx("option", Object.assign({ value: role.id }, { children: role.name }), role.id))) })) }) }) })) })) }));
};
export default RolePropertyEditor;
//# sourceMappingURL=role.js.map