cozy-sharing 12.2.0 → 13.0.0

package/dist/helpers/successMessage.spec.js

@@ -2,18 +2,6 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import { getSuccessMessage, countNewRecipients } from './successMessage';
 describe('getSuccessMessage method', function () {
   var props = {
-    contacts: {
-      id: 'contacts',
-      data: [],
-      hasMore: false,
-      fetchStatus: 'loaded'
-    },
-    contactGroups: {
-      id: 'groups',
-      data: [],
-      hasMore: false,
-      fetchStatus: 'loaded'
-    },
     currentRecipients: [{
       email: 'sansa.stark@winterfell.westeros'
     }],
@@ -24,10 +12,13 @@ describe('getSuccessMessage method', function () {
   };
   it('should return a success message and its params for multiple recipients', function () {
     var recipientsAfter = [{
+      _type: 'io.cozy.contacts',
       email: 'jon.snow@thewall.westeros'
     }, {
+      _type: 'io.cozy.contacts',
       email: 'arya.stark@winterfell.westeros'
     }, {
+      _type: 'io.cozy.contacts',
       email: 'sansa.stark@winterfell.westeros'
     }];
 
@@ -36,9 +27,9 @@ describe('getSuccessMessage method', function () {
         message = _getSuccessMessage2[0],
         params = _getSuccessMessage2[1];
 
-    expect(message).toEqual('Files.share.shareByEmail.genericSuccess');
+    expect(message).toEqual('Files.share.shareByEmail.contactSuccess');
     expect(params).toEqual({
-      count: 2
+      smart_count: 2
     });
   });
   it('should return a success message and its params for one recipient with email', function () {
@@ -51,7 +42,7 @@ describe('getSuccessMessage method', function () {
         message = _getSuccessMessage4[0],
         params = _getSuccessMessage4[1];
 
-    expect(message).toEqual('Files.share.shareByEmail.success');
+    expect(message).toEqual('Files.share.shareByEmail.singleContactSuccess');
     expect(params).toEqual({
       email: 'jon.snow@thewall.westeros'
     });
@@ -75,7 +66,7 @@ describe('getSuccessMessage method', function () {
         message = _getSuccessMessage6[0],
         params = _getSuccessMessage6[1];
 
-    expect(message).toEqual('Files.share.shareByEmail.success');
+    expect(message).toEqual('Files.share.shareByEmail.singleContactSuccess');
     expect(params).toEqual({
       email: 'jon.snow@thewall.westeros'
     });
@@ -92,12 +83,12 @@ describe('getSuccessMessage method', function () {
         message = _getSuccessMessage8[0],
         params = _getSuccessMessage8[1];
 
-    expect(message).toEqual('Files.share.shareByEmail.success');
+    expect(message).toEqual('Files.share.shareByEmail.singleContactSuccess');
     expect(params).toEqual({
       email: 'https://doranmartell.mycozy.cloud'
     });
   });
-  it('should use generic success message if recipient has no email and no cozy', function () {
+  it('should use contact success message if recipient has no email and no cozy', function () {
     var recipientsBefore = props.currentRecipients;
 
     var _getSuccessMessage9 = getSuccessMessage(recipientsBefore, [{
@@ -107,13 +98,87 @@ describe('getSuccessMessage method', function () {
         message = _getSuccessMessage10[0],
         params = _getSuccessMessage10[1];
 
-    expect(message).toEqual('Files.share.shareByEmail.genericSuccess');
+    expect(message).toEqual('Files.share.shareByEmail.contactSuccess');
     expect(params).toEqual({
-      count: 1
+      smart_count: 1
+    });
+  });
+  it('should use single group success message if recipient is a group', function () {
+    var recipientsBefore = props.currentRecipients;
+
+    var _getSuccessMessage11 = getSuccessMessage(recipientsBefore, [{
+      _type: 'io.cozy.contacts.groups',
+      name: 'Stark family'
+    }], props.documentType),
+        _getSuccessMessage12 = _slicedToArray(_getSuccessMessage11, 2),
+        message = _getSuccessMessage12[0],
+        params = _getSuccessMessage12[1];
+
+    expect(message).toEqual('Files.share.shareByEmail.singleGroupSuccess');
+    expect(params).toEqual({
+      groupName: 'Stark family'
+    });
+  });
+  it('should use contact success message if recipient has only multiple contacts', function () {
+    var recipientsBefore = props.currentRecipients;
+
+    var _getSuccessMessage13 = getSuccessMessage(recipientsBefore, [{
+      _type: 'io.cozy.contacts'
+    }, {
+      _type: 'io.cozy.contacts'
+    }, {
+      _type: 'io.cozy.contacts'
+    }], props.documentType),
+        _getSuccessMessage14 = _slicedToArray(_getSuccessMessage13, 2),
+        message = _getSuccessMessage14[0],
+        params = _getSuccessMessage14[1];
+
+    expect(message).toEqual('Files.share.shareByEmail.contactSuccess');
+    expect(params).toEqual({
+      smart_count: 3
+    });
+  });
+  it('should use group success message if recipient has only multiple groups', function () {
+    var recipientsBefore = props.currentRecipients;
+
+    var _getSuccessMessage15 = getSuccessMessage(recipientsBefore, [{
+      _type: 'io.cozy.contacts.groups'
+    }, {
+      _type: 'io.cozy.contacts.groups'
+    }], props.documentType),
+        _getSuccessMessage16 = _slicedToArray(_getSuccessMessage15, 2),
+        message = _getSuccessMessage16[0],
+        params = _getSuccessMessage16[1];
+
+    expect(message).toEqual('Files.share.shareByEmail.groupSuccess');
+    expect(params).toEqual({
+      smart_count: 2
+    });
+  });
+  it('should use contact and group success message if recipient has multiple contacts and groups', function () {
+    var recipientsBefore = props.currentRecipients;
+
+    var _getSuccessMessage17 = getSuccessMessage(recipientsBefore, [{
+      _type: 'io.cozy.contacts'
+    }, {
+      _id: 'fcb16b9e-7421',
+      _type: 'io.cozy.contacts.groups'
+    }, {
+      _id: 'f45b16be-7523',
+      _type: 'io.cozy.contacts.groups'
+    }], props.documentType),
+        _getSuccessMessage18 = _slicedToArray(_getSuccessMessage17, 2),
+        message = _getSuccessMessage18[0],
+        params = _getSuccessMessage18[1];
+
+    expect(message).toEqual('Files.share.shareByEmail.contactAndGroupSuccess');
+    expect(params).toEqual({
+      nbContact: 1,
+      nbGroup: 2
     });
   });
 });
-describe('countNewRecipients function', function () {
+describe('countNewRecipients', function () {
   var currentRecipients = [{
     email: 'arya.stark@winterfell.westeros'
   }, {
@@ -122,77 +187,77 @@ describe('countNewRecipients function', function () {
     email: 'jon.snow@thewall.westeros'
   }];
   var addedRecipients = [{
-    id: '5d4916fa-e193',
+    _id: 'e8c0e15f-da7d',
+    _type: 'io.cozy.contacts',
+    fullname: 'Jon Snow',
     email: [{
       address: 'jon.snow@thewall.westeros',
-      type: 'primary'
+      primary: true
+    }, {
+      address: 'jon.snow@winterfell.westeros',
+      primary: false
     }]
   }, {
-    id: '4df64228-ce84',
-    email: [{
-      address: 'sansa.stark@winterfell.westeros',
-      type: 'primary'
-    }]
+    _id: 'fcb16b9e-7421',
+    _type: 'io.cozy.contacts'
   }, {
-    id: 'ff955bb1-f696',
-    email: [{
-      address: 'bran.stark@winterfell.westeros',
-      type: 'primary'
+    _id: 'f45b16be-7523',
+    _type: 'io.cozy.contacts',
+    cozy: [{
+      url: 'https://doranmartell.mycozy.cloud'
     }]
   }];
-  it('should count only the new recipients using email', function () {
-    var result = countNewRecipients(currentRecipients, addedRecipients);
-    expect(result).toEqual(1);
-  });
-  it('should count the new recipients when there are no current recipients', function () {
-    var result = countNewRecipients([], addedRecipients);
-    expect(result).toEqual(3);
-  });
-  it('should return 0 if there is no new recipients', function () {
-    var currentRecipients = [{
-      email: 'arya.stark@winterfell.westeros'
-    }, {
-      email: 'sansa.stark@winterfell.westeros'
-    }, {
-      email: 'jon.snow@thewall.westeros'
-    }, {
-      email: 'bran.stark@winterfell.westeros'
-    }];
+  it('should count the new recipients with email', function () {
     var result = countNewRecipients(currentRecipients, addedRecipients);
-    expect(result).toEqual(0);
+    expect(result.contact).toEqual(2);
+    expect(result.group).toEqual(0);
   });
-  it('should count the new recipients using cozy url', function () {
+  it('should count the new recipients with cozy url', function () {
     var currentRecipients = [{
       instance: 'https://bran.mycozy.cloud'
     }, {
       instance: 'https://jon.mycozy.cloud'
     }];
     var addedRecipients = [{
-      id: '5d4916fa-e193',
+      _type: 'io.cozy.contacts',
       cozy: [{
         url: 'https://jon.mycozy.cloud',
         type: 'primary'
       }]
     }, {
-      id: '4df64228-ce84',
+      _type: 'io.cozy.contacts',
       cozy: [{
         url: 'https://sansa.mycozy.cloud',
         type: 'primary'
       }]
     }, {
-      id: 'ff955bb1-f696',
+      _type: 'io.cozy.contacts',
       cozy: [{
         url: 'https://bran.mycozy.cloud',
         type: 'primary'
       }]
     }, {
-      id: '0761944a-c740',
+      _type: 'io.cozy.contacts',
       cozy: [{
         url: 'https://arya.mycozy.cloud',
         type: 'primary'
       }]
     }];
     var result = countNewRecipients(currentRecipients, addedRecipients);
-    expect(result).toEqual(2);
+    expect(result.contact).toEqual(2);
+    expect(result.group).toEqual(0);
+  });
+  it('should count the new recipients with groups', function () {
+    var result = countNewRecipients(currentRecipients, [].concat(addedRecipients, [{
+      _id: 'f45b16be-7523',
+      _type: 'io.cozy.contacts.groups'
+    }]));
+    expect(result.contact).toEqual(2);
+    expect(result.group).toEqual(1);
+  });
+  it('should return 0 if there are no new recipients', function () {
+    var result = countNewRecipients(currentRecipients, []);
+    expect(result.contact).toEqual(0);
+    expect(result.group).toEqual(0);
   });
 });

package/dist/queries/queries.js

@@ -20,7 +20,7 @@ export var buildSharingsByIdQuery = function buildSharingsByIdQuery(sharingId) {
     }
   };
 };
-export var buildContactsQuery = function buildContactsQuery() {
+export var buildReachableContactsQuery = function buildReachableContactsQuery() {
   return {
     definition: Q(Contact.doctype).where({
       _id: {
@@ -49,15 +49,47 @@ export var buildContactsQuery = function buildContactsQuery() {
       }]
     }).indexFields(['_id']).limitBy(1000),
     options: {
-      as: 'io.cozy.contacts'
+      as: 'io.cozy.contacts/reachable'
     }
   };
 };
-export var buildContactGroupsQuery = function buildContactGroupsQuery() {
+export var buildContactGroupsByIdsQuery = function buildContactGroupsByIdsQuery(ids) {
   return {
-    definition: Q(Group.doctype),
+    definition: Q(Group.doctype).getByIds(ids),
     options: {
-      as: 'io.cozy.contacts.groups'
+      as: "io.cozy.contacts.groups/by-ids/".concat(ids.join('/')),
+      fetchPolicy: defaultFetchPolicy,
+      enabled: ids.length > 0
+    }
+  };
+};
+export var buildUnreachableContactsWithGroupsQuery = function buildUnreachableContactsWithGroupsQuery() {
+  return {
+    definition: Q(Contact.doctype).where({
+      _id: {
+        $gt: null
+      }
+    }).partialIndex({
+      trashed: {
+        $or: [{
+          $eq: false
+        }, {
+          $exists: false
+        }]
+      },
+      cozy: {
+        $size: 0
+      },
+      email: {
+        $size: 0
+      },
+      'relationships.groups.data': {
+        $exists: true
+      }
+    }).indexFields(['_id']).limitBy(1000),
+    options: {
+      as: 'io.cozy.contacts/unreachable-with-groups',
+      fetchPolicy: defaultFetchPolicy
     }
   };
 };

package/dist/styles/autosuggest.styl

@@ -33,6 +33,7 @@
 .recipientsContainer
     display flex
     flex-wrap wrap
+    align-items center
     padding .25rem .5rem
     border-radius .25rem
     border 1px solid var(--borderMainColor)
@@ -55,7 +56,7 @@
         &:hover
         &:focus
             border none
-        &:only-child
+        &:first-child
           padding .25rem .5rem
 
 .recipientChip

package/dist/stylesheet.css

@@ -425,6 +425,7 @@ input[type=text] {
 .autosuggest__recipientsContainer___1JYxA {
   display: flex;
   flex-wrap: wrap;
+  align-items: center;
   padding: 0.25rem 0.5rem;
   border-radius: 0.25rem;
   border: 1px solid var(--borderMainColor);
@@ -449,7 +450,7 @@ input[type=text] {
 .autosuggest__recipientsContainer___1JYxA input[type=email]:focus {
   border: none;
 }
-.autosuggest__recipientsContainer___1JYxA input[type=email]:only-child {
+.autosuggest__recipientsContainer___1JYxA input[type=email]:first-child {
   padding: 0.25rem 0.5rem;
 }
 .autosuggest__recipientChip___d5I3R {

package/locales/en.json

@@ -115,8 +115,11 @@
         "subtitle": "By email",
         "emailPlaceholder": "Add contacts or groups",
         "send": "Send",
-        "genericSuccess": "You sent an invite to %{count} contacts.",
-        "success": "You sent an invite to %{email}.",
+        "singleContactSuccess": "You sent an invite to %{email}.",
+        "contactSuccess": "You sent an invite to %{smart_count} contact. |||| You sent an invite to %{smart_count} contacts.",
+        "singleGroupSuccess": "You sent an invite to the members of the %{groupName} group.",
+        "groupSuccess": "You sent an invite to the members of %{smart_count} group. |||| You sent an invite to the members of %{smart_count} groups.",
+        "contactAndGroupSuccess": "You sent an invite to %{nbContact} contacts and the members of %{nbGroup} groups.",
         "comingsoon": "Coming soon! You will be able to share documents and photos in a single click with your family, your friends, and even your coworkers. Don't worry, we'll let you know when it's ready!",
         "onlyByLink": "This %{type} can only be shared by link, because",
         "type": {
@@ -180,8 +183,11 @@
         "email": "To:",
         "emailPlaceholder": "Enter the email address or name of the recipient",
         "send": "Send",
-        "genericSuccess": "You sent an invite to %{count} contacts.",
-        "success": "You sent an invite to %{email}.",
+        "singleContactSuccess": "You sent an invite to %{email}.",
+        "contactSuccess": "You sent an invite to %{smart_count} contact. |||| You sent an invite to %{smart_count} contacts.",
+        "singleGroupSuccess": "You sent an invite to the members of the %{groupName} group.",
+        "groupSuccess": "You sent an invite to the members of %{smart_count} group. |||| You sent an invite to the members of %{smart_count} groups.",
+        "contactAndGroupSuccess": "You sent an invite to %{nbContact} contacts and the members of %{nbGroup} groups.",
         "comingsoon": "Coming soon! You will be able to share documents and photos in a single click with your family, your friends, and even your coworkers. Don't worry, we'll let you know when it's ready!",
         "onlyByLink": "This %{type} can only be shared by link, because",
         "type": {
@@ -246,8 +252,11 @@
         "email": "email",
         "emailPlaceholder": "Enter the email address or name of the recipient",
         "send": "Send",
-        "genericSuccess": "You sent an invite to %{count} contacts.",
-        "success": "You sent an invite to %{email}.",
+        "singleContactSuccess": "You sent an invite to %{email}.",
+        "contactSuccess": "You sent an invite to %{smart_count} contact. |||| You sent an invite to %{smart_count} contacts.",
+        "singleGroupSuccess": "You sent an invite to the members of the %{groupName} group.",
+        "groupSuccess": "You sent an invite to the members of %{smart_count} group. |||| You sent an invite to the members of %{smart_count} groups.",
+        "contactAndGroupSuccess": "You sent an invite to %{nbContact} contacts and the members of %{nbGroup} groups.",
         "comingsoon": "Coming soon! You will be able to share documents and photos in a single click with your family, your friends, and even your coworkers. Don't worry, we'll let you know when it's ready!"
       },
       "unshare": {
@@ -307,8 +316,11 @@
         "email": "Send to:",
         "emailPlaceholder": "Enter the email address or name of the recipient",
         "send": "Send",
-        "genericSuccess": "You sent an invite to %{count} contacts.",
-        "success": "You sent an invite to %{email}.",
+        "singleContactSuccess": "You sent an invite to %{email}.",
+        "contactSuccess": "You sent an invite to %{smart_count} contact. |||| You sent an invite to %{smart_count} contacts.",
+        "singleGroupSuccess": "You sent an invite to the members of the %{groupName} group.",
+        "groupSuccess": "You sent an invite to the members of %{smart_count} group. |||| You sent an invite to the members of %{smart_count} groups.",
+        "contactAndGroupSuccess": "You sent an invite to %{nbContact} contacts and the members of %{nbGroup} groups.",
         "comingsoon": "Coming soon! You will be able to share documents and photos in a single click with your family, your friends, and even your coworkers. Don't worry, we'll let you know when it's ready!",
         "onlyByLink": "This %{type} can only be shared by link, because",
         "type": {
@@ -364,7 +376,7 @@
     }
   },
   "GroupRecipient": {
-    "secondary": "%{nbMemberReady}/%{nbMember} members",
+    "secondary": "%{memberCount} member |||| %{memberCount} members",
     "secondary_you": "including you"
   },
   "RevokeGroupItem": {
@@ -387,7 +399,8 @@
       "status": {
         "mail-not-sent": "Invitation failed",
         "revoked": "Sharing revoked"
-      }
+      },
+      "addEmail": "Enter an email address to invite the contact"
     }
   }
 }

package/locales/fr.json

@@ -114,8 +114,11 @@
         "subtitle": "Par email",
         "emailPlaceholder": "Ajouter des contacts ou des groupes",
         "send": "Envoyer",
-        "genericSuccess": "Vous avez invité %{count} contacts.",
-        "success": "Vous avez envoyé une invitation à %{email}.",
+        "singleContactSuccess": "Vous avez envoyé une invitation à %{email}.",
+        "contactSuccess": "Vous avez invité %{smart_count} contact. |||| Vous avez invité %{smart_count} contacts.",
+        "singleGroupSuccess": "Vous avez invité les membres du groupe %{groupName}.",
+        "groupSuccess": "Vous avez invité les membres de %{smart_count} groupe. |||| Vous avez invité les membres de %{smart_count} groupes.",
+        "contactAndGroupSuccess": "Vous avez invité %{nbContact} contacts et les membres de %{nbGroup} groupes.",
         "comingsoon": "Bientôt disponible ! Vous pourrez partager un document et vos photos en un seul clic avec votre famille, vos amis, et même vos collaborateurs. Ne vous inquiétez pas, on vous prévient quand ce sera prêt !",
         "onlyByLink": "Ce %{type} ne peut être partagé que sous la forme d'un lien, car il",
         "type": {
@@ -179,7 +182,11 @@
         "email": "À :",
         "emailPlaceholder": "Saisissez le courriel ou le nom du destinataire.",
         "send": "Envoyer",
-        "genericSuccess": "Vous avez invité %{count} contacts.",
+        "singleContactSuccess": "Vous avez envoyé une invitation à %{email}.",
+        "contactSuccess": "Vous avez invité %{smart_count} contact. |||| Vous avez invité %{smart_count} contacts.",
+        "singleGroupSuccess": "Vous avez invité les membres du groupe %{groupName}.",
+        "groupSuccess": "Vous avez invité les membres de %{smart_count} groupe. |||| Vous avez invité les membres de %{smart_count} groupes.",
+        "contactAndGroupSuccess": "Vous avez invité %{nbContact} contacts et les membres de %{nbGroup} groupes.",
         "success": "Vous avez envoyé une invitation à %{email}.",
         "comingsoon": "Bientôt disponible ! Vous pourrez partager un document et vos photos en un seul clic avec votre famille, vos amis, et même vos collaborateurs. Ne vous inquiétez pas, on vous prévient quand ce sera prêt !",
         "onlyByLink": "Ce %{type} ne peut être partagé que sous la forme d'un lien, car il",
@@ -245,7 +252,11 @@
         "email": "e-mail",
         "emailPlaceholder": "Saisissez l'email ou le nom du destinataire.",
         "send": "Envoyer",
-        "genericSuccess": "Vous avez envoyé une invitation à %{count} contacts.",
+        "singleContactSuccess": "Vous avez envoyé une invitation à %{email}.",
+        "contactSuccess": "Vous avez invité %{smart_count} contact. |||| Vous avez invité %{smart_count} contacts.",
+        "singleGroupSuccess": "Vous avez invité les membres du groupe %{groupName}.",
+        "groupSuccess": "Vous avez invité les membres de %{smart_count} groupe. |||| Vous avez invité les membres de %{smart_count} groupes.",
+        "contactAndGroupSuccess": "Vous avez invité %{nbContact} contacts et les membres de %{nbGroup} groupes.",
         "success": "Vous avez envoyé une invitation à %{email}.",
         "comingsoon": "Bientôt disponible ! Vous pourrez partager vos documents et vos photos en un seul clic avec votre famille, vos amis et même vos collaborateurs. Ne vous inquiétez pas, on vous préviendra quand ce sera prêt !\n"
       },
@@ -305,8 +316,11 @@
         "email": "Envoyer à :",
         "emailPlaceholder": "Saisissez le courriel ou le nom du destinataire.",
         "send": "Envoyer",
-        "genericSuccess": "Vous avez invité %{count} contacts.",
-        "success": "Vous avez envoyé une invitation à %{email}.",
+        "singleContactSuccess": "Vous avez envoyé une invitation à %{email}.",
+        "contactSuccess": "Vous avez invité %{smart_count} contact. |||| Vous avez invité %{smart_count} contacts.",
+        "singleGroupSuccess": "Vous avez invité les membres du groupe %{groupName}.",
+        "groupSuccess": "Vous avez invité les membres de %{smart_count} groupe. |||| Vous avez invité les membres de %{smart_count} groupes.",
+        "contactAndGroupSuccess": "Vous avez invité %{nbContact} contacts et les membres de %{nbGroup} groupes.",
         "comingsoon": "Bientôt disponible ! Vous pourrez partager un document et vos photos en un seul clic avec votre famille, vos amis, et même vos collaborateurs. Ne vous inquiétez pas, on vous prévient quand ce sera prêt !",
         "onlyByLink": "Ce %{type} ne peut être partagé que sous la forme d'un lien, car il",
         "type": {
@@ -362,7 +376,7 @@
     }
   },
   "GroupRecipient": {
-    "secondary": "%{nbMemberReady}/%{nbMember} membres",
+    "secondary": "%{memberCount} membre |||| %{memberCount} membres",
     "secondary_you": "dont vous"
   },
   "RevokeGroupItem": {
@@ -385,7 +399,8 @@
       "status": {
         "mail-not-sent": "Echec de l’invitation",
         "revoked": "Partage révoqué"
-      }
+      },
+      "addEmail": "Renseigner un email pour pouvoir inviter le contact"
     }
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cozy-sharing",
-  "version": "12.2.0",
+  "version": "13.0.0",
   "description": "Provides sharing login for React applications.",
   "main": "dist/index.js",
   "author": "Cozy",
@@ -50,7 +50,7 @@
     "babel-plugin-css-modules-transform": "1.6.2",
     "babel-plugin-inline-react-svg": "1.1.2",
     "cozy-client": "46.1.0",
-    "cozy-ui": "^103.8.2",
+    "cozy-ui": "105.3.1",
     "enzyme": "3.11.0",
     "enzyme-adapter-react-16": "1.15.6",
     "enzyme-to-json": "3.6.2",
@@ -63,7 +63,7 @@
   "peerDependencies": {
     "cozy-client": ">=46.1.0",
     "cozy-realtime": "^3.11.0",
-    "cozy-ui": ">=103.8.1",
+    "cozy-ui": ">=105.3.1",
     "prop-types": "^15.7.2",
     "react": "^16.12.0",
     "react-router": "^5.0.1"
@@ -71,5 +71,5 @@
   "sideEffects": [
     "*.css"
   ],
-  "gitHead": "e48ad9475627e2be13c46e6b7be8a9f82215a392"
+  "gitHead": "ba86f000e46844edb26e07edec601bc7669fcda9"
 }

package/src/components/Avatar/AvatarList.jsx

@@ -6,6 +6,7 @@ import Avatar from 'cozy-ui/transpiled/react/Avatar'
 import LinkIcon from 'cozy-ui/transpiled/react/Icons/Link'
 
 import { ExtraAvatar } from './ExtraAvatar'
+import { GroupAvatar } from './GroupAvatar'
 import { MemberAvatar } from './MemberAvatar'
 import { getDisplayName } from '../../models'
 import styles from '../../styles/recipient.styl'
@@ -88,20 +89,38 @@ const AvatarList = ({
           />
         </span>
       )}
-      {shownRecipients.map((recipient, idx) => (
-        <span
-          data-testid={`AvatarList-avatar${
-            recipient.status === 'owner' ? '-owner' : ''
-          }`}
-          key={idx}
-        >
-          <MemberAvatar
-            recipient={recipient}
-            size={size}
-            className={cx(styles['recipients-avatars--avatar'])}
-          />
-        </span>
-      ))}
+      {shownRecipients.map(recipient => {
+        if (recipient.members) {
+          return (
+            <span
+              data-testid={`AvatarList-avatar${
+                recipient.status === 'owner' ? '-owner' : ''
+              }`}
+              key={recipient.index}
+            >
+              <GroupAvatar
+                size={size}
+                className={cx(styles['recipients-avatars--avatar'])}
+              />
+            </span>
+          )
+        }
+
+        return (
+          <span
+            data-testid={`AvatarList-avatar${
+              recipient.status === 'owner' ? '-owner' : ''
+            }`}
+            key={recipient.index}
+          >
+            <MemberAvatar
+              recipient={recipient}
+              size={size}
+              className={cx(styles['recipients-avatars--avatar'])}
+            />
+          </span>
+        )
+      })}
     </div>
   )
 }

package/src/components/Avatar/AvatarList.spec.jsx

@@ -14,7 +14,8 @@ const mockRecipients = new Array(MAX_DISPLAYED_RECIPIENTS - 1)
   .fill(
     {
       status: 'owner',
-      public_name: 'cozy'
+      public_name: 'cozy',
+      index: 'sharing-123-member-0'
     },
     0,
     1
@@ -22,7 +23,8 @@ const mockRecipients = new Array(MAX_DISPLAYED_RECIPIENTS - 1)
   .fill(
     {
       status: 'pending',
-      name: 'Mitch Young'
+      name: 'Mitch Young',
+      index: 'sharing-123-member-1'
     },
     1
   )
@@ -31,15 +33,18 @@ const mockMoreRecipientsThanMaxDisplayed = [
   ...mockRecipients,
   {
     status: 'mail-not-send',
-    name: 'Lyn Webster'
+    name: 'Lyn Webster',
+    index: 'sharing-123-member-2'
   },
   {
     status: 'ready',
-    name: 'Richelle Young'
+    name: 'Richelle Young',
+    index: 'sharing-123-member-3'
   },
   {
     status: 'ready',
-    name: 'John Connor'
+    name: 'John Connor',
+    index: 'sharing-123-member-4'
   }
 ]
 
@@ -120,7 +125,7 @@ describe('AvatarList', () => {
 })
 
 describe('excludeMeAsOwnerFromRecipients', () => {
-  test('excludeMeAsOwnerFromRecipients behavior', () => {
+  it('excludeMeAsOwnerFromRecipients behavior', () => {
     const recipients = [
       {
         status: 'owner',