cozy-sharing 28.3.4 → 28.4.0

package/src/components/FederatedFolder/FederatedFolderModal.jsx

@@ -0,0 +1,119 @@
+import PropTypes from 'prop-types'
+import React, { useState } from 'react'
+import { useI18n } from 'twake-i18n'
+
+import { useClient } from 'cozy-client'
+import { useAlert } from 'cozy-ui/transpiled/react/providers/Alert'
+
+import { DumbFederatedFolderModal } from './DumbFederatedFolderModal'
+import withLocales from '../../hoc/withLocales'
+import { useSharingContext } from '../../hooks/useSharingContext'
+import {
+  formatRecipients,
+  moveRecipientToReadWrite,
+  moveRecipientToReadOnly,
+  RECIPIENT_INDEX_PREFIX
+} from '../SharedDrive/helpers'
+
+export const FederatedFolderModal = withLocales(
+  ({ onClose, document: existingDocument }) => {
+    const client = useClient()
+    const { t } = useI18n()
+    const { share, getSharingLink } = useSharingContext()
+    const { showAlert } = useAlert()
+
+    // Get sharing link
+    const sharingLink = existingDocument
+      ? getSharingLink(existingDocument._id)
+      : null
+
+    const [federatedRecipients, setFederatedRecipients] = useState({
+      recipients: [],
+      readOnlyRecipients: []
+    })
+    const [folderName] = useState(existingDocument?.name || '')
+
+    const onShare = params => {
+      setFederatedRecipients({
+        recipients: params.recipients || [],
+        readOnlyRecipients: params.readOnlyRecipients || []
+      })
+    }
+
+    const onSend = async () => {
+      try {
+        await share({
+          description: folderName,
+          document: existingDocument,
+          recipients: federatedRecipients.recipients,
+          readOnlyRecipients: federatedRecipients.readOnlyRecipients,
+          sharedDrive: true,
+          openSharing: false
+        })
+
+        showAlert({
+          message: t('FederatedFolder.successNotification'),
+          severity: 'success',
+          variant: 'filled'
+        })
+
+        onClose()
+      } catch (err) {
+        showAlert({
+          message: t('FederatedFolder.errorNotification'),
+          severity: 'error',
+          variant: 'filled'
+        })
+      }
+    }
+
+    const onSetType = (index, newType) => {
+      const _id = index.split(RECIPIENT_INDEX_PREFIX)[1]
+
+      if (newType === 'two-way') {
+        setFederatedRecipients(prev => moveRecipientToReadWrite(prev, _id))
+      } else {
+        setFederatedRecipients(prev => moveRecipientToReadOnly(prev, _id))
+      }
+    }
+
+    const onRevoke = index => {
+      const _id = index.split(RECIPIENT_INDEX_PREFIX)[1]
+
+      setFederatedRecipients(prev => {
+        return {
+          recipients: prev.recipients.filter(r => r._id !== _id),
+          readOnlyRecipients: prev.readOnlyRecipients.filter(r => r._id !== _id)
+        }
+      })
+    }
+
+    const recipients = formatRecipients(federatedRecipients)
+
+    const modalTitle = t('FederatedFolder.shareTitle', { name: folderName })
+
+    return (
+      <DumbFederatedFolderModal
+        title={modalTitle}
+        document={existingDocument}
+        createContact={contact => client.create('io.cozy.contacts', contact)}
+        recipients={recipients}
+        readOnlyRecipients={federatedRecipients.readOnlyRecipients}
+        currentRecipients={[]}
+        onRevoke={onRevoke}
+        onSetType={onSetType}
+        onSend={onSend}
+        onClose={onClose}
+        onShare={onShare}
+        sharingLink={sharingLink}
+      />
+    )
+  }
+)
+
+FederatedFolderModal.propTypes = {
+  onClose: PropTypes.func.isRequired,
+  document: PropTypes.object.isRequired
+}
+
+export default FederatedFolderModal

package/src/components/FederatedFolder/FederatedFolderModal.spec.jsx

