'use strict';

var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
var React = require('react');
var neetoAtoms = require('@bigbinary/neeto-atoms');
var neetoCist = require('@bigbinary/neeto-cist');
var initializers = require('@bigbinary/neeto-commons-frontend/v2/initializers');
var reactUtils = require('@bigbinary/neeto-commons-frontend/v2/react-utils');
var Container = require('@bigbinary/neeto-molecules/v2/Container');
var NeetoHeader = require('@bigbinary/neeto-molecules/v2/Header');
var reactI18next = require('react-i18next');
var constants = require('../../constants-D_H6M1Pm.js');
var useUsersApi = require('../../useUsersApi-CBZ1Dk5d.js');
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
var formik$1 = require('@bigbinary/neeto-atoms/formik');
var utils = require('@bigbinary/neeto-commons-frontend/v2/utils');
var ramda = require('ramda');
var i18next = require('i18next');
var yup = require('yup');
var formik = require('formik');
var MoreDropdown = require('@bigbinary/neeto-molecules/v2/MoreDropdown');
var jsxRuntime = require('react/jsx-runtime');
var ActionBlock = require('../../ActionBlock-C9Iy0jGZ.js');
var Select = require('../../Select-CshPoN2b.js');
require('@babel/runtime/helpers/objectWithoutProperties');
var lucideReact = require('lucide-react');
var SubHeader = require('@bigbinary/neeto-molecules/v2/SubHeader');
var utils$1 = require('../utils.js');
var _toConsumableArray = require('@babel/runtime/helpers/toConsumableArray');
require('@bigbinary/neeto-commons-frontend/constants');
require('@tanstack/react-query');
require('@bigbinary/neeto-commons-frontend/react-utils');
require('axios');
require('@bigbinary/neeto-commons-frontend/initializers');
require('../../_commonjsHelpers-BJu3ubxk.js');
require('../../useTeamsApi-ClWGPxNW.js');
require('qs');
require('../../queryClient-4vAFE3bx.js');

function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }

function _interopNamespace(e) {
  if (e && e.__esModule) return e;
  var n = Object.create(null);
  if (e) {
    Object.keys(e).forEach(function (k) {
      if (k !== 'default') {
        var d = Object.getOwnPropertyDescriptor(e, k);
        Object.defineProperty(n, k, d.get ? d : {
          enumerable: true,
          get: function () { return e[k]; }
        });
      }
    });
  }
  n.default = e;
  return Object.freeze(n);
}

var _slicedToArray__default = /*#__PURE__*/_interopDefault(_slicedToArray);
var Container__default = /*#__PURE__*/_interopDefault(Container);
var NeetoHeader__default = /*#__PURE__*/_interopDefault(NeetoHeader);
var _defineProperty__default = /*#__PURE__*/_interopDefault(_defineProperty);
var yup__namespace = /*#__PURE__*/_interopNamespace(yup);
var MoreDropdown__default = /*#__PURE__*/_interopDefault(MoreDropdown);
var SubHeader__default = /*#__PURE__*/_interopDefault(SubHeader);
var _toConsumableArray__default = /*#__PURE__*/_interopDefault(_toConsumableArray);

var MAXIMUM_NAME_LENGTH = 25;
var GROUP_FORM_VALIDATION_SCHEMA = yup__namespace.object({
  name: yup__namespace.string().required(i18next.t("neetoTeamMembers.validations.required", {
    what: i18next.t("neetoTeamMembers.common.name")
  })).trim(i18next.t("neetoTeamMembers.validations.noWhiteSpaces", {
    what: i18next.t("neetoTeamMembers.common.name")
  })).max(MAXIMUM_NAME_LENGTH, i18next.t("neetoTeamMembers.validations.max", {
    size: MAXIMUM_NAME_LENGTH
  }))
});
var GROUP_FORM_INITIAL_VALUES = {
  name: "",
  description: "",
  members: []
};
var DEFAULT_DELETE_GROUP_DATA = {
  isDeleting: false,
  group: {}
};
var DEFAULT_EDIT_GROUP = {
  isVisible: false,
  groupId: ""
};
var EVENTS = {
  GROUP_CREATED: "group_created"
};

