@bigbinary/neeto-access-control-frontend 1.3.3 → 1.3.4

package/README.md

@@ -137,6 +137,10 @@ The engine is used to manage access control across neeto products.
         def owner
           @organization
         end
+
+        def update_owner!
+          # Optional override to update the owner if required when configuration is updated
+        end
     end
   ```
 
@@ -181,6 +185,10 @@ The engine is used to manage access control across neeto products.
 - `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.
+- `inviteButtonProps`: If specified, this will show a button on the top of the Pane. It can be used to take the users to invitation forms outside the InvitationsPane.
+- `additionalFieldsInitialValues`: Prop to add additional custom fields to the form.
+- `fieldsWrapper`: A component that wraps the fields in the form. Useful for adding custom fields to the form.
+- `translationContext`: Context for translations, it can be used to override the translations of the field labels. Ref: https://www.i18next.com/translation-function/context
 
 #### 2. `Invitations` Object
 The `Invitations` object provides access to invitation-related components, hooks, and constants.
@@ -200,6 +208,7 @@ The `Invitations` object provides access to invitation-related components, hooks
 - `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.
+- `inviteButtonProps`: If specified, this will show a button on the top of the Pane. It can be used to take the users to invitation forms outside the InvitationsPane.
 
 #### Hooks
 - `useBulkCreateInvitations` [source code](/app/javascript/src/hooks/reactQuery/useInvitationsApi.js): Bulk create invitations.Check [usage](app/javascript/src/components/Configuration/Invitations/index.jsx).

package/dist/index.cjs.js

@@ -7,12 +7,12 @@ var classNames = require('classnames');
 var neetoCist = require('@bigbinary/neeto-cist');
 var Container = require('@bigbinary/neeto-molecules/Container');
 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');
 var Radio = require('@bigbinary/neetoui/formik/Radio');
+var ramda = require('ramda');
 var reactI18next = require('react-i18next');
 var constants = require('@bigbinary/neeto-commons-frontend/constants');
 var Delete = require('@bigbinary/neeto-icons/Delete');
@@ -24,7 +24,6 @@ var NoData = require('@bigbinary/neetoui/NoData');
 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');
@@ -37,6 +36,7 @@ var jsxRuntime = require('react/jsx-runtime');
 var MoreDropdown = require('@bigbinary/neeto-molecules/MoreDropdown');
 var Tooltip = require('@bigbinary/neetoui/Tooltip');
 var formik = require('formik');
+var Label = require('@bigbinary/neetoui/Label');
 var NeetoHeader = require('@bigbinary/neeto-molecules/Header');
 var HelpPopover = require('@bigbinary/neeto-molecules/HelpPopover');
 
@@ -97,14 +97,14 @@ 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 ownKeys$4(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$4(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$4(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$4(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);
-  return reactQuery.useQuery(_objectSpread$3({
+  return reactQuery.useQuery(_objectSpread$4({
     queryKey: [ACCESS_CONTROL_CONFIGURATION_INVITATIONS$1, ownerType, ownerId, otherParams],
     queryFn: function queryFn() {
       return invitationsApi.list(otherParams);
@@ -121,7 +121,7 @@ var useBulkCreateInvitations = function useBulkCreateInvitations(_ref2, options)
       configurationId: configurationId,
       payload: payload
     });
-  }, _objectSpread$3({
+  }, _objectSpread$4({
     keysToInvalidate: [[ACCESS_CONTROL_CONFIGURATION_INVITATIONS$1, ownerType, ownerId]]
   }, options));
 };
@@ -134,7 +134,7 @@ var useBulkDestroyInvitations = function useBulkDestroyInvitations(_ref3, option
       configurationId: configurationId,
       payload: payload
     });
-  }, _objectSpread$3({
+  }, _objectSpread$4({
     keysToInvalidate: [[ACCESS_CONTROL_CONFIGURATION_INVITATIONS$1, ownerType, ownerId]]
   }, options));
 };
@@ -257,6 +257,8 @@ var renderColumnData = function renderColumnData(_ref2) {
   }), extraColumnsData);
 };
 
+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; }
 var Invitations$1 = function Invitations(_ref) {
   var _selectedEmails$;
   var _ref$extraColumnsData = _ref.extraColumnsData,
@@ -270,6 +272,8 @@ var Invitations$1 = function Invitations(_ref) {
     onClose = _ref.onClose,
     _ref$hideAddEmailsFor = _ref.hideAddEmailsForm,
     hideAddEmailsForm = _ref$hideAddEmailsFor === void 0 ? false : _ref$hideAddEmailsFor,
+    _ref$inviteButtonProp = _ref.inviteButtonProps,
+    inviteButtonProps = _ref$inviteButtonProp === void 0 ? {} : _ref$inviteButtonProp,
     _ref$onDestroyInvitat = _ref.onDestroyInvitationsSuccess,
     onDestroyInvitationsSuccess = _ref$onDestroyInvitat === void 0 ? neetoCist.noop : _ref$onDestroyInvitat;
   var _useState = react.useState([]),
@@ -342,8 +346,11 @@ var Invitations$1 = function Invitations(_ref) {
           children: t("neetoAccessControl.titles.invitations")
         })
       }), /*#__PURE__*/jsxRuntime.jsxs(Pane.Body, {
-        className: "pt-2",
-        children: [!hideAddEmailsForm && /*#__PURE__*/jsxRuntime.jsx(AddEmails, {
+        className: "space-y-4 pt-2",
+        children: [neetoCist.isNotEmpty(inviteButtonProps) && /*#__PURE__*/jsxRuntime.jsx("div", {
+          className: "flex w-full justify-end",
+          children: /*#__PURE__*/jsxRuntime.jsx(Button$1, _objectSpread$3({}, inviteButtonProps))
+        }), !hideAddEmailsForm && /*#__PURE__*/jsxRuntime.jsx(AddEmails, {
           configurationId: configurationId,
           ownerId: ownerId,
           ownerType: ownerType
@@ -494,27 +501,6 @@ var AUTH = {
   SESSION: "session",
   INVITED: "invited"
 };
-var AUTH_OPTIONS = [{
-  label: i18next.t("neetoAccessControl.auth.no"),
-  value: AUTH.NO,
-  "data-cy": "access-control-public-access-radio-input"
-}, {
-  label: i18next.t("neetoAccessControl.auth.basic"),
-  value: AUTH.BASIC,
-  "data-cy": "access-control-password-protected-radio-input"
-}, {
-  label: i18next.t("neetoAccessControl.auth.invited"),
-  value: AUTH.INVITED,
-  "data-cy": "access-control-only-invited-people-radio-input"
-}, {
-  label: i18next.t("neetoAccessControl.auth.email"),
-  value: AUTH.EMAIL,
-  "data-cy": "access-control-secure-by-email-patterns-radio-input"
-}, {
-  label: i18next.t("neetoAccessControl.auth.session"),
-  value: AUTH.SESSION,
-  "data-cy": "access-control-logged-in-members-only-radio-input"
-}];
 var CONFIGURATION_VALIDATION_SCHEMA = yup__namespace.object({
   auth: yup__namespace.string().required(i18next.t("neetoAccessControl.inputs.validation.authRequired")),
   password: yup__namespace.string().nullable().when("auth", {
@@ -579,6 +565,41 @@ var renderLabelWithViewInvitation = function renderLabelWithViewInvitation(_ref2
     }
   });
 };
+var getAuthOptions = function getAuthOptions(_ref3) {
+  var translationContext = _ref3.translationContext,
+    t = _ref3.t;
+  return [{
+    label: t("neetoAccessControl.auth.no", {
+      context: translationContext
+    }),
+    value: AUTH.NO,
+    "data-cy": "access-control-public-access-radio-input"
+  }, {
+    label: t("neetoAccessControl.auth.basic", {
+      context: translationContext
+    }),
+    value: AUTH.BASIC,
+    "data-cy": "access-control-password-protected-radio-input"
+  }, {
+    label: t("neetoAccessControl.auth.invited", {
+      context: translationContext
+    }),
+    value: AUTH.INVITED,
+    "data-cy": "access-control-only-invited-people-radio-input"
+  }, {
+    label: t("neetoAccessControl.auth.email", {
+      context: translationContext
+    }),
+    value: AUTH.EMAIL,
+    "data-cy": "access-control-secure-by-email-patterns-radio-input"
+  }, {
+    label: t("neetoAccessControl.auth.session", {
+      context: translationContext
+    }),
+    value: AUTH.SESSION,
+    "data-cy": "access-control-logged-in-members-only-radio-input"
+  }];
+};
 
 var AllowedKeywords = reactUtils.withT(function (_ref) {
   var t = _ref.t,
@@ -671,11 +692,18 @@ var Configuration = function Configuration(_ref) {
     hideAddEmailsFromInvitationPane = _ref$hideAddEmailsFro === void 0 ? false : _ref$hideAddEmailsFro,
     _ref$onDestroyInvitat = _ref.onDestroyInvitationsSuccess,
     onDestroyInvitationsSuccess = _ref$onDestroyInvitat === void 0 ? neetoCist.noop : _ref$onDestroyInvitat,
-    children = _ref.children;
+    _ref$inviteButtonProp = _ref.inviteButtonProps,
+    inviteButtonProps = _ref$inviteButtonProp === void 0 ? {} : _ref$inviteButtonProp,
+    _ref$additionalFields = _ref.additionalFieldsInitialValues,
+    additionalFieldsInitialValues = _ref$additionalFields === void 0 ? {} : _ref$additionalFields,
+    children = _ref.children,
+    fieldsWrapper = _ref.fieldsWrapper,
+    translationContext = _ref.translationContext;
   var _useState = react.useState(false),
     _useState2 = _slicedToArray(_useState, 2),
-    showInviationsPane = _useState2[0],
-    setShowInviationsPane = _useState2[1];
+    showInvitationsPane = _useState2[0],
+    setShowInvitationsPane = _useState2[1];
+  var FieldsWrapper = fieldsWrapper || react.Fragment;
   var _useTranslation = reactI18next.useTranslation(),
     t = _useTranslation.t;
   var _useShowConfiguration = useShowConfiguration({
@@ -686,7 +714,7 @@ var Configuration = function Configuration(_ref) {
     configuration = _useShowConfiguration2 === void 0 ? {} : _useShowConfiguration2,
     isLoading = _useShowConfiguration.isLoading,
     isFetching = _useShowConfiguration.isFetching;
-  var configurationInitialValues = buildConfigurationInitialValues(configuration);
+  var configurationInitialValues = ramda.mergeLeft(buildConfigurationInitialValues(configuration), additionalFieldsInitialValues);
   var _useUpdateConfigurati = useUpdateConfiguration({
       ownerId: ownerId,
       ownerType: ownerType
@@ -704,7 +732,7 @@ var Configuration = function Configuration(_ref) {
     updateConfiguration = _useUpdateConfigurati.mutate;
   var handleSubmit = function handleSubmit(values, _ref2) {
     var setSubmitting = _ref2.setSubmitting;
-    var payload = buildPayload(values);
+    var payload = ramda.mergeLeft(buildPayload(values), ramda.pick(ramda.keys(additionalFieldsInitialValues), values));
     updateConfiguration(payload, {
       onSettled: function onSettled() {
         return setSubmitting(false);
@@ -712,7 +740,7 @@ var Configuration = function Configuration(_ref) {
     });
   };
   var handleShowInvitations = onConfigurationChangedToInviteOnly === neetoCist.noop ? function () {
-    return setShowInviationsPane(true);
+    return setShowInvitationsPane(true);
   } : onConfigurationChangedToInviteOnly;
   return /*#__PURE__*/jsxRuntime.jsxs(Container, {
     children: [/*#__PURE__*/jsxRuntime.jsx(Header, {
@@ -734,44 +762,46 @@ var Configuration = function Configuration(_ref) {
         children: function children(_ref3) {
           var values = _ref3.values;
           return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
-            children: [/*#__PURE__*/jsxRuntime.jsx(Label, {
-              className: "neeto-ui-text-base",
-              children: t("neetoAccessControl.inputs.labels.visibility")
-            }), /*#__PURE__*/jsxRuntime.jsx(Radio, {
-              stacked: true,
-              name: "auth",
-              children: AUTH_OPTIONS.map(function (props) {
-                return /*#__PURE__*/react.createElement(Radio.Item, _objectSpread(_objectSpread({}, props), {}, {
-                  key: props.value,
-                  className: classNames({
-                    "items-start": (configuration === null || configuration === void 0 ? void 0 : configuration.auth) === props.value && (configuration === null || configuration === void 0 ? void 0 : configuration.auth) === AUTH.INVITED
-                  }),
-                  label: (configuration === null || configuration === void 0 ? void 0 : configuration.auth) === props.value && (configuration === null || configuration === void 0 ? void 0 : configuration.auth) === AUTH.INVITED ? renderLabelWithViewInvitation({
-                    onViewInvites: function onViewInvites() {
-                      return setShowInviationsPane(true);
-                    }
-                  }) : props.label,
-                  labelProps: {
+            children: [/*#__PURE__*/jsxRuntime.jsxs(FieldsWrapper, {
+              children: [/*#__PURE__*/jsxRuntime.jsx(Radio, {
+                stacked: true,
+                name: "auth",
+                children: getAuthOptions({
+                  translationContext: translationContext,
+                  t: t
+                }).map(function (props) {
+                  return /*#__PURE__*/react.createElement(Radio.Item, _objectSpread(_objectSpread({}, props), {}, {
+                    key: props.value,
                     className: classNames({
-                      "flex flex-col items-start justify-start": (configuration === null || configuration === void 0 ? void 0 : configuration.auth) === props.value && (configuration === null || configuration === void 0 ? void 0 : configuration.auth) === AUTH.INVITED
-                    })
-                  }
-                }));
-              })
-            }), values.auth === AUTH.BASIC && /*#__PURE__*/jsxRuntime.jsx("div", {
-              className: "space-y-4 pb-2",
-              children: /*#__PURE__*/jsxRuntime.jsx(Input, {
-                autoFocus: true,
-                required: true,
-                unlimitedChars: true,
-                className: "w-7/12",
-                label: t("neetoAccessControl.inputs.labels.password"),
-                name: "password",
-                placeholder: t("neetoAccessControl.inputs.placeholders.enterPassword")
-              })
-            }), values.auth === AUTH.EMAIL && /*#__PURE__*/jsxRuntime.jsx(AllowedKeywords, {
-              label: t("neetoAccessControl.inputs.labels.keywords"),
-              name: "allowedKeywords"
+                      "items-start": (configuration === null || configuration === void 0 ? void 0 : configuration.auth) === props.value && (configuration === null || configuration === void 0 ? void 0 : configuration.auth) === AUTH.INVITED
+                    }),
+                    label: (configuration === null || configuration === void 0 ? void 0 : configuration.auth) === props.value && (configuration === null || configuration === void 0 ? void 0 : configuration.auth) === AUTH.INVITED ? renderLabelWithViewInvitation({
+                      onViewInvites: function onViewInvites() {
+                        return setShowInvitationsPane(true);
+                      }
+                    }) : props.label,
+                    labelProps: {
+                      className: classNames({
+                        "flex flex-col items-start justify-start": (configuration === null || configuration === void 0 ? void 0 : configuration.auth) === props.value && (configuration === null || configuration === void 0 ? void 0 : configuration.auth) === AUTH.INVITED
+                      })
+                    }
+                  }));
+                })
+              }), values.auth === AUTH.BASIC && /*#__PURE__*/jsxRuntime.jsx("div", {
+                className: "space-y-4 pb-2",
+                children: /*#__PURE__*/jsxRuntime.jsx(Input, {
+                  autoFocus: true,
+                  required: true,
+                  unlimitedChars: true,
+                  className: "w-7/12",
+                  label: t("neetoAccessControl.inputs.labels.password"),
+                  name: "password",
+                  placeholder: t("neetoAccessControl.inputs.placeholders.enterPassword")
+                })
+              }), values.auth === AUTH.EMAIL && /*#__PURE__*/jsxRuntime.jsx(AllowedKeywords, {
+                label: t("neetoAccessControl.inputs.labels.keywords"),
+                name: "allowedKeywords"
+              })]
             }), /*#__PURE__*/jsxRuntime.jsx(ActionBlock, {
               cancelButtonProps: {
                 onClick: handleCancel
@@ -783,15 +813,16 @@ var Configuration = function Configuration(_ref) {
           });
         }
       }), /*#__PURE__*/jsxRuntime.jsx(Invitations$1, {
+        inviteButtonProps: inviteButtonProps,
         onDestroyInvitationsSuccess: onDestroyInvitationsSuccess,
         ownerId: ownerId,
         ownerType: ownerType,
         configurationId: configuration.id,
         extraColumnsData: invitationsTableExtraColumnsData,
         hideAddEmailsForm: hideAddEmailsFromInvitationPane,
-        isOpen: showInviationsPane && !isFetching,
+        isOpen: showInvitationsPane && !isFetching,
         onClose: function onClose() {
-          return setShowInviationsPane(false);
+          return setShowInvitationsPane(false);
         }
       }), children]
     })]