cozy-sharing 11.0.0 → 11.1.0

package/dist/components/Recipient/actions/revokeMember.js

@@ -0,0 +1,41 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React, { forwardRef } from 'react';
+import ActionsMenuItem from 'cozy-ui/transpiled/react/ActionsMenu/ActionsMenuItem';
+import Icon from 'cozy-ui/transpiled/react/Icon';
+import TrashIcon from 'cozy-ui/transpiled/react/Icons/Trash';
+import ListItemIcon from 'cozy-ui/transpiled/react/ListItemIcon';
+import ListItemText from 'cozy-ui/transpiled/react/ListItemText';
+import Typography from 'cozy-ui/transpiled/react/Typography';
+
+var revokeMember = function revokeMember(_ref) {
+  var t = _ref.t,
+      isOwner = _ref.isOwner,
+      handleRevocation = _ref.handleRevocation;
+  var revokeType = isOwner ? 'revoke' : 'revokeSelf';
+  var title = t("RevokeMemberItem.".concat(revokeType, ".title"));
+  var desc = t("RevokeMemberItem.".concat(revokeType, ".desc"));
+  var icon = TrashIcon;
+  return {
+    name: 'revokeMember',
+    label: title,
+    icon: icon,
+    action: function action() {
+      handleRevocation();
+    },
+    Component: /*#__PURE__*/forwardRef(function RevokeMemberItem(props, ref) {
+      return /*#__PURE__*/React.createElement(ActionsMenuItem, _extends({}, props, {
+        ref: ref
+      }), /*#__PURE__*/React.createElement(ListItemIcon, null, /*#__PURE__*/React.createElement(Icon, {
+        icon: icon,
+        color: "var(--errorColor)"
+      })), /*#__PURE__*/React.createElement(ListItemText, {
+        primary: /*#__PURE__*/React.createElement(Typography, {
+          color: "error"
+        }, title),
+        secondary: desc
+      }));
+    })
+  };
+};
+
+export { revokeMember };

package/dist/components/ShareByEmail.js

@@ -2,10 +2,10 @@ import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _regeneratorRuntime from "@babel/runtime/regenerator";
-import get from 'lodash/get';
 import PropTypes from 'prop-types';
 import React, { useState } from 'react';
 import { useClient } from 'cozy-client';
+import flag from 'cozy-flags';
 import Alerter from 'cozy-ui/transpiled/react/deprecated/Alerter';
 import { useI18n } from 'cozy-ui/transpiled/react/providers/I18n';
 import ShareRecipientsInput from './ShareRecipientsInput';
@@ -13,10 +13,9 @@ import { ShareRecipientsLimitModal } from './ShareRecipientsLimitModal';
 import ShareSubmit from './Sharesubmit';
 import ShareTypeSelect from './Sharetypeselect';
 import { getOrCreateFromArray } from '../helpers/contacts';
-import { hasReachRecipientsLimit } from '../helpers/recipients';
+import { mergeRecipients, spreadGroupAndMergeRecipients, hasReachRecipientsLimit } from '../helpers/recipients';
 import { getSuccessMessage } from '../helpers/successMessage';