@@ -0,0 +1,376 @@
+import { fireEvent, render, waitFor } from '@testing-library/react'
+import React from 'react'
+
+import { createMockClient } from 'cozy-client'
+
+import { FederatedFolderModal } from './FederatedFolderModal'
+import AppLike from '../SharingBanner/test/AppLike'
+
+const mockShare = jest.fn()
+const mockGetSharingLink = jest.fn()
+const mockShowAlert = jest.fn()
+const mockOnClose = jest.fn()
+
+jest.mock('../../hooks/useSharingContext', () => ({
+  useSharingContext: () => ({
+    share: mockShare,
+    getSharingLink: mockGetSharingLink,
+    getDocumentPermissions: jest.fn().mockReturnValue([])
+  })
+}))
+
+jest.mock('cozy-ui/transpiled/react/providers/Alert', () => ({
+  useAlert: () => ({
+    showAlert: mockShowAlert
+  })
+}))
+
+jest.mock('../../hoc/withLocales', () => Component => Component)
+
+jest.mock('./DumbFederatedFolderModal', () => ({
+  DumbFederatedFolderModal: ({
+    title,
+    createContact,
+    recipients,
+    readOnlyRecipients,
+    onRevoke,
+    onSetType,
+    onSend,
+    onClose,
+    onShare,
+    sharingLink
+  }) => (
+    <div data-testid="dumb-modal">
+      <span data-testid="title">{title}</span>
+      <span data-testid="sharing-link">{sharingLink}</span>
+      <span data-testid="recipients-count">{recipients.length}</span>
+      <span data-testid="readOnly-recipients-count">
+        {readOnlyRecipients ? readOnlyRecipients.length : 0}
+      </span>
+      <button
+        data-testid="btn-share"
+        onClick={() =>
+          onShare({
+            recipients: [{ _id: 'r1', displayName: 'Alice' }],
+            readOnlyRecipients: [{ _id: 'r2', displayName: 'Bob' }]
+          })
+        }
+      >
+        Share
+      </button>
+      <button data-testid="btn-send" onClick={onSend}>
+        Send
+      </button>
+      <button
+        data-testid="btn-set-type-two-way"
+        onClick={() => onSetType('virtual-shared-drive-sharing-r2', 'two-way')}
+      >
+        Set Two-Way
+      </button>
+      <button
+        data-testid="btn-set-type-one-way"
+        onClick={() => onSetType('virtual-shared-drive-sharing-r1', 'one-way')}
+      >
+        Set One-Way
+      </button>
+      <button
+        data-testid="btn-revoke"
+        onClick={() => onRevoke('virtual-shared-drive-sharing-r1')}
+      >
+        Revoke
+      </button>
+      <button data-testid="btn-close" onClick={onClose}>
+        Close
+      </button>
+      <button
+        data-testid="btn-create-contact"
+        onClick={() => createContact({ email: 'test@example.com' })}
+      >
+        Create Contact
+      </button>
+    </div>
+  )
+}))
+
+const mockDocument = {
+  _id: 'folder-123',
+  name: 'My Test Folder',
+  path: '/test/folder'
+}
+
+const createSharingContextValue = () => ({
+  refresh: jest.fn(),
+  hasWriteAccess: jest.fn(),
+  getRecipients: jest.fn(),
+  getSharingLink: mockGetSharingLink,
+  getDocumentPermissions: jest.fn().mockReturnValue([]),
+  share: mockShare
+})
+
+const createTestClient = () => {
+  const client = createMockClient({
+    queries: {
+      'io.cozy.contacts/reachable': {
+        doctype: 'io.cozy.contacts',
+        data: []
+      },
+      'io.cozy.contacts/groups': {
+        doctype: 'io.cozy.contacts.groups',
+        data: []
+      },
+      'io.cozy.contacts/unreachable-with-groups': {
+        doctype: 'io.cozy.contacts',
+        data: []
+      }
+    }
+  })
+  client.create = jest.fn().mockResolvedValue({ data: {} })
+  return client
+}
+
+describe('FederatedFolderModal', () => {
+  let client
+  let sharingContextValue
+
+  beforeEach(() => {
+    jest.clearAllMocks()
+    mockGetSharingLink.mockReturnValue('https://example.com/share/abc123')
+    client = createTestClient()
+    sharingContextValue = createSharingContextValue()
+  })
+
+  const setup = (props = {}) => {
+    return render(
+      <AppLike client={client} sharingContextValue={sharingContextValue}>
+        <FederatedFolderModal
+          document={mockDocument}
+          onClose={mockOnClose}
+          {...props}
+        />
+      </AppLike>
+    )
+  }
+
+  describe('initialization', () => {
+    it('should pass document name as title', async () => {
+      const { getByTestId } = setup()
+
+      await waitFor(() => {
+        expect(getByTestId('title').textContent).toBe('Share "My Test Folder"')
+      })
+    })
+
+    it('should pass default title when document has no name', async () => {
+      const documentWithoutName = { _id: 'folder-456', path: '/test' }
+      const { getByTestId } = setup({ document: documentWithoutName })
+
+      await waitFor(() => {
+        expect(getByTestId('title').textContent).toBe('Share ""')
+      })
+    })
+
+    it('should pass sharing link to DumbFederatedFolderModal', async () => {
+      const { getByTestId } = setup()
+
+      await waitFor(() => {
+        expect(getByTestId('sharing-link').textContent).toBe(
+          'https://example.com/share/abc123'
+        )
+      })
+    })
+
+    it('should pass null sharing link when document is undefined', async () => {
+      const { getByTestId } = setup({ document: undefined })
+
+      await waitFor(() => {
+        expect(getByTestId('sharing-link').textContent).toBe('')
+      })
+    })
+  })
+
+  describe('onShare callback', () => {
+    it('should update recipients when onShare is called', async () => {
+      const { getByTestId } = setup()
+
+      await waitFor(() => {
+        expect(getByTestId('recipients-count').textContent).toBe('0')
+      })
+
+      fireEvent.click(getByTestId('btn-share'))
+
+      await waitFor(() => {
+        expect(getByTestId('recipients-count').textContent).toBe('2')
+      })
+    })
+  })
+
+  describe('onSend callback', () => {
+    it('should call share with correct parameters', async () => {
+      mockShare.mockResolvedValueOnce({})
+      const { getByTestId } = setup()
+
+      await waitFor(() => {
+        expect(getByTestId('btn-send')).toBeTruthy()
+      })
+
+      fireEvent.click(getByTestId('btn-share'))
+      fireEvent.click(getByTestId('btn-send'))
+
+      await waitFor(() => {
+        expect(mockShare).toHaveBeenCalledWith({
+          description: 'My Test Folder',
+          document: mockDocument,
+          recipients: [{ _id: 'r1', displayName: 'Alice' }],
+          readOnlyRecipients: [{ _id: 'r2', displayName: 'Bob' }],
+          sharedDrive: true,
+          openSharing: false
+        })
+      })
+    })
+
+    it('should show success alert and close modal on successful share', async () => {
+      mockShare.mockResolvedValueOnce({})
+      const { getByTestId } = setup()
+
+      await waitFor(() => {
+        expect(getByTestId('btn-send')).toBeTruthy()
+      })
+
+      fireEvent.click(getByTestId('btn-send'))
+
+      await waitFor(() => {
+        expect(mockShowAlert).toHaveBeenCalledWith({
+          message: 'Folder has been shared',
+          severity: 'success',
+          variant: 'filled'
+        })
+        expect(mockOnClose).toHaveBeenCalled()
+      })
+    })
+
+    it('should show error alert when share fails', async () => {
+      mockShare.mockRejectedValueOnce(new Error('Share failed'))
+      const { getByTestId } = setup()
+
+      await waitFor(() => {
+        expect(getByTestId('btn-send')).toBeTruthy()
+      })
+
+      fireEvent.click(getByTestId('btn-send'))
+
+      await waitFor(() => {
+        expect(mockShowAlert).toHaveBeenCalledWith({
+          message: 'Error while sharing folder',
+          severity: 'error',
+          variant: 'filled'
+        })
+        expect(mockOnClose).not.toHaveBeenCalled()
+      })
+    })
+  })
+
+  describe('onSetType callback', () => {
+    it('should move recipient from readOnlyRecipients to recipients when setting two-way', async () => {
+      const { getByTestId } = setup()
+
+      await waitFor(() => {
+        expect(getByTestId('btn-share')).toBeTruthy()
+      })
+
+      fireEvent.click(getByTestId('btn-share'))
+
+      // After btn-share: combined recipients = 2 (1 readWrite + 1 readOnly)
+      await waitFor(() => {
+        expect(getByTestId('recipients-count').textContent).toBe('2')
+        expect(getByTestId('readOnly-recipients-count').textContent).toBe('1')
+      })
+
+      fireEvent.click(getByTestId('btn-set-type-two-way'))
+
+      // After setting two-way: Bob moves from readOnlyRecipients to recipients
+      await waitFor(() => {
+        expect(getByTestId('recipients-count').textContent).toBe('2')
+        expect(getByTestId('readOnly-recipients-count').textContent).toBe('0')
+      })
+    })
+
+    it('should move recipient from recipients to readOnlyRecipients when setting one-way', async () => {
+      const { getByTestId } = setup()
+
+      await waitFor(() => {
+        expect(getByTestId('btn-share')).toBeTruthy()
+      })
+
+      fireEvent.click(getByTestId('btn-share'))
+
+      // After btn-share: combined recipients = 2 (1 readWrite + 1 readOnly)
+      await waitFor(() => {
+        expect(getByTestId('recipients-count').textContent).toBe('2')
+        expect(getByTestId('readOnly-recipients-count').textContent).toBe('1')
+      })
+
+      fireEvent.click(getByTestId('btn-set-type-one-way'))
+
+      // After setting one-way: Alice moves from recipients to readOnlyRecipients
+      // Combined count stays at 2, but readOnlyRecipients increases from 1 to 2
+      await waitFor(() => {
+        expect(getByTestId('recipients-count').textContent).toBe('2')
+        expect(getByTestId('readOnly-recipients-count').textContent).toBe('2')
+      })
+    })
+  })
+
+  describe('onRevoke callback', () => {
+    it('should remove recipient from both lists', async () => {
+      const { getByTestId } = setup()
+
+      await waitFor(() => {
+        expect(getByTestId('btn-share')).toBeTruthy()
+      })
+
+      fireEvent.click(getByTestId('btn-share'))
+
+      await waitFor(() => {
+        expect(getByTestId('recipients-count').textContent).toBe('2')
+      })
+
+      fireEvent.click(getByTestId('btn-revoke'))
+
+      await waitFor(() => {
+        expect(getByTestId('recipients-count').textContent).toBe('1')
+      })
+    })
+  })
+
+  describe('onClose callback', () => {
+    it('should call onClose when close button is clicked', async () => {
+      const { getByTestId } = setup()
+
+      await waitFor(() => {
+        expect(getByTestId('btn-close')).toBeTruthy()
+      })
+
+      fireEvent.click(getByTestId('btn-close'))
+
+      expect(mockOnClose).toHaveBeenCalled()
+    })
+  })
+
+  describe('createContact callback', () => {
+    it('should call client.create when creating a contact', async () => {
+      const { getByTestId } = setup()
+
+      await waitFor(() => {
+        expect(getByTestId('btn-create-contact')).toBeTruthy()
+      })
+
+      fireEvent.click(getByTestId('btn-create-contact'))
+
+      await waitFor(() => {
+        expect(client.create).toHaveBeenCalledWith('io.cozy.contacts', {
+          email: 'test@example.com'
+        })
+      })
+    })
+  })
+})

