Improve UX around linking and attaching images and files (attachments)

[mejo-]

Describe the bug
Text offers different ways to add an image or file to the editor and they result in different representation of that file. This is confusing to users and we should rethink it.

On the one hand, we distinguish between:

1. attachments (being it an image or any other file) which live in the .attachments.<fileId> folder
2. links to images/files that might live anywhere within the Nextcloud instance (also possibly in .attachments.<file>

The first is rendered via ImageView.vue and only supports opening full-screen in either ImageModal.vue for images or viewer/new tab for attachments depending on whether Text is already opened in Viewer. Images are displayed directly, but other non-image attachments only show a mimetype-related icon and don't over embedded preview.

The second is a classic link to the file and can be rendered as preview via reference widgets from different apps, optionally with embedded in-place editing capabilities (e.g. for office documents or deck boards).

The resulting user experience is very confusing. E.g. users might want to upload a file to the document as real attachment, but still might want a preview view of this file.

Also related: #8162

[mejo-]

I don't have a clear vision how to untangle this yet, but at least the following would be good in my opinion:

• For reference widgets where it makes sense, add a way to open the referenced resource full width. That's especially useful for office documents and Deck boards in my opinion.
• For attachment files, allow to toggle embedded preview.
• Possibly find a way to visually distinguish between attached files (as in: lives in .attachments folder) and linked files (as in: lives somewhere else). That could also help to make clear that files that are not attached might not be accessible to others (e.g. in shared Text documents or in Collectives pages that contain links to personal files of one user).

I'd be curious what others think about this topic @nextcloud/designers @max-nextcloud @silverkszlo @hiobjan

[jancborchardt]

Yeah, to simplify the requirements:

• Both attached and linked images & files should look very nicely integrated, basically the same
• Both should have the option to either show or hide the embedded preview
• Optional, not sure if it will be more confusing or helpful: Linked images & files could have an indicator on them. It needs to be very specific about its usefulness, like having a tooltip saying "External collaborators might not have access to this file."

[mejo-]

Related: nextcloud/collectives#1882