-import { Group } from '../models';
-import { contactsResponseType, groupsResponseType } from '../propTypes';
+import { contactsResponseType, contactGroupsResponseType } from '../propTypes';
 import { isReadOnlySharing } from '../state';
 var styles = {
   "share-modal-content": "share__share-modal-content___1iqEq",
@@ -43,7 +42,7 @@ var styles = {
 };
 export var ShareByEmail = function ShareByEmail(_ref) {
   var contacts = _ref.contacts,
-      groups = _ref.groups,
+      contactGroups = _ref.contactGroups,
       document = _ref.document,
       sharingDesc = _ref.sharingDesc,
       onShare = _ref.onShare,
@@ -86,28 +85,8 @@ export var ShareByEmail = function ShareByEmail(_ref) {
   };
 
   var onRecipientPick = function onRecipientPick(recipient) {
-    var contactsToAdd;
-
-    if (recipient._type === Group.doctype) {
-      var groupId = recipient.id;
-      contactsToAdd = contacts.data.filter(function (contact) {
-        var contactGroupIds = get(contact, 'relationships.groups.data', []).map(function (group) {
-          return group._id;
-        });
-        return contactGroupIds.includes(groupId);
-      });
-    } else {
-      contactsToAdd = [recipient];
-    }
-
-    var filtered = contactsToAdd.filter(function (contact) {
-      return contact.email && contact.email.length > 0 || contact.cozy && contact.cozy.length > 0;
-    }).filter(function (contact) {
-      return !recipients.find(function (r) {
-        return r === contact;
-      });
-    });
-    setRecipients([].concat(_toConsumableArray(recipients), _toConsumableArray(filtered)));
+    var mergedRecipients = flag('sharing.show-recipient-groups') ? mergeRecipients(recipients, recipient) : spreadGroupAndMergeRecipients(recipients, recipient, contacts);
+    setRecipients(mergedRecipients);
   };
 
   var onRecipientRemove = function onRecipientRemove(recipient) {
@@ -226,7 +205,7 @@ export var ShareByEmail = function ShareByEmail(_ref) {
       return onRecipientRemove(recipient);
     },
     contacts: contacts,
-    groups: groups,
+    contactGroups: contactGroups,
     recipients: recipients
   })), showShareControl && /*#__PURE__*/React.createElement("div", {
     className: styles['share-type-control']
@@ -248,7 +227,7 @@ export var ShareByEmail = function ShareByEmail(_ref) {
 ShareByEmail.propTypes = {
   currentRecipients: PropTypes.arrayOf(PropTypes.object),
   contacts: contactsResponseType.isRequired,
-  groups: groupsResponseType.isRequired,
+  contactGroups: contactGroupsResponseType.isRequired,
   document: PropTypes.object.isRequired,
   documentType: PropTypes.string.isRequired,
   sharingDesc: PropTypes.string.isRequired,

package/dist/components/ShareByEmail.spec.js

@@ -34,7 +34,7 @@ describe('ShareByEmailComponent', function () {
       contacts: {
         data: []
       },
-      groups: {
+      contactGroups: {
         data: []
       },
       documentType: 'Files',

package/dist/components/ShareDialogCozyToCozy.js

@@ -38,10 +38,10 @@ var styles = {
 
 var SharingContent = function SharingContent(_ref) {
   var contacts = _ref.contacts,
+      contactGroups = _ref.contactGroups,
       createContact = _ref.createContact,
       document = _ref.document,
       documentType = _ref.documentType,
-      groups = _ref.groups,
       hasSharedParent = _ref.hasSharedParent,
       isOwner = _ref.isOwner,
       needsContactsPermission = _ref.needsContactsPermission,
@@ -75,11 +75,11 @@ var SharingContent = function SharingContent(_ref) {
     className: "u-mb-1-half"
   }, t('Share.contacts.whoHasAccess')), showShareByEmail && /*#__PURE__*/React.createElement(DumbShareByEmail, {
     contacts: contacts,
+    contactGroups: contactGroups,
     createContact: createContact,
     currentRecipients: recipients,
     document: document,
     documentType: documentType,
-    groups: groups,
     needsContactsPermission: needsContactsPermission,
     onShare: onShare,
     sharing: sharing,

package/dist/components/ShareDialogCozyToCozy.spec.js

@@ -433,7 +433,7 @@ var getMockProps = function getMockProps() {
       _id: 'SOME_DOCUMENT_ID'
     },
     documentType: 'Organizations',
-    groups: {
+    contactGroups: {
       id: 'groups',
       definition: {
         doctype: 'io.cozy.contacts.groups'

package/dist/components/ShareDialogTwoStepsConfirmationContainer.js

@@ -99,10 +99,10 @@ var RejectRecipientActions = function RejectRecipientActions(_ref3) {
 
 var ShareDialogTwoStepsConfirmationContainer = function ShareDialogTwoStepsConfirmationContainer(_ref4) {
   var contacts = _ref4.contacts,
+      contactGroups = _ref4.contactGroups,
       createContact = _ref4.createContact,
       document = _ref4.document,
       documentType = _ref4.documentType,
-      groups = _ref4.groups,
       hasSharedParent = _ref4.hasSharedParent,
       isOwner = _ref4.isOwner,
       link = _ref4.link,
@@ -241,10 +241,10 @@ var ShareDialogTwoStepsConfirmationContainer = function ShareDialogTwoStepsConfi
   } else if (status === 'sharing') {
     dialogContent = /*#__PURE__*/React.createElement(DialogContentOnShare, {
       contacts: contacts,
+      contactGroups: contactGroups,
       createContact: createContact,
       document: document,
       documentType: documentType,
-      groups: groups,
       hasSharedParent: hasSharedParent,
       isOwner: isOwner,
       needsContactsPermission: needsContactsPermission,

package/dist/components/ShareDialogTwoStepsConfirmationContainer.spec.js

@@ -455,7 +455,7 @@ var getMockProps = function getMockProps() {
       _id: 'SOME_DOCUMENT_ID'
     },
     documentType: 'Organizations',
-    groups: {
+    contactGroups: {
       id: 'groups',
       definition: {
         doctype: 'io.cozy.contacts.groups'

package/dist/components/ShareModal/EditableSharingModal.js

@@ -4,10 +4,10 @@ var _excluded = ["document"];
 import PropTypes from 'prop-types';
 import React from 'react';
 import { useClient, useQueryAll } from 'cozy-client';
-import SharingContext from '../../context';
 import { useFetchDocumentPath } from '../../hooks/useFetchDocumentPath';
+import { useSharingContext } from '../../hooks/useSharingContext';
 import { Contact } from '../../models';
-import { buildContactsQuery, buildGroupsQuery } from '../../queries/queries';
+import { buildContactsQuery, buildContactGroupsQuery } from '../../queries/queries';
 import { default as DumbShareModal } from '../ShareModal';
 export var EditableSharingModal = function EditableSharingModal(_ref) {
   var document = _ref.document,
@@ -17,46 +17,47 @@ export var EditableSharingModal = function EditableSharingModal(_ref) {
   var documentPath = useFetchDocumentPath(client, document);
   var contactsQuery = buildContactsQuery();
   var contactsResult = useQueryAll(contactsQuery.definition, contactsQuery.options);
-  var groupsQuery = buildGroupsQuery();
-  var groupsResult = useQueryAll(groupsQuery.definition, groupsQuery.options);
-  return /*#__PURE__*/React.createElement(SharingContext.Consumer, null, function (_ref2) {
-    var documentType = _ref2.documentType,
-        getDocumentPermissions = _ref2.getDocumentPermissions,
-        getRecipients = _ref2.getRecipients,
-        getSharingForSelf = _ref2.getSharingForSelf,
-        getSharingLink = _ref2.getSharingLink,
-        hasSharedChild = _ref2.hasSharedChild,
-        hasSharedParent = _ref2.hasSharedParent,
-        isOwner = _ref2.isOwner,
-        revoke = _ref2.revoke,
-        revokeSelf = _ref2.revokeSelf,
-        revokeSharingLink = _ref2.revokeSharingLink,
-        share = _ref2.share,
-        shareByLink = _ref2.shareByLink,
-        updateDocumentPermissions = _ref2.updateDocumentPermissions;
-    return /*#__PURE__*/React.createElement(DumbShareModal, _extends({
-      contacts: contactsResult,
-      createContact: function createContact(contact) {
-        return client.create(Contact.doctype, contact);
-      },
-      document: document,
-      documentType: documentType,
-      groups: groupsResult,
-      hasSharedChild: documentPath && hasSharedChild(documentPath),
-      hasSharedParent: documentPath && hasSharedParent(documentPath),
-      isOwner: isOwner(document.id),
-      link: getSharingLink(document.id),
-      onRevoke: revoke,
-      onRevokeLink: revokeSharingLink,
-      onRevokeSelf: revokeSelf,
-      onShare: share,
-      onShareByLink: shareByLink,
-      onUpdateShareLinkPermissions: updateDocumentPermissions,
-      permissions: getDocumentPermissions(document.id),
-      recipients: getRecipients(document.id),
-      sharing: getSharingForSelf(document.id)
-    }, rest));
-  });
+  var contactGroupsQuery = buildContactGroupsQuery();
+  var contactGroupsResult = useQueryAll(contactGroupsQuery.definition, contactGroupsQuery.options);
+
+  var _useSharingContext = useSharingContext(),
+      documentType = _useSharingContext.documentType,
+      getDocumentPermissions = _useSharingContext.getDocumentPermissions,
+      getRecipients = _useSharingContext.getRecipients,
+      getSharingForSelf = _useSharingContext.getSharingForSelf,
+      getSharingLink = _useSharingContext.getSharingLink,
+      hasSharedChild = _useSharingContext.hasSharedChild,
+      hasSharedParent = _useSharingContext.hasSharedParent,
+      isOwner = _useSharingContext.isOwner,
+      revoke = _useSharingContext.revoke,
+      revokeSelf = _useSharingContext.revokeSelf,
+      revokeSharingLink = _useSharingContext.revokeSharingLink,
+      share = _useSharingContext.share,
+      shareByLink = _useSharingContext.shareByLink,
+      updateDocumentPermissions = _useSharingContext.updateDocumentPermissions;
+
+  return /*#__PURE__*/React.createElement(DumbShareModal, _extends({
+    contacts: contactsResult,
+    contactGroups: contactGroupsResult,
+    createContact: function createContact(contact) {
+      return client.create(Contact.doctype, contact);
+    },
+    document: document,
+    documentType: documentType,
+    hasSharedChild: documentPath && hasSharedChild(documentPath),
+    hasSharedParent: documentPath && hasSharedParent(documentPath),
+    isOwner: isOwner(document.id),
+    link: getSharingLink(document.id),
+    onRevoke: revoke,
+    onRevokeLink: revokeSharingLink,
+    onRevokeSelf: revokeSelf,
+    onShare: share,
+    onShareByLink: shareByLink,
+    onUpdateShareLinkPermissions: updateDocumentPermissions,
+    permissions: getDocumentPermissions(document.id),
+    recipients: getRecipients(document.id),
+    sharing: getSharingForSelf(document.id)
+  }, rest));
 };
 EditableSharingModal.propTypes = {
   document: PropTypes.object

package/dist/components/ShareModal/EditableSharingModal.spec.js

@@ -36,10 +36,10 @@ describe('EditableSharingModal', function () {
       contacts: {
         data: []
       },
-      document: document,
-      groups: {
+      contactGroups: {
         data: []
       },
+      document: document,
       t: function t(x) {
         return x;
       },

package/dist/components/ShareModal.js

@@ -3,14 +3,14 @@ import React from 'react';
 import flag from 'cozy-flags';
 import ShareDialogCozyToCozy from './ShareDialogCozyToCozy';
 import ShareDialogOnlyByLink from './ShareDialogOnlyByLink';
-import { contactsResponseType, groupsResponseType } from '../propTypes';
+import { contactsResponseType, contactGroupsResponseType } from '../propTypes';
 export var ShareModal = function ShareModal(_ref) {
   var contacts = _ref.contacts,
+      contactGroups = _ref.contactGroups,
       createContact = _ref.createContact,
       document = _ref.document,
       _ref$documentType = _ref.documentType,
       documentType = _ref$documentType === void 0 ? 'Document' : _ref$documentType,
-      groups = _ref.groups,
       hasSharedChild = _ref.hasSharedChild,
       hasSharedParent = _ref.hasSharedParent,
       isOwner = _ref.isOwner,
@@ -48,10 +48,10 @@ export var ShareModal = function ShareModal(_ref) {
     permissions: permissions
   }) : /*#__PURE__*/React.createElement(ShareDialogCozyToCozy, {
     contacts: contacts,
+    contactGroups: contactGroups,
     createContact: createContact,
     document: document,
     documentType: documentType,
-    groups: groups,
     hasSharedParent: hasSharedParent,
     isOwner: isOwner,
     link: link,
@@ -77,10 +77,10 @@ export var ShareModal = function ShareModal(_ref) {
 export default ShareModal;
 ShareModal.propTypes = {
   contacts: contactsResponseType.isRequired,
+  contactGroups: contactGroupsResponseType.isRequired,
   createContact: PropTypes.func.isRequired,
   document: PropTypes.object.isRequired,
   documentType: PropTypes.string,
-  groups: groupsResponseType.isRequired,
   hasSharedChild: PropTypes.bool,
   hasSharedParent: PropTypes.bool,
   isOwner: PropTypes.bool,

package/dist/components/ShareRecipientsInput.js

@@ -3,11 +3,11 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import PropTypes from 'prop-types';
 import React, { useState, useEffect } from 'react';
 import ShareAutosuggest from './ShareAutosuggest';
-import { contactsResponseType, groupsResponseType } from '../propTypes';
+import { contactsResponseType, contactGroupsResponseType } from '../propTypes';
 
 var ShareRecipientsInput = function ShareRecipientsInput(_ref) {
   var contacts = _ref.contacts,
-      groups = _ref.groups,
+      contactGroups = _ref.contactGroups,
       recipients = _ref.recipients,
       placeholder = _ref.placeholder,
       onPick = _ref.onPick,
@@ -19,13 +19,13 @@ var ShareRecipientsInput = function ShareRecipientsInput(_ref) {
       setLoading = _useState2[1];
 
   useEffect(function () {
-    if (loading && !contacts.hasMore && contacts.fetchStatus === 'loaded' && !groups.hasMore && groups.fetchStatus === 'loaded') {
+    if (loading && !contacts.hasMore && contacts.fetchStatus === 'loaded' && !contactGroups.hasMore && contactGroups.fetchStatus === 'loaded') {
       setLoading(false);
     }
-  }, [contacts, groups, loading]);
+  }, [contacts, contactGroups, loading]);
 
   var onShareAutosuggestFocus = function onShareAutosuggestFocus() {
-    if (contacts.hasMore || contacts.fetchStatus === 'loading' || groups.hasMore || groups.fetchStatus === 'loading') {
+    if (contacts.hasMore || contacts.fetchStatus === 'loading' || contactGroups.hasMore || contactGroups.fetchStatus === 'loading') {
       setLoading(true);
     }
   };
@@ -35,7 +35,7 @@ var ShareRecipientsInput = function ShareRecipientsInput(_ref) {
     if (contacts.hasMore || contacts.fetchStatus === 'loading') {
       return contacts.data;
     } else {
-      return [].concat(_toConsumableArray(contacts.data), _toConsumableArray(groups.data));
+      return [].concat(_toConsumableArray(contacts.data), _toConsumableArray(contactGroups.data));
     }
   };
 
@@ -52,7 +52,7 @@ var ShareRecipientsInput = function ShareRecipientsInput(_ref) {
 
 ShareRecipientsInput.propTypes = {
   contacts: contactsResponseType.isRequired,
-  groups: groupsResponseType.isRequired,
+  contactGroups: contactGroupsResponseType.isRequired,
   recipients: PropTypes.array,
   placeholder: PropTypes.string,
   onPick: PropTypes.func.isRequired,

package/dist/components/ShareRecipientsInput.spec.js

@@ -28,7 +28,7 @@ describe('ShareRecipientsInput component', function () {
           }
         }]
       },
-      groups: {
+      contactGroups: {
         id: 'groups',
         fetchStatus: 'loaded',
         hasMore: false,
@@ -85,7 +85,7 @@ describe('ShareRecipientsInput component', function () {
           }
         }]
       },
-      groups: {
+      contactGroups: {
         id: 'groups',
         fetchStatus: 'loaded',
         hasMore: false,

package/dist/helpers/recipients.js

@@ -1,10 +1,13 @@
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
+import get from 'lodash/get';
 import flag from 'cozy-flags';
+import { Group } from '../models';
 export var filterAndReworkRecipients = function filterAndReworkRecipients(recipients, previousRecipients) {
   return recipients.filter(function (recipient) {
     return recipient.status !== 'owner';
@@ -50,4 +53,39 @@ export var hasReachRecipientsLimit = function hasReachRecipientsLimit(current, n
   }
 
   return false;
+};
+/**
+ * Merges the recipients list with a new recipient and their associated contacts.
+ * @param {object[]} recipients - The list of recipients.
+ * @param {object} recipient - The new recipient.
+ * @param {object[]} contacts - The list of contacts.
+ * @returns {object[]} - The merged recipients list.
+ */
+
+export var spreadGroupAndMergeRecipients = function spreadGroupAndMergeRecipients(recipients, newRecipient, contacts) {
+  var contactsToAdd;
+
+  if (newRecipient._type === Group.doctype) {
+    var groupId = newRecipient.id;
+    contactsToAdd = contacts.data.filter(function (contact) {
+      var contactGroupIds = get(contact, 'relationships.groups.data', []).map(function (group) {
+        return group._id;
+      });
+      return contactGroupIds.includes(groupId);
+    });
+  } else {
+    contactsToAdd = [newRecipient];
+  }
+
+  var filtered = contactsToAdd.filter(function (contact) {
+    return contact.email && contact.email.length > 0 || contact.cozy && contact.cozy.length > 0;
+  }).filter(function (contact) {
+    return !recipients.find(function (r) {
+      return r === contact;
+    });
+  });
+  return [].concat(_toConsumableArray(recipients), _toConsumableArray(filtered));
+};
+export var mergeRecipients = function mergeRecipients(recipients, newRecipient) {
+  return [].concat(_toConsumableArray(recipients), [newRecipient]);
 };

package/dist/helpers/successMessage.spec.js

@@ -8,7 +8,7 @@ describe('getSuccessMessage method', function () {
       hasMore: false,
       fetchStatus: 'loaded'
     },
-    groups: {
+    contactGroups: {
       id: 'groups',
       data: [],
       hasMore: false,

package/dist/propTypes.js

@@ -12,7 +12,7 @@ export var contactsResponseType = PropTypes.shape({
   lastFetch: PropTypes.number,
   lastUpdate: PropTypes.number
 });
-export var groupsResponseType = PropTypes.shape({
+export var contactGroupsResponseType = PropTypes.shape({
   count: PropTypes.number,
   data: PropTypes.arrayOf(Group.propType),
   definition: PropTypes.object,

package/dist/queries/queries.js

@@ -53,7 +53,7 @@ export var buildContactsQuery = function buildContactsQuery() {
     }
   };
 };
-export var buildGroupsQuery = function buildGroupsQuery() {
+export var buildContactGroupsQuery = function buildContactGroupsQuery() {
   return {
     definition: Q(Group.doctype),
     options: {

package/dist/state.js

@@ -11,6 +11,7 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 import get from 'lodash/get';
+import flag from 'cozy-flags';
 var RECEIVE_SHARINGS = 'RECEIVE_SHARINGS';
 var ADD_SHARING = 'ADD_SHARING';
 var UPDATE_SHARING = 'UPDATE_SHARING';
@@ -380,13 +381,24 @@ export var getOwner = function getOwner(state, docId) {
   });
 };
 export var getRecipients = function getRecipients(state, docId) {
-  var recipients = getDocumentSharings(state, docId).map(function (sharing) {
+  var sharings = getDocumentSharings(state, docId);
+
+  if (flag('sharing.show-recipient-groups')) {
+    return getRecipientsWithGroups(sharings, docId);
+  }
+
+  return getRecipientsWithoutGroups(sharings, docId);
+};
+
+var getRecipientsWithoutGroups = function getRecipientsWithoutGroups(sharings, docId) {
+  var recipients = sharings.map(function (sharing) {
     var type = getDocumentSharingType(sharing, docId);
     return sharing.attributes.members.map(function (m, idx) {
       return _objectSpread(_objectSpread({}, m), {}, {
+        index: "sharing-".concat(sharing.id, "-member-").concat(idx),
         type: m.read_only ? 'one-way' : type,
         sharingId: sharing.id,
-        index: idx,
+        memberIndex: idx,
         avatarPath: "/sharings/".concat(sharing.id, "/recipients/").concat(idx, "/avatar")
       });
     });
@@ -404,6 +416,50 @@ export var getRecipients = function getRecipients(state, docId) {
 
   return recipients;
 };
+
+export var getRecipientsWithGroups = function getRecipientsWithGroups(sharings, docId) {
+  var recipients = sharings.flatMap(function (sharing) {
+    var _sharing$attributes$g;
+
+    var type = getDocumentSharingType(sharing, docId);
+    var sharingId = sharing.id;
+    var members = sharing.attributes.members.map(function (m, idx) {
+      return _objectSpread(_objectSpread({}, m), {}, {
+        type: m.read_only ? 'one-way' : type,
+        sharingId: sharingId,
+        index: "sharing-".concat(sharing.id, "-member-").concat(idx),
+        memberIndex: idx,
+        avatarPath: "/sharings/".concat(sharingId, "/recipients/").concat(idx, "/avatar")
+      });
+    });
+    var groups = ((_sharing$attributes$g = sharing.attributes.groups) === null || _sharing$attributes$g === void 0 ? void 0 : _sharing$attributes$g.map(function (g, idx) {
+      return _objectSpread(_objectSpread({}, g), {}, {
+        sharingId: sharingId,
+        index: "sharing-".concat(sharing.id, "-group-").concat(idx),
+        groupIndex: idx,
+        owner: members[g.addedBy],
+        members: members.filter(function (member) {
+          var _member$groups;
+
+          return (_member$groups = member.groups) === null || _member$groups === void 0 ? void 0 : _member$groups.includes(idx);
+        })
+      });
+    }).filter(function (g) {
+      return !g.revoked;
+    })) || [];
+    return [].concat(_toConsumableArray(members.filter(function (m) {
+      return !m.only_in_groups && m.status !== 'revoked';
+    })), _toConsumableArray(groups));
+  });
+
+  if (recipients[0] && recipients[0].status === 'owner') {
+    return [recipients[0]].concat(_toConsumableArray(recipients.filter(function (r) {
+      return r.status !== 'owner';
+    })));
+  }
+
+  return recipients;
+};
 export var getSharingLink = function getSharingLink(state, docId, documentType) {
   // This shouldn't have happened, but unfortunately some duplicate sharing links have been created in the past
   var perms = getDocumentPermissions(state, docId);