BundleMon

Total files change +16.89KB +0.34%

Final result: ✅

View report in BundleMon website ➡️

Current branch size history | Target branch size history

It's more a feat than a fix in my opinion 🤔

No need to use DropzoneDnD? I don't remember if we have dnd feature on public pages...

@JF-Cozy there is a ticket that require to add drag and drop in public page https://www.notion.so/linagora/Public-shared-page-add-drag-and-drop-22362718bad180e98f13d504d4f68868?source=copy_link and it's marked as bug

It's more a feat than a fix in my opinion 🤔
No need to use DropzoneDnD? I don't remember if we have dnd feature on public pages...

@JF-Cozy there is a ticket that require to add drag and drop in public page https://www.notion.so/linagora/Public-shared-page-add-drag-and-drop-22362718bad180e98f13d504d4f68868?source=copy_link and it's marked as bug

Ok, but it's not, it's a lack of feature, not the same. But anyway, it's a detail...

No need to use DropzoneDnD? I don't remember if we have dnd feature on public pages...

I just took a look, we don't use virtualized table on public page, so no need to use DropzoneDnD

@lethemanh don't forget to modify src/modules/views/Sharings/SharingsFolderView.jsx please and then I think we will be good to go

@JF-Cozy I've remove prop role from DropZone in src/modules/views/Sharings/SharingsFolderView.jsx

LGTM, but there is a small issue:

I just tested and the drag&drop works, just a small issue with the folder view not being updated after the upload is complete ( it refreshes if you upload via the create button ).
I think there is an issue with the refreshFolderContent not being triggered after the drag-and-drop action.

i made a small video:

edit: after some checking, the dropzone component dispatches the uploadFiles call with fileUploadedCallback = () => null

and this approach relies on the cozy-realtime to handle the update and this won't happen because the publicly shared folder view can't subscribe to the events.

one possible solution is to update the Dropzone component to support this case:

export const Dropzone = ({
  displayedFolder,
  disabled,
  refreshFolderContent = null,
  children,
}) => {
  const client = useClient()
  const { t } = useI18n()
  const { isMobile } = useBreakpoints()
  const { showAlert } = useAlert()
  const sharingState = useSharingContext()
  const vaultClient = useVaultClient()
  const dispatch = useDispatch()
  const fileUploadCallback = refreshFolderContent
    ? refreshFolderContent
    : () => null

  const onDrop = async (files, _, evt) => {
    if (!canDrop(evt)) return

    const filesToUpload = canHandleFolders(evt) ? evt.dataTransfer.items : files
    dispatch(
      uploadFiles(
        filesToUpload,
        displayedFolder.id,
        sharingState,
        fileUploadCallback,
        {
          client,
          vaultClient,
          showAlert,
          t,
        }
      )
    )
  }

and in the src/modules/views/Public/PublicFolderView.jsx

<Dropzone
  disabled={!hasWritePermissions}
  displayedFolder={displayedFolder}
  refreshFolderContent={refreshFolderContent}
>

LGTM, but there is a small issue:

I just tested and the drag&drop works, just a small issue with the folder view not being updated after the upload is complete ( it refreshes if you upload via the create button ). I think there is an issue with the refreshFolderContent not being triggered after the drag-and-drop action.

i made a small video:

dragdrop.mp4
edit: after some checking, the dropzone component dispatches the uploadFiles call with fileUploadedCallback = () => null

and this approach relies on the cozy-realtime to handle the update and this won't happen because the publicly shared folder view can't subscribe to the events.

one possible solution is to update the Dropzone component to support this case:

export const Dropzone = ({
  displayedFolder,
  disabled,
  refreshFolderContent = null,
  children,
}) => {
  const client = useClient()
  const { t } = useI18n()
  const { isMobile } = useBreakpoints()
  const { showAlert } = useAlert()
  const sharingState = useSharingContext()
  const vaultClient = useVaultClient()
  const dispatch = useDispatch()
  const fileUploadCallback = refreshFolderContent
    ? refreshFolderContent
    : () => null

  const onDrop = async (files, _, evt) => {
    if (!canDrop(evt)) return

    const filesToUpload = canHandleFolders(evt) ? evt.dataTransfer.items : files
    dispatch(
      uploadFiles(
        filesToUpload,
        displayedFolder.id,
        sharingState,
        fileUploadCallback,
        {
          client,
          vaultClient,
          showAlert,
          t,
        }
      )
    )
  }

and in the src/modules/views/Public/PublicFolderView.jsx

<Dropzone
  disabled={!hasWritePermissions}
  displayedFolder={displayedFolder}
  refreshFolderContent={refreshFolderContent}
>

@rezk2ll I've updated