diff --git a/cypress/e2e/cardFeatures.js b/cypress/e2e/cardFeatures.js index 71eb0f001..8ba320e17 100644 --- a/cypress/e2e/cardFeatures.js +++ b/cypress/e2e/cardFeatures.js @@ -114,7 +114,8 @@ describe('Card', function() { cy.get('.file-picker__main [data-filename="welcome.txt"]').should('be.visible') .click() cy.get('.dialog__actions button.button-vue--vue-primary').click() - cy.get('.attachment-list .basename').contains('welcome.txt') + cy.get('.attachment-list .filename').contains('welcome') + cy.get('.attachment-list .filename .extension').contains('txt') }) it('Shows the modal with the editor', () => { diff --git a/src/components/card/AttachmentList.vue b/src/components/card/AttachmentList.vue index 96a171ab2..756f0cc28 100644 --- a/src/components/card/AttachmentList.vue +++ b/src/components/card/AttachmentList.vue @@ -41,7 +41,8 @@
- {{ attachment.name }} + {{ attachmentBasename(attachment) }} + .{{ attachmentExtension(attachment) }}
@@ -58,7 +59,8 @@
- {{ attachment.data }} + {{ attachmentBasename(attachment) }} + .{{ attachmentExtension(attachment) }}
{{ formattedFileSize(attachment.extendedData.filesize) }} @@ -200,6 +202,14 @@ export default { return t('deck', 'Drop your files to upload') } }, + attachmentBasename() { + return (attachment) => attachment?.extendedData?.info.filename + ?? (attachment?.name ?? attachment.data).replace(/\.[^/.]+$/, '') + }, + attachmentExtension() { + return (attachment) => attachment?.extendedData?.info?.extension + ?? (attachment?.name ?? attachment.data).split('.').pop() + }, }, watch: { cardId: { diff --git a/src/components/card/Description.vue b/src/components/card/Description.vue index 4369b9abb..f71103976 100644 --- a/src/components/card/Description.vue +++ b/src/components/card/Description.vue @@ -255,15 +255,18 @@ export default { }, addAttachment(attachment) { const asImage = (attachment.type === 'file' && attachment.extendedData.hasPreview) || attachment.extendedData.mimetype.includes('image') + // We need to strip those as text does not support rtl yet, so we cannot insert them separately + const stripRTLO = (text) => text.replaceAll('\u202e', '') + const fileName = stripRTLO(attachment.extendedData.info.filename) + '.' + stripRTLO(attachment.extendedData.info.extension) if (this.editor) { this.editor.insertAtCursor( asImage ? `${attachment.data}` - : `${attachment.data}`, + : `${fileName}`, ) return } else { - const attachmentString = (asImage ? '!' : '') + '[📎 ' + attachment.data + '](' + this.attachmentPreview(attachment) + ')' + const attachmentString = (asImage ? '!' : '') + '[📎 ' + fileName + '](' + this.attachmentPreview(attachment) + ')' const descString = this.$refs.markdownEditor.easymde.value() const newContent = descString + '\n' + attachmentString this.$refs.markdownEditor.easymde.value(newContent)