MM-52539 Unify versions of Babel used throughout web app and remove unneeded libraries (#23543)

* Remove unneeded Babel plugins and update Babel preset

* Remove unneeded babel/cli package

* Update and share Babel and presets

* Update and share babel-plugin-styled-components

* Update and share babel-plugin-formatjs

* Update and share babel-plugin-typescript-to-proptypes

* Update and share babel-loader

* Remove all Babel-related ESLint libraries

* Remove unused babel-jest from Playbooks

* MM-51968 Remove unused Babel libraries from Boards

* Update snapshots because of course I have to

* Update snapshot

webapp/boards/.eslintrc.json

@@ -4,7 +4,6 @@
   ],
   "plugins": [
     "react",
-    "babel",
     "import",
     "no-only-tests",
     "header",

webapp/boards/package.json

@@ -63,17 +63,6 @@
 		"trim-newlines": "^4.0.2"
 	},
 	"devDependencies": {
-		"@babel/cli": "7.17.6",
-		"@babel/core": "7.17.8",
-		"@babel/plugin-proposal-class-properties": "7.16.7",
-		"@babel/plugin-proposal-object-rest-spread": "7.17.3",
-		"@babel/plugin-proposal-optional-chaining": "7.16.7",
-		"@babel/plugin-syntax-dynamic-import": "7.8.3",
-		"@babel/polyfill": "7.10.4",
-		"@babel/preset-env": "7.16.11",
-		"@babel/preset-react": "7.16.7",
-		"@babel/preset-typescript": "7.16.7",
-		"@babel/runtime": "7.17.8",
 		"@formatjs/cli": "^4.8.2",
 		"@formatjs/ts-transformer": "^3.9.2",
 		"@swc/core": "1.3.40",
@@ -100,9 +89,7 @@
 		"@types/redux-mock-store": "1.0.3",
 		"@typescript-eslint/eslint-plugin": "5.57.1",
 		"@typescript-eslint/parser": "5.57.1",
-		"babel-eslint": "10.1.0",
 		"eslint-import-resolver-webpack": "0.13.2",
-		"eslint-plugin-babel": "^5.3.1",
 		"eslint-plugin-eslint-comments": "3.2.0",
 		"eslint-plugin-formatjs": "4.9.0",
 		"eslint-plugin-header": "3.1.1",

webapp/channels/.eslintrc.json

@@ -5,7 +5,6 @@
     "plugin:react-hooks/recommended"
   ],
   "plugins": [
-    "@babel",
     "mattermost",
     "import",
     "no-only-tests",
@@ -35,7 +34,6 @@
     "import/no-duplicates": 2,
     "max-nested-callbacks": ["error", 10],
     "no-unused-expressions": 0,
-    "@babel/no-unused-expressions": 2,
     "eol-last": ["error", "always"],
     "import/no-unresolved": 2,
     "import/order": [

webapp/channels/babel.config.js

@@ -5,14 +5,12 @@ const config = {
     presets: [
         ['@babel/preset-env', {
             targets: {
-                chrome: 66,
+                chrome: 110,
-                firefox: 60,
+                firefox: 102,
-                edge: 42,
+                edge: 110,
-                safari: 12,
+                safari: 16,
             },
-            modules: 'auto',
             corejs: 3,
-            debug: false,
             useBuiltIns: 'usage',
             shippedProposals: true,
         }],
@@ -26,8 +24,6 @@ const config = {
     ],
     plugins: [
         'lodash',
-        '@babel/plugin-proposal-class-properties',
-        '@babel/plugin-proposal-object-rest-spread',
         'react-hot-loader/babel',
         'babel-plugin-typescript-to-proptypes',
         [

webapp/channels/package.json

@@ -99,15 +99,6 @@
     "zen-observable": "0.9.0"
   },
   "devDependencies": {
-    "@babel/cli": "7.16.0",
-    "@babel/core": "7.16.0",
-    "@babel/eslint-parser": "7.19.1",
-    "@babel/eslint-plugin": "7.19.1",
-    "@babel/plugin-proposal-class-properties": "7.16.0",
-    "@babel/plugin-proposal-object-rest-spread": "7.16.0",
-    "@babel/preset-env": "7.16.4",
-    "@babel/preset-react": "7.16.0",
-    "@babel/preset-typescript": "7.16.0",
     "@deanwhillier/jest-matchmedia-mock": "1.2.0",
     "@hot-loader/react-dom": "17.0.2",
     "@redux-devtools/extension": "3.2.3",
@@ -147,10 +138,7 @@
     "@types/webpack-env": "1.18.0",
     "@typescript-eslint/eslint-plugin": "5.57.1",
     "@typescript-eslint/parser": "5.57.1",
-    "babel-loader": "8.2.3",
     "babel-plugin-lodash": "3.3.4",
-    "babel-plugin-styled-components": "1.12.0",
-    "babel-plugin-typescript-to-proptypes": "1.4.2",
     "bundle-loader": "0.2.0",
     "copy-webpack-plugin": "11.0.0",
     "dotenv-webpack": "8.0.1",

webapp/channels/src/components/add_user_to_channel_modal/__snapshots__/add_user_to_channel_modal.test.tsx.snap

@@ -89,7 +89,6 @@ exports[`components/AddUserToChannelModal should match snapshot 1`] = `
                 "latestComplete": true,
                 "latestPrefix": "",
                 "requestStarted": false,
-                "triggerCharacter": undefined,
               },
             ]
           }

webapp/channels/src/components/create_team/__snapshots__/create_team.test.tsx.snap

@@ -2,7 +2,7 @@
 
 exports[`component/create_team should match snapshot default 1`] = `
 <div>
-  <Connect(_class) />
+  <Connect(Component) />
   <BackButton
     url="/undefined/channels/undefined"
   />

webapp/channels/src/components/quick_switch_modal/__snapshots__/quick_switch_modal.test.tsx.snap

@@ -90,7 +90,6 @@ exports[`components/QuickSwitchModal should match snapshot 1`] = `
               "latestComplete": true,
               "latestPrefix": "",
               "requestStarted": false,
-              "triggerCharacter": undefined,
             },
           ]
         }

webapp/channels/src/components/root/__snapshots__/root.test.tsx.snap

@@ -91,7 +91,7 @@ exports[`components/Root Routes Should mount public product routes 1`] = `
       theme={Object {}}
     >
       <Connect(ModalController) />
-      <Connect(_class) />
+      <Connect(Component) />
       <Connect(SystemNotice) />
       <GlobalHeader />
       <CloudEffectsWrapper />

webapp/channels/src/components/select_team/__snapshots__/select_team.test.tsx.snap

@@ -2,7 +2,7 @@
 
 exports[`components/select_team/SelectTeam should match snapshot 1`] = `
 <div>
-  <Connect(_class) />
+  <Connect(Component) />
   <BackButton
     url="/"
   />
@@ -114,7 +114,7 @@ exports[`components/select_team/SelectTeam should match snapshot 1`] = `
 
 exports[`components/select_team/SelectTeam should match snapshot, on create team restricted 1`] = `
 <div>
-  <Connect(_class) />
+  <Connect(Component) />
   <BackButton
     url="/"
   />
@@ -198,7 +198,7 @@ exports[`components/select_team/SelectTeam should match snapshot, on create team
 
 exports[`components/select_team/SelectTeam should match snapshot, on error 1`] = `
 <div>
-  <Connect(_class) />
+  <Connect(Component) />
   <BackButton
     onClick={[Function]}
     url="/"
@@ -287,7 +287,7 @@ exports[`components/select_team/SelectTeam should match snapshot, on error 1`] =
 
 exports[`components/select_team/SelectTeam should match snapshot, on loading 1`] = `
 <div>
-  <Connect(_class) />
+  <Connect(Component) />
   <BackButton
     url="/"
   />
@@ -363,7 +363,7 @@ exports[`components/select_team/SelectTeam should match snapshot, on loading 1`]
 
 exports[`components/select_team/SelectTeam should match snapshot, on no joinable team and is not system admin nor can create team 1`] = `
 <div>
-  <Connect(_class) />
+  <Connect(Component) />
   <BackButton
     url="/"
   />
@@ -496,7 +496,7 @@ exports[`components/select_team/SelectTeam should match snapshot, on no joinable
 
 exports[`components/select_team/SelectTeam should match snapshot, on no joinable team and user is guest 1`] = `
 <div>
-  <Connect(_class) />
+  <Connect(Component) />
   <BackButton
     url="/"
   />
@@ -587,7 +587,7 @@ exports[`components/select_team/SelectTeam should match snapshot, on no joinable
 
 exports[`components/select_team/SelectTeam should match snapshot, on no joinable team but can create team 1`] = `
 <div>
-  <Connect(_class) />
+  <Connect(Component) />
   <BackButton
     url="/"
   />

webapp/package.json

@@ -21,6 +21,14 @@
     "react-intl": "6.3.2"
   },
   "devDependencies": {
+    "@babel/core": "7.21.8",
+    "@babel/preset-env": "7.21.5",
+    "@babel/preset-react": "7.18.6",
+    "@babel/preset-typescript": "7.21.5",
+    "babel-loader": "9.1.2",
+    "babel-plugin-formatjs": "10.5.1",
+    "babel-plugin-styled-components": "2.1.1",
+    "babel-plugin-typescript-to-proptypes": "2.1.0",
     "blessed": "0.1.81",
     "chalk": "4.1.2",
     "concurrently": "7.6.0",

webapp/platform/components/package.json

@@ -12,12 +12,7 @@
     "clean": "rm -rf dist node_modules tsconfig.tsbuildinfo .rollup.cache"
   },
   "devDependencies": {
-    "@babel/cli": "^7.17.6",
-    "@babel/core": "^7.17.7",
     "@babel/plugin-transform-runtime": "^7.17.0",
-    "@babel/preset-env": "^7.16.11",
-    "@babel/preset-react": "^7.16.7",
-    "@babel/preset-typescript": "^7.16.7",
     "@rollup/plugin-babel": "^5.3.1",
     "@rollup/plugin-commonjs": "^21.0.2",
     "@rollup/plugin-node-resolve": "^13.1.3",
@@ -29,9 +24,6 @@
     "@types/react-redux": "^7.1.21",
     "@types/shallow-equals": "^1.0.0",
     "@types/styled-components": "^5.1.19",
-    "babel-loader": "^8.2.3",
-    "babel-plugin-formatjs": "10.3.14",
-    "babel-plugin-styled-components": "^2.0.6",
     "css-loader": "^6.7.1",
     "rollup": "^2.75.7",
     "rollup-plugin-auto-external": "^2.0.0",

webapp/playbooks/babel.config.js

@@ -5,14 +5,12 @@ const config = {
     presets: [
         ['@babel/preset-env', {
             targets: {
-                chrome: 66,
+                chrome: 110,
-                firefox: 60,
+                firefox: 102,
-                edge: 42,
+                edge: 110,
-                safari: 12,
+                safari: 16,
             },
-            modules: 'auto',
             corejs: 3,
-            debug: false,
             useBuiltIns: 'usage',
             shippedProposals: true,
         }],
@@ -25,10 +23,6 @@ const config = {
         }],
     ],
     plugins: [
-        '@babel/plugin-proposal-class-properties',
-        '@babel/plugin-syntax-dynamic-import',
-        '@babel/proposal-object-rest-spread',
-        '@babel/plugin-proposal-optional-chaining',
         'babel-plugin-typescript-to-proptypes',
         'babel-plugin-add-react-displayname',
         [

webapp/playbooks/package.json

@@ -40,14 +40,6 @@
     "typescript": "4.7.4"
   },
   "devDependencies": {
-    "@babel/core": "7.16.7",
-    "@babel/plugin-proposal-class-properties": "7.16.7",
-    "@babel/plugin-proposal-object-rest-spread": "7.16.7",
-    "@babel/plugin-proposal-optional-chaining": "7.16.7",
-    "@babel/plugin-syntax-dynamic-import": "7.8.3",
-    "@babel/preset-env": "7.16.7",
-    "@babel/preset-react": "7.16.7",
-    "@babel/preset-typescript": "7.16.7",
     "@formatjs/cli": "4.7.0",
     "@graphql-codegen/cli": "2.16.3",
     "@graphql-codegen/client-preset": "1.2.5",
@@ -76,13 +68,7 @@
     "@typescript-eslint/eslint-plugin": "5.57.1",
     "@typescript-eslint/parser": "5.57.1",
     "@webpack-cli/serve": "1.6.0",
-    "babel-eslint": "10.1.0",
-    "babel-jest": "27.4.6",
-    "babel-loader": "8.2.3",
     "babel-plugin-add-react-displayname": "0.0.5",
-    "babel-plugin-formatjs": "10.3.14",
-    "babel-plugin-styled-components": "2.0.2",
-    "babel-plugin-typescript-to-proptypes": "2.0.0",
     "classnames": "2.3.1",
     "eslint-import-resolver-webpack": "0.13.2",
     "eslint-plugin-import": "2.25.4",