set sentry user ID, if available and applicable

client/wrappers/SentryWrapper.tsx

@@ -0,0 +1,17 @@
+import * as Sentry from '@sentry/nextjs';
+import { useEffect } from 'react';
+
+import { useAppSelector } from '@/store/hooks';
+
+const SentryWrapper: React.FC<React.PropsWithChildren<unknown>> = ({ children }) => {
+  const user = useAppSelector((state) => state.auth.user);
+
+  useEffect(() => {
+    const sentryUser: Sentry.User | null = user && { ...user, id: user?.id.toString() };
+    Sentry.setUser(sentryUser);
+  }, [user]);
+
+  return <>{children}</>;
+};
+
+export default SentryWrapper;

client/wrappers/index.tsx

@@ -1,17 +1,18 @@
 import DateWrapper from './DateWrapper';
 import FontWrapper from './FontWrapper';
+import SentryWrapper from './SentryWrapper';
 import ThemeWrapper from './ThemeWrapper';
 
-const WrapperRegistry: React.FC<React.PropsWithChildren<unknown>> = ({ children }) => {
+const WrapperRegistry: React.FC<React.PropsWithChildren<unknown>> = ({ children }) => (
-  return (
   <ThemeWrapper>
     <FontWrapper>
       <DateWrapper>
+        <SentryWrapper>
           <>{children}</>
+        </SentryWrapper>
       </DateWrapper>
     </FontWrapper>
   </ThemeWrapper>
-  );
+);
-};
 
 export default WrapperRegistry;