var Member = function Member(_ref) {
  var member = _ref.member;
  var _useState = React.useState(false),
    _useState2 = _slicedToArray__default.default(_useState, 2),
    isDeleteAlertOpen = _useState2[0],
    setIsDeleteAlertOpen = _useState2[1];
  var _useTranslation = reactI18next.useTranslation(),
    t = _useTranslation.t;
  var _useFormikContext = formik.useFormikContext(),
    setFieldValue = _useFormikContext.setFieldValue,
    values = _useFormikContext.values;
  var handleRemoveMember = function handleRemoveMember(memberToRemove) {
    setFieldValue("members", values.members.filter(function (id) {
      return id !== memberToRemove.value;
    }));
    setIsDeleteAlertOpen(false);
  };
  return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
    children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
      className: "flex items-center justify-between neeto-ui-rounded-lg border p-2",
      children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
        className: "flex items-center space-x-2",
        children: [/*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Avatar, {
          className: "size-8 shrink-0",
          user: {
            name: member === null || member === void 0 ? void 0 : member.label
          }
        }), /*#__PURE__*/jsxRuntime.jsxs("div", {
          className: "ms-2 w-auto",
          children: [/*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Typography, {
            className: "mb-1 capitalize",
            variant: "body3",
            weight: "medium",
            children: member === null || member === void 0 ? void 0 : member.label
          }), /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Typography, {
            color: "muted",
            variant: "caption",
            children: initializers.taxonomies.groupMember.singular
          })]
        })]
      }), /*#__PURE__*/jsxRuntime.jsx(MoreDropdown__default.default, {
        dropdownProps: {
          position: "bottom-end"
        },
        menuItems: [{
          key: "delete-menu",
          "data-testid": "member-remove-button",
          label: t("neetoTeamMembers.common.remove"),
          onClick: function onClick() {
            return setIsDeleteAlertOpen(true);
          }
        }]
      })]
    }), /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Alert, {
      cancelButtonLabel: t("neetoTeamMembers.buttons.cancel"),
      isOpen: isDeleteAlertOpen,
      submitButtonLabel: t("neetoTeamMembers.common.remove"),
      message: /*#__PURE__*/jsxRuntime.jsx(reactI18next.Trans, {
        i18nKey: "neetoTeamMembers.alerts.messages.removeMember",
        values: {
          member: member === null || member === void 0 ? void 0 : member.label
        }
      }),
      title: t("neetoTeamMembers.labels.removeMember", {
        member: member === null || member === void 0 ? void 0 : member.label
      }),
      onClose: function onClose() {
        return setIsDeleteAlertOpen(false);
      },
      onSubmit: function onSubmit() {
        return handleRemoveMember(member);
      }
    })]
  });
};

