import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
import { useState, createElement, useEffect } from 'react';
import { removeBy, nullSafe, noop, isPresent, findById, isNotEmpty } from '@bigbinary/neeto-cist';
import { taxonomies } from '@bigbinary/neeto-commons-frontend/initializers';
import { withT, useQueryParams } from '@bigbinary/neeto-commons-frontend/react-utils';
import Container from '@bigbinary/neeto-molecules/Container';
import NeetoHeader from '@bigbinary/neeto-molecules/Header';
import Button from '@bigbinary/neetoui/Button';
import { useTranslation, Trans } from 'react-i18next';
import { u as useFetchUsers, a as useCreateGroup, b as useUpdateGroup, c as useFetchGroup, d as useDeleteGroup, e as useFetchGroups } from './useUsersApi-BRPy1kqa.js';
import { d as DEFAULT_PAGE_PROPERTIES } from './constants-CXdiW8NZ.js';
import Pane from '@bigbinary/neetoui/Pane';
import Typography from '@bigbinary/neetoui/Typography';
import { captureAnalyticsEvent } from '@bigbinary/neeto-commons-frontend/utils';
import ActionBlock from '@bigbinary/neetoui/formik/ActionBlock';
import Form$1 from '@bigbinary/neetoui/formik/Form';
import Input from '@bigbinary/neetoui/formik/Input';
import Select from '@bigbinary/neetoui/formik/Select';
import Textarea from '@bigbinary/neetoui/formik/Textarea';
import { pluck, mergeLeft, prop, isEmpty } from 'ramda';
import Spinner from '@bigbinary/neetoui/Spinner';
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
import { t } from 'i18next';
import * as yup from 'yup';
import { useFormikContext } from 'formik';
import MoreDropdown from '@bigbinary/neeto-molecules/MoreDropdown';
import Avatar from '@bigbinary/neetoui/Avatar';
import Alert from '@bigbinary/neetoui/Alert';
import _defineProperty from '@babel/runtime/helpers/defineProperty';
import SubHeader from '@bigbinary/neeto-molecules/SubHeader';
import TableWrapper from '@bigbinary/neeto-molecules/TableWrapper';
import Table from '@bigbinary/neetoui/Table';
import NoData from '@bigbinary/neetoui/NoData';
import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
import Tooltip from '@bigbinary/neetoui/Tooltip';
import { pluralizeLabelUsingTaxonomy } from './utils.js';
import '@tanstack/react-query';
import 'axios';
import '@bigbinary/neeto-commons-frontend/constants';
import './_commonjsHelpers-BFTU3MAI.js';
import './useTeamsApi-DkgWqw-g.js';
import '@babel/runtime/helpers/objectWithoutProperties';
import 'qs';
import './queryClient-Dsu-gu4Y.js';

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

