diff --git a/apps/meteor/client/main.ts b/apps/meteor/client/main.ts index c19ffe0b59b58..7edd934d5264d 100644 --- a/apps/meteor/client/main.ts +++ b/apps/meteor/client/main.ts @@ -1,6 +1,6 @@ import './serviceWorker'; import './startup/accounts'; -import './startup/fakeUserPresence'; +import './startup/desktopInjection'; import('@rocket.chat/fuselage-polyfills') .then(() => import('./meteor/overrides')) diff --git a/apps/meteor/client/startup/desktopInjection.ts b/apps/meteor/client/startup/desktopInjection.ts new file mode 100644 index 0000000000000..f3d20b525e92f --- /dev/null +++ b/apps/meteor/client/startup/desktopInjection.ts @@ -0,0 +1,32 @@ +import { watch } from '../meteor/watch'; +import { PublicSettings } from '../stores'; + +if (window.RocketChatDesktop) { + // backport of rocketchat:user-presence for the desktop app + const fakeUserPresenceModule = { + UserPresence: { + awayTime: undefined, + start: () => undefined, + }, + }; + + // backport of settings module for the desktop app + const fakeSettingsModule = { + settings: { + get: (settingId: string) => watch(PublicSettings.use, (state) => state.get(settingId)?.value), + }, + }; + + window.require = ((fn) => + Object.assign((id: string) => { + if (id === 'meteor/rocketchat:user-presence') { + return fakeUserPresenceModule; + } + + if (id === '/app/settings/client/index.ts') { + return fakeSettingsModule; + } + + return fn(id); + }, fn))(window.require); +} diff --git a/apps/meteor/client/startup/fakeUserPresence.ts b/apps/meteor/client/startup/fakeUserPresence.ts deleted file mode 100644 index 3bda53c5055fd..0000000000000 --- a/apps/meteor/client/startup/fakeUserPresence.ts +++ /dev/null @@ -1,18 +0,0 @@ -// backport of rocketchat:user-presence for the desktop app - -if (window.RocketChatDesktop) { - const fakeUserPresenceModule = { - UserPresence: { - awayTime: undefined, - start: () => undefined, - }, - }; - - window.require = ((fn) => - Object.assign((id: string) => { - if (id === 'meteor/rocketchat:user-presence') { - return fakeUserPresenceModule; - } - return fn(id); - }, fn))(window.require); -} diff --git a/apps/meteor/client/views/root/AppLayout.tsx b/apps/meteor/client/views/root/AppLayout.tsx index cb671e3fea60a..198616b40c9ce 100644 --- a/apps/meteor/client/views/root/AppLayout.tsx +++ b/apps/meteor/client/views/root/AppLayout.tsx @@ -12,6 +12,8 @@ import { useNextcloudOAuth } from './hooks/customOAuth/useNextcloudOAuth'; import { useTokenpassOAuth } from './hooks/customOAuth/useTokenpassOAuth'; import { useWordPressOAuth } from './hooks/customOAuth/useWordPressOAuth'; import { useCodeHighlight } from './hooks/useCodeHighlight'; +import { useDesktopFavicon } from './hooks/useDesktopFavicon'; +import { useDesktopTitle } from './hooks/useDesktopTitle'; import { useEscapeKeyStroke } from './hooks/useEscapeKeyStroke'; import { useGoogleTagManager } from './hooks/useGoogleTagManager'; import { useLoadMissedMessages } from './hooks/useLoadMissedMessages'; @@ -65,6 +67,8 @@ const AppLayout = () => { useCodeHighlight(); useLoginViaQuery(); useLoadMissedMessages(); + useDesktopFavicon(); + useDesktopTitle(); const layout = useSyncExternalStore(appLayout.subscribe, appLayout.getSnapshot); diff --git a/apps/meteor/client/views/root/hooks/useDesktopFavicon.ts b/apps/meteor/client/views/root/hooks/useDesktopFavicon.ts new file mode 100644 index 0000000000000..0c4fccca28006 --- /dev/null +++ b/apps/meteor/client/views/root/hooks/useDesktopFavicon.ts @@ -0,0 +1,19 @@ +import { useAbsoluteUrl, useAssetPath } from '@rocket.chat/ui-contexts'; +import { useEffect } from 'react'; + +export const useDesktopFavicon = () => { + const absoluteUrl = useAbsoluteUrl(); + + useEffect(() => { + if (typeof window === 'undefined') return; + window.RocketChatDesktop?.setUrlResolver((relativePath?: string) => absoluteUrl(relativePath ?? '/')); + }, [absoluteUrl]); + + const faviconUrl = useAssetPath('favicon'); + + useEffect(() => { + if (typeof window === 'undefined') return; + if (!faviconUrl) return; + window.RocketChatDesktop?.setFavicon(faviconUrl); + }, [faviconUrl]); +}; diff --git a/apps/meteor/client/views/root/hooks/useDesktopTitle.ts b/apps/meteor/client/views/root/hooks/useDesktopTitle.ts new file mode 100644 index 0000000000000..25129bce0e91c --- /dev/null +++ b/apps/meteor/client/views/root/hooks/useDesktopTitle.ts @@ -0,0 +1,12 @@ +import { useSetting } from '@rocket.chat/ui-contexts'; +import { useEffect } from 'react'; + +export const useDesktopTitle = () => { + const title = useSetting('Site_Name', 'Rocket.Chat'); + + useEffect(() => { + if (typeof window === 'undefined') return; + if (!title) return; + window.RocketChatDesktop?.setTitle(title); + }, [title]); +};