var Members = function Members(_ref) {
  var _selectedMembers$leng;
  var members = _ref.members,
    membersSelectbox = _ref.membersSelectbox;
  var _useState = React.useState(false),
    _useState2 = _slicedToArray__default.default(_useState, 2),
    isAddNewMemberDropdownVisible = _useState2[0],
    setIsAddNewMemberDropdownVisible = _useState2[1];
  var _useFormikContext = formik.useFormikContext(),
    values = _useFormikContext.values;
  var selectedMembers = members === null || members === void 0 ? void 0 : members.filter(function (member) {
    var _values$members;
    return values === null || values === void 0 || (_values$members = values.members) === null || _values$members === void 0 ? void 0 : _values$members.includes(member.value);
  });
  var _useTranslation = reactI18next.useTranslation(),
    t = _useTranslation.t;
  return /*#__PURE__*/jsxRuntime.jsxs("div", {
    className: "w-full space-y-4",
    children: [/*#__PURE__*/jsxRuntime.jsxs(neetoAtoms.Typography, {
      variant: "body1",
      weight: "semibold",
      children: [initializers.taxonomies.groupMember.plural, " (", (_selectedMembers$leng = selectedMembers === null || selectedMembers === void 0 ? void 0 : selectedMembers.length) !== null && _selectedMembers$leng !== void 0 ? _selectedMembers$leng : 0, ")"]
    }), isAddNewMemberDropdownVisible ? membersSelectbox : /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Button, {
      "data-testid": "new-member-button",
      variant: "outline",
      onClick: function onClick() {
        return setIsAddNewMemberDropdownVisible(true);
      },
      children: t("neetoTeamMembers.common.addNew_", {
        what: initializers.taxonomies.groupMember.singular
      })
    }), /*#__PURE__*/jsxRuntime.jsx("div", {
      className: "w-full space-y-1",
      children: selectedMembers === null || selectedMembers === void 0 ? void 0 : selectedMembers.map(function (member) {
        return /*#__PURE__*/React.createElement(Member, {
          member: member,
          key: member.value
        });
      })
    })]
  });
};

var PaneSpinner = function PaneSpinner() {
  return /*#__PURE__*/jsxRuntime.jsx("div", {
    className: "flex h-full w-full items-center justify-center",
    children: /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Spinner, {})
  });
};