var MAXIMUM_NAME_LENGTH = 25;
var GROUP_FORM_VALIDATION_SCHEMA = yup.object({
  name: yup.string().required(t("neetoTeamMembers.validations.required", {
    what: t("neetoTeamMembers.common.name")
  })).trim(t("neetoTeamMembers.validations.noWhiteSpaces", {
    what: t("neetoTeamMembers.common.name")
  })).max(MAXIMUM_NAME_LENGTH, 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 = useState(false),
    _useState2 = _slicedToArray(_useState, 2),
    isDeleteAlertOpen = _useState2[0],
    setIsDeleteAlertOpen = _useState2[1];
  var _useTranslation = useTranslation(),
    t = _useTranslation.t;
  var _useFormikContext = useFormikContext(),
    setFieldValue = _useFormikContext.setFieldValue,
    values = _useFormikContext.values;
  return /*#__PURE__*/jsxs(Fragment, {
    children: [/*#__PURE__*/jsxs("div", {
      className: "neeto-ui-neeto-ui-rounded-lg neeto-desk-team-settings__member-list flex items-center justify-between p-2",
      children: [/*#__PURE__*/jsxs("div", {
        className: "flex items-center space-x-2",
        children: [/*#__PURE__*/jsx(Avatar, {
          className: "shrink-0",
          size: "medium",
          user: {
            name: member === null || member === void 0 ? void 0 : member.name
          }
        }), /*#__PURE__*/jsxs("div", {
          className: "ms-2 w-auto",
          children: [/*#__PURE__*/jsx(Typography, {
            className: "mb-1 capitalize",
            style: "h5",
            weight: "medium",
            children: member === null || member === void 0 ? void 0 : member.name
          }), /*#__PURE__*/jsx(Typography, {
            style: "body3",
            weight: "normal",
            children: taxonomies.groupMember.singular
          })]
        })]
      }), /*#__PURE__*/jsx(MoreDropdown, {
        dropdownProps: {
          strategy: "fixed",
          position: "bottom-end"
        },
        menuItems: [{
          key: "delete-menu",
          "data-testid": "member-remove-button",
          label: t("neetoTeamMembers.common.remove"),
          onClick: function onClick() {
            return setIsDeleteAlertOpen(true);
          }
        }]
      })]
    }), /*#__PURE__*/jsx(Alert, {
      isOpen: isDeleteAlertOpen,
      submitButtonLabel: t("neetoTeamMembers.common.remove"),
      message: /*#__PURE__*/jsx(Trans, {
        i18nKey: "neetoTeamMembers.alerts.messages.removeMember",
        values: {
          member: member === null || member === void 0 ? void 0 : member.name
        }
      }),
      title: t("neetoTeamMembers.labels.removeMember", {
        member: member === null || member === void 0 ? void 0 : member.name
      }),
      onClose: function onClose() {
        return setIsDeleteAlertOpen(false);
      },
      onSubmit: function onSubmit() {
        setFieldValue("members", removeBy({
          id: member.id
        }, values.members));
        setIsDeleteAlertOpen(false);
      }
    })]
  });
};

var Members = function Members(_ref) {
  var members = _ref.members,
    membersSelectbox = _ref.membersSelectbox;
  var _useState = useState(false),
    _useState2 = _slicedToArray(_useState, 2),
    isAddNewMemberDropdownVisible = _useState2[0],
    setIsAddNewMemberDropdownVisible = _useState2[1];
  var _useFormikContext = useFormikContext(),
    values = _useFormikContext.values;
  var selectedMembers = members === null || members === void 0 ? void 0 : members.filter(function (member) {
    var _nullSafe;
    return (_nullSafe = nullSafe(pluck)("value", values === null || values === void 0 ? void 0 : values.members)) === null || _nullSafe === void 0 ? void 0 : _nullSafe.includes(member.value);
  });
  var _useTranslation = useTranslation(),
    t = _useTranslation.t;
  return /*#__PURE__*/jsxs("div", {
    className: "w-full space-y-4",
    children: [/*#__PURE__*/jsxs(Typography, {
      style: "h4",
      weight: "semibold",
      children: [taxonomies.groupMember.plural, " (", members ? members.length : 0, ")"]
    }), isAddNewMemberDropdownVisible ? membersSelectbox : /*#__PURE__*/jsx(Button, {
      "data-testid": "new-member-button",
      iconPosition: "left",
      style: "secondary",
      label: t("neetoTeamMembers.common.addNew_", {
        what: taxonomies.groupMember.singular
      }),
      onClick: function onClick() {
        return setIsAddNewMemberDropdownVisible(true);
      }
    }), /*#__PURE__*/jsx("div", {
      className: "w-full space-y-1",
      children: selectedMembers === null || selectedMembers === void 0 ? void 0 : selectedMembers.map(function (member) {
        return /*#__PURE__*/createElement(Member, {
          member: member,
          key: member.id
        });
      })
    })]
  });
};

var Form = function Form(_ref) {
  var _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 ? noop : _ref$onClose;
  var _useTranslation = useTranslation(),
    t = _useTranslation.t;
  var _useFetchUsers = useFetchUsers(),
    _useFetchUsers$data = _useFetchUsers.data,
    _useFetchUsers$data2 = _useFetchUsers$data === void 0 ? {} : _useFetchUsers$data,
    users = _useFetchUsers$data2.users,
    isLoading = _useFetchUsers.isLoading;
  var _useCreateGroup = useCreateGroup(config),
    create = _useCreateGroup.mutate,
    isCreating = _useCreateGroup.isPending;
  var _useUpdateGroup = useUpdateGroup(config),
    update = _useUpdateGroup.mutate,
    isUpdating = _useUpdateGroup.isPending;
  var initialValues = isEdit ? group : mergeLeft(GROUP_FORM_INITIAL_VALUES, (_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 : {});
  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 getUserIds = function getUserIds(members) {
    return members ? pluck("id", members) : [];
  };
  var handleSubmit = function handleSubmit(values) {
    var _config$form3, _config$form3$otherPa;
    var payload = {
      group: mergeLeft({
        name: values.name,
        description: values.description,
        userIds: getUserIds(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() {
          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__*/jsx(PaneSpinner, {});
  return /*#__PURE__*/jsx(Form$1, {
    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__*/jsxs(Fragment, {
        children: [/*#__PURE__*/jsx(Input, {
          required: true,
          "data-testid": "group-name-text-field",
          label: t("neetoTeamMembers.common.name"),
          name: "name"
        }), /*#__PURE__*/jsx(Textarea, {
          "data-testid": "group-description-text-area",
          label: t("neetoTeamMembers.common.description"),
          name: "description",
          rows: 4,
          size: "medium"
        }), 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__*/jsx(Members, {
          members: values.members,
          membersSelectbox: /*#__PURE__*/jsx(Select, {
            isMulti: true,
            closeMenuOnSelect: false,
            getOptionLabel: prop("name"),
            getOptionValue: prop("id"),
            id: "members-autocomplete",
            label: taxonomies.groupMember.plural,
            name: "members",
            options: users,
            placeholder: taxonomies.groupMember.plural
          })
        }) : /*#__PURE__*/jsx(Select, {
          isMulti: true,
          closeMenuOnSelect: false,
          getOptionLabel: prop("name"),
          getOptionValue: prop("id"),
          id: "members-autocomplete",
          label: taxonomies.groupMember.plural,
          name: "members",
          options: users,
          placeholder: taxonomies.groupMember.plural
        }), 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__*/jsx(Pane.Footer, {
          className: "absolute bottom-0 start-0",
          children: /*#__PURE__*/jsx(ActionBlock, {
            cancelButtonProps: {
              onClick: onClose
            },
            isSubmitting: isCreating || isUpdating
          })
        })]
      });
    }
  });
};

var Create = withT(function (_ref) {
  var t = _ref.t,
    config = _ref.config,
    isOpen = _ref.isOpen,
    onClose = _ref.onClose;
  return /*#__PURE__*/jsxs(Pane, {
    isOpen: isOpen,
    onClose: onClose,
    children: [/*#__PURE__*/jsx(Pane.Header, {
      children: /*#__PURE__*/jsx(Typography, {
        style: "h2",
        weight: "semibold",
        children: t("neetoTeamMembers.common.addNew_", {
          what: taxonomies.group.singular
        })
      })
    }), /*#__PURE__*/jsx(Pane.Body, {
      children: /*#__PURE__*/jsx(Form, {
        config: config,
        onClose: onClose
      })
    })]
  });
});

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__*/jsxs("div", {
    className: "flex items-center justify-between gap-x-3",
    children: [/*#__PURE__*/jsx(Tooltip, {
      content: name,
      position: "bottom",
      children: /*#__PURE__*/jsx(Typography, {
        className: "truncate",
        style: "body2",
        children: name
      })
    }), /*#__PURE__*/jsx(MoreDropdown, {
      dropdownButtonProps: {
        className: "me-1 my-1"
      },
      dropdownProps: {
        strategy: "fixed",
        position: "bottom-end",
        appendTo: function appendTo() {
          return document.body;
        }
      },
      menuItems: [{
        key: "edit-menu",
        label: t("neetoTeamMembers.common.edit"),
        onClick: function onClick() {
          return setEditGroupDetail({
            isVisible: true,
            groupId: group.id
          });
        }
      }, {
        key: "delete-menu",
        label: 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 [{
    dataIndex: "name",
    key: "name",
    title: t("neetoTeamMembers.common.name"),
    ellipsis: true,
    width: 250,
    render: function render(name, group) {
      return renderName({
        name: name,
        group: group,
        config: config,
        setEditGroupDetail: setEditGroupDetail,
        setDeleteGroup: setDeleteGroup,
        getGroupDetail: getGroupDetail
      });
    }
  }, {
    dataIndex: "description",
    key: "description",
    title: t("neetoTeamMembers.common.description"),
    render: function render(description) {
      return description || "-";
    },
    width: 300
  }].concat(_toConsumableArray((_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 Edit = function Edit(_ref) {
  var config = _ref.config,
    groupId = _ref.groupId,
    isOpen = _ref.isOpen,
    onClose = _ref.onClose;
  var _useTranslation = useTranslation(),
    t = _useTranslation.t;
  var _useFetchGroup = useFetchGroup(groupId),
    group = _useFetchGroup.data,
    isLoading = _useFetchGroup.isLoading;
  return /*#__PURE__*/jsxs(Pane, {
    isOpen: isOpen,
    onClose: onClose,
    children: [/*#__PURE__*/jsx(Pane.Header, {
      children: /*#__PURE__*/jsx(Typography, {
        style: "h2",
        weight: "semibold",
        children: t("neetoTeamMembers.common.edit_", {
          what: taxonomies.group.singular
        })
      })
    }), /*#__PURE__*/jsx(Pane.Body, {
      children: isLoading ? /*#__PURE__*/jsx("div", {
        className: "flex h-full w-full items-center justify-center",
        children: /*#__PURE__*/jsx(Spinner, {})
      }) : /*#__PURE__*/jsx(Form, {
        config: config,
        group: group,
        onClose: onClose,
        isEdit: true
      })
    })]
  });
};

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(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 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 = useState(DEFAULT_EDIT_GROUP),
    _useState2 = _slicedToArray(_useState, 2),
    editGroupDetail = _useState2[0],
    setEditGroupDetail = _useState2[1];
  var _useState3 = useState(DEFAULT_DELETE_GROUP_DATA),
    _useState4 = _slicedToArray(_useState3, 2),
    deleteGroup = _useState4[0],
    setDeleteGroup = _useState4[1];
  var _useTranslation = useTranslation(),
    t = _useTranslation.t;
  var totalCount = groups === null || groups === void 0 ? void 0 : groups.length;
  var _useDeleteGroup = useDeleteGroup(config),
    groupDelete = _useDeleteGroup.mutate,
    isDeleting = _useDeleteGroup.isPending;
  var getGroupDetail = function getGroupDetail(id) {
    return 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
  });
  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) && 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__*/jsx("div", {
      className: "flex h-full w-full items-center justify-center",
      children: /*#__PURE__*/jsx(Spinner, {})
    });
  }
  return /*#__PURE__*/jsxs(Fragment, {
    children: [!isEmpty(groups) ? /*#__PURE__*/jsxs(Fragment, {
      children: [/*#__PURE__*/jsx(SubHeader, {
        className: "mb-4",
        leftActionBlock: totalCount > 0 && /*#__PURE__*/jsx(Typography, {
          className: "me-4 font-semibold",
          component: "h4",
          "data-testid": "item-count",
          children: pluralizeLabelUsingTaxonomy(taxonomies.group.singular, totalCount)
        })
      }), /*#__PURE__*/jsx(TableWrapper, {
        hasPagination: totalCount > pageProperties.size,
        children: /*#__PURE__*/jsx(Table, {
          columnData: columnData,
          totalCount: totalCount,
          fixedHeight: true,
          allowRowClick: false,
          currentPageNumber: pageProperties.index,
          defaultPageSize: pageProperties.size,
          loading: isLoading,
          rowData: groups,
          rowSelection: false,
          handlePageChange: function handlePageChange(index, size) {
            return setPageProperties({
              index: index,
              size: size
            });
          }
        })
      })]
    }) : /*#__PURE__*/jsx("div", {
      className: "flex h-full w-full grow items-center justify-center",
      children: /*#__PURE__*/jsx(NoData, _objectSpread(_objectSpread({
        title: t("neetoTeamMembers.helpers.emptyTable", {
          entity: taxonomies.group.plural
        })
      }, !searchTerm && {
        primaryButtonProps: {
          label: t("neetoTeamMembers.common.addNew_", {
            what: taxonomies.group.singular
          }),
          onClick: emptyStateAction
        }
      }), config === null || config === void 0 ? void 0 : config.noDataProps))
    }), /*#__PURE__*/jsx(Edit, {
      config: config,
      groupId: editGroupDetail.groupId,
      isOpen: editGroupDetail.isVisible,
      onClose: function onClose() {
        return setEditGroupDetail(DEFAULT_EDIT_GROUP);
      }
    }), /*#__PURE__*/jsx(Alert, {
      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__*/jsx(Trans, {
        i18nKey: "neetoTeamMembers.alerts.messages.delete",
        values: {
          resource: taxonomies.group.singular,
          name: deleteGroup.group.name
        }
      }),
      title: t("neetoTeamMembers.labels.deleteTitle", {
        resource: 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 = useQueryParams(),
    _useQueryParams$searc = _useQueryParams.searchTerm,
    searchTerm = _useQueryParams$searc === void 0 ? "" : _useQueryParams$searc;
  var _useState = useState(false),
    _useState2 = _slicedToArray(_useState, 2),
    isPaneOpen = _useState2[0],
    setIsPaneOpen = _useState2[1];
  var _useState3 = useState(DEFAULT_PAGE_PROPERTIES),
    _useState4 = _slicedToArray(_useState3, 2),
    pageProperties = _useState4[0],
    setPageProperties = _useState4[1];
  var _useTranslation = useTranslation(),
    t = _useTranslation.t;
  var _useFetchGroups = 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 = isNotEmpty(groups) || isPresent(searchTerm);
  useEffect(function () {
    setPageProperties(DEFAULT_PAGE_PROPERTIES);
  }, [searchTerm]);
  return /*#__PURE__*/jsxs(Container, {
    children: [/*#__PURE__*/jsx(NeetoHeader, {
      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: 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__*/jsx("div", {
        className: "flex flex-row items-center justify-end",
        children: /*#__PURE__*/jsx(Button, {
          "data-testid": "add-new-group-button",
          style: "primary",
          label: t("neetoTeamMembers.common.addNew_", {
            what: taxonomies.group.singular
          }),
          onClick: function onClick() {
            return setIsPaneOpen(true);
          }
        })
      }),
      searchProps: isFiltersVisible && {
        placeholder: t("neetoTeamMembers.placeholders.searchEntity", {
          entity: taxonomies.group.plural
        })
      }
    }), /*#__PURE__*/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__*/jsx(Create, {
      config: config,
      isOpen: isPaneOpen,
      onClose: function onClose() {
        return setIsPaneOpen(false);
      }
    })]
  });
};

export { Groups as default };
//# sourceMappingURL=Groups.js.map
