Refactor/prepare update sharing modal

packages/cozy-sharing/package.json

@@ -19,7 +19,7 @@
     "build:doc:react": "(cd ../.. && TARGET=cozy-sharing yarn build:doc:react)",
     "deploy:doc": "(cd ../.. && yarn deploy:doc)",
     "prepublishOnly": "yarn build",
-    "test": "env NODE_ENV=test jest",
+    "test": "env NODE_ENV=test jest --env=jest-environment-jsdom-sixteen",
     "lint": "cd .. && yarn eslint --ext js,jsx packages/cozy-sharing",
     "watch": "yarn build --watch",
     "watch:doc:react": "(cd ../.. && TARGET=cozy-sharing yarn watch:doc:react)"
@@ -40,8 +40,8 @@
     "babel-jest": "26.6.3",
     "babel-plugin-css-modules-transform": "1.6.2",
     "babel-plugin-inline-react-svg": "1.1.2",
-    "cozy-client": "34.1.0",
-    "cozy-ui": "77.6.0",
+    "cozy-client": "34.6.0",
+    "cozy-ui": "79.2.2",
     "enzyme": "3.11.0",
     "enzyme-adapter-react-16": "1.15.6",
     "enzyme-to-json": "3.6.2",
@@ -51,9 +51,9 @@
     "react-router": "^5.0.1"
   },
   "peerDependencies": {
-    "cozy-client": "^34.1.0",
+    "cozy-client": "^34.6.0",
+    "cozy-ui": ">=79.2.2",
     "cozy-realtime": "^3.11.0",
-    "cozy-ui": ">=77.6.0",
     "prop-types": "^15.7.2",
     "react": "^16.12.0",
     "react-router": "^5.0.1"

packages/cozy-sharing/src/SharingBanner/hooks/useSharingInfos.jsx

@@ -4,7 +4,7 @@ import { useClient, models } from 'cozy-client'
 
 import getQueryParameter from '../helpers/QueryParameter'
 import logger from '../../logger'
-import { buildSharingsByIdQuery } from '../helpers/queries'
+import { buildSharingsByIdQuery } from '../../queries/queries'
 
 const getSharingId = permission => {
   const sourceId = permission.data.attributes.source_id

packages/cozy-sharing/src/components/EditableSharingModal.jsx

@@ -1,116 +1,74 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import { queryConnect, useClient, Q } from 'cozy-client'
+import { useClient, useQueryAll } from 'cozy-client'
 
-import { Contact, Group } from '../models'
-import { contactsResponseType, groupsResponseType } from '../propTypes'
+import { Contact } from '../models'
 import SharingContext from '../context'
-import ContactsAndGroupsDataLoader from './ContactsAndGroupsDataLoader'
 import { default as DumbShareModal } from './ShareModal'
 import { useFetchDocumentPath } from './useFetchDocumentPath'
+import { buildContactsQuery, buildGroupsQuery } from '../queries/queries'
 
-export const EditableSharingModal = ({
-  contacts,
-  document,
-  groups,
-  ...rest
-}) => {
+export const EditableSharingModal = ({ document, ...rest }) => {
   const client = useClient()
   const documentPath = useFetchDocumentPath(client, document)
+
+  const contactsQuery = buildContactsQuery()
+  const contactsResult = useQueryAll(
+    contactsQuery.definition,
+    contactsQuery.options
+  )
+
+  const groupsQuery = buildGroupsQuery()
+  const groupsResult = useQueryAll(groupsQuery.definition, groupsQuery.options)
+
   return (
-    <ContactsAndGroupsDataLoader contacts={contacts} groups={groups}>
-      <SharingContext.Consumer>
-        {({
-          documentType,
-          getDocumentPermissions,
-          getRecipients,
-          getSharingForSelf,
-          getSharingLink,
-          hasSharedChild,
-          hasSharedParent,
-          isOwner,
-          revoke,
-          revokeSelf,
-          revokeSharingLink,
-          share,
-          shareByLink,
-          updateDocumentPermissions
-        }) => {
-          return (
-            <DumbShareModal
-              contacts={contacts}
-              createContact={contact => client.create(Contact.doctype, contact)}
-              document={document}
-              documentType={documentType}
-              groups={groups}
-              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}
-            />
-          )
-        }}
-      </SharingContext.Consumer>
-    </ContactsAndGroupsDataLoader>
+    <SharingContext.Consumer>
+      {({
+        documentType,
+        getDocumentPermissions,
+        getRecipients,
+        getSharingForSelf,
+        getSharingLink,
+        hasSharedChild,
+        hasSharedParent,
+        isOwner,
+        revoke,
+        revokeSelf,
+        revokeSharingLink,
+        share,
+        shareByLink,
+        updateDocumentPermissions
+      }) => {
+        return (
+          <DumbShareModal
+            contacts={contactsResult}
+            createContact={contact => 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}
+          />
+        )
+      }}
+    </SharingContext.Consumer>
   )
 }
 
 EditableSharingModal.propTypes = {
-  contacts: contactsResponseType,
-  document: PropTypes.object,
-  groups: groupsResponseType
+  document: PropTypes.object
 }
 
-const contactsQuery = () =>
-  Q(Contact.doctype)
-    .where({
-      _id: {
-        $gt: null
-      }
-    })
-    .partialIndex({
-      trashed: {
-        $or: [{ $eq: false }, { $exists: false }]
-      },
-      $or: [
-        {
-          cozy: {
-            $not: {
-              $size: 0
-            }
-          }
-        },
-        {
-          email: {
-            $not: {
-              $size: 0
-            }
-          }
-        }
-      ]
-    })
-    .indexFields(['_id'])
-    .limitBy(1000)
-
-const groupsQuery = () => Q(Group.doctype)
-
-export default queryConnect({
-  contacts: {
-    query: contactsQuery,
-    as: 'contacts'
-  },
-  groups: {
-    query: groupsQuery,
-    as: 'groups'
-  }
-})(EditableSharingModal)
+export default EditableSharingModal