import { jsxDEV, Fragment } from "react/jsx-dev-runtime";
import { FieldContainer, Stack, Box, Select, Divider, Button, Icon } from "@contember/ui";
import { useCallback } from "react";
import { QueryLoader } from "../QueryLoader.js";
import { VariableSelector } from "./VariableSelector.js";
import { useListRolesQuery } from "../../queries/roles.js";
const EditMembership = ({ project, memberships, setMemberships, rolesConfig }) => {
  const { state: roleDefinitionState } = useListRolesQuery(project);
  const addMembership = useCallback(() => {
    setMemberships((memberships2) => [...memberships2, void 0]);
  }, [setMemberships]);
  return /* @__PURE__ */ jsxDEV(QueryLoader, { query: roleDefinitionState, children: ({ query }) => {
    const roleDefinitions = query.data.project.roles;
    const rolesToShow = rolesConfig ? roleDefinitions.filter(({ name }) => name in rolesConfig) : roleDefinitions;
    return /* @__PURE__ */ jsxDEV(FieldContainer, { label: "Roles", useLabelElement: false, children: /* @__PURE__ */ jsxDEV(Stack, { gap: "gap", children: [
      memberships.map((membership, membershipIndex) => {
        const roleDefinition = membership && roleDefinitions.find((def) => def.name === membership.role);
        const variablesToShow = (roleDefinition && roleDefinition.variables.filter((it) => "entityName" in it)) ?? [];
        const updateMembership = (newMembership) => {
          setMemberships((memberships2) => {
            const newMemberships = [...memberships2];
            newMemberships[membershipIndex] = newMembership;
            return newMemberships;
          });
        };
        const removeMembership = () => {
          setMemberships((memberships2) => {
            return memberships2.slice(0, membershipIndex).concat(memberships2.slice(membershipIndex + 1));
          });
        };
        return /* @__PURE__ */ jsxDEV(Box, { padding: false, children: [
          /* @__PURE__ */ jsxDEV(Stack, { align: "center", horizontal: true, gap: false, children: [
            /* @__PURE__ */ jsxDEV(
              Select,
              {
                required: true,
                distinction: "seamless-with-padding",
                onChange: (role) => {
                  if (typeof role === "string" && (!membership || role !== membership.role)) {
                    updateMembership({ role, variables: [] });
                  }
                },
                options: [
                  { value: null, label: "Select role", disabled: true },
                  ...rolesToShow.map(({ name: roleName }) => {
                    const otherIndex = memberships.findIndex((mem) => mem && mem.role === roleName);
                    const enabled = otherIndex === -1 || otherIndex === membershipIndex;
                    return {
                      value: roleName,
                      label: rolesConfig?.[roleName]?.name ?? roleName,
                      disabled: !enabled
                    };
                  })
                ],
                placeholder: "Select role",
                value: membership === void 0 ? null : membership.role
              },
              void 0,
              false,
              {
                fileName: "/__w/interface/interface/packages/admin/src/tenant/components/member/EditMembership.tsx",
                lineNumber: 72,
                columnNumber: 12
              },
              void 0
            ),
            /* @__PURE__ */ jsxDEV(Divider, { gap: false }, void 0, false, {
              fileName: "/__w/interface/interface/packages/admin/src/tenant/components/member/EditMembership.tsx",
              lineNumber: 95,
              columnNumber: 12
            }, void 0),
            /* @__PURE__ */ jsxDEV(
              Button,
              {
                square: true,
                distinction: "seamless",
                onClick: removeMembership,
                children: /* @__PURE__ */ jsxDEV(Icon, { blueprintIcon: "trash" }, void 0, false, {
                  fileName: "/__w/interface/interface/packages/admin/src/tenant/components/member/EditMembership.tsx",
                  lineNumber: 101,
                  columnNumber: 13
                }, void 0)
              },
              void 0,
              false,
              {
                fileName: "/__w/interface/interface/packages/admin/src/tenant/components/member/EditMembership.tsx",
                lineNumber: 96,
                columnNumber: 12
              },
              void 0
            )
          ] }, void 0, true, {
            fileName: "/__w/interface/interface/packages/admin/src/tenant/components/member/EditMembership.tsx",
            lineNumber: 71,
            columnNumber: 11
          }, void 0),
          variablesToShow.length > 0 && membership && /* @__PURE__ */ jsxDEV(Fragment, { children: [
            /* @__PURE__ */ jsxDEV(Divider, { gap: false }, void 0, false, {
              fileName: "/__w/interface/interface/packages/admin/src/tenant/components/member/EditMembership.tsx",
              lineNumber: 106,
              columnNumber: 12
            }, void 0),
            /* @__PURE__ */ jsxDEV(Box, { background: false, border: false, padding: false, children: /* @__PURE__ */ jsxDEV(Stack, { children: variablesToShow.map((variable) => /* @__PURE__ */ jsxDEV(
              VariableSelector,
              {
                rolesConfig,
                membership,
                variable,
                onChange: (newMembership) => {
                  updateMembership(newMembership);
                }
              },
              variable.name,
              false,
              {
                fileName: "/__w/interface/interface/packages/admin/src/tenant/components/member/EditMembership.tsx",
                lineNumber: 110,
                columnNumber: 15
              },
              void 0
            )) }, void 0, false, {
              fileName: "/__w/interface/interface/packages/admin/src/tenant/components/member/EditMembership.tsx",
              lineNumber: 108,
              columnNumber: 13
            }, void 0) }, void 0, false, {
              fileName: "/__w/interface/interface/packages/admin/src/tenant/components/member/EditMembership.tsx",
              lineNumber: 107,
              columnNumber: 12
            }, void 0)
          ] }, void 0, true, {
            fileName: "/__w/interface/interface/packages/admin/src/tenant/components/member/EditMembership.tsx",
            lineNumber: 105,
            columnNumber: 56
          }, void 0)
        ] }, membershipIndex, true, {
          fileName: "/__w/interface/interface/packages/admin/src/tenant/components/member/EditMembership.tsx",
          lineNumber: 70,
          columnNumber: 10
        }, void 0);
      }),
      /* @__PURE__ */ jsxDEV(
        Button,
        {
          distinction: "seamless",
          display: "block",
          justify: "start",
          onClick: addMembership,
          children: [
            /* @__PURE__ */ jsxDEV(Icon, { blueprintIcon: "add", style: { marginRight: "0.2em" } }, void 0, false, {
              fileName: "/__w/interface/interface/packages/admin/src/tenant/components/member/EditMembership.tsx",
              lineNumber: 134,
              columnNumber: 9
            }, void 0),
            "Add role"
          ]
        },
        void 0,
        true,
        {
          fileName: "/__w/interface/interface/packages/admin/src/tenant/components/member/EditMembership.tsx",
          lineNumber: 128,
          columnNumber: 8
        },
        void 0
      )
    ] }, void 0, true, {
      fileName: "/__w/interface/interface/packages/admin/src/tenant/components/member/EditMembership.tsx",
      lineNumber: 50,
      columnNumber: 7
    }, void 0) }, void 0, false, {
      fileName: "/__w/interface/interface/packages/admin/src/tenant/components/member/EditMembership.tsx",
      lineNumber: 49,
      columnNumber: 6
    }, void 0);
  } }, void 0, false, {
    fileName: "/__w/interface/interface/packages/admin/src/tenant/components/member/EditMembership.tsx",
    lineNumber: 43,
    columnNumber: 3
  }, void 0);
};
export {
  EditMembership
};
//# sourceMappingURL=EditMembership.js.map