package/src/components/Recipient/LinkRecipient.jsx

@@ -29,7 +29,7 @@ const LinkRecipient = props => {
   const { recipientConfirmationData, verifyRecipient, link, fadeIn, document } =
     props
 
-  const permissions = getDocumentPermissions(document._id)
+  const permissions = getDocumentPermissions(document?._id)
   const hasPassword = checkIsPermissionHasPassword(permissions)
   const expiresDate = getPermissionExpiresDate(permissions)
   const dateFormatted = expiresDate

package/src/components/ShareAutosuggest.jsx

@@ -20,6 +20,7 @@ import {
 
 const ShareAutocomplete = ({
   loading,
+  disabled,
   contactsAndGroups,
   recipients,
   onPick,
@@ -192,7 +193,8 @@ const ShareAutocomplete = ({
         value: inputValue,
         type: 'email',
         placeholder,
-        className: styles['suggestionInput']
+        className: styles['suggestionInput'],
+        disabled
       }}
     />
   )
@@ -200,6 +202,7 @@ const ShareAutocomplete = ({
 
 ShareAutocomplete.propTypes = {
   loading: PropTypes.bool,
+  disabled: PropTypes.bool,
   contactsAndGroups: PropTypes.array,
   recipients: PropTypes.array.isRequired,
   onPick: PropTypes.func.isRequired,

package/src/components/ShareByEmail.jsx

@@ -29,12 +29,15 @@ export const ShareByEmail = ({
   currentRecipients,
   sharing,
   submitLabel,
-  showNotifications = true
+  showNotifications = true,
+  sharedDrive = false
 }) => {
   const client = useClient()
   const { t } = useI18n()
   const { showAlert } = useAlert()
 
+  const isFederatedMode = flag('drive.federated-shared-folder.enabled')
+
   const [recipients, setRecipients] = useState([])
   const [loading, setLoading] = useState(false)
   const [selectedOption, setSelectedOption] = useState('readWrite')
@@ -50,7 +53,39 @@ export const ShareByEmail = ({
     setSelectedOption(value)
   }
 
-  const onRecipientPick = recipient => {
+  const onRecipientPick = async recipient => {
+    // In federated mode, directly share with the recipient with readWrite access
+    if (isFederatedMode) {
+      setLoading(true)
+      try {
+        const contacts = await getOrCreateFromArray(
+          client,
+          [recipient],
+          createContact
+        )
+        await onShare({
+          document,
+          recipients: contacts,
+          readOnlyRecipients: [],
+          description: sharingDesc,
+          openSharing: false,
+          sharedDrive: true
+        })
+      } catch (err) {
+        if (showNotifications) {
+          showAlert({
+            message: t('Share.shareByEmail.error.addingRecipient'),
+            severity: 'error',
+            variant: 'filled'
+          })
+        }
+      } finally {
+        reset()
+      }
+      return
+    }
+
+    // Normal mode: just add to the list
     const mergedRecipients = flag('sharing.show-recipient-groups')
       ? mergeRecipients(recipients, recipient)
       : spreadGroupAndMergeRecipients(recipients, recipient)
@@ -95,7 +130,8 @@ export const ShareByEmail = ({
         recipients: readWriteRecipients,
         readOnlyRecipients,
         description: sharingDesc,
-        openSharing: readWriteRecipients.length > 0
+        openSharing: readWriteRecipients.length > 0,
+        sharedDrive
       })
 
       if (showNotifications) {
@@ -130,7 +166,7 @@ export const ShareByEmail = ({
 
   const getSharingOptions = () => {
     const isSharingReadOnly = sharing
-      ? isReadOnlySharing(sharing, document._id)
+      ? isReadOnlySharing(sharing, document?._id)
       : false
     const readWrite = {
       value: 'readWrite',
@@ -162,9 +198,10 @@ export const ShareByEmail = ({
           onRemove={recipient => onRecipientRemove(recipient)}
           currentRecipients={currentRecipients}
           recipients={recipients}
+          disabled={loading}
         />
       </div>
-      {showShareControl && (
+      {!isFederatedMode && showShareControl && (
         <div className={styles['share-type-control']}>
           <ShareTypeSelect
             value={selectedOption}
@@ -181,7 +218,7 @@ export const ShareByEmail = ({
       )}
       {showRecipientsLimit ? (
         <ShareRecipientsLimitModal
-          documentName={document.name}
+          documentName={document?.name}
           onConfirm={() => setRecipientsLimit(false)}
         />
       ) : null}
@@ -191,7 +228,7 @@ export const ShareByEmail = ({
 
 ShareByEmail.propTypes = {
   currentRecipients: PropTypes.arrayOf(PropTypes.object),
-  document: PropTypes.object.isRequired,
+  document: PropTypes.object,
   documentType: PropTypes.string.isRequired,
   sharingDesc: PropTypes.string.isRequired,
   onShare: PropTypes.func.isRequired,
@@ -201,7 +238,9 @@ ShareByEmail.propTypes = {
   // Customize the label of the button that submit contacts
   submitLabel: PropTypes.string,
   // Display success or error notifications
-  showNotifications: PropTypes.bool
+  showNotifications: PropTypes.bool,
+  // Set to true for shared drive context
+  sharedDrive: PropTypes.bool
 }
 
 export default ShareByEmail