diff --git a/apps/meteor/app/ui/client/lib/KonchatNotification.ts b/apps/meteor/app/ui/client/lib/KonchatNotification.ts index 2b463886fdac2..e6a030215ab87 100644 --- a/apps/meteor/app/ui/client/lib/KonchatNotification.ts +++ b/apps/meteor/app/ui/client/lib/KonchatNotification.ts @@ -10,7 +10,7 @@ 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, Users } from '../../../models/client'; +import { Subscriptions } from '../../../models/client'; import { getUserPreference } from '../../../utils/client'; import { getUserAvatarURL } from '../../../utils/client/getUserAvatarURL'; import { getUserNotificationsSoundVolume } from '../../../utils/client/getUserNotificationsSoundVolume'; @@ -206,31 +206,6 @@ class KonchatNotification { // do nothing } } - - public newRoom() { - Tracker.nonreactive(() => { - const uid = Meteor.userId(); - if (!uid) { - return; - } - const user = Users.findOne(uid, { - fields: { - 'settings.preferences.newRoomNotification': 1, - 'settings.preferences.notificationsSoundVolume': 1, - }, - }); - const newRoomNotification = getUserPreference(user, 'newRoomNotification'); - const audioVolume = getUserNotificationsSoundVolume(user?._id); - - if (!newRoomNotification) { - return; - } - - void CustomSounds.play(newRoomNotification, { - volume: Number((audioVolume / 100).toPrecision(2)), - }); - }); - } } const instance = new KonchatNotification(); diff --git a/apps/meteor/client/hooks/useNotifyNewRoom.ts b/apps/meteor/client/hooks/useNotifyNewRoom.ts new file mode 100644 index 0000000000000..0b8eed55f9b4d --- /dev/null +++ b/apps/meteor/client/hooks/useNotifyNewRoom.ts @@ -0,0 +1,22 @@ +import { useUserPreference } from '@rocket.chat/ui-contexts'; +import { useCallback } from 'react'; + +import { useUserSoundPreferences } from './useUserSoundPreferences'; +import { CustomSounds } from '../../app/custom-sounds/client/lib/CustomSounds'; + +export const useNotifyNewRoom = () => { + const newRoomNotification = useUserPreference('newRoomNotification'); + const { notificationsSoundVolume } = useUserSoundPreferences(); + + const notifyNewRoom = useCallback(() => { + if (!newRoomNotification) { + return; + } + + void CustomSounds.play(newRoomNotification, { + volume: Number((notificationsSoundVolume / 100).toPrecision(2)), + }); + }, [newRoomNotification, notificationsSoundVolume]); + + return notifyNewRoom; +}; diff --git a/apps/meteor/client/hooks/useNotifyUser.ts b/apps/meteor/client/hooks/useNotifyUser.ts index 440c979fed111..2949ad4a14f9d 100644 --- a/apps/meteor/client/hooks/useNotifyUser.ts +++ b/apps/meteor/client/hooks/useNotifyUser.ts @@ -4,6 +4,7 @@ import { useRouter, useStream, useUser, useUserPreference } from '@rocket.chat/u 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'; @@ -15,6 +16,7 @@ export const useNotifyUser = () => { const isLayoutEmbedded = useEmbeddedLayout(); const notifyUserStream = useStream('notify-user'); const muteFocusedConversations = useUserPreference('muteFocusedConversations'); + const newRoomNotification = useNotifyNewRoom(); const notifyNewRoom = useEffectEvent(async (sub: AtLeast): Promise => { if (!user || user.status === 'busy') { @@ -22,7 +24,7 @@ export const useNotifyUser = () => { } if ((!router.getRouteParameters().name || router.getRouteParameters().name !== sub.name) && !sub.ls && sub.alert === true) { - KonchatNotification.newRoom(); + newRoomNotification(); } }); diff --git a/apps/meteor/client/providers/OmnichannelProvider.tsx b/apps/meteor/client/providers/OmnichannelProvider.tsx index ed06c15d68736..00428d6bfcd59 100644 --- a/apps/meteor/client/providers/OmnichannelProvider.tsx +++ b/apps/meteor/client/providers/OmnichannelProvider.tsx @@ -14,11 +14,11 @@ import { useState, useEffect, useMemo, useCallback, memo, useRef } from 'react'; import { LivechatInquiry } from '../../app/livechat/client/collections/LivechatInquiry'; import { initializeLivechatInquiryStream } from '../../app/livechat/client/lib/stream/queueManager'; import { getOmniChatSortQuery } from '../../app/livechat/lib/inquiries'; -import { KonchatNotification } from '../../app/ui/client/lib/KonchatNotification'; import { ClientLogger } from '../../lib/ClientLogger'; import type { OmnichannelContextValue } from '../contexts/OmnichannelContext'; import { OmnichannelContext } from '../contexts/OmnichannelContext'; 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,6 +76,8 @@ const OmnichannelProvider = ({ children }: OmnichannelProviderProps) => { const isPrioritiesEnabled = isEnterprise && accessible; const enabled = accessible && !!user && !!routeConfig; + const notifyNewRoom = useNotifyNewRoom(); + const { data: { priorities = [] } = {}, isLoading: isLoadingPriorities, @@ -158,10 +160,10 @@ const OmnichannelProvider = ({ children }: OmnichannelProviderProps) => { useEffect(() => { if (lastQueueSize.current < (queue?.length ?? 0)) { - KonchatNotification.newRoom(); + notifyNewRoom(); } lastQueueSize.current = queue?.length ?? 0; - }, [queue?.length]); + }, [notifyNewRoom, queue?.length]); useOmnichannelContinuousSoundNotification(queue ?? []);