From 28e913196e1cfa07fd23dd8d7f827be0aebb4153 Mon Sep 17 00:00:00 2001 From: Sulaiman AlRomaih Date: Fri, 8 May 2026 22:22:42 +0300 Subject: [PATCH 1/5] Web: Enhance file transfer UI & add translations - Added 'Decline' translations to multiple languages. - Improved UI for accept/decline file actions with better styling. - Enhanced accessibility with aria-labels and translations. --- .../src/app/core/i18n/localizations/ar.json | 1 + .../src/app/core/i18n/localizations/en.json | 1 + .../src/app/core/i18n/localizations/es.json | 1 + .../src/app/core/i18n/localizations/fr.json | 1 + .../src/app/core/i18n/localizations/ru.json | 1 + .../app/core/i18n/localizations/zh-CN.json | 1 + .../chat-messages/chat-messages.component.css | 112 ++++++++++++++++++ .../chat-messages.component.html | 24 ++-- 8 files changed, 132 insertions(+), 10 deletions(-) diff --git a/client/web/src/app/core/i18n/localizations/ar.json b/client/web/src/app/core/i18n/localizations/ar.json index 05a8d0c..2d9a6e0 100644 --- a/client/web/src/app/core/i18n/localizations/ar.json +++ b/client/web/src/app/core/i18n/localizations/ar.json @@ -10,6 +10,7 @@ "DROP_FILES_HERE": "أسقِط الملفات هنا", "WANTS_TO_SEND_FILE": "يرغب في إرسال ملف إليك", "ACCEPT": "قبول", + "DECLINE": "رفض", "CANCEL": "إلغاء", "_ROOMS_SECTION": "==== ROOMS ====", diff --git a/client/web/src/app/core/i18n/localizations/en.json b/client/web/src/app/core/i18n/localizations/en.json index c4f69c3..4469acc 100644 --- a/client/web/src/app/core/i18n/localizations/en.json +++ b/client/web/src/app/core/i18n/localizations/en.json @@ -10,6 +10,7 @@ "DROP_FILES_HERE": "Drop files here", "WANTS_TO_SEND_FILE": "wants to send you a file", "ACCEPT": "Accept", + "DECLINE": "Decline", "CANCEL": "Cancel", "_ROOMS_SECTION": "==== ROOMS ====", diff --git a/client/web/src/app/core/i18n/localizations/es.json b/client/web/src/app/core/i18n/localizations/es.json index 1abbeda..05576c0 100644 --- a/client/web/src/app/core/i18n/localizations/es.json +++ b/client/web/src/app/core/i18n/localizations/es.json @@ -10,6 +10,7 @@ "DROP_FILES_HERE": "Suelta los archivos aquí", "WANTS_TO_SEND_FILE": "quiere enviarte un archivo", "ACCEPT": "Aceptar", + "DECLINE": "Rechazar", "CANCEL": "Cancelar", "_ROOMS_SECTION": "==== ROOMS ====", diff --git a/client/web/src/app/core/i18n/localizations/fr.json b/client/web/src/app/core/i18n/localizations/fr.json index 18fa189..4157589 100644 --- a/client/web/src/app/core/i18n/localizations/fr.json +++ b/client/web/src/app/core/i18n/localizations/fr.json @@ -10,6 +10,7 @@ "DROP_FILES_HERE": "Déposez les fichiers ici", "WANTS_TO_SEND_FILE": "veut vous envoyer un fichier", "ACCEPT": "Accepter", + "DECLINE": "Refuser", "CANCEL": "Annuler", "_ROOMS_SECTION": "==== ROOMS ====", diff --git a/client/web/src/app/core/i18n/localizations/ru.json b/client/web/src/app/core/i18n/localizations/ru.json index f06037c..f1a5408 100644 --- a/client/web/src/app/core/i18n/localizations/ru.json +++ b/client/web/src/app/core/i18n/localizations/ru.json @@ -10,6 +10,7 @@ "DROP_FILES_HERE": "Перетащите файлы сюда", "WANTS_TO_SEND_FILE": "хочет отправить вам файл", "ACCEPT": "Принять", + "DECLINE": "Отклонить", "CANCEL": "Отмена", "_ROOMS_SECTION": "==== ROOMS ====", diff --git a/client/web/src/app/core/i18n/localizations/zh-CN.json b/client/web/src/app/core/i18n/localizations/zh-CN.json index 54ec12f..7fb0975 100644 --- a/client/web/src/app/core/i18n/localizations/zh-CN.json +++ b/client/web/src/app/core/i18n/localizations/zh-CN.json @@ -10,6 +10,7 @@ "DROP_FILES_HERE": "将文件拖放到此处", "WANTS_TO_SEND_FILE": "想向您发送一个文件", "ACCEPT": "接受", + "DECLINE": "拒绝", "CANCEL": "取消", "_ROOMS_SECTION": "==== ROOMS ====", diff --git a/client/web/src/app/features/chat/components/chat-messages/chat-messages.component.css b/client/web/src/app/features/chat/components/chat-messages/chat-messages.component.css index 92d692c..021fa56 100644 --- a/client/web/src/app/features/chat/components/chat-messages/chat-messages.component.css +++ b/client/web/src/app/features/chat/components/chat-messages/chat-messages.component.css @@ -1,3 +1,115 @@ :host { display: contents; } + +.file-offer-action { + position: relative; + display: inline-flex; + min-width: 2.75rem; + height: 2.5rem; + align-items: center; + justify-content: center; + gap: 0.375rem; + padding: 0 0.75rem; + border: 1px solid rgb(255 255 255 / 0.38); + border-radius: 9999px; + font-family: expo-arabic-medium, sans-serif; + font-size: 0.75rem; + font-weight: 700; + line-height: 1; + white-space: nowrap; + backdrop-filter: blur(12px) saturate(145%); + box-shadow: + 0 8px 18px rgb(15 23 42 / 0.16), + inset 0 1px 0 rgb(255 255 255 / 0.4); + transition: + transform 180ms ease, + color 180ms ease, + background 180ms ease, + border-color 180ms ease, + box-shadow 180ms ease; +} + +.file-offer-action svg { + flex: 0 0 auto; +} + +.file-offer-action:hover { + transform: translateY(-1px); + box-shadow: + 0 12px 22px rgb(15 23 42 / 0.2), + inset 0 1px 0 rgb(255 255 255 / 0.5); +} + +.file-offer-action:active { + transform: translateY(0) scale(0.96); +} + +.file-offer-action:focus-visible { + outline: 2px solid rgb(255 255 255 / 0.9); + outline-offset: 2px; +} + +.file-offer-action--accept { + color: #3c54f0; + border-color: rgb(255 255 255 / 0.84); + background: rgb(255 255 255 / 0.94); +} + +.file-offer-action--accept:hover { + color: #2438c7; + border-color: rgb(255 255 255 / 0.95); + background: rgb(238 242 255 / 0.98); +} + +.file-offer-action--decline { + color: rgb(255 255 255 / 0.92); + background: rgb(255 255 255 / 0.14); +} + +.file-offer-action--decline:hover { + color: #ffffff; + border-color: rgb(255 255 255 / 0.54); + background: rgb(255 255 255 / 0.22); +} + +:host-context(.dark) .file-offer-action { + box-shadow: + 0 8px 18px rgb(0 0 0 / 0.18), + inset 0 1px 0 rgb(255 255 255 / 0.36); +} + +:host-context(.dark) .file-offer-action--accept { + color: #4f46e5; + background: rgb(255 255 255 / 0.95); +} + +:host-context(.dark) .file-offer-action--accept:hover { + color: #3730a3; + background: rgb(238 242 255 / 0.98); +} + +:host-context(.dark) .file-offer-action--decline { + color: rgb(255 255 255 / 0.9); + background: rgb(255 255 255 / 0.13); +} + +@media (max-width: 640px) { + .file-offer-action { + min-width: 2.5rem; + width: 2.5rem; + padding: 0; + } + + .file-offer-action span { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + clip: rect(0, 0, 0, 0); + white-space: nowrap; + border: 0; + } +} diff --git a/client/web/src/app/features/chat/components/chat-messages/chat-messages.component.html b/client/web/src/app/features/chat/components/chat-messages/chat-messages.component.html index d858fa0..313a427 100644 --- a/client/web/src/app/features/chat/components/chat-messages/chat-messages.component.html +++ b/client/web/src/app/features/chat/components/chat-messages/chat-messages.component.html @@ -405,15 +405,16 @@ ) { } From 5a4f2178f0d597aeec55baf8477611ba7eb8899a Mon Sep 17 00:00:00 2001 From: Sulaiman AlRomaih Date: Fri, 8 May 2026 22:22:56 +0300 Subject: [PATCH 2/5] Web: Simplify progress tracking - Removed redundant debug logging to streamline code. - Optimized progress calculation by removing unnecessary parameters. - Improved UI by simplifying progress bar logic. --- .../websocket-connection.service.ts | 2 +- .../chat-sidebar/chat-sidebar.component.html | 16 ++++----- .../chat-sidebar/chat-sidebar.component.ts | 33 ++++--------------- 3 files changed, 16 insertions(+), 35 deletions(-) diff --git a/client/web/src/app/core/services/communication/websocket-connection.service.ts b/client/web/src/app/core/services/communication/websocket-connection.service.ts index 7ca4c3b..95f0201 100644 --- a/client/web/src/app/core/services/communication/websocket-connection.service.ts +++ b/client/web/src/app/core/services/communication/websocket-connection.service.ts @@ -295,7 +295,7 @@ export class WebSocketConnectionService implements OnDestroy { } }; - socket.onerror = (_event) => { + socket.onerror = () => { if (socket !== this.socket) return; this.logger.warn('connect', 'WebSocket connection error (will attempt reconnect)'); this.isConnecting = false; diff --git a/client/web/src/app/features/chat/components/chat-sidebar/chat-sidebar.component.html b/client/web/src/app/features/chat/components/chat-sidebar/chat-sidebar.component.html index 16f6dbd..4046bcc 100644 --- a/client/web/src/app/features/chat/components/chat-sidebar/chat-sidebar.component.html +++ b/client/web/src/app/features/chat/components/chat-sidebar/chat-sidebar.component.html @@ -325,7 +325,7 @@

- {{ progressValue(upload.progress, 'upload', upload.fileId) | number: '1.0-0' }}% + {{ progressValue(upload.progress) | number: '1.0-0' }}%