@bigbinary/neeto-team-members-frontend 2.5.17 → 2.5.19

package/dist/index.cjs.js

@@ -5540,7 +5540,8 @@ var helpers$1 = {
 	selectedMembersCount: "{{count}} {{metaName}} selected of",
 	singleProductInvitation: "{{- emails, boldList}} will be invited to <strong>{{product}}</strong> with a role of <strong>{{role}}</strong>.",
 	themeSelector: "Theme selector",
-	visitToKnowMoreAboutPermissions: "Visit to know more about permissions"
+	visitToKnowMoreAboutPermissions: "Visit to know more about permissions",
+	whyIsItDisabled: "Why is it disabled?"
 };
 var labels = {
 	neeto_: "neeto{{product}}"
@@ -5568,8 +5569,7 @@ var tooltips$1 = {
 	noPermissionToEditRoles: "Please ask the admin to permit you to edit roles.",
 	noPermissionToRemoveRoles: "Please ask the admin to permit you to remove roles.",
 	goBackToChangeRole: "Please go back to change the role.",
-	hostAppisRequired: "This neeto product is required to continue.",
-	whyEmailsAreNotEditable: "Why can't the owner change another user's email?"
+	hostAppisRequired: "This neeto product is required to continue."
 };
 var validations$1 = {
 	enterRoleName: "Please enter a valid role name.",
@@ -5631,9 +5631,13 @@ var common = {
 	edit_: "Modifier le {{what}}",
 	email_one: "E-mail",
 	email_other: "E-mails",
+	invited: "Invité",
+	inviteStatus: "Statut d'invitation",
 	manage_: "Gérer {{what}}",
 	name: "Nom",
 	notFound_: "Il n'y a pas de {{what}} à afficher",
+	notInvited: "Non invité",
+	pending: "En attente",
 	permission_one: "Autorisation",
 	permission_other: "Autorisations",
 	role_one: "Rôle",
@@ -5656,7 +5660,8 @@ var helpers = {
 	singleProductInvitation_one: "{{- emails, boldList}} sera invité à <strong>{{product}}</strong> avec un rôle de <strong>{{role}}</strong>.",
 	singleProductInvitation_other: "{{- emails, boldList}} seront invités à <strong>{{product}}</strong> avec un rôle de <strong>{{role}}</strong>.",
 	themeSelector: "Sélecteur de thème",
-	visitToKnowMoreAboutPermissions: "Visitez pour en savoir plus sur les autorisations"
+	visitToKnowMoreAboutPermissions: "Visitez pour en savoir plus sur les autorisations",
+	whyIsItDisabled: "Pourquoi est-ce désactivé?"
 };
 var metaNames = {
 	member_one: "Membre",
@@ -5679,8 +5684,7 @@ var tooltips = {
 	noPermissionToEditRoles: "Veuillez demander à l'administrateur de vous autoriser à modifier les rôles.",
 	noPermissionToRemoveRoles: "Veuillez demander à l'administrateur de vous autoriser à supprimer des rôles.",
 	goBackToChangeRole: "Veuillez revenir en arrière pour modifier le rôle.",
-	hostAppisRequired: "Ce produit neeto est nécessaire pour continuer.",
-	whyEmailsAreNotEditable: "Pourquoi le propriétaire ne peut-il pas modifier l'adresse e-mail d'un autre utilisateur?"
+	hostAppisRequired: "Ce produit neeto est nécessaire pour continuer."
 };
 var validations = {
 	enterRoleName: "Veuillez entrer le nom du rôle",
@@ -10560,6 +10564,18 @@ const DEFAULT_SELECTED_ROWS = {
   keys: []
 };
 const DEFAULT_NEETO_FILTERS_COLUMNS = [{
+  key: "email",
+  node: "email",
+  label: instance.t("common.email", SINGULAR),
+  type: "multi_option",
+  values: []
+}, {
+  key: "name",
+  node: "first_name,last_name",
+  label: instance.t("common.name"),
+  type: "text",
+  values: ""
+}, {
   key: "role",
   node: "organization_role.name",
   model: "OrganizationRole",
@@ -11393,9 +11409,28 @@ const getMetaName = ramda.curry((metaName, count) => {
 });
 const clearSelectedMembers = (previousCategory, currentCategory) => pure.notEquals(previousCategory, currentCategory) && pure.notEquals(currentCategory, "ALL");
 const buildFilterColumns = _ref10 => {
-  let _ref10$organizationRo = _ref10.organizationRoles,
-    organizationRoles = _ref10$organizationRo === void 0 ? [] : _ref10$organizationRo;
-  return ramda.assocPath([0, "values"], organizationRoles.map(pure.toLabelAndValue), DEFAULT_NEETO_FILTERS_COLUMNS);
+  let _ref10$options = _ref10.options,
+    _ref10$options$emails = _ref10$options.emails,
+    emails = _ref10$options$emails === void 0 ? [] : _ref10$options$emails,
+    _ref10$options$organi = _ref10$options.organizationRoles,
+    organizationRoles = _ref10$options$organi === void 0 ? [] : _ref10$options$organi,
+    _ref10$emailConfig = _ref10.emailConfig,
+    setSearchTerm = _ref10$emailConfig.setSearchTerm,
+    isLoading = _ref10$emailConfig.isLoading;
+  const columnValues = {
+    email: emails.map(pure.toLabelAndValue),
+    role: organizationRoles.map(pure.toLabelAndValue)
+  };
+  return DEFAULT_NEETO_FILTERS_COLUMNS.map(column => {
+    const values = columnValues[column.key];
+    if (column.key === "role") return ramda.assoc("values", values, column);
+    const emailConfig = {
+      values,
+      isLoading,
+      onInputChange: setSearchTerm
+    };
+    return ramda.mergeLeft(emailConfig, column);
+  });
 };
 const getValidCategory = function (category) {
   let defaultCategory = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : MEMBER_FILTER.ACTIVE.value;
@@ -11721,27 +11756,6 @@ const Confirmation = () => {
   }));
 };
 
-const LabelWithIcon = _ref => {
-  let _ref$label = _ref.label,
-    label = _ref$label === void 0 ? "" : _ref$label,
-    _ref$tooltipProps = _ref.tooltipProps,
-    tooltipProps = _ref$tooltipProps === void 0 ? {
-      content: ""
-    } : _ref$tooltipProps,
-    _ref$iconProps = _ref.iconProps,
-    iconProps = _ref$iconProps === void 0 ? {
-      onClick: pure.noop
-    } : _ref$iconProps;
-  return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("span", {
-    className: "ntm-members-radio-group__label"
-  }, label), /*#__PURE__*/React__default["default"].createElement(neetoui.Tooltip, _extends({
-    position: "right"
-  }, tooltipProps), /*#__PURE__*/React__default["default"].createElement("span", null, /*#__PURE__*/React__default["default"].createElement(neetoIcons.Info, _extends({
-    className: "ntm-members-radio-group__icon",
-    size: 16
-  }, iconProps)))));
-};
-
 const MultipleEmailInput = _ref => {
   var _head;
   let _ref$emails = _ref.emails,
@@ -11757,15 +11771,17 @@ const MultipleEmailInput = _ref => {
     name: "emails",
     size: "medium",
     value: (_head = ramda.head(emails)) === null || _head === void 0 ? void 0 : _head.value,
-    label: /*#__PURE__*/React__default["default"].createElement(LabelWithIcon, {
-      label: instance.t("common.email", SINGULAR),
-      iconProps: {
-        onClick: () => window.open(OWNER_CANT_CHANGE_USER_EMAIL_KB_ARTICLE_URL, "_blank")
-      },
-      tooltipProps: {
-        content: instance.t("tooltips.whyEmailsAreNotEditable")
-      }
-    })
+    label: /*#__PURE__*/React__default["default"].createElement("span", {
+      className: "neeto-ui-w-full neeto-ui-flex neeto-ui-justify-between"
+    }, /*#__PURE__*/React__default["default"].createElement(neetoui.Typography, {
+      component: "span",
+      style: "body2"
+    }, instance.t("common.email", SINGULAR)), /*#__PURE__*/React__default["default"].createElement(neetoui.Button, {
+      href: OWNER_CANT_CHANGE_USER_EMAIL_KB_ARTICLE_URL,
+      label: instance.t("helpers.whyIsItDisabled"),
+      style: "link",
+      target: "_blank"
+    }))
   }) : /*#__PURE__*/React__default["default"].createElement(formik$1.MultiEmailInput, {
     counter: COUNTER_PROPS,
     "data-cy": "ntm-manage-member-email-input",
@@ -11778,6 +11794,27 @@ const MultipleEmailInput = _ref => {
   }));
 };
 
+const LabelWithIcon = _ref => {
+  let _ref$label = _ref.label,
+    label = _ref$label === void 0 ? "" : _ref$label,
+    _ref$tooltipProps = _ref.tooltipProps,
+    tooltipProps = _ref$tooltipProps === void 0 ? {
+      content: ""
+    } : _ref$tooltipProps,
+    _ref$iconProps = _ref.iconProps,
+    iconProps = _ref$iconProps === void 0 ? {
+      onClick: pure.noop
+    } : _ref$iconProps;
+  return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("span", {
+    className: "ntm-members-radio-group__label"
+  }, label), /*#__PURE__*/React__default["default"].createElement(neetoui.Tooltip, _extends({
+    position: "right"
+  }, tooltipProps), /*#__PURE__*/React__default["default"].createElement("span", null, /*#__PURE__*/React__default["default"].createElement(neetoIcons.Info, _extends({
+    className: "ntm-members-radio-group__icon",
+    size: 16
+  }, iconProps)))));
+};
+
 const RolesRadioGroup = _ref => {
   let _ref$role = _ref.role,
     role = _ref$role === void 0 ? "" : _ref$role,
@@ -12066,25 +12103,40 @@ function _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) {
 const useFilters = _ref => {
   var _config$filterColumns, _config$defaultFilter;
   let config = _ref.config;
+  const _useState = React.useState(""),
+    _useState2 = _slicedToArray(_useState, 2),
+    emailSearchTerm = _useState2[0],
+    setEmailSearchTerm = _useState2[1];
   const metaName = getMetaName((config === null || config === void 0 ? void 0 : config.metaName) || "member");
   const defaultNeetoFilters = Ze((_config$filterColumns = config === null || config === void 0 ? void 0 : config.filterColumns) !== null && _config$filterColumns !== void 0 ? _config$filterColumns : DEFAULT_NEETO_FILTERS_COLUMNS);
-  const _useState = React.useState(_objectSpread$2(_objectSpread$2(_objectSpread$2({}, DEFAULT_FILTER_VALUES), config === null || config === void 0 ? void 0 : config.defaultFilterValues), {}, {
+  const _useState3 = React.useState(_objectSpread$2(_objectSpread$2(_objectSpread$2({}, DEFAULT_FILTER_VALUES), config === null || config === void 0 ? void 0 : config.defaultFilterValues), {}, {
       neetoFilters: defaultNeetoFilters,
       category: getValidCategory(URL_CATEGORY_FILTER_VALUE, config === null || config === void 0 ? void 0 : (_config$defaultFilter = config.defaultFilterValues) === null || _config$defaultFilter === void 0 ? void 0 : _config$defaultFilter.category)
     })),
-    _useState2 = _slicedToArray(_useState, 2),
-    filters = _useState2[0],
-    setFilters = _useState2[1];
+    _useState4 = _slicedToArray(_useState3, 2),
+    filters = _useState4[0],
+    setFilters = _useState4[1];
   const debouncedSearch = reactUtils.useDebounce(filters.search, 750);
+  const debouncedEmailSearchTerm = reactUtils.useDebounce(emailSearchTerm, 750);
   const shouldFetchFilterOptions = ramda.isNil(config === null || config === void 0 ? void 0 : config.filterColumns);
   const _useFetchFilterOption = useFetchFilterOptions({
+      params: {
+        emailSearchTerm: debouncedEmailSearchTerm
+      },
       options: {
         enabled: shouldFetchFilterOptions
       }
     }),
     _useFetchFilterOption2 = _useFetchFilterOption.data,
-    filterOptions = _useFetchFilterOption2 === void 0 ? {} : _useFetchFilterOption2;
-  const filterColumns = shouldFetchFilterOptions ? buildFilterColumns(filterOptions) : config === null || config === void 0 ? void 0 : config.filterColumns;
+    filterOptions = _useFetchFilterOption2 === void 0 ? {} : _useFetchFilterOption2,
+    isFilterOptionsLoading = _useFetchFilterOption.isLoading;
+  const filterColumns = shouldFetchFilterOptions ? buildFilterColumns({
+    options: filterOptions,
+    emailConfig: {
+      setSearchTerm: setEmailSearchTerm,
+      isLoading: isFilterOptionsLoading
+    }
+  }) : config === null || config === void 0 ? void 0 : config.filterColumns;
   const searchProps = {
     "data-cy": "ntm-search-members-input",
     onChange: _ref2 => {