function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), true).forEach(function (r) { _defineProperty__default.default(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
var Form = function Form(_ref) {
  var _group$members$map, _group$members, _config$form$initialV, _config$form, _config$form2, _config$pane;
  var _ref$group = _ref.group,
    group = _ref$group === void 0 ? {} : _ref$group,
    _ref$config = _ref.config,
    config = _ref$config === void 0 ? {} : _ref$config,
    _ref$isEdit = _ref.isEdit,
    isEdit = _ref$isEdit === void 0 ? false : _ref$isEdit,
    _ref$onClose = _ref.onClose,
    onClose = _ref$onClose === void 0 ? neetoCist.noop : _ref$onClose;
  var _useTranslation = reactI18next.useTranslation(),
    t = _useTranslation.t;
  var _useFetchUsers = useUsersApi.useFetchUsers(),
    _useFetchUsers$data = _useFetchUsers.data,
    _useFetchUsers$data2 = _useFetchUsers$data === void 0 ? {} : _useFetchUsers$data,
    users = _useFetchUsers$data2.users,
    isLoading = _useFetchUsers.isLoading;
  var _useCreateGroup = useUsersApi.useCreateGroup(config),
    create = _useCreateGroup.mutate,
    isCreating = _useCreateGroup.isPending;
  var _useUpdateGroup = useUsersApi.useUpdateGroup(config),
    update = _useUpdateGroup.mutate,
    isUpdating = _useUpdateGroup.isPending;
  var initialValues = isEdit ? _objectSpread(_objectSpread({}, group), {}, {
    members: (_group$members$map = (_group$members = group.members) === null || _group$members === void 0 ? void 0 : _group$members.map(function (m) {
      return String(m.id);
    })) !== null && _group$members$map !== void 0 ? _group$members$map : []
  }) : ramda.mergeLeft((_config$form$initialV = config === null || config === void 0 || (_config$form = config.form) === null || _config$form === void 0 ? void 0 : _config$form.initialValues) !== null && _config$form$initialV !== void 0 ? _config$form$initialV : {}, GROUP_FORM_INITIAL_VALUES);
  var validationSchema = GROUP_FORM_VALIDATION_SCHEMA.concat(config === null || config === void 0 || (_config$form2 = config.form) === null || _config$form2 === void 0 ? void 0 : _config$form2.validationSchema);
  var memberOptions = React.useMemo(function () {
    var _users$map;
    return (_users$map = users === null || users === void 0 ? void 0 : users.map(function (u) {
      return {
        label: u.name,
        value: String(u.id)
      };
    })) !== null && _users$map !== void 0 ? _users$map : [];
  }, [users]);
  var handleSubmit = function handleSubmit(values) {
    var _values$members, _config$form3, _config$form3$otherPa;
    var payload = {
      group: ramda.mergeLeft({
        name: values.name,
        description: values.description,
        userIds: (_values$members = values.members) !== null && _values$members !== void 0 ? _values$members : []
      }, config === null || config === void 0 || (_config$form3 = config.form) === null || _config$form3 === void 0 || (_config$form3$otherPa = _config$form3.otherPayloadData) === null || _config$form3$otherPa === void 0 ? void 0 : _config$form3$otherPa.call(_config$form3, values))
    };
    if (isEdit) {
      update({
        id: group.id,
        payload: payload
      }, {
        onSuccess: function onSuccess() {
          return onClose();
        }
      });
    } else {
      create(payload, {
        onSuccess: function onSuccess() {
          utils.captureAnalyticsEvent(EVENTS.GROUP_CREATED);
          onClose();
        }
      });
    }
  };
  if (isLoading || config !== null && config !== void 0 && (_config$pane = config.pane) !== null && _config$pane !== void 0 && _config$pane.isLoading) return /*#__PURE__*/jsxRuntime.jsx(PaneSpinner, {});
  var membersSelect = /*#__PURE__*/jsxRuntime.jsx(Select.FormikSelect, {
    isMulti: true,
    closeMenuOnSelect: false,
    id: "members-autocomplete",
    label: initializers.taxonomies.groupMember.plural,
    name: "members",
    options: memberOptions,
    placeholder: initializers.taxonomies.groupMember.plural
  });
  return /*#__PURE__*/jsxRuntime.jsx(Select.FormikForm, {
    formProps: {
      noValidate: true,
      className: "flex w-full flex-col gap-y-4 pb-6"
    },
    formikProps: {
      enableReinitialize: true,
      initialValues: initialValues,
      validationSchema: validationSchema,
      onSubmit: handleSubmit
    },
    children: function children(_ref2) {
      var _config$form4, _config$form4$otherEl, _config$form5, _config$form5$otherEl;
      var values = _ref2.values;
      return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
        children: [/*#__PURE__*/jsxRuntime.jsx(formik$1.Input, {
          required: true,
          "data-testid": "group-name-text-field",
          label: t("neetoTeamMembers.common.name"),
          name: "name"
        }), /*#__PURE__*/jsxRuntime.jsx(formik$1.Textarea, {
          "data-testid": "group-description-text-area",
          label: t("neetoTeamMembers.common.description"),
          name: "description",
          rows: 4
        }), config === null || config === void 0 || (_config$form4 = config.form) === null || _config$form4 === void 0 || (_config$form4$otherEl = _config$form4.otherElements) === null || _config$form4$otherEl === void 0 ? void 0 : _config$form4$otherEl.call(_config$form4, values), isEdit ? /*#__PURE__*/jsxRuntime.jsx(Members, {
          members: memberOptions,
          membersSelectbox: membersSelect
        }) : membersSelect, config === null || config === void 0 || (_config$form5 = config.form) === null || _config$form5 === void 0 || (_config$form5$otherEl = _config$form5.otherElementsAtLast) === null || _config$form5$otherEl === void 0 ? void 0 : _config$form5$otherEl.call(_config$form5, values), /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Sheet.Footer, {
          className: "absolute bottom-0 start-0 gap-x-2",
          children: /*#__PURE__*/jsxRuntime.jsx(ActionBlock.FormikActionBlock, {
            cancelButtonProps: {
              onClick: onClose
            },
            isSubmitting: isCreating || isUpdating
          })
        })]
      });
    }
  });
};

