cozy-sharing 32.3.2 → 33.0.1

package/dist/components/SharedDrive/useSharedDrive.spec.js

@@ -2,16 +2,12 @@ import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _regeneratorRuntime from "@babel/runtime/regenerator";
 import { renderHook, act } from '@testing-library/react-hooks';
 import { useSharedDrive } from './useSharedDrive';
-var mockShowAlert = jest.fn();
 var mockCreateSharedDrive = jest.fn();
 var mockCollection = jest.fn(function () {
   return {
     createSharedDrive: mockCreateSharedDrive
   };
 });
-var mockT = jest.fn(function (key) {
-  return key;
-});
 jest.mock('cozy-client', function () {
   return {
     useClient: jest.fn(function () {
@@ -22,24 +18,6 @@ jest.mock('cozy-client', function () {
     })
   };
 });
-jest.mock('cozy-ui/transpiled/react/providers/Alert', function () {
-  return {
-    useAlert: jest.fn(function () {
-      return {
-        showAlert: mockShowAlert
-      };
-    })
-  };
-});
-jest.mock('twake-i18n', function () {
-  return {
-    useI18n: jest.fn(function () {
-      return {
-        t: mockT
-      };
-    })
-  };
-});
 jest.mock('../../models', function () {
   return {
     Contact: {
@@ -60,9 +38,7 @@ describe('useSharedDrive', function () {
   });
   it('returns empty initial state', function () {
     var _renderHook = renderHook(function () {
-      return useSharedDrive({
-        onSuccess: jest.fn()
-      });
+      return useSharedDrive();
     }),
         result = _renderHook.result;
 
@@ -72,9 +48,7 @@ describe('useSharedDrive', function () {
   });
   it('handleSharedDriveNameChange updates the name', function () {
     var _renderHook2 = renderHook(function () {
-      return useSharedDrive({
-        onSuccess: jest.fn()
-      });
+      return useSharedDrive();
     }),
         result = _renderHook2.result;
 
@@ -87,18 +61,15 @@ describe('useSharedDrive', function () {
     });
     expect(result.current.sharedDriveName).toBe('My Drive');
   });
-  it('onCreate calls createSharedDrive and onSuccess', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
-    var onSuccess, _renderHook3, result;
+  it('onCreate calls createSharedDrive', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
+    var _renderHook3, result;
 
     return _regeneratorRuntime.wrap(function _callee2$(_context2) {
       while (1) switch (_context2.prev = _context2.next) {
         case 0:
-          onSuccess = jest.fn();
           mockCreateSharedDrive.mockResolvedValue({});
           _renderHook3 = renderHook(function () {
-            return useSharedDrive({
-              onSuccess: onSuccess
-            });
+            return useSharedDrive();
           }), result = _renderHook3.result;
           act(function () {
             result.current.handleSharedDriveNameChange({
@@ -110,7 +81,7 @@ describe('useSharedDrive', function () {
               email: 'a@b.c'
             }]);
           });
-          _context2.next = 6;
+          _context2.next = 5;
           return act( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
             return _regeneratorRuntime.wrap(function _callee$(_context) {
               while (1) switch (_context.prev = _context.next) {
@@ -125,7 +96,7 @@ describe('useSharedDrive', function () {
             }, _callee);
           })));
 
-        case 6:
+        case 5:
           expect(mockCreateSharedDrive).toHaveBeenCalledWith({
             name: 'My Drive',
             description: 'My Drive',
@@ -134,55 +105,11 @@ describe('useSharedDrive', function () {
             }],
             readOnlyRecipients: []
           });
-          expect(mockShowAlert).toHaveBeenCalledWith(expect.objectContaining({
-            severity: 'success'
-          }));
-          expect(onSuccess).toHaveBeenCalledTimes(1);
 
-        case 9:
+        case 6:
         case "end":
           return _context2.stop();
       }
     }, _callee2);
   })));
-  it('onCreate shows error alert and does not call onSuccess on failure', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee4() {
-    var onSuccess, _renderHook4, result;
-
-    return _regeneratorRuntime.wrap(function _callee4$(_context4) {
-      while (1) switch (_context4.prev = _context4.next) {
-        case 0:
-          onSuccess = jest.fn();
-          mockCreateSharedDrive.mockRejectedValue(new Error('network error'));
-          _renderHook4 = renderHook(function () {
-            return useSharedDrive({
-              onSuccess: onSuccess
-            });
-          }), result = _renderHook4.result;
-          _context4.next = 5;
-          return act( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3() {
-            return _regeneratorRuntime.wrap(function _callee3$(_context3) {
-              while (1) switch (_context3.prev = _context3.next) {
-                case 0:
-                  _context3.next = 2;
-                  return result.current.onCreate();
-
-                case 2:
-                case "end":
-                  return _context3.stop();
-              }
-            }, _callee3);
-          })));
-
-        case 5:
-          expect(mockShowAlert).toHaveBeenCalledWith(expect.objectContaining({
-            severity: 'error'
-          }));
-          expect(onSuccess).not.toHaveBeenCalled();
-
-        case 7:
-        case "end":
-          return _context4.stop();
-      }
-    }, _callee4);
-  })));
 });

package/dist/components/WhoHasAccess.js

@@ -32,6 +32,8 @@ var WhoHasAccess = function WhoHasAccess(_ref2) {
       isOwner = _ref2$isOwner === void 0 ? false : _ref2$isOwner,
       _ref2$isSharedDrive = _ref2.isSharedDrive,
       isSharedDrive = _ref2$isSharedDrive === void 0 ? false : _ref2$isSharedDrive,
+      _ref2$showOwner = _ref2.showOwner,
+      showOwner = _ref2$showOwner === void 0 ? true : _ref2$showOwner,
       recipients = _ref2.recipients,
       _ref2$recipientsToBeC = _ref2.recipientsToBeConfirmed,
       recipientsToBeConfirmed = _ref2$recipientsToBeC === void 0 ? [] : _ref2$recipientsToBeC,
@@ -57,7 +59,7 @@ var WhoHasAccess = function WhoHasAccess(_ref2) {
     onRevokeSelf: onRevokeSelf,
     permissions: permissions,
     fadeIn: linkHasBeenJustCreated
-  }), /*#__PURE__*/React.createElement(OwnerRecipient, {
+  }), showOwner && /*#__PURE__*/React.createElement(OwnerRecipient, {
     recipients: recipients
   }), /*#__PURE__*/React.createElement(RecipientList, {
     recipients: recipients,
@@ -75,6 +77,7 @@ var WhoHasAccess = function WhoHasAccess(_ref2) {
 
 WhoHasAccess.propTypes = {
   isOwner: PropTypes.bool,
+  showOwner: PropTypes.bool,
   recipients: PropTypes.array.isRequired,
   recipientsToBeConfirmed: PropTypes.arrayOf(PropTypes.shape({
     email: PropTypes.string.isRequired

package/dist/helpers/contacts.js

@@ -102,4 +102,16 @@ export var getContactsFromGroupId = function getContactsFromGroupId() {
       return group._id === groupId;
     });
   });
+};
+/**
+ * Returns true when a contact does not exist. A contact without
+ * an `_id` is always a placeholder that must be created before sharing.
+ *
+ * Used to decide whether the autosuggest input should allow creating
+ * a new contact on the fly or should block the pick (depending on the
+ * `enableCreateContact` flag).
+ */
+
+export var isContactToBeCreated = function isContactToBeCreated(contact) {
+  return !contact._id;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cozy-sharing",
-  "version": "32.3.2",
+  "version": "33.0.1",
   "description": "Provides sharing login for React applications.",
   "main": "dist/index.js",
   "author": "Cozy",
@@ -57,7 +57,7 @@
     "cozy-device-helper": "^4.0.0",
     "cozy-intent": "^2.31.1",
     "cozy-minilog": "^3.10.1",
-    "cozy-ui": "^138.1.0",
+    "cozy-ui": "^139.0.2",
     "cozy-ui-plus": "^8.0.1",
     "jest": "30.3.0",
     "jest-environment-jsdom": "30.3.0",
@@ -73,7 +73,7 @@
     "cozy-flags": ">=4.8.1",
     "cozy-intent": ">=2.29.1",
     "cozy-minilog": ">=3.9.1",
-    "cozy-ui": ">=138.1.0",
+    "cozy-ui": ">=139.0.2",
     "cozy-ui-plus": ">=6.0.0",
     "prop-types": ">=15.7.2",
     "react": ">=16.12.0",
@@ -83,5 +83,5 @@
   "sideEffects": [
     "*.css"
   ],
-  "gitHead": "5fd20886ef0dfec91783b81bce0ae59d210a0cfa"
+  "gitHead": "546412325d385a075b531e7c735a0082d6864040"
 }

package/src/components/FederatedFolder/FederatedFolderModal.jsx

@@ -206,6 +206,7 @@ const FederatedFolderModalContent = ({
               onPendingRecipientsChange={setPendingRecipients}
               selectedOption={selectedOption}
               onSelectedOptionChange={setSelectedOption}
+              enableCreateContact
             />
           </div>
           <WhoHasAccess

package/src/components/ShareAutosuggest.jsx

@@ -8,6 +8,7 @@ import { Spinner } from 'cozy-ui/transpiled/react/Spinner'
 
 import { GroupAvatar } from './Avatar/GroupAvatar'
 import ContactSuggestion from './ContactSuggestion'
+import { isContactToBeCreated } from '../helpers/contacts'
 import { extractEmails, validateEmail } from '../helpers/email'
 import { getDisplayName, getInitials, Contact, Group } from '../models'
 import styles from '../styles/autosuggest.styl'
@@ -25,6 +26,7 @@ const ShareAutocomplete = ({
   recipients,
   onPick,
   onRemove,
+  enableCreateContact,
   placeholder,
   endAdornment
 }) => {
@@ -53,17 +55,18 @@ const ShareAutocomplete = ({
   const onSuggestionsFetchRequested = ({ value }) => {
     const computedSuggestions = computeSuggestions(value)
 
-    const newSuggestions =
-      computedSuggestions.length === 0 && validateEmail(value)
-        ? [
-            {
-              email: value,
-              _type: Contact.doctype
-            }
-          ]
-        : computedSuggestions
-
-    setSuggestions(newSuggestions)
+    if (computedSuggestions.length > 0) {
+      setSuggestions(computedSuggestions)
+    } else if (enableCreateContact && validateEmail(value)) {
+      setSuggestions([
+        {
+          email: value,
+          _type: Contact.doctype
+        }
+      ])
+    } else {
+      setSuggestions([])
+    }
   }
 
   const onSuggestionsClearRequested = () => {
@@ -130,6 +133,8 @@ const ShareAutocomplete = ({
   }
 
   const onAutosuggestPick = value => {
+    if (isContactToBeCreated(value) && !enableCreateContact) return
+
     onPick(value)
     setInputValue('')
     autosuggestRef?.current?.input?.focus()
@@ -228,6 +233,7 @@ ShareAutocomplete.propTypes = {
   recipients: PropTypes.array.isRequired,
   onPick: PropTypes.func.isRequired,
   onRemove: PropTypes.func.isRequired,
+  enableCreateContact: PropTypes.bool,
   placeholder: PropTypes.string,
   endAdornment: PropTypes.node
 }

package/src/components/ShareAutosuggest.spec.jsx

@@ -9,7 +9,12 @@ jest.mock('cozy-ui/transpiled/react/Spinner', () => ({
 }))
 
 describe('ShareAutosuggest', () => {
-  const setup = ({ onPick, onRemove, loading = false }) => {
+  const setup = ({
+    onPick,
+    onRemove,
+    loading = false,
+    enableCreateContact = true
+  }) => {
     render(
       <AppLike>
         <ShareAutosuggest
@@ -19,6 +24,7 @@ describe('ShareAutosuggest', () => {
           onPick={onPick}
           recipients={[]}
           onRemove={onRemove}
+          enableCreateContact={enableCreateContact}
         />
       </AppLike>
     )
@@ -51,6 +57,19 @@ describe('ShareAutosuggest', () => {
     })
   })
 
+  it('should not call onPick for new contacts when enableCreateContact is false', () => {
+    const onPick = jest.fn()
+    const onRemove = jest.fn()
+
+    setup({ onPick, onRemove, enableCreateContact: false })
+
+    const inputNode = screen.getByPlaceholderText('myPlaceHolder')
+
+    fireEvent.change(inputNode, { target: { value: 'new@cozycloud.cc' } })
+    fireEvent.keyPress(inputNode, { key: 'Enter', keyCode: 13, charCode: 13 })
+    expect(onPick).not.toHaveBeenCalled()
+  })
+
   it('should show loading indicator when loading prop is true (autoFocus triggers onFocus on mount)', () => {
     const onPick = jest.fn()
     const onRemove = jest.fn()

package/src/components/ShareByEmail.jsx

@@ -21,6 +21,7 @@ export const ShareByEmail = ({
   onPendingRecipientsChange,
   selectedOption,
   onSelectedOptionChange,
+  enableCreateContact,
   sharing
 }) => {
   const { t } = useI18n()
@@ -66,6 +67,7 @@ export const ShareByEmail = ({
           }
           onPick={onRecipientPick}
           onRemove={onRecipientRemove}
+          enableCreateContact={enableCreateContact}
           currentRecipients={currentRecipients}
           recipients={pendingRecipients}
           endAdornment={
@@ -89,6 +91,7 @@ ShareByEmail.propTypes = {
   onPendingRecipientsChange: PropTypes.func.isRequired,
   selectedOption: PropTypes.oneOf(['readWrite', 'readOnly']).isRequired,
   onSelectedOptionChange: PropTypes.func.isRequired,
+  enableCreateContact: PropTypes.bool,
   sharing: PropTypes.object
 }
 

package/src/components/ShareByEmail.spec.jsx

@@ -17,6 +17,7 @@ describe('ShareByEmail (controlled)', () => {
       onPendingRecipientsChange,
       selectedOption: 'readWrite',
       onSelectedOptionChange,
+      enableCreateContact: true,
       ...overrides
     }
     const utils = render(

package/src/components/ShareDialogCozyToCozy.jsx

@@ -79,6 +79,7 @@ const SharingContent = ({
             onPendingRecipientsChange={onPendingRecipientsChange}
             selectedOption={selectedOption}
             onSelectedOptionChange={onSelectedOptionChange}
+            enableCreateContact
           />
         )}
       </div>

package/src/components/ShareDialogCozyToCozy.spec.jsx

@@ -21,6 +21,7 @@ jest.mock('../hooks/useSharingContext', () => ({
 }))
 
 jest.mock('../helpers/contacts', () => ({
+  ...jest.requireActual('../helpers/contacts'),
   getOrCreateFromArray: jest.fn((client, recipients) =>
     Promise.resolve(recipients)
   )

package/src/components/ShareRecipientsInput.jsx

@@ -25,6 +25,7 @@ const ShareRecipientsInput = ({
   placeholder,
   onPick,
   onRemove,
+  enableCreateContact,
   disabled,
   endAdornment
 }) => {
@@ -114,6 +115,7 @@ const ShareRecipientsInput = ({
       recipients={recipients}
       onPick={onPick}
       onRemove={onRemove}
+      enableCreateContact={enableCreateContact}
       placeholder={placeholder}
       endAdornment={endAdornment}
     />
@@ -126,6 +128,7 @@ ShareRecipientsInput.propTypes = {
   placeholder: PropTypes.string,
   onPick: PropTypes.func.isRequired,
   onRemove: PropTypes.func.isRequired,
+  enableCreateContact: PropTypes.bool,
   disabled: PropTypes.bool,
   endAdornment: PropTypes.node
 }

package/src/components/SharedDrive/EditSharedDriveModal.jsx

@@ -6,7 +6,7 @@ import Button from 'cozy-ui/transpiled/react/Buttons'
 import { FixedDialog } from 'cozy-ui/transpiled/react/CozyDialogs'
 import TextField from 'cozy-ui/transpiled/react/TextField'
 import Typography from 'cozy-ui/transpiled/react/Typography'
-import { useAlert } from 'cozy-ui/transpiled/react/providers/Alert'
+import { useSubmitWithLoader } from 'cozy-ui/transpiled/react/hooks/useSubmitWithLoader'
 import { useI18n } from 'twake-i18n'
 
 import SharedDriveHeader from './SharedDriveHeader'
@@ -21,62 +21,41 @@ export const EditSharedDriveModal = withLocales(({ onClose, document }) => {
   const client = useClient()
   const { t } = useI18n()
   const { share, getRecipients, revoke } = useSharingContext()
-  const { showAlert } = useAlert()
   const {
     pendingRecipients,
     setPendingRecipients,
     selectedOption,
     setSelectedOption
   } = usePendingRecipients()
+  const { onSubmit, isLoading } = useSubmitWithLoader()
 
   const [driveName, setDriveName] = useState(document.name)
-  const [isSaving, setIsSaving] = useState(false)
 
   const onSave = async () => {
-    if (isSaving) return
-    setIsSaving(true)
-    try {
-      // We add contacts
-      const contacts = await getOrCreateFromArray(
-        client,
-        pendingRecipients,
-        contact => client.create('io.cozy.contacts', contact)
-      )
-      const readWriteRecipients = selectedOption === 'readOnly' ? [] : contacts
-      const readOnlyRecipients = selectedOption === 'readOnly' ? contacts : []
+    // We add contacts
+    const contacts = await getOrCreateFromArray(
+      client,
+      pendingRecipients,
+      contact => client.create('io.cozy.contacts', contact)
+    )
+    const readWriteRecipients = selectedOption === 'readOnly' ? [] : contacts
+    const readOnlyRecipients = selectedOption === 'readOnly' ? contacts : []
 
-      await share({
-        document: document,
-        recipients: readWriteRecipients,
-        readOnlyRecipients,
-        sharedDrive: true,
-        openSharing: false
-      })
-
-      // We rename the shared drive
-      if (document?.name !== driveName) {
-        await client.collection('io.cozy.files').update({
-          ...document,
-          name: driveName,
-          _rev: document._rev || document.meta.rev
-        })
-      }
-
-      showAlert({
-        message: t('SharedDrive.editSharedDriveModal.successNotification'),
-        severity: 'success',
-        variant: 'filled'
-      })
+    await share({
+      document: document,
+      recipients: readWriteRecipients,
+      readOnlyRecipients,
+      sharedDrive: true,
+      openSharing: false
+    })
 
-      onClose()
-    } catch (_err) {
-      showAlert({
-        message: t('SharedDrive.editSharedDriveModal.errorNotification'),
-        severity: 'error',
-        variant: 'filled'
+    // We rename the shared drive
+    if (document?.name !== driveName) {
+      await client.collection('io.cozy.files').update({
+        ...document,
+        name: driveName,
+        _rev: document._rev || document.meta.rev
       })
-    } finally {
-      setIsSaving(false)
     }
   }
 
@@ -110,8 +89,8 @@ export const EditSharedDriveModal = withLocales(({ onClose, document }) => {
               {t('Share.contacts.addUsers')}
             </Typography>
             <DumbShareByEmail
-              currentRecipients={[]}
               documentType="Files"
+              currentRecipients={existingRecipients}
               pendingRecipients={pendingRecipients}
               onPendingRecipientsChange={setPendingRecipients}
               selectedOption={selectedOption}
@@ -121,6 +100,7 @@ export const EditSharedDriveModal = withLocales(({ onClose, document }) => {
           <WhoHasAccess
             isOwner
             isSharedDrive
+            showOwner={false}
             recipients={existingRecipients}
             document={document}
             documentType="Files"
@@ -134,14 +114,29 @@ export const EditSharedDriveModal = withLocales(({ onClose, document }) => {
               className="u-w-100 u-m-1"
               size="large"
               onClick={onClose}
+              disabled={isLoading}
             />
             <Button
               variant="primary"
               label={t('SharedDrive.sharedDriveModal.save')}
               className="u-w-100 u-m-1"
               size="large"
-              disabled={isSaving}
-              onClick={onSave}
+              onClick={() =>
+                onSubmit({
+                  submit: onSave,
+                  success: {
+                    action: onClose,
+                    message: t(
+                      'SharedDrive.editSharedDriveModal.successNotification'
+                    )
+                  },
+                  error: {
+                    message: () =>
+                      t('SharedDrive.editSharedDriveModal.errorNotification')
+                  }
+                })
+              }
+              busy={isLoading}
             />
           </div>
         </div>

package/src/components/SharedDrive/SharedDriveForm.jsx

@@ -4,6 +4,7 @@ import React from 'react'
 import Button from 'cozy-ui/transpiled/react/Buttons'
 import TextField from 'cozy-ui/transpiled/react/TextField'
 import Typography from 'cozy-ui/transpiled/react/Typography'
+import { useSubmitWithLoader } from 'cozy-ui/transpiled/react/hooks/useSubmitWithLoader'
 import { useI18n } from 'twake-i18n'
 
 import withLocales from '../../hoc/withLocales'
@@ -21,7 +22,8 @@ export const SharedDriveForm = withLocales(({ onSuccess, onCancel }) => {
     selectedOption,
     setSelectedOption,
     onCreate
-  } = useSharedDrive({ onSuccess })
+  } = useSharedDrive()
+  const { onSubmit, isLoading } = useSubmitWithLoader()
 
   return (
     <div>
@@ -55,13 +57,27 @@ export const SharedDriveForm = withLocales(({ onSuccess, onCancel }) => {
           className="u-w-100 u-m-1"
           size="large"
           onClick={onCancel}
+          disabled={isLoading}
         />
         <Button
           variant="primary"
           label={t('SharedDrive.sharedDriveModal.create')}
           className="u-w-100 u-m-1"
           size="large"
-          onClick={onCreate}
+          onClick={() =>
+            onSubmit({
+              submit: onCreate,
+              success: {
+                action: onSuccess,
+                message: t('SharedDrive.sharedDriveModal.successNotification')
+              },
+              error: {
+                message: () =>
+                  t('SharedDrive.sharedDriveModal.errorNotification')
+              }
+            })
+          }
+          busy={isLoading}
         />
       </div>
     </div>