diff --git a/apps/meteor/app/ui/client/lib/KonchatNotification.ts b/apps/meteor/app/ui/client/lib/KonchatNotification.ts index e6a030215ab87..3b1e1f285f2aa 100644 --- a/apps/meteor/app/ui/client/lib/KonchatNotification.ts +++ b/apps/meteor/app/ui/client/lib/KonchatNotification.ts @@ -1,4 +1,4 @@ -import type { INotificationDesktop, IRoom, IUser } from '@rocket.chat/core-typings'; +import type { INotificationDesktop, IUser } from '@rocket.chat/core-typings'; import { Random } from '@rocket.chat/random'; import { Meteor } from 'meteor/meteor'; import { ReactiveVar } from 'meteor/reactive-var'; @@ -8,12 +8,9 @@ import { onClientMessageReceived } from '../../../../client/lib/onClientMessageR import { getAvatarAsPng } from '../../../../client/lib/utils/getAvatarAsPng'; import { router } from '../../../../client/providers/RouterProvider'; import { stripTags } from '../../../../lib/utils/stringUtils'; -import { CustomSounds } from '../../../custom-sounds/client/lib/CustomSounds'; import { e2e } from '../../../e2e/client'; -import { Subscriptions } from '../../../models/client'; import { getUserPreference } from '../../../utils/client'; import { getUserAvatarURL } from '../../../utils/client/getUserAvatarURL'; -import { getUserNotificationsSoundVolume } from '../../../utils/client/getUserNotificationsSoundVolume'; import { sdk } from '../../../utils/client/lib/SDKClient'; declare global { @@ -169,43 +166,6 @@ class KonchatNotification { return this.notify(notification); }); } - - public async newMessage(rid: IRoom['_id'] | undefined) { - if ((Meteor.user() as IUser | null)?.status === 'busy') { - return; - } - - const userId = Meteor.userId(); - const newMessageNotification = getUserPreference(userId, 'newMessageNotification'); - const audioVolume = getUserNotificationsSoundVolume(userId); - - if (!rid) { - return; - } - - const sub = Subscriptions.findOne({ rid }, { fields: { audioNotificationValue: 1 } }); - - if (!sub || sub.audioNotificationValue === 'none') { - return; - } - - try { - if (sub.audioNotificationValue && sub.audioNotificationValue !== '0') { - void CustomSounds.play(sub.audioNotificationValue, { - volume: Number((audioVolume / 100).toPrecision(2)), - }); - return; - } - - if (newMessageNotification && newMessageNotification !== 'none') { - void CustomSounds.play(newMessageNotification, { - volume: Number((audioVolume / 100).toPrecision(2)), - }); - } - } catch (e) { - // do nothing - } - } } const instance = new KonchatNotification(); diff --git a/apps/meteor/client/hooks/notification/useNewMessageNotification.ts b/apps/meteor/client/hooks/notification/useNewMessageNotification.ts new file mode 100644 index 0000000000000..bd69e69e066e7 --- /dev/null +++ b/apps/meteor/client/hooks/notification/useNewMessageNotification.ts @@ -0,0 +1,32 @@ +import type { AtLeast, ISubscription } from '@rocket.chat/core-typings'; +import { useUserPreference } from '@rocket.chat/ui-contexts'; +import { useCallback } from 'react'; + +import { CustomSounds } from '../../../app/custom-sounds/client/lib/CustomSounds'; +import { useUserSoundPreferences } from '../useUserSoundPreferences'; + +export const useNewMessageNotification = () => { + const newMessageNotification = useUserPreference('newMessageNotification'); + const { notificationsSoundVolume } = useUserSoundPreferences(); + + const notifyNewMessage = useCallback( + (sub: AtLeast) => { + if (!sub || sub.audioNotificationValue === 'none') { + return; + } + if (sub.audioNotificationValue && sub.audioNotificationValue !== '0') { + void CustomSounds.play(sub.audioNotificationValue, { + volume: Number((notificationsSoundVolume / 100).toPrecision(2)), + }); + } + + if (newMessageNotification && newMessageNotification !== 'none') { + void CustomSounds.play(newMessageNotification, { + volume: Number((notificationsSoundVolume / 100).toPrecision(2)), + }); + } + }, + [newMessageNotification, notificationsSoundVolume], + ); + return notifyNewMessage; +}; diff --git a/apps/meteor/client/hooks/useNotifyNewRoom.ts b/apps/meteor/client/hooks/notification/useNewRoomNotification.ts similarity index 72% rename from apps/meteor/client/hooks/useNotifyNewRoom.ts rename to apps/meteor/client/hooks/notification/useNewRoomNotification.ts index 0b8eed55f9b4d..7b475745b642c 100644 --- a/apps/meteor/client/hooks/useNotifyNewRoom.ts +++ b/apps/meteor/client/hooks/notification/useNewRoomNotification.ts @@ -1,10 +1,10 @@ import { useUserPreference } from '@rocket.chat/ui-contexts'; import { useCallback } from 'react'; -import { useUserSoundPreferences } from './useUserSoundPreferences'; -import { CustomSounds } from '../../app/custom-sounds/client/lib/CustomSounds'; +import { CustomSounds } from '../../../app/custom-sounds/client/lib/CustomSounds'; +import { useUserSoundPreferences } from '../useUserSoundPreferences'; -export const useNotifyNewRoom = () => { +export const useNewRoomNotification = () => { const newRoomNotification = useUserPreference('newRoomNotification'); const { notificationsSoundVolume } = useUserSoundPreferences(); diff --git a/apps/meteor/client/hooks/useNotifyUser.ts b/apps/meteor/client/hooks/notification/useNotifyUser.ts similarity index 77% rename from apps/meteor/client/hooks/useNotifyUser.ts rename to apps/meteor/client/hooks/notification/useNotifyUser.ts index 2949ad4a14f9d..a71dd6c25a0fa 100644 --- a/apps/meteor/client/hooks/useNotifyUser.ts +++ b/apps/meteor/client/hooks/notification/useNotifyUser.ts @@ -3,12 +3,13 @@ import { useEffectEvent } from '@rocket.chat/fuselage-hooks'; import { useRouter, useStream, useUser, useUserPreference } from '@rocket.chat/ui-contexts'; import { useEffect } from 'react'; -import { useEmbeddedLayout } from './useEmbeddedLayout'; -import { useNotifyNewRoom } from './useNotifyNewRoom'; -import { CachedChatSubscription } from '../../app/models/client'; -import { KonchatNotification } from '../../app/ui/client/lib/KonchatNotification'; -import { RoomManager } from '../lib/RoomManager'; -import { fireGlobalEvent } from '../lib/utils/fireGlobalEvent'; +import { useEmbeddedLayout } from '../useEmbeddedLayout'; +import { useNewMessageNotification } from './useNewMessageNotification'; +import { useNewRoomNotification } from './useNewRoomNotification'; +import { CachedChatSubscription } from '../../../app/models/client'; +import { KonchatNotification } from '../../../app/ui/client/lib/KonchatNotification'; +import { RoomManager } from '../../lib/RoomManager'; +import { fireGlobalEvent } from '../../lib/utils/fireGlobalEvent'; export const useNotifyUser = () => { const user = useUser(); @@ -16,7 +17,8 @@ export const useNotifyUser = () => { const isLayoutEmbedded = useEmbeddedLayout(); const notifyUserStream = useStream('notify-user'); const muteFocusedConversations = useUserPreference('muteFocusedConversations'); - const newRoomNotification = useNotifyNewRoom(); + const newRoomNotification = useNewRoomNotification(); + const newMessageNotification = useNewMessageNotification(); const notifyNewRoom = useEffectEvent(async (sub: AtLeast): Promise => { if (!user || user.status === 'busy') { @@ -45,12 +47,12 @@ export const useNotifyUser = () => { if (isLayoutEmbedded) { if (!hasFocus && messageIsInOpenedRoom) { // Play a notification sound - void KonchatNotification.newMessage(rid); + newMessageNotification(notification.payload); void KonchatNotification.showDesktop(notification); } } else if (!hasFocus || !messageIsInOpenedRoom || !muteFocusedConversations) { // Play a notification sound - void KonchatNotification.newMessage(rid); + newMessageNotification(notification.payload); void KonchatNotification.showDesktop(notification); } }); diff --git a/apps/meteor/client/providers/OmnichannelProvider.tsx b/apps/meteor/client/providers/OmnichannelProvider.tsx index 00428d6bfcd59..c20264571ed31 100644 --- a/apps/meteor/client/providers/OmnichannelProvider.tsx +++ b/apps/meteor/client/providers/OmnichannelProvider.tsx @@ -17,8 +17,8 @@ import { getOmniChatSortQuery } from '../../app/livechat/lib/inquiries'; import { ClientLogger } from '../../lib/ClientLogger'; import type { OmnichannelContextValue } from '../contexts/OmnichannelContext'; import { OmnichannelContext } from '../contexts/OmnichannelContext'; +import { useNewRoomNotification } from '../hooks/notification/useNewRoomNotification'; import { useHasLicenseModule } from '../hooks/useHasLicenseModule'; -import { useNotifyNewRoom } from '../hooks/useNotifyNewRoom'; import { useOmnichannelContinuousSoundNotification } from '../hooks/useOmnichannelContinuousSoundNotification'; import { useReactiveValue } from '../hooks/useReactiveValue'; import { useShouldPreventAction } from '../hooks/useShouldPreventAction'; @@ -76,7 +76,7 @@ const OmnichannelProvider = ({ children }: OmnichannelProviderProps) => { const isPrioritiesEnabled = isEnterprise && accessible; const enabled = accessible && !!user && !!routeConfig; - const notifyNewRoom = useNotifyNewRoom(); + const notifyNewRoom = useNewRoomNotification(); const { data: { priorities = [] } = {}, diff --git a/apps/meteor/client/views/root/AppLayout.tsx b/apps/meteor/client/views/root/AppLayout.tsx index 23a1373f6cfba..656255baa495d 100644 --- a/apps/meteor/client/views/root/AppLayout.tsx +++ b/apps/meteor/client/views/root/AppLayout.tsx @@ -19,10 +19,10 @@ import { useGitLabAuth } from '../../../app/gitlab/client/hooks/useGitLabAuth'; import { useLivechatEnterprise } from '../../../app/livechat-enterprise/hooks/useLivechatEnterprise'; import { useNextcloud } from '../../../app/nextcloud/client/useNextcloud'; import { useTokenPassAuth } from '../../../app/tokenpass/client/hooks/useTokenPassAuth'; +import { useNotifyUser } from '../../hooks/notification/useNotifyUser'; import { useAnalyticsEventTracking } from '../../hooks/useAnalyticsEventTracking'; import { useAutoupdate } from '../../hooks/useAutoupdate'; import { useLoadRoomForAllowedAnonymousRead } from '../../hooks/useLoadRoomForAllowedAnonymousRead'; -import { useNotifyUser } from '../../hooks/useNotifyUser'; import { appLayout } from '../../lib/appLayout'; import { useCustomOAuth } from '../../sidebar/hooks/useCustomOAuth'; import { useRedirectToSetupWizard } from '../../startup/useRedirectToSetupWizard';