Field for uploading files.

[corsacca]

Create a field for uploading files.
These could be pictures, documents, pdfs, voice messages, etc.

Since all D.T fields are components we could make this new field a component too.

The field will hold multiple files.

[corsacca]

I'm thinking a section that shows the images thumbnails and icon + name for the other file types (PDF, txt, docx, .md, etc) and a button to upload more.
We need a way to delete already uploaded files.

[cairocoder01]

In the backend, can admins who add this field put a file type limitation? Or will it always accept any file type?

To spec out some of the features we would want for the UI and the component build:

• Should display list of existing files saved to the field
  • Click file should open/download
  • File type icon for non-image files
  • Images show a small thumbnail and clicking opens them in a modal for larger view. Modal has a download option.
  • Option to delete file (trigger change event)
  • Should we allow renaming files?
  • Should we display these as a grid with larger icons (better for images), or as a list with a very small icon but allows longer file names to be visible? Or we have an icon/button in the label that allows switching between grid and list layout.
• Button to select file to upload
• Drag and drop a file anywhere in the field should upload that file
• Change event will need to pass file name and binary content so that it can be sent to the server to be saved with the Storage feature

[cairocoder01]

I'm thinking a section that shows the images thumbnails and icon + name for the other file types (PDF, txt, docx, .md, etc) and a button to upload more. We need a way to delete already uploaded files.

That's a good layout. Should give plenty of space for longer filenames.

For deleting, when hover is available on desktop, there can be an overlay with a delete icon on hover. Overlay also shows a magnification icon centered to indicate clicking anywhere besides the delete icon will open it larger. For non-images, that magnify icon would just be a download icon. On mobile, we'll need to show that overlay on the first tap of the file though, since hover isn't possible.

[corsacca]

There could be a 3 dot menu item on each file that lets the user:

• delete the file
• rename the file

[cairocoder01]

[corsacca]

For mobile, things will be fairly small and hover isn't on option to show the buttons. Just one button on each file might be better

[cairocoder01]

I was thinking on mobile that this overlay would show up when you tap on the icon. It's kinda the same as having a menu button, but with a bigger tap target. And this overlay would give larger tap targets that a popover menu.

[cairocoder01]

When saving a file using the Storage feature to save on S3, what data gets saved in the database/backend and would thus be needed for saving files to posts?