feat: Add name to the Reanimated Plugin (#6705)

## Summary

Babel plugin can have names. Plugin will now be named `reanimated`
instead of `node_modules/react-native-reanimated/plugin/index.js`.

Cleaning some files as a bonus.

## Test plan

🚀

packages/react-native-reanimated/plugin/src/globals.ts

@@ -1,3 +1,5 @@
+import type { ReanimatedPluginPass } from './types';
+
 const notCapturedIdentifiers = [
   // Based on https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects
 
@@ -152,6 +154,12 @@ const notCapturedIdentifiers_DEPRECATED = [
   '_getAnimationTimestamp',
 ];
 
+export function initializeState(state: ReanimatedPluginPass) {
+  state.workletNumber = 1;
+  initializeGlobals();
+  addCustomGlobals(state);
+}
+
 export const defaultGlobals = new Set(
   notCapturedIdentifiers.concat(notCapturedIdentifiers_DEPRECATED)
 );
@@ -161,3 +169,23 @@ export let globals: Set<string>;
 export function initializeGlobals() {
   globals = new Set(defaultGlobals);
 }
+
+/**
+ * This function allows to add custom globals such as host-functions. Those
+ * globals have to be passed as an argument for the plugin in babel.config.js.
+ *
+ * For example:
+ *
+ * ```js
+ * plugins: [
+ *   ['react-native-reanimated/plugin', { globals: ['myHostFunction'] }],
+ * ];
+ * ```
+ */
+export function addCustomGlobals(state: ReanimatedPluginPass) {
+  if (state.opts && Array.isArray(state.opts.globals)) {
+    state.opts.globals.forEach((name: string) => {
+      globals.add(name);
+    });
+  }
+}

packages/react-native-reanimated/plugin/src/plugin.ts

@@ -10,16 +10,15 @@ import {
   processCalleesAutoworkletizableCallbacks,
   processIfAutoworkletizableCallback,
 } from './autoworkletization';
+import { processIfWorkletClass } from './class';
 import { processIfWorkletContextObject } from './contextObject';
 import { processIfWorkletFile } from './file';
-import { initializeGlobals } from './globals';
+import { initializeState } from './globals';
 import { processInlineStylesWarning } from './inlineStylesWarning';
 import type { ReanimatedPluginPass } from './types';
 import { WorkletizableFunction } from './types';
-import { addCustomGlobals } from './utils';
 import { substituteWebCallExpression } from './webOptimization';
 import { processIfWithWorkletDirective } from './workletSubstitution';
-import { processIfWorkletClass } from './class';
 
 module.exports = function (): PluginItem {
   function runWithTaggedExceptions(fun: () => void) {
@@ -31,12 +30,11 @@ module.exports = function (): PluginItem {
   }
 
   return {
-    pre(state: ReanimatedPluginPass) {
+    name: 'reanimated',
+
+    pre(this: ReanimatedPluginPass) {
       runWithTaggedExceptions(() => {
-        // Initialize worklet number.
-        state.workletNumber = 1;
-        initializeGlobals();
-        addCustomGlobals.call(this);
+        initializeState(this);
       });
     },
     visitor: {
@@ -78,8 +76,6 @@ module.exports = function (): PluginItem {
       Program: {
         enter(path: NodePath<Program>, state: ReanimatedPluginPass) {
           runWithTaggedExceptions(() => {
-            // Reset worklet number.
-            state.workletNumber = 1;
             processIfWorkletFile(path, state);
           });
         },

packages/react-native-reanimated/plugin/src/types.ts

@@ -31,10 +31,7 @@ export interface ReanimatedPluginPass {
   opts: ReanimatedPluginOptions;
   cwd: string;
   filename: string | undefined;
-  get(key: unknown): unknown;
-  set(key: unknown, value: unknown): void;
   workletNumber: number;
-  [key: string]: unknown;
 }
 
 export type WorkletizableFunction =

packages/react-native-reanimated/plugin/src/utils.ts

@@ -7,8 +7,6 @@ import {
   variableDeclaration,
   variableDeclarator,
 } from '@babel/types';
-import { globals } from './globals';
-import type { ReanimatedPluginPass } from './types';
 
 export function isRelease() {
   const pattern = /(prod|release|stag[ei])/i;
@@ -18,26 +16,6 @@ export function isRelease() {
   );
 }
 
-/**
- * This function allows to add custom globals such as host-functions. Those
- * globals have to be passed as an argument for the plugin in babel.config.js.
- *
- * For example:
- *
- * ```js
- * plugins: [
- *   ['react-native-reanimated/plugin', { globals: ['myHostFunction'] }],
- * ];
- * ```
- */
-export function addCustomGlobals(this: ReanimatedPluginPass) {
-  if (this.opts && Array.isArray(this.opts.globals)) {
-    this.opts.globals.forEach((name: string) => {
-      globals.add(name);
-    });
-  }
-}
-
 /**
  * This function replaces the node with a factory call while making sure that
  * it's a legal operation. If the node cannot be simply replaced with a factory