chore(settings): Update refs to use libs instead of fxa-shared

Because:
- Cleaning up code duplication

This Commit:
- References @fxa/shared/sentry
- References @fxa/shared/otel
- References @fxa/shared/monitoring

Author: dschom

packages/fxa-settings/src/components/App/index.test.tsx

@@ -34,15 +34,15 @@ import { currentAccount } from '../../lib/cache';
 import { MozServices } from '../../lib/types';
 import mockUseFxAStatus from '../../lib/hooks/useFxAStatus/mocks';
 import useFxAStatus from '../../lib/hooks/useFxAStatus';
-import sentryMetrics from 'fxa-shared/sentry/browser';
+import * as sentryWrapper from '@fxa/shared/sentry-browser';
 import { OAuthError } from '../../lib/oauth';
 
 jest.mock('../../lib/hooks/useFxAStatus', () => ({
   __esModule: true,
   default: jest.fn(),
 }));
 
-jest.mock('fxa-shared/sentry/browser', () => ({
+jest.mock('@fxa/shared/sentry/browser', () => ({
   __esModule: true,
   default: {
     enable: jest.fn(),
@@ -664,7 +664,7 @@ describe('Integration serviceName error handling', () => {
     (useLocalSignedInQueryState as jest.Mock).mockRestore();
     (useSession as jest.Mock).mockRestore();
     (currentAccount as jest.Mock).mockRestore();
-    (sentryMetrics.captureException as jest.Mock).mockClear();
+    (sentryWrapper.captureException as jest.Mock).mockClear();
   });
 
   it('shows OAuthDataError component when OAuth integration throws', async () => {

packages/fxa-settings/src/components/App/index.tsx

@@ -40,7 +40,8 @@ import {
 } from '../../models/contexts/SettingsContext';
 import { AccountStateProvider } from '../../models/contexts/AccountStateContext';
 
-import sentryMetrics from 'fxa-shared/sentry/browser';
+import { disableSentry, enableSentry } from '@fxa/shared/sentry-utils';
+
 // Components
 import LoadingSpinner from 'fxa-react/components/LoadingSpinner';
 import { ScrollToTop } from '../Settings/ScrollToTop';
@@ -206,7 +207,7 @@ export const App = ({
   // - we can't send any identifying metrics to sentry
   // - we can't determine whether or not they have opted out
   if (isSignedInData === undefined || isSignedInData.isSignedIn === false) {
-    sentryMetrics.enable();
+    enableSentry();
   }
 
   const config = useConfig();
@@ -380,9 +381,9 @@ export const App = ({
 
   useEffect(() => {
     if (metricsEnabled || isSignedIn === false) {
-      sentryMetrics.enable();
+      enableSentry();
     } else {
-      sentryMetrics.disable();
+      disableSentry();
     }
   }, [
     data?.account?.metricsEnabled,

packages/fxa-settings/src/index.tsx

@@ -4,7 +4,7 @@
 
 import React from 'react';
 import { render } from 'react-dom';
-import sentryMetrics from 'fxa-shared/sentry/browser';
+import * as sentryWrapper from '@fxa/shared/sentry-browser';
 import { AppErrorBoundary } from './components/ErrorBoundaries';
 import App from './components/App';
 import { NimbusProvider } from './models/contexts/NimbusContext';
@@ -52,7 +52,7 @@ try {
   });
 
   // Must be configured early. Otherwise baggage and sentry-trace headers won't be added
-  sentryMetrics.configure({
+  sentryWrapper.initSentry({
     release: config.version,
     sentry: {
       ...config.sentry,

packages/fxa-settings/src/lib/metrics.ts

@@ -2,7 +2,7 @@
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
-import sentryMetrics from 'fxa-shared/sentry/browser';
+import * as sentryWrapper from '@fxa/shared/sentry-browser';
 import { window } from './window';
 import { v4 as uuid } from 'uuid';
 import { QueryParams } from '..';
@@ -323,7 +323,7 @@ export function logEvents(
     );
   } catch (e) {
     console.error('AppError', e);
-    sentryMetrics.captureException(e);
+    sentryWrapper.captureException(e);
   }
 }
 

packages/fxa-settings/src/models/integrations/oauth-web-integration.ts

@@ -212,6 +212,7 @@ export class OAuthWebIntegration extends GenericIntegration<
           wantsScopeThatHasKeys = true;
         } else {
           // Requesting keys, but trying to deliver them to an unexpected uri? Nope.
+          console.warn('Invalid redirect URI:' + this.clientInfo?.redirectUri);
           throw new Error('Invalid redirect parameter');
         }
       }

packages/fxa-settings/src/pages/Signup/ConfirmSignupCode/container.test.tsx

@@ -9,7 +9,7 @@ import * as HooksModule from '../../../lib/oauth/hooks';
 import * as OAuthFlowRecoveryModule from '../../../lib/hooks/useOAuthFlowRecovery';
 import * as CacheModule from '../../../lib/cache';
 import * as ReachRouterModule from '@reach/router';
-import * as SentryModule from 'fxa-shared/sentry/browser';
+import * as SentryModule from '@fxa/shared/sentry-browser';
 import * as ReactUtils from 'fxa-react/lib/utils';
 
 import { screen, waitFor } from '@testing-library/react';
@@ -143,7 +143,7 @@ function applyMocks() {
     });
   mockLocation();
   mockReactUtilsModule();
-  jest.spyOn(SentryModule.default, 'captureException');
+  jest.spyOn(SentryModule, 'captureException');
   jest.spyOn(OAuthFlowRecoveryModule, 'useOAuthFlowRecovery').mockReturnValue({
     isRecovering: false,
     recoveryFailed: false,
@@ -326,15 +326,18 @@ describe('confirm-signup-container', () => {
         .mockReturnValue({
           isRecovering: false,
           recoveryFailed: true,
-          attemptOAuthFlowRecovery: jest.fn().mockResolvedValue({ success: false }),
+          attemptOAuthFlowRecovery: jest
+            .fn()
+            .mockResolvedValue({ success: false }),
         });
 
       render();
 
       await waitFor(() => {
         expect(mockNavigate).toHaveBeenCalledWith('/signin', {
           state: {
-            localizedErrorMessage: 'Something went wrong. Please sign in again.',
+            localizedErrorMessage:
+              'Something went wrong. Please sign in again.',
           },
         });
       });