diff --git a/src/components/MediaRecorder/AudioRecorder/AudioRecorderRecordingControls.tsx b/src/components/MediaRecorder/AudioRecorder/AudioRecorderRecordingControls.tsx index ec616f0af..c1cba09c3 100644 --- a/src/components/MediaRecorder/AudioRecorder/AudioRecorderRecordingControls.tsx +++ b/src/components/MediaRecorder/AudioRecorder/AudioRecorderRecordingControls.tsx @@ -1,9 +1,14 @@ import { CheckSignIcon, LoadingIndicatorIcon } from '../../MessageComposer/icons'; import { IconMicrophone, IconPause, IconTrashBin } from '../../Icons'; import React from 'react'; -import { useMessageComposerContext } from '../../../context'; +import { + useChatContext, + useMessageComposerContext, + useTranslationContext, +} from '../../../context'; import { isRecording } from './recordingStateIdentity'; import { Button } from '../../Button'; +import { addNotificationTargetTag, useNotificationTarget } from '../../Notifications'; const ToggleRecordingButton = () => { const { @@ -27,9 +32,13 @@ const ToggleRecordingButton = () => { }; export const AudioRecorderRecordingControls = () => { + const { client } = useChatContext(); + const { t } = useTranslationContext(); const { recordingController: { completeRecording, recorder, recording, recordingState }, } = useMessageComposerContext(); + const panel = useNotificationTarget(); + const isUploadingFile = recording?.localMetadata?.uploadState === 'uploading'; if (!recorder) return null; @@ -43,7 +52,17 @@ export const AudioRecorderRecordingControls = () => { className='str-chat__audio_recorder__cancel-button' data-testid={'cancel-recording-audio-button'} disabled={isUploadingFile} - onClick={recorder.cancel} + onClick={() => { + recorder.cancel(); + client.notifications.addInfo({ + message: t('Voice message deleted'), + options: { + tags: addNotificationTargetTag(panel), + type: 'audioRecording:cancel:success', + }, + origin: { emitter: 'AudioRecorder' }, + }); + }} size='sm' variant='secondary' > diff --git a/src/components/Notifications/Notification.tsx b/src/components/Notifications/Notification.tsx index 8f92e274d..314d2bb68 100644 --- a/src/components/Notifications/Notification.tsx +++ b/src/components/Notifications/Notification.tsx @@ -6,7 +6,6 @@ import { type Notification as NotificationType } from 'stream-chat'; import { IconArrowRotateRightLeftRepeatRefresh, IconCheckmark2, - IconCircleInfoTooltip, IconCrossMedium, IconExclamationCircle, IconExclamationTriangle, @@ -22,9 +21,9 @@ export type NotificationIconProps = { notification: NotificationType; }; -const IconsBySeverity: Record = { +const IconsBySeverity: Record = { error: IconExclamationCircle, - info: IconCircleInfoTooltip, + info: null, // IconCircleInfoTooltip, loading: IconArrowRotateRightLeftRepeatRefresh, success: IconCheckmark2, warning: IconExclamationTriangle, @@ -34,7 +33,13 @@ const DefaultNotificationIcon = ({ notification }: NotificationIconProps) => { if (!notification.severity) return null; const Icon = IconsBySeverity[notification.severity] ?? null; - return Icon && ; + return ( + Icon && ( +
+ +
+ ) + ); }; export type NotificationProps = { @@ -104,11 +109,7 @@ export const Notification = forwardRef( ref={ref} >
- {Icon && ( -
- -
- )} + {Icon && }
{displayMessage}
{notification.actions && notification.actions.length > 0 && ( diff --git a/src/components/Notifications/styling/Notification.scss b/src/components/Notifications/styling/Notification.scss index b7d27bae8..f95dd2c2c 100644 --- a/src/components/Notifications/styling/Notification.scss +++ b/src/components/Notifications/styling/Notification.scss @@ -1,7 +1,7 @@ .str-chat__notification { display: flex; align-items: center; - gap: var(--spacing-xxs); + gap: var(--spacing-xs); min-height: 48px; min-width: 200px; max-width: 100%; @@ -21,7 +21,6 @@ display: flex; flex: 1 1 auto; gap: var(--spacing-xs); - min-width: 0; .str-chat__notification-icon { display: flex; @@ -38,7 +37,8 @@ flex: 1 1 auto; padding-block: var(--spacing-xxxs); font: var(--str-chat__caption-default-text); - min-width: 0; + text-align: center; + white-space: nowrap; } } diff --git a/src/i18n/de.json b/src/i18n/de.json index 4a4fed479..46a31babc 100644 --- a/src/i18n/de.json +++ b/src/i18n/de.json @@ -445,6 +445,7 @@ "View translation": "Übersetzung anzeigen", "Voice message": "Sprachnachricht", "Voice message {{ duration }}": "Sprachnachricht {{ duration }}", + "Voice message deleted": "Sprachnachricht gelöscht", "voiceMessageCount_one": "Sprachnachricht", "voiceMessageCount_other": "{{ count }} sprachnachrichten", "Vote ended": "Abstimmung beendet", diff --git a/src/i18n/en.json b/src/i18n/en.json index ba7f34d92..fa45395a8 100644 --- a/src/i18n/en.json +++ b/src/i18n/en.json @@ -445,6 +445,7 @@ "View translation": "View translation", "Voice message": "Voice message", "Voice message {{ duration }}": "Voice message {{ duration }}", + "Voice message deleted": "Voice message deleted", "voiceMessageCount_one": "Voice message", "voiceMessageCount_other": "{{ count }} voice messages", "Vote ended": "Vote ended", diff --git a/src/i18n/es.json b/src/i18n/es.json index 6c8390c24..beb39c1a8 100644 --- a/src/i18n/es.json +++ b/src/i18n/es.json @@ -463,6 +463,7 @@ "View translation": "Ver traducción", "Voice message": "Mensaje de voz", "Voice message {{ duration }}": "Mensaje de voz {{ duration }}", + "Voice message deleted": "Mensaje de voz eliminado", "voiceMessageCount_one": "Mensaje de voz", "voiceMessageCount_many": "{{ count }} mensajes de voz", "voiceMessageCount_other": "{{ count }} mensajes de voz", diff --git a/src/i18n/fr.json b/src/i18n/fr.json index 336f3f2f7..7f1dd6d40 100644 --- a/src/i18n/fr.json +++ b/src/i18n/fr.json @@ -463,6 +463,7 @@ "View translation": "Voir la traduction", "Voice message": "Message vocal", "Voice message {{ duration }}": "Message vocal {{ duration }}", + "Voice message deleted": "Message vocal supprimé", "voiceMessageCount_one": "Mémo vocal", "voiceMessageCount_many": "{{ count }} mémos vocaux", "voiceMessageCount_other": "{{ count }} mémos vocaux", diff --git a/src/i18n/hi.json b/src/i18n/hi.json index 6946d1a0f..6f1211cf1 100644 --- a/src/i18n/hi.json +++ b/src/i18n/hi.json @@ -446,6 +446,7 @@ "View translation": "अनुवाद देखें", "Voice message": "आवाज संदेश", "Voice message {{ duration }}": "वॉइस संदेश {{ duration }}", + "Voice message deleted": "वॉइस संदेश हटा दिया गया", "voiceMessageCount_one": "1 ध्वनि संदेश", "voiceMessageCount_other": "{{ count }} ध्वनि संदेश", "Vote ended": "मतदान समाप्त", diff --git a/src/i18n/it.json b/src/i18n/it.json index 8794c1cfe..2fd733477 100644 --- a/src/i18n/it.json +++ b/src/i18n/it.json @@ -463,6 +463,7 @@ "View translation": "Visualizza traduzione", "Voice message": "Messaggio vocale", "Voice message {{ duration }}": "Messaggio vocale {{ duration }}", + "Voice message deleted": "Messaggio vocale eliminato", "voiceMessageCount_one": "Messaggio vocale", "voiceMessageCount_many": "{{ count }} messaggi vocali", "voiceMessageCount_other": "{{ count }} messaggi vocali", diff --git a/src/i18n/ja.json b/src/i18n/ja.json index 6cf5e1e93..225ffdd4b 100644 --- a/src/i18n/ja.json +++ b/src/i18n/ja.json @@ -438,6 +438,7 @@ "View translation": "翻訳を表示", "Voice message": "ボイスメッセージ", "Voice message {{ duration }}": "ボイスメッセージ {{ duration }}", + "Voice message deleted": "ボイスメッセージが削除されました", "voiceMessageCount_other": "{{ count }}件のボイスメッセージ", "Vote ended": "投票が終了しました", "Votes": "投票", diff --git a/src/i18n/ko.json b/src/i18n/ko.json index 7d2b1ace1..64e725428 100644 --- a/src/i18n/ko.json +++ b/src/i18n/ko.json @@ -438,6 +438,7 @@ "View translation": "번역 보기", "Voice message": "음성 메시지", "Voice message {{ duration }}": "음성 메시지 {{ duration }}", + "Voice message deleted": "음성 메시지가 삭제됨", "voiceMessageCount_other": "음성 메시지 {{ count }}개", "Vote ended": "투표 종료", "Votes": "투표", diff --git a/src/i18n/nl.json b/src/i18n/nl.json index bdfcd6850..56cdadf89 100644 --- a/src/i18n/nl.json +++ b/src/i18n/nl.json @@ -447,6 +447,7 @@ "View translation": "Vertaling bekijken", "Voice message": "Spraakbericht", "Voice message {{ duration }}": "Spraakbericht {{ duration }}", + "Voice message deleted": "Spraakbericht verwijderd", "voiceMessageCount_one": "Spraakbericht", "voiceMessageCount_other": "{{ count }} spraakberichten", "Vote ended": "Stemmen beëindigd", diff --git a/src/i18n/pt.json b/src/i18n/pt.json index 90adacb30..430f5ceb1 100644 --- a/src/i18n/pt.json +++ b/src/i18n/pt.json @@ -463,6 +463,7 @@ "View translation": "Ver tradução", "Voice message": "Mensagem de voz", "Voice message {{ duration }}": "Mensagem de voz {{ duration }}", + "Voice message deleted": "Mensagem de voz excluída", "voiceMessageCount_one": "Mensagem de voz", "voiceMessageCount_many": "{{ count }} mensagens de voz", "voiceMessageCount_other": "{{ count }} mensagens de voz", diff --git a/src/i18n/ru.json b/src/i18n/ru.json index 49d8dcf2a..993ee060d 100644 --- a/src/i18n/ru.json +++ b/src/i18n/ru.json @@ -485,6 +485,7 @@ "View translation": "Показать перевод", "Voice message": "Голосовое сообщение", "Voice message {{ duration }}": "Голосовое сообщение {{ duration }}", + "Voice message deleted": "Голосовое сообщение удалено", "voiceMessageCount_one": "{{ count }} голосовое сообщение", "voiceMessageCount_few": "{{ count }} голосовых сообщения", "voiceMessageCount_many": "{{ count }} голосовых сообщений", diff --git a/src/i18n/tr.json b/src/i18n/tr.json index be01077e6..4dff3b662 100644 --- a/src/i18n/tr.json +++ b/src/i18n/tr.json @@ -445,6 +445,7 @@ "View translation": "Çeviriyi görüntüle", "Voice message": "Sesli mesaj", "Voice message {{ duration }}": "Sesli mesaj {{ duration }}", + "Voice message deleted": "Sesli mesaj silindi", "voiceMessageCount_one": "Sesli mesaj", "voiceMessageCount_other": "{{ count }} sesli mesaj", "Vote ended": "Oylama sona erdi",