@bigbinary/neeto-team-members-frontend 4.4.27 → 4.5.1

package/app/javascript/src/translations/en.json

@@ -31,6 +31,7 @@
       "back": "Back",
       "cancel": "Cancel",
       "continue": "Continue",
+      "download": "Download",
       "editBasicInfo": "Edit basic info",
       "manageBillingAndSubscriptions": "Manage billing and subscriptions",
       "reset": "Reset",
@@ -63,6 +64,7 @@
       "edit_": "Edit {{what}}",
       "email_one": "Email",
       "email_other": "Emails",
+      "format": "Format",
       "name": "Name",
       "notFound_": "There are no {{what}} to show",
       "notFoundWithKind_": "There are no {{kind}} {{what}} to show",
@@ -120,7 +122,13 @@
       "removeMember": "Remove {{member}}?",
       "timeZone": "Time zone",
       "totalMembers": "Total {{taxonomies.member.plural}}",
-      "groupName": "{{taxonomies.group.singular, anyCase}} name"
+      "groupName": "{{taxonomies.group.singular, anyCase}} name",
+      "downloadAs": "Download as {{format, anyCase}}",
+      "downloads": {
+        "pdf": "PDF",
+        "csv": "CSV",
+        "xlsx": "Excel"
+      }
     },
     "placeholders": {
       "email": "Please enter the email addresses",
@@ -161,6 +169,14 @@
       "noWhiteSpaces": "{{what, anyCase}} should not lead or end with white spaces",
       "max": "Field must be less than {{size}} characters"
     },
+    "downloadPane": {
+      "title": "Download {{taxonomies.member.plural}}",
+      "description": {
+        "selectedMembers_one": "Download selected {{taxonomies.member.singular}}",
+        "selectedMembers_other": "Download {{count}} selected {{taxonomies.member.plural}}",
+        "allMembers": "Download all {{taxonomies.member.plural}}"
+      }
+    },
     "profile": {
       "common": {
         "myProfile": "My Profile",
@@ -208,5 +224,10 @@
         "dotsNotAllowed": "Dots are not allowed"
       }
     }
+  },
+  "toastr": {
+    "success": {
+      "downloadMembers": "Your file is being prepared. It will be sent to <strong>{{email}}</strong> shortly."
+    }
   }
 }

package/dist/Groups.js

@@ -37,7 +37,7 @@ import Tooltip from '@bigbinary/neetoui/Tooltip';
 import { pluralizeLabelUsingTaxonomy } from './utils.js';
 import '@bigbinary/neeto-commons-frontend/constants';
 import './_commonjsHelpers-BFTU3MAI.js';
-import './useTeamsApi-DReZnkbo.js';
+import './useTeamsApi-DLoZKPuX.js';
 import '@babel/runtime/helpers/objectWithoutProperties';
 import 'qs';
 import './queryClient-Dsu-gu4Y.js';

package/dist/ManageMember.js

@@ -16,8 +16,8 @@ import '@bigbinary/neetoui/formik/Form';
 import 'ramda';
 import 'react-i18next';
 import './index-Dvjcz-b3.js';
-import './useTeamsApi-DReZnkbo.js';
-export { M as default } from './index-CKp_a6SU.js';
+import './useTeamsApi-DLoZKPuX.js';
+export { M as default } from './index-C2ciZlLk.js';
 import './RolesRadioGroup-Bxt7zZkh.js';
 import 'react/jsx-runtime';
 import '@babel/runtime/helpers/objectWithoutProperties';

package/dist/MembersDropdown.js

@@ -6,7 +6,7 @@ import Dropdown from '@bigbinary/neetoui/Dropdown';
 import Spinner from '@bigbinary/neetoui/Spinner';
 import { includes, toLower, map, append, pluck, any, not, isEmpty } from 'ramda';
 import { useTranslation } from 'react-i18next';
-import { A as AssignList } from './index-D0Ev1DvT.js';
+import { A as AssignList } from './index-Cpad1EmZ.js';
 import Down from '@bigbinary/neeto-icons/Down';
 import Avatar from '@bigbinary/neetoui/Avatar';
 import Tooltip from '@bigbinary/neetoui/Tooltip';

package/dist/TeamMembers.js

