vue3: Attachment Cell

[wingkwong]

Attachment cells are used to keep attachments. By default, we are using local storage to keep the files, and in the database keeping the URL as a JSON array string.

Attachment cell

• [x] Clicking + icon user could able to upload new image
• [x] Expand icon on the right side will open a modal with images
• [x] On clicking an attachment in the cell it should be open in a full-screen slider
• [x] There should be a read-only mode, the user can only view cell content. You can get the state by ReadonlyInj.

Expanded modal

• [x] Remove option for images
• [x] Download option for downloading attachment
• [x] A button for uploading new attachments
• [x] Attachements should be sortable
  

Attachment Slider overlay

• [x] At the top there should be a download button
• [x] Middle of the screen a slider with next and prev icon
• [x] Bottom small navigation with thumbnails

---

For v1 implementation refer following file : packages/nc-gui/components/project/spreadsheet/components/editableCell/EditableAttachmentCell.vue

Note : Will add more details later

[dstala]

@bcakmakoglu

• [x] for an empty cell, v1 showed both options : + and expand cell; v2 shows equivalent to only + as add files. I couldn't attach by using drag drop feature until i upload at least one image

• [x] [minor] attachment cell row height can be restricted when we add many files

v1

v2

[bcakmakoglu]

@dstala what is the expanded cell supposed to show when there are no images? it would just be an empty modal then?

I can't seem to reproduce the drop issue. Dropping works fine regardless if there is an image already or not.

Were there any errors in the console when you try to drop into an empty attachment Cell?

[dstala]

@bcakmakoglu Expanded cell will open a modal to drop images (wouldn't be required if you have configured to let images to be dropped on to cell directly). If I drop images on to cell, image opens in a separate tab in browser - chrome. No error observed in console.

[bcakmakoglu]

@dstala Dropzone should work correctly now, please try again 😄 I added a maxheight and made the cell scroll if there's too many items to show at once