var Create = reactUtils.withT(function (_ref) {
  var t = _ref.t,
    config = _ref.config,
    isOpen = _ref.isOpen,
    onClose = _ref.onClose;
  return /*#__PURE__*/jsxRuntime.jsxs(neetoAtoms.Sheet, {
    isOpen: isOpen,
    onClose: onClose,
    modal: false,
    children: [/*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Sheet.Header, {
      children: /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Sheet.Title, {
        children: t("neetoTeamMembers.common.addNew_", {
          what: initializers.taxonomies.group.singular
        })
      })
    }), /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Sheet.Body, {
      hasFooter: false,
      children: /*#__PURE__*/jsxRuntime.jsx(Form, {
        config: config,
        onClose: onClose
      })
    })]
  });
});

var Edit = function Edit(_ref) {
  var config = _ref.config,
    groupId = _ref.groupId,
    isOpen = _ref.isOpen,
    onClose = _ref.onClose;
  var _useTranslation = reactI18next.useTranslation(),
    t = _useTranslation.t;
  var _useFetchGroup = useUsersApi.useFetchGroup(groupId),
    group = _useFetchGroup.data,
    isLoading = _useFetchGroup.isLoading;
  return /*#__PURE__*/jsxRuntime.jsxs(neetoAtoms.Sheet, {
    isOpen: isOpen,
    onClose: onClose,
    modal: false,
    children: [/*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Sheet.Header, {
      children: /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Sheet.Title, {
        children: t("neetoTeamMembers.common.edit_", {
          what: initializers.taxonomies.group.singular
        })
      })
    }), /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Sheet.Body, {
      hasFooter: false,
      children: isLoading ? /*#__PURE__*/jsxRuntime.jsx("div", {
        className: "flex h-full w-full items-center justify-center",
        children: /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Spinner, {})
      }) : /*#__PURE__*/jsxRuntime.jsx(Form, {
        config: config,
        group: group,
        onClose: onClose,
        isEdit: true
      })
    })]
  });
};

var renderName = function renderName(_ref) {
  var name = _ref.name,
    group = _ref.group,
    config = _ref.config,
    setEditGroupDetail = _ref.setEditGroupDetail,
    setDeleteGroup = _ref.setDeleteGroup,
    getGroupDetail = _ref.getGroupDetail;
  return /*#__PURE__*/jsxRuntime.jsxs("div", {
    className: "flex items-center justify-between gap-x-3",
    children: [/*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Tooltip, {
      content: name,
      position: "bottom",
      children: /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Typography, {
        lineClamp: 1,
        variant: "body3",
        children: name
      })
    }), /*#__PURE__*/jsxRuntime.jsx(MoreDropdown__default.default, {
      dropdownProps: {
        position: "bottom-end"
      },
      menuItems: [{
        key: "edit-menu",
        label: i18next.t("neetoTeamMembers.common.edit"),
        onClick: function onClick() {
          return setEditGroupDetail({
            isVisible: true,
            groupId: group.id
          });
        }
      }, {
        key: "delete-menu",
        label: i18next.t("neetoTeamMembers.common.delete"),
        onClick: function onClick() {
          var _config$groupDependen, _config$table, _config$table$onBefor;
          config !== null && config !== void 0 && (_config$groupDependen = config.groupDependency) !== null && _config$groupDependen !== void 0 && _config$groupDependen.isCheckEnabled ? config === null || config === void 0 || (_config$table = config.table) === null || _config$table === void 0 || (_config$table$onBefor = _config$table.onBeforeDelete) === null || _config$table$onBefor === void 0 ? void 0 : _config$table$onBefor.call(_config$table, group) : setDeleteGroup({
            isDeleting: true,
            group: getGroupDetail(group.id)
          });
        }
      }]
    })]
  });
};
var getColumnData = function getColumnData(_ref2) {
  var _config$table$columns, _config$table2, _config$table2$column;
  var _ref2$config = _ref2.config,
    config = _ref2$config === void 0 ? {} : _ref2$config,
    setEditGroupDetail = _ref2.setEditGroupDetail,
    setDeleteGroup = _ref2.setDeleteGroup,
    getGroupDetail = _ref2.getGroupDetail;
  return [{
    accessorKey: "name",
    id: "name",
    header: i18next.t("neetoTeamMembers.common.name"),
    size: 250,
    cell: function cell(_ref3) {
      var row = _ref3.row;
      return renderName({
        name: row.original.name,
        group: row.original,
        config: config,
        setEditGroupDetail: setEditGroupDetail,
        setDeleteGroup: setDeleteGroup,
        getGroupDetail: getGroupDetail
      });
    }
  }, {
    accessorKey: "description",
    id: "description",
    header: i18next.t("neetoTeamMembers.common.description"),
    cell: function cell(_ref4) {
      var getValue = _ref4.getValue;
      return getValue() || "-";
    },
    size: 300
  }].concat(_toConsumableArray__default.default((_config$table$columns = config === null || config === void 0 || (_config$table2 = config.table) === null || _config$table2 === void 0 || (_config$table2$column = _config$table2.columnsData) === null || _config$table2$column === void 0 ? void 0 : _config$table2$column.call(_config$table2)) !== null && _config$table$columns !== void 0 ? _config$table$columns : []));
};