@@ -4,7 +4,7 @@ import { useState, useMemo, memo, useEffect } from 'react';
 import { DEFAULT_PAGE_INDEX, PLURAL } from '@bigbinary/neeto-commons-frontend/constants';
 import { taxonomies, globalProps } from '@bigbinary/neeto-commons-frontend/initializers';
 import { useQueryParams, useFuncDebounce, useDebounce, withT, withTitle, useBreakpoints } from '@bigbinary/neeto-commons-frontend/react-utils';
-import { buildUrl } from '@bigbinary/neeto-commons-frontend/utils';
+import { captureAnalyticsEvent, buildUrl } from '@bigbinary/neeto-commons-frontend/utils';
 import FiltersBar from '@bigbinary/neeto-filters-frontend/Bar';
 import { useHiddenColumns } from '@bigbinary/neeto-molecules/Columns';
 import Container from '@bigbinary/neeto-molecules/Container';
@@ -19,10 +19,10 @@ import { useTranslation, Trans } from 'react-i18next';
 import { useHistory } from 'react-router-dom';
 import { w as withReactQuery } from './withReactQuery-CHybbL5V.js';
 import { u as useFetchRoles } from './index-Dvjcz-b3.js';
-import { e as useFetchFilterOptions, f as useBulkUpdateMembers, u as useFetchMembers, d as useUpdateMember } from './useTeamsApi-DReZnkbo.js';
+import { e as useFetchFilterOptions, f as useBulkUpdateMembers, g as useExportMembers, u as useFetchMembers, d as useUpdateMember } from './useTeamsApi-DLoZKPuX.js';
 import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
 import { buildFiltersFromURL } from '@bigbinary/neeto-filters-frontend/utils';
-import { d as defaultNeetoFiltersColumns, D as DEFAULT_FILTER_VALUES, b as buildFilterColumns, a as DEFAULT_IS_OPEN_VALUES, c as DEFAULT_SELECTED_ROWS, h as handlePageChange, T as TEAM_MEMBERS_HIDDEN_COLUMNS, g as getFilteredRoles, e as getColumnData, f as generateNoDataContent, i as DEFAULT_RADIX, r as renderPaginationProps, M as ManageMember, j as renderUpdateAlert } from './index-CKp_a6SU.js';
+import { d as defaultNeetoFiltersColumns, D as DEFAULT_FILTER_VALUES, b as buildFilterColumns, a as DEFAULT_IS_OPEN_VALUES, c as DEFAULT_SELECTED_ROWS, h as handlePageChange, T as TEAM_MEMBERS_HIDDEN_COLUMNS, g as getFilteredRoles, e as getColumnData, f as generateNoDataContent, i as DEFAULT_RADIX, r as renderPaginationProps, M as ManageMember, j as renderUpdateAlert } from './index-C2ciZlLk.js';
 import { n } from './inject-css-DmrvuTKK.js';
 import { noop, isNotEmpty, hyphenate, findBy } from '@bigbinary/neeto-cist';
 import Button from '@bigbinary/neetoui/Button';
@@ -34,6 +34,10 @@ import Typography from '@bigbinary/neetoui/Typography';
 import Right$1 from '@bigbinary/neeto-icons/Right';
 import Search from '@bigbinary/neeto-icons/Search';
 import Input from '@bigbinary/neetoui/Input';
+import Pane from '@bigbinary/neetoui/Pane';
+import Radio from '@bigbinary/neetoui/Radio';
+import Toastr from '@bigbinary/neetoui/Toastr';
+import { EVENTS } from './constants.js';
 import NeetoHeader from '@bigbinary/neeto-molecules/Header';
 import '@tanstack/react-query';
 import './queryClient-Dsu-gu4Y.js';
@@ -45,7 +49,6 @@ import 'qs';
 import 'classnames';
 import '@bigbinary/neeto-icons/Info';
 import '@bigbinary/neeto-icons/LeftArrow';
-import '@bigbinary/neetoui/Toastr';
 import '@bigbinary/neetoui/Callout';
 import '@bigbinary/neetoui/formik/ActionBlock';
 import '@bigbinary/neetoui/formik/Form';
@@ -56,15 +59,14 @@ import './RolesRadioGroup-Bxt7zZkh.js';
 import '@bigbinary/neetoui/Label';
 import '@bigbinary/neetoui/formik/Radio';
 import 'yup';
-import '@bigbinary/neetoui/Pane';
 import '@bigbinary/neetoui/Modal';
 import '@bigbinary/neetoui/formik/MultiEmailInput';
 import '@bigbinary/neetoui/formik/Input';
 import '@bigbinary/neeto-molecules/MoreDropdown';
 import '@bigbinary/neetoui/Avatar';
 
