replacement + fix

cmss13-devs · Apr 26, 2024 · 213cef1 · 213cef1
1 parent 0a0e85e
commit 213cef1
Show file tree

Hide file tree

Showing 15 changed files with 626 additions and 1,600 deletions.
diff --git a/tgui/.swcrc b/tgui/.swcrc
@@ -0,0 +1,15 @@
+{
+  "$schema": "https://json.schemastore.org/swcrc",
+  "jsc": {
+    "loose": true,
+    "parser": {
+      "syntax": "typescript",
+      "tsx": true
+    },
+    "transform": {
+      "react": {
+        "runtime": "automatic"
+      }
+    }
+  }
+}
diff --git a/tgui/babel.config.js b/tgui/babel.config.js
diff --git a/tgui/jest.config.js b/tgui/jest.config.js
@@ -8,7 +8,7 @@ module.exports = {
   testEnvironment: 'jsdom',
   testRunner: require.resolve('jest-circus/runner'),
   transform: {
-    '^.+\\.(js|cjs|ts|tsx)$': require.resolve('babel-jest'),
+    '^.+\\.(js|cjs|ts|tsx)$': require.resolve('@swc/jest'),
   },
   moduleFileExtensions: ['js', 'cjs', 'ts', 'tsx', 'json'],
   resetMocks: true,

diff --git a/tgui/package.json b/tgui/package.json
@@ -20,24 +20,16 @@
     "tgui:tsc": "tsc"
   },
   "dependencies": {
-    "@babel/core": "^7.15.0",
-    "@babel/eslint-parser": "^7.15.0",
-    "@babel/plugin-transform-class-properties": "^7.23.3",
-    "@babel/plugin-transform-jscript": "^7.14.5",
-    "@babel/preset-env": "^7.15.0",
-    "@babel/preset-react": "^7.23.3",
-    "@babel/preset-typescript": "^7.15.0",
+    "@swc/core": "^1.5.0",
+    "@swc/jest": "^0.2.36",
     "@types/jest": "^27.0.1",
     "@types/jsdom": "^16.2.13",
     "@types/node": "^14.17.9",
     "@types/webpack": "^5.28.0",
     "@types/webpack-env": "^1.16.2",
     "@typescript-eslint/parser": "^4.29.1",
-    "babel-jest": "^27.0.6",
-    "babel-loader": "^8.2.2",
-    "babel-plugin-transform-remove-console": "^6.9.4",
-    "common": "workspace:*",
     "css-loader": "^5.2.7",
+    "esbuild-loader": "^4.1.0",
     "eslint": "^7.32.0",
     "eslint-config-prettier": "^8.5.0",
     "eslint-plugin-radar": "^0.2.1",
@@ -52,7 +44,7 @@
     "sass": "^1.37.5",
     "sass-loader": "^11.1.1",
     "style-loader": "^2.0.0",
-    "terser-webpack-plugin": "^5.1.4",
+    "swc-loader": "^0.2.6",
     "typescript": "^4.9.4",
     "url-loader": "^4.1.1",
     "webpack": "^5.75.0",

diff --git a/tgui/packages/tgui/components/Button.jsx b/tgui/packages/tgui/components/Button.jsx
@@ -5,7 +5,7 @@
  */
 
 import { KEY_ENTER, KEY_ESCAPE, KEY_SPACE } from 'common/keycodes';
-import { classes, pureComponentHooks } from 'common/react';
+import { classes } from 'common/react';
 import { Component, createRef } from 'react';
 import { createLogger } from '../logging';
 import { Box, computeBoxClassName, computeBoxProps } from './Box';
@@ -134,8 +134,6 @@ export const Button = (props) => {
   return buttonContent;
 };
 
-Button.defaultHooks = pureComponentHooks;
-
 export const ButtonCheckbox = (props) => {
   const { checked, ...rest } = props;
   return (

diff --git a/tgui/packages/tgui/components/Chart.jsx b/tgui/packages/tgui/components/Chart.jsx
@@ -5,7 +5,6 @@
  */
 
 import { map, zipWith } from 'common/collections';
-import { pureComponentHooks } from 'common/react';
 import { Component, createRef } from 'react';
 import { Box } from './Box';
 
@@ -117,8 +116,6 @@ class LineChart extends Component {
   }
 }
 
-LineChart.defaultHooks = pureComponentHooks;
-
 const Stub = (props) => null;
 
 // IE8: No inline svg support

diff --git a/tgui/packages/tgui/components/ColorBox.jsx b/tgui/packages/tgui/components/ColorBox.jsx
@@ -4,7 +4,7 @@
  * @license MIT
  */
 
-import { classes, pureComponentHooks } from 'common/react';
+import { classes } from 'common/react';
 import { computeBoxClassName, computeBoxProps } from './Box';
 
 export const ColorBox = (props) => {
@@ -27,5 +27,3 @@ export const ColorBox = (props) => {
     </div>
   );
 };
-
-ColorBox.defaultHooks = pureComponentHooks;
diff --git a/tgui/packages/tgui/components/DraggableControl.jsx b/tgui/packages/tgui/components/DraggableControl.jsx
@@ -5,7 +5,6 @@
  */
 
 import { clamp } from 'common/math';
-import { pureComponentHooks } from 'common/react';
 import { Component, createRef } from 'react';
 import { AnimatedNumber } from './AnimatedNumber';
 
@@ -276,7 +275,6 @@ export class DraggableControl extends Component {
   }
 }
 
-DraggableControl.defaultHooks = pureComponentHooks;
 DraggableControl.defaultProps = {
   minValue: -Infinity,
   maxValue: +Infinity,

diff --git a/tgui/packages/tgui/components/Grid.jsx b/tgui/packages/tgui/components/Grid.jsx
@@ -5,7 +5,6 @@
  */
 
 import { Table } from './Table';
-import { pureComponentHooks } from 'common/react';
 
 /** @deprecated */
 export const Grid = (props) => {
@@ -17,8 +16,6 @@ export const Grid = (props) => {
   );
 };
 
-Grid.defaultHooks = pureComponentHooks;
-
 /** @deprecated */
 export const GridColumn = (props) => {
   const { size = 1, style, ...rest } = props;
@@ -33,6 +30,4 @@ export const GridColumn = (props) => {
   );
 };
 
-Grid.defaultHooks = pureComponentHooks;
-
 Grid.Column = GridColumn;
diff --git a/tgui/packages/tgui/components/Icon.jsx b/tgui/packages/tgui/components/Icon.jsx
@@ -6,7 +6,7 @@
  * @license MIT
  */
 
-import { classes, pureComponentHooks } from 'common/react';
+import { classes } from 'common/react';
 import { computeBoxClassName, computeBoxProps } from './Box';
 
 const FA_OUTLINE_REGEX = /-o$/;
@@ -55,8 +55,6 @@ export const Icon = (props) => {
   );
 };
 
-Icon.defaultHooks = pureComponentHooks;
-
 export const IconStack = (props) => {
   const { className, children, ...rest } = props;
   return (

diff --git a/tgui/packages/tgui/components/NoticeBox.jsx b/tgui/packages/tgui/components/NoticeBox.jsx
@@ -4,7 +4,7 @@
  * @license MIT
  */
 
-import { classes, pureComponentHooks } from 'common/react';
+import { classes } from 'common/react';
 import { Box } from './Box';
 
 export const NoticeBox = (props) => {
@@ -23,5 +23,3 @@ export const NoticeBox = (props) => {
     />
   );
 };
-
-NoticeBox.defaultHooks = pureComponentHooks;
diff --git a/tgui/packages/tgui/components/Table.jsx b/tgui/packages/tgui/components/Table.jsx
@@ -4,7 +4,7 @@
  * @license MIT
  */
 
-import { classes, pureComponentHooks } from 'common/react';
+import { classes } from 'common/react';
 import { computeBoxClassName, computeBoxProps } from './Box';
 
 export const Table = (props) => {
@@ -23,8 +23,6 @@ export const Table = (props) => {
   );
 };
 
-Table.defaultHooks = pureComponentHooks;
-
 export const TableRow = (props) => {
   const { className, header, ...rest } = props;
   return (
@@ -40,8 +38,6 @@ export const TableRow = (props) => {
   );
 };
 
-TableRow.defaultHooks = pureComponentHooks;
-
 export const TableCell = (props) => {
   const { className, collapsing, header, ...rest } = props;
   return (
@@ -58,7 +54,5 @@ export const TableCell = (props) => {
   );
 };
 
-TableCell.defaultHooks = pureComponentHooks;
-
 Table.Row = TableRow;
 Table.Cell = TableCell;
diff --git a/tgui/public/tgui-panel.bundle.css b/tgui/public/tgui-panel.bundle.css
diff --git a/tgui/webpack.config.js b/tgui/webpack.config.js
@@ -7,7 +7,6 @@
 const webpack = require('webpack');
 const path = require('path');
 const ExtractCssPlugin = require('mini-css-extract-plugin');
-const { createBabelConfig } = require('./babel.config.js');
 
 const createStats = (verbose) => ({
   assets: verbose,
@@ -33,18 +32,9 @@ module.exports = (env = {}, argv) => {
     context: path.resolve(__dirname),
     target: ['web', 'es3', 'browserslist:ie 8'],
     entry: {
-      'tgui': [
-        './packages/tgui-polyfill',
-        './packages/tgui',
-      ],
-      'tgui-panel': [
-        './packages/tgui-polyfill',
-        './packages/tgui-panel',
-      ],
-      'tgui-say': [
-        './packages/tgui-polyfill',
-        './packages/tgui-say',
-      ],
+      'tgui': ['./packages/tgui-polyfill', './packages/tgui'],
+      'tgui-panel': ['./packages/tgui-polyfill', './packages/tgui-panel'],
+      'tgui-say': ['./packages/tgui-polyfill', './packages/tgui-say'],
     },
     output: {
       path: argv.useTmpFolder
@@ -61,13 +51,10 @@ module.exports = (env = {}, argv) => {
     module: {
       rules: [
         {
-          test: /\.(js|jsx|cjs|ts|tsx)$/,
+          test: /\.([tj]s(x)?|cjs)$/,
           use: [
             {
-              loader: require.resolve('babel-loader'),
-              options: createBabelConfig({
-                removeConsole: !bench,
-              }),
+              loader: require.resolve('swc-loader'),
             },
           ],
         },
@@ -143,17 +130,11 @@ module.exports = (env = {}, argv) => {
 
   // Production build specific options
   if (mode === 'production') {
-    const TerserPlugin = require('terser-webpack-plugin');
+    const { EsbuildPlugin } = require('esbuild-loader');
     config.optimization.minimizer = [
-      new TerserPlugin({
-        extractComments: false,
-        terserOptions: {
-          ie8: true,
-          output: {
-            ascii_only: true,
-            comments: false,
-          },
-        },
+      new EsbuildPlugin({
+        target: 'ie8',
+        css: true,
       }),
     ];
   }