var List = function List(_ref) {
  var _config$table$deleteA, _config$table, _config$table$deleteA2;
  var config = _ref.config,
    groups = _ref.groups,
    isLoading = _ref.isLoading,
    searchTerm = _ref.searchTerm,
    pageProperties = _ref.pageProperties,
    setPageProperties = _ref.setPageProperties,
    emptyStateAction = _ref.emptyStateAction;
  var _useState = React.useState(DEFAULT_EDIT_GROUP),
    _useState2 = _slicedToArray__default.default(_useState, 2),
    editGroupDetail = _useState2[0],
    setEditGroupDetail = _useState2[1];
  var _useState3 = React.useState(DEFAULT_DELETE_GROUP_DATA),
    _useState4 = _slicedToArray__default.default(_useState3, 2),
    deleteGroup = _useState4[0],
    setDeleteGroup = _useState4[1];
  var _useTranslation = reactI18next.useTranslation(),
    t = _useTranslation.t;
  var totalCount = groups === null || groups === void 0 ? void 0 : groups.length;
  var _useDeleteGroup = useUsersApi.useDeleteGroup(config),
    groupDelete = _useDeleteGroup.mutate,
    isDeleting = _useDeleteGroup.isPending;
  var getGroupDetail = function getGroupDetail(id) {
    return neetoCist.findById(id, groups);
  };
  var handleGroupDelete = function handleGroupDelete(group) {
    groupDelete(group.id, {
      onSuccess: function onSuccess() {
        setDeleteGroup(DEFAULT_DELETE_GROUP_DATA);
      }
    });
  };
  var columnData = getColumnData({
    config: config,
    setEditGroupDetail: setEditGroupDetail,
    setDeleteGroup: setDeleteGroup,
    getGroupDetail: getGroupDetail
  });
  React.useEffect(function () {
    var _config$groupDependen, _config$groupDependen2, _config$groupDependen3, _config$groupDependen4;
    if (config !== null && config !== void 0 && (_config$groupDependen = config.groupDependency) !== null && _config$groupDependen !== void 0 && _config$groupDependen.isCheckEnabled && ((_config$groupDependen2 = config.groupDependency) === null || _config$groupDependen2 === void 0 ? void 0 : _config$groupDependen2.verificationStatus) === "successful" && !(config !== null && config !== void 0 && (_config$groupDependen3 = config.groupDependency) !== null && _config$groupDependen3 !== void 0 && _config$groupDependen3.isDependent) && neetoCist.isPresent(config === null || config === void 0 || (_config$groupDependen4 = config.groupDependency) === null || _config$groupDependen4 === void 0 ? void 0 : _config$groupDependen4.selectedGroup)) {
      var _config$groupDependen5;
      setDeleteGroup({
        isDeleting: true,
        group: config === null || config === void 0 || (_config$groupDependen5 = config.groupDependency) === null || _config$groupDependen5 === void 0 ? void 0 : _config$groupDependen5.selectedGroup
      });
    }
  }, [config === null || config === void 0 ? void 0 : config.groupDependency]);
  if (isLoading || isDeleting) {
    return /*#__PURE__*/jsxRuntime.jsx("div", {
      className: "flex h-full w-full items-center justify-center",
      children: /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Spinner, {})
    });
  }
  return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
    children: [ramda.isEmpty(groups) && !searchTerm ? /*#__PURE__*/jsxRuntime.jsx("div", {
      className: "flex w-full flex-1 items-center justify-center",
      children: /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Empty, {
        icon: lucideReact.UsersRound,
        description: t("neetoTeamMembers.common.groupEmptyDescription", {
          what: initializers.taxonomies.group.plural
        }),
        primaryButtonProps: {
          "data-testid": "ntm-add-group-button",
          label: t("neetoTeamMembers.common.addNew_", {
            what: initializers.taxonomies.group.singular
          }),
          onClick: emptyStateAction
        },
        title: t("neetoTeamMembers.common.groupEmptyTitle", {
          what: initializers.taxonomies.group.plural
        })
      })
    }) : ramda.isEmpty(groups) ? /*#__PURE__*/jsxRuntime.jsx("div", {
      className: "flex w-full flex-1 items-center justify-center",
      children: /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Empty, {
        icon: lucideReact.Search,
        description: t("neetoTeamMembers.common.groupSearchEmptyDescription"),
        title: t("neetoTeamMembers.common.groupSearchEmptyTitle", {
          what: initializers.taxonomies.group.plural
        })
      })
    }) : /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
      children: [/*#__PURE__*/jsxRuntime.jsx(SubHeader__default.default, {
        className: "mb-4",
        leftActionBlock: totalCount > 0 && /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Typography, {
          className: "me-4",
          "data-testid": "item-count",
          variant: "body1",
          weight: "semibold",
          children: utils$1.pluralizeLabelUsingTaxonomy(initializers.taxonomies.group.singular, totalCount)
        })
      }), /*#__PURE__*/jsxRuntime.jsx("div", {
        children: /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.DataTable, {
          totalCount: totalCount,
          fixedHeight: true,
          allowRowClick: false,
          columns: columnData,
          currentPage: pageProperties.index,
          data: groups || [],
          loading: isLoading,
          pageSize: pageProperties.size,
          onPageChange: function onPageChange(index, size) {
            return setPageProperties({
              index: index,
              size: size
            });
          }
        })
      })]
    }), /*#__PURE__*/jsxRuntime.jsx(Edit, {
      config: config,
      groupId: editGroupDetail.groupId,
      isOpen: editGroupDetail.isVisible,
      onClose: function onClose() {
        return setEditGroupDetail(DEFAULT_EDIT_GROUP);
      }
    }), /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Alert, {
      cancelButtonLabel: t("neetoTeamMembers.buttons.cancel"),
      isOpen: deleteGroup.isDeleting,
      submitButtonLabel: t("neetoTeamMembers.common.delete"),
      message: (_config$table$deleteA = config === null || config === void 0 || (_config$table = config.table) === null || _config$table === void 0 || (_config$table$deleteA2 = _config$table.deleteAlertMessage) === null || _config$table$deleteA2 === void 0 ? void 0 : _config$table$deleteA2.call(_config$table, deleteGroup.group)) !== null && _config$table$deleteA !== void 0 ? _config$table$deleteA : /*#__PURE__*/jsxRuntime.jsx(reactI18next.Trans, {
        i18nKey: "neetoTeamMembers.alerts.messages.delete",
        values: {
          resource: initializers.taxonomies.group.singular,
          name: deleteGroup.group.name
        }
      }),
      title: t("neetoTeamMembers.labels.deleteTitle", {
        resource: initializers.taxonomies.group.singular
      }),
      onClose: function onClose() {
        return setDeleteGroup(DEFAULT_DELETE_GROUP_DATA);
      },
      onSubmit: function onSubmit() {
        return handleGroupDelete(deleteGroup.group);
      }
    })]
  });
};