-function ownKeys$5(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$5(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$5(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$5(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function ownKeys$6(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$6(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$6(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$6(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var useFilters = function useFilters(_ref) {
   var _config$filterColumns;
   var config = _ref.config;
@@ -83,7 +85,7 @@ var useFilters = function useFilters(_ref) {
     emailSearchTerm = _useState2[0],
     setEmailSearchTerm = _useState2[1];
   var defaultNeetoFilters = buildFiltersFromURL([].concat(_toConsumableArray((_config$filterColumns = config === null || config === void 0 ? void 0 : config.filterColumns) !== null && _config$filterColumns !== void 0 ? _config$filterColumns : defaultNeetoFiltersColumns()), [searchKeywordProps]));
-  var _useState3 = useState(_objectSpread$5(_objectSpread$5(_objectSpread$5({}, DEFAULT_FILTER_VALUES), config === null || config === void 0 ? void 0 : config.defaultFilterValues), {}, {
+  var _useState3 = useState(_objectSpread$6(_objectSpread$6(_objectSpread$6({}, DEFAULT_FILTER_VALUES), config === null || config === void 0 ? void 0 : config.defaultFilterValues), {}, {
       neetoFilters: defaultNeetoFilters
     })),
     _useState4 = _slicedToArray(_useState3, 2),
@@ -132,8 +134,8 @@ var useFilters = function useFilters(_ref) {
   };
 };
 
-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; }
+function ownKeys$5(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$5(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$5(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$5(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var useTeams = function useTeams(_ref) {
   var config = _ref.config,
     filters = _ref.filters,
@@ -209,7 +211,7 @@ var useTeams = function useTeams(_ref) {
       emails: pluck("email", rowData),
       keys: keys
     };
-    setSelectedRows(_objectSpread$4({}, rows));
+    setSelectedRows(_objectSpread$5({}, rows));
     config === null || config === void 0 || (_config$table = config.table) === null || _config$table === void 0 || (_config$table$onRowSe = _config$table.onRowSelect) === null || _config$table$onRowSe === void 0 || _config$table$onRowSe.call(_config$table, {
       rows: rows,
       resetSelectedRows: resetSelectedRows,
@@ -239,8 +241,8 @@ n(css,{});
 var FIXED_COLUMNS = ["name", "actions"];
 var MANAGE_ROLES_BUTTON_LABEL = t("neetoTeamMembers.labels.manageRole", PLURAL);
 
-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 Header$2 = function Header(_ref) {
   var isCreatePermissionGranted = _ref.isCreatePermissionGranted,
     otherActionBlock = _ref.otherActionBlock,
@@ -252,7 +254,7 @@ var Header$2 = function Header(_ref) {
   var isRolesButtonVisible = !!rolesButtonProps;
   var isOtherActionBlockVisible = !!otherActionBlock;
   return /*#__PURE__*/jsxs(Fragment, {
-    children: [isOtherActionBlockVisible && otherActionBlock(), isRolesButtonVisible ? /*#__PURE__*/jsx(Button, _objectSpread$3({
+    children: [isOtherActionBlockVisible && otherActionBlock(), isRolesButtonVisible ? /*#__PURE__*/jsx(Button, _objectSpread$4({
       "data-cy": "ntm-manage-roles-button",
       label: MANAGE_ROLES_BUTTON_LABEL,
       style: "secondary"
@@ -393,8 +395,8 @@ var RolesDropdown = function RolesDropdown(_ref) {
   });
 };
 
-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 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 Menu = Dropdown.Menu,
   MenuItem = Dropdown.MenuItem;
 var Left = function Left(_ref) {
@@ -540,7 +542,7 @@ var Left = function Left(_ref) {
       title: selectedAlert === null || selectedAlert === void 0 ? void 0 : selectedAlert.title,
       message: /*#__PURE__*/jsx(Trans, {
         i18nKey: selectedAlert === null || selectedAlert === void 0 ? void 0 : selectedAlert.message,
-        values: _objectSpread$2(_objectSpread$2({}, selectedMembersCountValues), {}, {
+        values: _objectSpread$3(_objectSpread$3({}, selectedMembersCountValues), {}, {
           person: selectedRows.displayNames[0],
           role: bulkUpdateRole
         })
@@ -557,9 +559,10 @@ var Right = withT(function (_ref3) {
     columns = _ref3.columns,
     filterColumns = _ref3.filterColumns,
     handleNeetoFilterChange = _ref3.handleNeetoFilterChange,
-    setIsFiltersPaneOpen = _ref3.setIsFiltersPaneOpen,
     isFiltersPaneOpen = _ref3.isFiltersPaneOpen,
-    searchKeywordProps = _ref3.searchKeywordProps;
+    searchKeywordProps = _ref3.searchKeywordProps,
+    setIsDownloadPaneOpen = _ref3.setIsDownloadPaneOpen,
+    setIsFiltersPaneOpen = _ref3.setIsFiltersPaneOpen;
   return /*#__PURE__*/jsx(SubHeader$1.RightBlock, {
     columnsButtonProps: {
       columnData: columns,
@@ -570,6 +573,12 @@ var Right = withT(function (_ref3) {
         placeholder: t("neetoTeamMembers.columns.search")
       }
     },
+    downloadButtonProps: {
+      isVisible: true,
+      onClick: function onClick() {
+        return setIsDownloadPaneOpen(true);
+      }
+    },
     filterProps: {
       columns: filterColumns,
       isOpen: isFiltersPaneOpen,
@@ -584,6 +593,134 @@ var SubHeader = {
   Right: Right
 };
 
+var EXPORT_TYPES = {
+  PDF: "pdf",
+  CSV: "csv",
+  EXCEL: "xlsx"
+};
+var DEFAULT_EXPORT_OPTIONS = {
+  exportType: EXPORT_TYPES.EXCEL
+};
+var EXPORT_OPTIONS = [{
+  type: EXPORT_TYPES.EXCEL,
+  individualExportLabel: t("neetoTeamMembers.labels.downloads.xlsx"),
+  bulkExportLabel: t("neetoTeamMembers.labels.downloadAs", {
+    format: t("neetoTeamMembers.labels.downloads.xlsx")
+  }),
+  dataCy: "download-as-excel-radio-item"
+}, {
+  type: EXPORT_TYPES.CSV,
+  individualExportLabel: t("neetoTeamMembers.labels.downloads.csv"),
+  bulkExportLabel: t("neetoTeamMembers.labels.downloadAs", {
+    format: t("neetoTeamMembers.labels.downloads.csv")
+  }),
+  dataCy: "download-as-csv-radio-item"
+}, {
+  type: EXPORT_TYPES.PDF,
+  individualExportLabel: t("neetoTeamMembers.labels.downloads.pdf"),
+  bulkExportLabel: t("neetoTeamMembers.labels.downloadAs", {
+    format: t("neetoTeamMembers.labels.downloads.pdf")
+  }),
+  dataCy: "download-as-pdf-radio-item"
+}];
+
+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; }
+var ExportPane = function ExportPane(_ref) {
+  var isOpen = _ref.isOpen,
+    onClose = _ref.onClose,
+    appliedFilters = _ref.appliedFilters,
+    hasBulkSelectedAllRows = _ref.hasBulkSelectedAllRows,
+    selectedMemberIds = _ref.selectedMemberIds,
+    selectedRowsCount = _ref.selectedRowsCount;
+  var _useState = useState(DEFAULT_EXPORT_OPTIONS),
+    _useState2 = _slicedToArray(_useState, 2),
+    exportOptions = _useState2[0],
+    setExportOptions = _useState2[1];
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var setExportOption = function setExportOption(exportOptions) {
+    return setExportOptions(mergeLeft(exportOptions));
+  };
+  var exportType = exportOptions.exportType;
+  var getParams = function getParams() {
+    return _objectSpread$2(_objectSpread$2({}, exportOptions), {}, {
+      filters: appliedFilters || undefined,
+      considerAllMembers: hasBulkSelectedAllRows,
+      memberIds: hasBulkSelectedAllRows ? undefined : selectedMemberIds
+    });
+  };
+  var _useExportMembers = useExportMembers({
+      onSuccess: function onSuccess() {
+        onClose();
+        setExportOptions(DEFAULT_EXPORT_OPTIONS);
+        Toastr.success(/*#__PURE__*/jsx(Trans, {
+          i18nKey: "toastr.success.downloadMembers",
+          values: {
+            email: globalProps.user.email
+          }
+        }));
+        captureAnalyticsEvent(EVENTS.TEAM_MEMBERS_DOWNLOADED, _objectSpread$2({}, exportOptions));
+      },
+      onError: function onError(error) {
+        return Toastr.error(error);
+      }
+    }),
+    exportMembers = _useExportMembers.mutate;
+  var description = isNotEmpty(selectedMemberIds) || hasBulkSelectedAllRows ? t("neetoTeamMembers.downloadPane.description.selectedMembers", {
+    count: selectedRowsCount
+  }) : t("neetoTeamMembers.downloadPane.description.allMembers");
+  return /*#__PURE__*/jsxs(Pane, {
+    isOpen: isOpen,
+    onClose: onClose,
+    children: [/*#__PURE__*/jsx(Pane.Header, {
+      children: /*#__PURE__*/jsx(Typography, {
+        "data-cy": "export-member-heading",
+        style: "h2",
+        children: t("neetoTeamMembers.downloadPane.title")
+      })
+    }), /*#__PURE__*/jsx(Pane.Body, {
+      children: /*#__PURE__*/jsx(Radio, {
+        stacked: true,
+        className: "flex-grow-0 space-y-4",
+        label: description,
+        children: EXPORT_OPTIONS.map(function (_ref2) {
+          var type = _ref2.type,
+            bulkExportLabel = _ref2.bulkExportLabel,
+            dataCy = _ref2.dataCy;
+          return /*#__PURE__*/jsx(Radio.Item, {
+            checked: exportType === type,
+            "data-cy": dataCy,
+            label: bulkExportLabel,
+            onChange: function onChange() {
+              return setExportOption({
+                exportType: type
+              });
+            }
+          }, type);
+        })
+      })
+    }), /*#__PURE__*/jsxs(Pane.Footer, {
+      className: "gap-x-2",
+      children: [/*#__PURE__*/jsx(Button, {
+        "data-cy": "export-submit-button",
+        label: t("neetoTeamMembers.buttons.download"),
+        onClick: function onClick() {
+          return exportMembers({
+            "export": getParams()
+          });
+        }
+      }), /*#__PURE__*/jsx(Button, {
+        className: "mr-2",
+        "data-cy": "export-cancel-button",
+        label: t("neetoTeamMembers.buttons.cancel"),
+        style: "text",
+        onClick: onClose
+      })]
+    })]
+  });
+};
+
 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; }
 var Header = function Header(_ref) {
@@ -625,8 +762,12 @@ var TeamMembers = function TeamMembers(_ref) {
     setIsFiltersPaneOpen = _useState2[1];
   var _useState3 = useState(false),
     _useState4 = _slicedToArray(_useState3, 2),
-    hasBulkSelectedAllRows = _useState4[0],
-    setHasBulkSelectedAllRows = _useState4[1];
+    isDownloadPaneOpen = _useState4[0],
+    setIsDownloadPaneOpen = _useState4[1];
+  var _useState5 = useState(false),
+    _useState6 = _slicedToArray(_useState5, 2),
+    hasBulkSelectedAllRows = _useState6[0],
+    setHasBulkSelectedAllRows = _useState6[1];
   useEffect(function () {
     handleMemberFilterChange();
   }, []);
@@ -761,6 +902,7 @@ var TeamMembers = function TeamMembers(_ref) {
           handleNeetoFilterChange: handleNeetoFilterChange,
           isFiltersPaneOpen: isFiltersPaneOpen,
           searchKeywordProps: searchKeywordProps,
+          setIsDownloadPaneOpen: setIsDownloadPaneOpen,
           setIsFiltersPaneOpen: setIsFiltersPaneOpen
         })
       }), /*#__PURE__*/jsx(FiltersBar, {
@@ -769,6 +911,15 @@ var TeamMembers = function TeamMembers(_ref) {
         keyword: searchKeywordProps,
         setIsPaneOpen: setIsFiltersPaneOpen,
         onChange: handleNeetoFilterChange
+      }), /*#__PURE__*/jsx(ExportPane, {
+        hasBulkSelectedAllRows: hasBulkSelectedAllRows,
+        selectedRowsCount: selectedRowsCount,
+        appliedFilters: filters,
+        isOpen: isDownloadPaneOpen,
+        selectedMemberIds: selectedRows.keys,
+        onClose: function onClose() {
+          return setIsDownloadPaneOpen(false);
+        }
       }), /*#__PURE__*/jsx(TableWrapper, {
         hasPagination: (team === null || team === void 0 ? void 0 : team.membersCount) > filters.pageSize,
         children: (team === null || team === void 0 ? void 0 : team.membersCount) !== 0 ? /*#__PURE__*/jsx(Table, {