feat(settings): Add sentry capture for AppErrorDialog

Because:

* We want to measure how often users see this screen from an error on retrieving initial settings state, and compare with AppErrorBoundary

This commit:

* Add Sentry capture exception, add tags for source

Closes #

packages/fxa-react/components/AppErrorBoundary/index.tsx

@@ -4,7 +4,7 @@
 
 import React from 'react';
 import AppErrorDialog from '../AppErrorDialog';
-import sentryMetrics from 'fxa-shared/sentry/browser';
+import * as Sentry from '@sentry/browser';
 
 interface AppErrorBoundaryProps {
   children?: React.ReactNode;
@@ -33,7 +33,7 @@ class AppErrorBoundary extends React.Component<
 
   componentDidCatch(error: Error) {
     console.error('AppError', error);
-    sentryMetrics.captureException(error);
+    Sentry.captureException(error, { tags: { source: 'AppErrorBoundary' } });
   }
 
   render() {

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

@@ -3,6 +3,7 @@
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 import React, { useEffect } from 'react';
+import * as Sentry from '@sentry/browser';
 import SettingsLayout from './SettingsLayout';
 import LoadingSpinner from 'fxa-react/components/LoadingSpinner';
 import AppErrorDialog from 'fxa-react/components/AppErrorDialog';
@@ -137,6 +138,7 @@ export const Settings = ({
 
   // This error check includes a network error
   if (error) {
+    Sentry.captureException(error, { tags: { source: 'settings' } });
     GleanMetrics.error.view({ event: { reason: error.message } });
     return <AppErrorDialog data-testid="error-dialog" {...{ error }} />;
   }