From cb84bf4c9b0439f12e3b3a7ce9486bbf10dfd923 Mon Sep 17 00:00:00 2001
From: Kira <kira+git@e621.net>
Date: Fri, 24 Sep 2021 20:32:07 -0700
Subject: [PATCH] [JS] Fix webpacker overriding babel config and setting loose

Loose does super dumb shit like converts spread operators to
[].concat() which is broken, incorrect, and not at all helpful.

Because this was forced in their base preset, it would break all
kinds of things that shouldn't have broken, and it would ignore the
project config explicitly.

This seems to fix the vast majority of the JS on the site, and the
generated code makes a lot more sense now.
---
 babel.config.js | 66 +++++++++++++++++++++----------------------------
 package.json    |  6 +----
 yarn.lock       |  5 ++++
 3 files changed, 34 insertions(+), 43 deletions(-)

diff --git a/babel.config.js b/babel.config.js
index ccdc12be8..487c2374e 100644
--- a/babel.config.js
+++ b/babel.config.js
@@ -1,63 +1,53 @@
-module.exports = function(api) {
+module.exports = function (api) {
   var validEnv = ['development', 'test', 'production']
   var currentEnv = api.env()
   var isDevelopmentEnv = api.env('development')
   var isProductionEnv = api.env('production')
   var isTestEnv = api.env('test')
+  const { moduleExists } = require('@rails/webpacker')
 
   if (!validEnv.includes(currentEnv)) {
     throw new Error(
       'Please specify a valid `NODE_ENV` or ' +
-        '`BABEL_ENV` environment variables. Valid values are "development", ' +
-        '"test", and "production". Instead, received: ' +
-        JSON.stringify(currentEnv) +
-        '.'
+      '`BABEL_ENV` environment variables. Valid values are "development", ' +
+      '"test", and "production". Instead, received: ' +
+      JSON.stringify(currentEnv) +
+      '.'
     )
   }
 
   return {
     presets: [
-      isTestEnv && [
-        require('@babel/preset-env').default,
+      isTestEnv && ['@babel/preset-env', { targets: { node: 'current' } }],
+      (isProductionEnv || isDevelopmentEnv) && [
+        '@babel/preset-env',
         {
-          targets: {
-            node: 'current'
-          }
+          useBuiltIns: 'entry',
+          corejs: '3.8',
+          modules: 'auto',
+          bugfixes: true,
+          exclude: ['transform-typeof-symbol']
         }
       ],
-      (isProductionEnv || isDevelopmentEnv) && [
-        require('@babel/preset-env').default,
+      moduleExists('@babel/preset-typescript') && [
+        '@babel/preset-typescript',
+        { allExtensions: true, isTSX: true }
+      ],
+      moduleExists('@babel/preset-react') && [
+        '@babel/preset-react',
         {
-          forceAllTransforms: true,
-          useBuiltIns: 'entry',
-          corejs: 3,
-          modules: false,
-          exclude: ['transform-typeof-symbol']
+          development: isDevelopmentEnv || isTestEnv,
+          useBuiltIns: true
         }
       ]
     ].filter(Boolean),
     plugins: [
-      require('babel-plugin-macros'),
-      require('@babel/plugin-syntax-dynamic-import').default,
-      isTestEnv && require('babel-plugin-dynamic-import-node'),
-      require('@babel/plugin-transform-destructuring').default,
-      ["@babel/plugin-proposal-class-properties", { loose: true }],
-      ["@babel/plugin-proposal-private-property-in-object", { "loose": true }],
-      ["@babel/plugin-proposal-private-methods", { "loose": true }],
-      ['@babel/plugin-proposal-object-rest-spread', {useBuiltIns: true}],
-      [
-        require('@babel/plugin-transform-runtime').default,
-        {
-          helpers: false,
-          regenerator: true,
-          corejs: false
-        }
-      ],
-      [
-        require('@babel/plugin-transform-regenerator').default,
-        {
-          async: false
-        }
+      ['@babel/plugin-proposal-class-properties', { loose: true }],
+      ['@babel/plugin-transform-runtime', { helpers: false }],
+      isProductionEnv &&
+      moduleExists('babel-plugin-transform-react-remove-prop-types') && [
+        'babel-plugin-transform-react-remove-prop-types',
+        { removeImport: true }
       ]
     ].filter(Boolean)
   }
diff --git a/package.json b/package.json
index 919296ad7..ecbdcb38e 100644
--- a/package.json
+++ b/package.json
@@ -4,6 +4,7 @@
   "dependencies": {
     "@rails/webpacker": "^6.0.0-rc.5",
     "babel-plugin-macros": "^3.1.0",
+    "core-js": "3.8",
     "css-loader": "^6.3.0",
     "css-minimizer-webpack-plugin": "^3.0.2",
     "jquery-ui": "^1.12.1",
@@ -23,11 +24,6 @@
     "zingtouch": "^1.0.6"
   },
   "version": "0.1.0",
-  "babel": {
-    "presets": [
-      "./node_modules/@rails/webpacker/package/babel/preset.js"
-    ]
-  },
   "devDependencies": {
     "webpack-dev-server": "^4.2.1"
   }
diff --git a/yarn.lock b/yarn.lock
index bdbee0352..ecb59cda1 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1831,6 +1831,11 @@ core-js-compat@^3.14.0, core-js-compat@^3.16.0:
     browserslist "^4.16.7"
     semver "7.0.0"
 
+core-js@3.8:
+  version "3.8.3"
+  resolved "https://registry.yarnpkg.com/core-js/-/core-js-3.8.3.tgz#c21906e1f14f3689f93abcc6e26883550dd92dd0"
+  integrity sha512-KPYXeVZYemC2TkNEkX/01I+7yd+nX3KddKwZ1Ww7SKWdI2wQprSgLmrTddT8nw92AjEklTsPBoSdQBhbI1bQ6Q==
+
 core-util-is@~1.0.0:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/core-util-is/-/core-util-is-1.0.3.tgz#a6042d3634c2b27e9328f837b965fac83808db85"