diff --git a/src/actions/me.ts b/src/actions/me.ts index 4e02a6e622..dc6c8fa2d9 100644 --- a/src/actions/me.ts +++ b/src/actions/me.ts @@ -1,4 +1,5 @@ import { selectAccount } from 'soapbox/selectors'; +import { setSentryAccount } from 'soapbox/sentry'; import KVStore from 'soapbox/storage/kv-store'; import { getAuthUserId, getAuthUserUrl } from 'soapbox/utils/auth'; @@ -8,6 +9,7 @@ import { loadCredentials } from './auth'; import { importFetchedAccount } from './importer'; import type { AxiosError, RawAxiosRequestHeaders } from 'axios'; +import type { Account } from 'soapbox/schemas'; import type { AppDispatch, RootState } from 'soapbox/store'; import type { APIEntity } from 'soapbox/types/entities'; @@ -88,10 +90,14 @@ const fetchMeRequest = () => ({ type: ME_FETCH_REQUEST, }); -const fetchMeSuccess = (me: APIEntity) => ({ - type: ME_FETCH_SUCCESS, - me, -}); +const fetchMeSuccess = (account: Account) => { + setSentryAccount(account); + + return { + type: ME_FETCH_SUCCESS, + me: account, + }; +}; const fetchMeFail = (error: APIEntity) => ({ type: ME_FETCH_FAIL, diff --git a/src/hooks/index.ts b/src/hooks/index.ts index ef77478df5..1da5fb9e4f 100644 --- a/src/hooks/index.ts +++ b/src/hooks/index.ts @@ -19,7 +19,6 @@ export { useOwnAccount } from './useOwnAccount'; export { usePrevious } from './usePrevious'; export { useRefEventHandler } from './useRefEventHandler'; export { useRegistrationStatus } from './useRegistrationStatus'; -export { useSentry } from './useSentry'; export { useSettings } from './useSettings'; export { useSoapboxConfig } from './useSoapboxConfig'; export { useSystemTheme } from './useSystemTheme'; diff --git a/src/init/soapbox-head.tsx b/src/init/soapbox-head.tsx index 0039404e0c..735e258f1a 100644 --- a/src/init/soapbox-head.tsx +++ b/src/init/soapbox-head.tsx @@ -1,14 +1,14 @@ import clsx from 'clsx'; -import React from 'react'; +import React, { useEffect } from 'react'; import { - useSentry, useSettings, useSoapboxConfig, useTheme, useLocale, } from 'soapbox/hooks'; import { normalizeSoapboxConfig } from 'soapbox/normalizers'; +import { startSentry } from 'soapbox/sentry'; import { generateThemeCss } from 'soapbox/utils/theme'; const Helmet = React.lazy(() => import('soapbox/components/helmet')); @@ -26,6 +26,7 @@ const SoapboxHead: React.FC = ({ children }) => { const demo = !!settings.get('demo'); const darkMode = useTheme() === 'dark'; const themeCss = generateThemeCss(demo ? normalizeSoapboxConfig({ brandColor: '#0482d8' }) : soapboxConfig); + const dsn = soapboxConfig.sentryDsn; const bodyClass = clsx('h-full bg-white text-base dark:bg-gray-800', { 'no-reduce-motion': !settings.get('reduceMotion'), @@ -33,7 +34,11 @@ const SoapboxHead: React.FC = ({ children }) => { 'demetricator': settings.get('demetricator'), }); - useSentry(soapboxConfig.sentryDsn); + useEffect(() => { + if (dsn) { + startSentry(dsn).catch(console.error); + } + }, [dsn]); return ( <> diff --git a/src/reducers/compose.test.ts b/src/reducers/compose.test.ts index c13e0bd4a3..181e3b3356 100644 --- a/src/reducers/compose.test.ts +++ b/src/reducers/compose.test.ts @@ -167,7 +167,7 @@ describe('compose reducer', () => { type: ME_FETCH_SUCCESS, me: { pleroma: { settings_store: { soapbox_fe: { defaultPrivacy: 'unlisted' } } } }, }; - expect(reducer(state, action).toJS().default).toMatchObject({ + expect(reducer(state, action as any).toJS().default).toMatchObject({ privacy: 'unlisted', }); }); diff --git a/src/hooks/useSentry.ts b/src/sentry.ts similarity index 78% rename from src/hooks/useSentry.ts rename to src/sentry.ts index 2a13b2645b..4ef1ea77ea 100644 --- a/src/hooks/useSentry.ts +++ b/src/sentry.ts @@ -1,13 +1,4 @@ -import { useEffect } from 'react'; - -/** Hook to start Sentry. Should only be called once. */ -function useSentry(dsn: string | undefined) { - useEffect(() => { - if (dsn) { - startSentry(dsn).catch(console.error); - } - }, [dsn]); -} +import type { Account } from './schemas'; /** Start Sentry. */ async function startSentry(dsn: string): Promise { @@ -47,4 +38,14 @@ async function startSentry(dsn: string): Promise { }); } -export { useSentry }; \ No newline at end of file +/** Associate the account with Sentry events. */ +async function setSentryAccount(account: Account) { + const Sentry = await import('@sentry/react'); + + Sentry.setUser({ + id: account.id, + username: account.acct, + }); +} + +export { startSentry, setSentryAccount }; \ No newline at end of file