var Groups = function Groups(_ref) {
  var _config$header$breadc, _config$header, _config$header$titleH, _config$header2;
  var _ref$config = _ref.config,
    config = _ref$config === void 0 ? {} : _ref$config;
  var _useQueryParams = reactUtils.useQueryParams(),
    _useQueryParams$searc = _useQueryParams.searchTerm,
    searchTerm = _useQueryParams$searc === void 0 ? "" : _useQueryParams$searc;
  var _useState = React.useState(false),
    _useState2 = _slicedToArray__default.default(_useState, 2),
    isPaneOpen = _useState2[0],
    setIsPaneOpen = _useState2[1];
  var _useState3 = React.useState(constants.DEFAULT_PAGE_PROPERTIES),
    _useState4 = _slicedToArray__default.default(_useState3, 2),
    pageProperties = _useState4[0],
    setPageProperties = _useState4[1];
  var _useTranslation = reactI18next.useTranslation(),
    t = _useTranslation.t;
  var _useFetchGroups = useUsersApi.useFetchGroups({
      page: pageProperties.index,
      pageSize: pageProperties.size,
      searchTerm: searchTerm
    }),
    _useFetchGroups$data = _useFetchGroups.data,
    _useFetchGroups$data2 = _useFetchGroups$data === void 0 ? {} : _useFetchGroups$data,
    groups = _useFetchGroups$data2.groups,
    isLoading = _useFetchGroups.isLoading;
  var isFiltersVisible = neetoCist.isNotEmpty(groups) || neetoCist.isPresent(searchTerm);
  React.useEffect(function () {
    setPageProperties(constants.DEFAULT_PAGE_PROPERTIES);
  }, [searchTerm]);
  return /*#__PURE__*/jsxRuntime.jsxs(Container__default.default, {
    className: "pb-10",
    children: [/*#__PURE__*/jsxRuntime.jsx(NeetoHeader__default.default, {
      breadcrumbs: (_config$header$breadc = config === null || config === void 0 || (_config$header = config.header) === null || _config$header === void 0 ? void 0 : _config$header.breadcrumbs) !== null && _config$header$breadc !== void 0 ? _config$header$breadc : [],
      title: initializers.taxonomies.group.plural,
      titleHelpPopoverProps: (_config$header$titleH = config === null || config === void 0 || (_config$header2 = config.header) === null || _config$header2 === void 0 ? void 0 : _config$header2.titleHelpPopoverProps) !== null && _config$header$titleH !== void 0 ? _config$header$titleH : {},
      actionBlock: /*#__PURE__*/jsxRuntime.jsx("div", {
        className: "flex flex-row items-center justify-end",
        children: /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Button, {
          "data-testid": "add-new-group-button",
          onClick: function onClick() {
            return setIsPaneOpen(true);
          },
          children: t("neetoTeamMembers.common.addNew_", {
            what: initializers.taxonomies.group.singular
          })
        })
      }),
      searchProps: isFiltersVisible && {
        placeholder: t("neetoTeamMembers.placeholders.searchEntity", {
          entity: initializers.taxonomies.group.plural
        })
      }
    }), /*#__PURE__*/jsxRuntime.jsx(List, {
      config: config,
      groups: groups,
      isLoading: isLoading,
      pageProperties: pageProperties,
      searchTerm: searchTerm,
      setPageProperties: setPageProperties,
      emptyStateAction: function emptyStateAction() {
        return setIsPaneOpen(true);
      },
      onClose: function onClose() {
        return setIsPaneOpen(false);
      }
    }), /*#__PURE__*/jsxRuntime.jsx(Create, {
      config: config,
      isOpen: isPaneOpen,
      onClose: function onClose() {
        return setIsPaneOpen(false);
      }
    })]
  });
};

module.exports = Groups;
//# sourceMappingURL=Groups.js.map
