feat(plugins): Add Babel plugin to annotate frontend with React component names (#59156)

babel.config.ts

@@ -44,12 +44,14 @@ const config: TransformOptions = {
           },
         ],
         ['babel-plugin-add-react-displayname'],
+        ['@fullstory/babel-plugin-annotate-react'],
       ],
     },
     development: {
       plugins: [
         '@emotion/babel-plugin',
         '@babel/plugin-transform-react-jsx-source',
+        ['@fullstory/babel-plugin-annotate-react'],
         ...(process.env.SENTRY_UI_HOT_RELOAD ? ['react-refresh/babel'] : []),
       ],
     },

package.json

@@ -23,6 +23,7 @@
     "@emotion/css": "^11.10.5",
     "@emotion/react": "^11.10.5",
     "@emotion/styled": "^11.10.5",
+    "@fullstory/babel-plugin-annotate-react": "^2.3.0",
     "@monaco-editor/react": "^4.4.5",
     "@popperjs/core": "^2.11.5",
     "@react-aria/button": "^3.7.2",

yarn.lock

@@ -1467,6 +1467,11 @@
   dependencies:
     tslib "^2.4.0"
 
+"@fullstory/babel-plugin-annotate-react@^2.3.0":
+  version "2.3.0"
+  resolved "https://registry.yarnpkg.com/@fullstory/babel-plugin-annotate-react/-/babel-plugin-annotate-react-2.3.0.tgz#ab4df27dbecaa3771a1b353b898ccf887876e9fb"
+  integrity sha512-gYLUL6Tu0exbvTIhK9nSCaztmqBlQAm07Fvtl/nKTc+lxwFkcX9vR8RrdTbyjJZKbPaA5EMlExQ6GeLCXkfm5g==
+
 "@gar/promisify@^1.1.3":
   version "1.1.3"
   resolved "https://registry.yarnpkg.com/@gar/promisify/-/promisify-1.1.3.tgz#555193ab2e3bb3b6adc3d551c9c030d9e860daf6"