@bigbinary/neeto-access-control-frontend 1.2.2 → 1.3.0

package/README.md

@@ -108,8 +108,9 @@ The engine is used to manage access control across neeto products.
         # Use to send invitation emails or perform any post-invitation tasks.
         def after_invitations_created
           # @invited_emails is loaded in engine
-          invited_emails = @invited_emails.present? ? @invited_emails.rows.flatten : []
-          EmailInvitationsJob.perform_async(invited_emails, current_organization.id, current_user.id)
+          return if @invited_emails.blank?
+
+          EmailInvitationsJob.perform_async(@invited_emails, current_user.id)
         end
     end
   ```
@@ -174,10 +175,87 @@ The engine is used to manage access control across neeto products.
 - `onReset`: Callback function that is triggered when the reset button is clicked.
 - `onSuccess`: Callback function that is triggered when the configuration is successfully updated.
 - `handleCancel`: Callback function that is triggered when the cancel button is clicked.
-- `invitationsTableColumnData`: Prop to render column data for invitations table. Refer [Column data](https://neeto-ui.neeto.com/?path=/docs/components-table--docs#columndata-a-idcolumndata-)
+- `invitationsTableExtraColumnsData`: Prop to add column data for invitations table. This will override the existing column if the key is already present. Refer [Column data](https://neeto-ui.neeto.com/?path=/docs/components-table--docs#columndata-a-idcolumndata-)
 - `onConfigurationChangedToInviteOnly`: Callback function that is triggered when configuration is changed to `invited`. Default: `noop`.
 - `headerProps`: Props passed to the [`Header`](https://neeto-molecules.neeto.com/?path=/docs/layouts-header--docs) component from neetoMolecules.
+- `hideAddEmailsFromInvitationPane`: Prop to hide the add emails form from invitation pane. Default: `false`.
 - `className`: Additional classes to be added to the form.
+- `onDestroyInvitationsSuccess`: Callback function that is triggered when the invitations are successfully destroyed.
+
+#### 2. `Invitations` Object
+The `Invitations` object provides access to invitation-related components, hooks, and constants.
+
+#### Components
+
+#### `InvitationsPane` ([source code](/app/javascript/src/components/Configuration/Invitations/index.jsx))
+
+**Props**
+
+> Check source code for default values
+- `onClose`: Callback function that is triggered when the close button is clicked.
+- `isOpen`: Prop for pane, will reflect state of the pane.
+- `extraColumnsData`: Prop to add column data for invitations table. This will override the existing column if the key is already present. Refer [Column data](https://neeto-ui.neeto.com/?path=/docs/components-table--docs#columndata-a-idcolumndata-)
+- `ownerId`: To specify the ID of the instance of the model. The ID is used to fetch and update access control configuration.
+- `ownerType`: Type of the model.
+- `hideAddEmailsForm`: Prop to hide the add emails form from invitation pane.
+- `configurationId`: Prop to specify the ID of the instance of the model. The ID is used to load access control configuration. **NOTE: If this prop is not passed, make sure `invitations_controller_override.rb` is added with `access_control_configuration` method as mentioned above in adding overrides section.**
+- `onDestroyInvitationsSuccess`: Callback function that is triggered when the invitations are successfully destroyed.
+
+#### Hooks
+- `useBulkCreateInvitations` [source code](/app/javascript/src/hooks/reactQuery/useInvitationsApi.js): Bulk create invitations.Check [usage](app/javascript/src/components/Configuration/Invitations/index.jsx).
+
+#### Constants
+- `INVITATIONS_QUERY_KEY`: For react query cache of invitations
+
+#### Invitations object usage
+
+```jsx
+/* Required imports */
+import { Invitations } from "@bigbinary/neeto-access-control-frontend";
+
+const { InvitationsPane, useBulkCreateInvitations, INVITATIONS_QUERY_KEY } =
+  Invitations;
+
+const MyComponent = () => {
+  const [showInviationsPane, setShowInviationsPane] = useState(false);
+  const [emails, setEmails] = useState("");
+
+  const { mutateAsync: addEmails } = useBulkCreateInvitations({
+    configurationId: null,
+  });
+
+  const queryClient = useQueryClient();
+
+  const addTestEmails = async () => {
+    const payload = { emails: emails.split(",") };
+    await addEmails(payload);
+    setEmails("");
+    queryClient.invalidateQueries({
+      queryKey: [INVITATIONS_QUERY_KEY],
+    });
+  };
+
+  return (
+    <div className="space-4 p-5">
+      <Input
+        label="Email"
+        value={emails}
+        onChange={e => setEmails(e.target.value)}
+      />
+      <Button label="Add test email " onClick={addTestEmails} />
+      <Button
+        label="Open Invitation pane"
+        onClick={() => setShowInviationsPane(true)}
+      />
+      <InvitationsPane
+        hideAddEmailsForm
+        isOpen={showInviationsPane}
+        onClose={() => setShowInviationsPane(false)}
+      />
+    </div>
+  );
+};
+```
 
 **Usage**
 

package/dist/index.cjs.js

@@ -2,13 +2,15 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
 var react = require('react');
 var classNames = require('classnames');
 var neetoCist = require('@bigbinary/neeto-cist');
 var Container = require('@bigbinary/neeto-molecules/Container');
-var PageLoader = require('@bigbinary/neeto-molecules/PageLoader');
 var Scrollable = require('@bigbinary/neeto-molecules/Scrollable');
 var Label = require('@bigbinary/neetoui/Label');
+var Spinner = require('@bigbinary/neetoui/Spinner');
 var ActionBlock = require('@bigbinary/neetoui/formik/ActionBlock');
 var Form = require('@bigbinary/neetoui/formik/Form');
 var Input = require('@bigbinary/neetoui/formik/Input');
@@ -25,6 +27,7 @@ var Pane = require('@bigbinary/neetoui/Pane');
 var Table = require('@bigbinary/neetoui/Table');
 var Typography = require('@bigbinary/neetoui/Typography');
 var ramda = require('ramda');
+var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
 var reactQuery = require('@tanstack/react-query');
 var reactUtils = require('@bigbinary/neeto-commons-frontend/react-utils');
 var axios = require('axios');
@@ -59,11 +62,13 @@ function _interopNamespace(e) {
   return Object.freeze(n);
 }
 
+var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
+var _slicedToArray__default = /*#__PURE__*/_interopDefaultLegacy(_slicedToArray);
 var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames);
 var Container__default = /*#__PURE__*/_interopDefaultLegacy(Container);
-var PageLoader__default = /*#__PURE__*/_interopDefaultLegacy(PageLoader);
 var Scrollable__default = /*#__PURE__*/_interopDefaultLegacy(Scrollable);
 var Label__default = /*#__PURE__*/_interopDefaultLegacy(Label);
+var Spinner__default = /*#__PURE__*/_interopDefaultLegacy(Spinner);
 var ActionBlock__default = /*#__PURE__*/_interopDefaultLegacy(ActionBlock);
 var Form__default = /*#__PURE__*/_interopDefaultLegacy(Form);
 var Input__default = /*#__PURE__*/_interopDefaultLegacy(Input);
@@ -77,6 +82,7 @@ var NoData__default = /*#__PURE__*/_interopDefaultLegacy(NoData);
 var Pane__default = /*#__PURE__*/_interopDefaultLegacy(Pane);
 var Table__default = /*#__PURE__*/_interopDefaultLegacy(Table);
 var Typography__default = /*#__PURE__*/_interopDefaultLegacy(Typography);
+var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
 var axios__default = /*#__PURE__*/_interopDefaultLegacy(axios);
 var MultiEmailInput__default = /*#__PURE__*/_interopDefaultLegacy(MultiEmailInput);
 var Button__default = /*#__PURE__*/_interopDefaultLegacy(Button);
@@ -86,131 +92,6 @@ var Tooltip__default = /*#__PURE__*/_interopDefaultLegacy(Tooltip);
 var NeetoHeader__default = /*#__PURE__*/_interopDefaultLegacy(NeetoHeader);
 var HelpPopover__default = /*#__PURE__*/_interopDefaultLegacy(HelpPopover);
 
-function _typeof(o) {
-  "@babel/helpers - typeof";
-
-  return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) {
-    return typeof o;
-  } : function (o) {
-    return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o;
-  }, _typeof(o);
-}
-
-function _toPrimitive(input, hint) {
-  if (_typeof(input) !== "object" || input === null) return input;
-  var prim = input[Symbol.toPrimitive];
-  if (prim !== undefined) {
-    var res = prim.call(input, hint || "default");
-    if (_typeof(res) !== "object") return res;
-    throw new TypeError("@@toPrimitive must return a primitive value.");
-  }
-  return (hint === "string" ? String : Number)(input);
-}
-
-function _toPropertyKey(arg) {
-  var key = _toPrimitive(arg, "string");
-  return _typeof(key) === "symbol" ? key : String(key);
-}
-
-function _defineProperty(obj, key, value) {
-  key = _toPropertyKey(key);
-  if (key in obj) {
-    Object.defineProperty(obj, key, {
-      value: value,
-      enumerable: true,
-      configurable: true,
-      writable: true
-    });
-  } else {
-    obj[key] = value;
-  }
-  return obj;
-}
-
-function _arrayWithHoles(arr) {
-  if (Array.isArray(arr)) return arr;
-}
-
-function _iterableToArrayLimit(r, l) {
-  var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"];
-  if (null != t) {
-    var e,
-      n,
-      i,
-      u,
-      a = [],
-      f = !0,
-      o = !1;
-    try {
-      if (i = (t = t.call(r)).next, 0 === l) {
-        if (Object(t) !== t) return;
-        f = !1;
-      } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0);
-    } catch (r) {
-      o = !0, n = r;
-    } finally {
-      try {
-        if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return;
-      } finally {
-        if (o) throw n;
-      }
-    }
-    return a;
-  }
-}
-
-function _arrayLikeToArray(arr, len) {
-  if (len == null || len > arr.length) len = arr.length;
-  for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
-  return arr2;
-}
-
-function _unsupportedIterableToArray(o, minLen) {
-  if (!o) return;
-  if (typeof o === "string") return _arrayLikeToArray(o, minLen);
-  var n = Object.prototype.toString.call(o).slice(8, -1);
-  if (n === "Object" && o.constructor) n = o.constructor.name;
-  if (n === "Map" || n === "Set") return Array.from(o);
-  if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
-}
-
-function _nonIterableRest() {
-  throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
-}
-
-function _slicedToArray(arr, i) {
-  return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
-}
-
-function _objectWithoutPropertiesLoose(source, excluded) {
-  if (source == null) return {};
-  var target = {};
-  var sourceKeys = Object.keys(source);
-  var key, i;
-  for (i = 0; i < sourceKeys.length; i++) {
-    key = sourceKeys[i];
-    if (excluded.indexOf(key) >= 0) continue;
-    target[key] = source[key];
-  }
-  return target;
-}
-
-function _objectWithoutProperties(source, excluded) {
-  if (source == null) return {};
-  var target = _objectWithoutPropertiesLoose(source, excluded);
-  var key, i;
-  if (Object.getOwnPropertySymbols) {
-    var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
-    for (i = 0; i < sourceSymbolKeys.length; i++) {
-      key = sourceSymbolKeys[i];
-      if (excluded.indexOf(key) >= 0) continue;
-      if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
-      target[key] = source[key];
-    }
-  }
-  return target;
-}
-
 var ACCESS_CONTROL_BASE_PATH = "/secure/api/v1";
 
 var invitationsPath = "".concat(ACCESS_CONTROL_BASE_PATH, "/configuration/invitations");
@@ -250,12 +131,12 @@ var QUERY_KEYS = {
 
 var _excluded = ["ownerId", "ownerType"];
 function ownKeys$3(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$3(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$3(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$3(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _objectSpread$3(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$3(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$3(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var ACCESS_CONTROL_CONFIGURATION_INVITATIONS$1 = QUERY_KEYS.ACCESS_CONTROL_CONFIGURATION_INVITATIONS;
 var useListInvitations = function useListInvitations(_ref, options) {
   var ownerId = _ref.ownerId,
     ownerType = _ref.ownerType,
-    otherParams = _objectWithoutProperties(_ref, _excluded);
+    otherParams = _objectWithoutProperties__default["default"](_ref, _excluded);
   return reactQuery.useQuery(_objectSpread$3({
     queryKey: [ACCESS_CONTROL_CONFIGURATION_INVITATIONS$1, ownerType, ownerId, otherParams],
     queryFn: function queryFn() {
@@ -355,7 +236,7 @@ var AddEmails = function AddEmails(_ref) {
   });
 };
 
-var renderColumnData = function renderColumnData(_ref) {
+var defaultColumnData = function defaultColumnData(_ref) {
   var onDelete = _ref.onDelete;
   return [{
     title: i18next.t("neetoAccessControl.titles.emails"),
@@ -396,25 +277,44 @@ var renderColumnData = function renderColumnData(_ref) {
     }
   }];
 };
+var mergeByKey = function mergeByKey(key, a, b) {
+  var merge = ramda.mergeDeepRight(ramda.indexBy(ramda.prop(key), a), ramda.indexBy(ramda.prop(key), b));
+  return ramda.values(merge);
+};
+var renderColumnData = function renderColumnData(_ref2) {
+  var onDelete = _ref2.onDelete,
+    _ref2$extraColumnsDat = _ref2.extraColumnsData,
+    extraColumnsData = _ref2$extraColumnsDat === void 0 ? [] : _ref2$extraColumnsDat;
+  return mergeByKey("key", defaultColumnData({
+    onDelete: onDelete
+  }), extraColumnsData);
+};
 
-var Invitations = function Invitations(_ref) {
+var Invitations$1 = function Invitations(_ref) {
   var _selectedEmails$;
-  var invitationsTableColumnData = _ref.invitationsTableColumnData,
+  var _ref$extraColumnsData = _ref.extraColumnsData,
+    extraColumnsData = _ref$extraColumnsData === void 0 ? [] : _ref$extraColumnsData,
     configurationId = _ref.configurationId,
-    ownerType = _ref.ownerType,
-    ownerId = _ref.ownerId,
+    _ref$ownerType = _ref.ownerType,
+    ownerType = _ref$ownerType === void 0 ? null : _ref$ownerType,
+    _ref$ownerId = _ref.ownerId,
+    ownerId = _ref$ownerId === void 0 ? null : _ref$ownerId,
     isOpen = _ref.isOpen,
-    onClose = _ref.onClose;
+    onClose = _ref.onClose,
+    _ref$hideAddEmailsFor = _ref.hideAddEmailsForm,
+    hideAddEmailsForm = _ref$hideAddEmailsFor === void 0 ? false : _ref$hideAddEmailsFor,
+    _ref$onDestroyInvitat = _ref.onDestroyInvitationsSuccess,
+    onDestroyInvitationsSuccess = _ref$onDestroyInvitat === void 0 ? neetoCist.noop : _ref$onDestroyInvitat;
   var _useState = react.useState([]),
-    _useState2 = _slicedToArray(_useState, 2),
+    _useState2 = _slicedToArray__default["default"](_useState, 2),
     selectedEmails = _useState2[0],
     setSelectedEmails = _useState2[1];
   var _useState3 = react.useState(false),
-    _useState4 = _slicedToArray(_useState3, 2),
+    _useState4 = _slicedToArray__default["default"](_useState3, 2),
     showDeleteAlert = _useState4[0],
     setShowDeleteAlert = _useState4[1];
   var _useState5 = react.useState(constants.DEFAULT_PAGE_INDEX),
-    _useState6 = _slicedToArray(_useState5, 2),
+    _useState6 = _slicedToArray__default["default"](_useState5, 2),
     page = _useState6[0],
     setPage = _useState6[1];
   var _useTranslation = reactI18next.useTranslation(),
@@ -455,6 +355,7 @@ var Invitations = function Invitations(_ref) {
       onSuccess: function onSuccess() {
         setSelectedEmails([]);
         setShowDeleteAlert(false);
+        onDestroyInvitationsSuccess();
       }
     });
   };
@@ -475,7 +376,7 @@ var Invitations = function Invitations(_ref) {
         })
       }), /*#__PURE__*/jsxRuntime.jsxs(Pane__default["default"].Body, {
         className: "pt-2",
-        children: [/*#__PURE__*/jsxRuntime.jsx(AddEmails, {
+        children: [!hideAddEmailsForm && /*#__PURE__*/jsxRuntime.jsx(AddEmails, {
           configurationId: configurationId,
           ownerId: ownerId,
           ownerType: ownerType
@@ -518,8 +419,9 @@ var Invitations = function Invitations(_ref) {
               loading: isFetching,
               rowData: invitations,
               selectedRowKeys: ramda.pluck("id", selectedEmails),
-              columnData: invitationsTableColumnData !== null && invitationsTableColumnData !== void 0 ? invitationsTableColumnData : renderColumnData({
-                onDelete: handleDeleteAction
+              columnData: renderColumnData({
+                onDelete: handleDeleteAction,
+                extraColumnsData: extraColumnsData
               }),
               onRowSelect: function onRowSelect(_, selectedRows) {
                 return setSelectedEmails(selectedRows);
@@ -530,7 +432,10 @@ var Invitations = function Invitations(_ref) {
           className: "flex h-full w-full justify-center",
           children: [!isLoading && /*#__PURE__*/jsxRuntime.jsx(NoData__default["default"], {
             title: t("neetoAccessControl.labels.noInvitations")
-          }), isLoading && /*#__PURE__*/jsxRuntime.jsx(PageLoader__default["default"], {})]
+          }), isLoading && /*#__PURE__*/jsxRuntime.jsx("div", {
+            className: "flex h-full w-full items-center justify-center",
+            children: /*#__PURE__*/jsxRuntime.jsx(Spinner__default["default"], {})
+          })]
         })]
       })]
     }), /*#__PURE__*/jsxRuntime.jsx(Alert__default["default"], {
@@ -583,7 +488,7 @@ var configurationsApi = {
 };
 
 function ownKeys$2(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$2(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$2(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$2(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _objectSpread$2(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$2(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$2(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var ACCESS_CONTROL_CONFIGURATION = QUERY_KEYS.ACCESS_CONTROL_CONFIGURATION,
   ACCESS_CONTROL_CONFIGURATION_INVITATIONS = QUERY_KEYS.ACCESS_CONTROL_CONFIGURATION_INVITATIONS;
 var useShowConfiguration = function useShowConfiguration(_ref) {
@@ -758,7 +663,7 @@ var AllowedKeywords = reactUtils.withT(function (_ref) {
 });
 
 function ownKeys$1(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$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var Header = function Header(_ref) {
   var headerProps = _ref.headerProps;
   var title = headerProps.title,
@@ -780,7 +685,7 @@ var Header = function Header(_ref) {
 };
 
 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), !0).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; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).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 Configuration = function Configuration(_ref) {
   var ownerId = _ref.ownerId,
     ownerType = _ref.ownerType,
@@ -792,10 +697,14 @@ var Configuration = function Configuration(_ref) {
     handleCancel = _ref$handleCancel === void 0 ? neetoCist.noop : _ref$handleCancel,
     _ref$onConfigurationC = _ref.onConfigurationChangedToInviteOnly,
     onConfigurationChangedToInviteOnly = _ref$onConfigurationC === void 0 ? neetoCist.noop : _ref$onConfigurationC,
-    _ref$invitationsTable = _ref.invitationsTableColumnData,
-    invitationsTableColumnData = _ref$invitationsTable === void 0 ? null : _ref$invitationsTable;
+    _ref$invitationsTable = _ref.invitationsTableExtraColumnsData,
+    invitationsTableExtraColumnsData = _ref$invitationsTable === void 0 ? [] : _ref$invitationsTable,
+    _ref$hideAddEmailsFro = _ref.hideAddEmailsFromInvitationPane,
+    hideAddEmailsFromInvitationPane = _ref$hideAddEmailsFro === void 0 ? false : _ref$hideAddEmailsFro,
+    _ref$onDestroyInvitat = _ref.onDestroyInvitationsSuccess,
+    onDestroyInvitationsSuccess = _ref$onDestroyInvitat === void 0 ? neetoCist.noop : _ref$onDestroyInvitat;
   var _useState = react.useState(false),
-    _useState2 = _slicedToArray(_useState, 2),
+    _useState2 = _slicedToArray__default["default"](_useState, 2),
     showInviationsPane = _useState2[0],
     setShowInviationsPane = _useState2[1];
   var _useTranslation = reactI18next.useTranslation(),
@@ -839,7 +748,10 @@ var Configuration = function Configuration(_ref) {
   return /*#__PURE__*/jsxRuntime.jsxs(Container__default["default"], {
     children: [/*#__PURE__*/jsxRuntime.jsx(Header, {
       headerProps: headerProps
-    }), isLoading ? /*#__PURE__*/jsxRuntime.jsx(PageLoader__default["default"], {}) : /*#__PURE__*/jsxRuntime.jsxs(Scrollable__default["default"], {
+    }), isLoading ? /*#__PURE__*/jsxRuntime.jsx("div", {
+      className: "flex h-full w-full items-center justify-center",
+      children: /*#__PURE__*/jsxRuntime.jsx(Spinner__default["default"], {})
+    }) : /*#__PURE__*/jsxRuntime.jsxs(Scrollable__default["default"], {
       className: "w-full",
       children: [/*#__PURE__*/jsxRuntime.jsx(Form__default["default"], {
         className: classNames__default["default"]("space-y-6", className),
@@ -901,11 +813,13 @@ var Configuration = function Configuration(_ref) {
             })]
           });
         }
-      }), /*#__PURE__*/jsxRuntime.jsx(Invitations, {
-        invitationsTableColumnData: invitationsTableColumnData,
+      }), /*#__PURE__*/jsxRuntime.jsx(Invitations$1, {
+        onDestroyInvitationsSuccess: onDestroyInvitationsSuccess,
         ownerId: ownerId,
         ownerType: ownerType,
         configurationId: configuration.id,
+        extraColumnsData: invitationsTableExtraColumnsData,
+        hideAddEmailsForm: hideAddEmailsFromInvitationPane,
         isOpen: showInviationsPane && !isFetching,
         onClose: function onClose() {
           return setShowInviationsPane(false);
@@ -915,5 +829,13 @@ var Configuration = function Configuration(_ref) {
   });
 };
 
+var INVITATIONS_QUERY_KEY = QUERY_KEYS.ACCESS_CONTROL_CONFIGURATION_INVITATIONS;
+var Invitations = {
+  InvitationsPane: Invitations$1,
+  useBulkCreateInvitations: useBulkCreateInvitations,
+  INVITATIONS_QUERY_KEY: INVITATIONS_QUERY_KEY
+};
+
 exports.Configuration = Configuration;
+exports.Invitations = Invitations;
 //# sourceMappingURL=index.cjs.js.map