fix(FilePreview): sanitize file name

[Antreesy]

☑️ Resolves

• Refactor + Hardening for FilePreview
  • drop redundant prop smallPreview - always used in pair with rowLayout
  • sanitize filename on rendering - keep file extension a static append to the file name (aligned with Files app)
  • highlight extension

AI (if applicable)

• The content of this PR was partly or fully generated using AI

🖌️ UI Checklist

🖼️ Screenshots / Screencasts

🏚️ Before	🏡 After
b
bb

🚧 Tasks

• ...

🏁 Checklist

• 🌏 Tested with different browsers / clients:
  • Chromium (Chrome / Edge / Opera / Brave)
  • Firefox
  • Safari
  • Talk Desktop
  • Integrations with Files sidebar and other apps
  • Not risky to browser differences / client
• 🖌️ Design was reviewed, approved or inspired by the design team
• ⛑️ Tests are included or not possible
• 📗 User documentation in https://github.com/nextcloud/documentation/tree/master/user_manual/talk has been updated or is not required

[Antreesy]

/backport to stable35

[Antreesy]

/backport to stable34

[Antreesy]

/backport to stable33

[Antreesy]

/backport to stable32

[nickvergessen]

Small improvement copied from files app for long names and color different on the extension:

Details

diff --git a/src/components/MessagesList/MessagesGroup/Message/MessagePart/FilePreview.vue b/src/components/MessagesList/MessagesGroup/Message/MessagePart/FilePreview.vue
index 3dcf2ab66e..e23f8e29fe 100644
--- a/src/components/MessagesList/MessagesGroup/Message/MessagePart/FilePreview.vue
+++ b/src/components/MessagesList/MessagesGroup/Message/MessagePart/FilePreview.vue
@@ -95,7 +95,7 @@
                        </template>
                </NcButton>
                <div v-if="shouldShowFileDetail" class="name-container">
-                       <span class="name-container__basename">{{ fileNameWithoutExtension }}</span><span v-if="fileExtension">{{ fileExtension }}</span>
+                       <span class="name-container__basename">{{ fileNameWithoutExtension }}</span><span v-if="fileExtension" class="name-container__extension">{{ fileExtension }}</span>
                </div>
        </component>
 </template>
@@ -796,10 +796,18 @@ export default {
                width: 100%;
                overflow: hidden;
                white-space: nowrap;
-               text-overflow: ellipsis;
+               display: inline-flex;
 
                &__basename {
                        unicode-bidi: isolate;
+                       overflow: hidden;
+                       white-space: nowrap;
+                       text-overflow: ellipsis;
+               }
+
+               &__extension {
+                       color: var(--color-text-maxcontrast);
+                       overflow: visible;
                }
        }