fix: remove react support

.babelrc.cjs

@@ -1,10 +0,0 @@
-module.exports = {
-  presets: [
-    [
-      "@babel/preset-react",
-    ],
-  ],
-  plugins: [
-    "@babel/plugin-transform-class-properties",
-  ],
-};

.eslintrc.cjs

@@ -13,9 +13,6 @@ module.exports = {
   extends: [
     "eslint:recommended",
     "plugin:@typescript-eslint/recommended",
-    "plugin:react/recommended",
-    "plugin:react/jsx-runtime",
-    "plugin:react-hooks/recommended",
   ],
   globals: {
     Atomics: "readonly",
@@ -33,14 +30,7 @@ module.exports = {
   },
   plugins: [
     "@typescript-eslint",
-    "react",
-    "react-hooks",
   ],
-  settings: {
-    react: {
-      version: "detect",
-    },
-  },
   rules: {
     "no-unreachable": "off",
     "quotes": [ "error", "double" ],
@@ -61,10 +51,6 @@ module.exports = {
     "@typescript-eslint/no-explicit-any": "off",
     "comma-dangle": ["error", "only-multiline"],
     "no-misleading-character-class": "off",
-    "react-hooks/rules-of-hooks": "error",
-    "react-hooks/exhaustive-deps": "error",
-    "react/react-in-jsx-scope": "off",
-    "react/prop-types": "off",
   },
   overrides: [
     {

assets/require.json

@@ -1,8 +1 @@
-[
-  {
-    "url": "https://unpkg.com/react@18/umd/react.development.js"
-  },
-  {
-    "url": "https://unpkg.com/react-dom@18/umd/react-dom.development.js"
-  }
-]
+[]

rollup.config.mjs

@@ -4,11 +4,7 @@ import pluginJson from "@rollup/plugin-json";
 import pluginHtml from "rollup-plugin-html";
 import pluginCss from "rollup-plugin-import-css";
 import pluginMarkdown from "@jackfranklin/rollup-plugin-markdown";
-import pluginReplace from "@rollup/plugin-replace";
-import pluginCJS from "rollup-plugin-commonjs";
-import pluginBabel from "@rollup/plugin-babel";
 import pluginExecute from "rollup-plugin-execute";
-
 import typescript from "typescript";
 
 const outputDir = "dist";
@@ -29,13 +25,8 @@ export default (/**@type {import("./src/types").RollupArgs}*/ args) => (async ()
   const config = {
     input: "src/index.ts",
     plugins: [
-      pluginReplace({
-        "process.env.NODE_ENV": JSON.stringify(mode),
-        ENVIRONMENT: JSON.stringify(mode),
-        preventAssignment: true,
-      }),
       pluginNodeResolve({
-        extensions: [".ts", ".tsx", ".mts", ".json"],
+        extensions: [".ts", ".mts", ".json"],
       }),
       pluginTypeScript({
         typescript,
@@ -47,15 +38,6 @@ export default (/**@type {import("./src/types").RollupArgs}*/ args) => (async ()
         output: "global.css",
       }),
       pluginMarkdown(),
-      pluginCJS({
-        include: [
-          "node_modules/**"
-        ],
-        exclude: [
-          "node_modules/process-es6/**"
-        ],
-      }),
-      pluginBabel({ babelHelpers: "bundled" }),
       pluginExecute([
         `npm run --silent post-build -- --mode=${mode} --branch=${branch} --host=${host} --suffix=${suffix}`,
         ...(mode === "development" ? ["npm run --silent invisible -- \"npm run tr-progress\""] : []),
@@ -66,11 +48,6 @@ export default (/**@type {import("./src/types").RollupArgs}*/ args) => (async ()
       format: "iife",
       sourcemap: mode === "development",
       compact: mode === "development",
-      banner: "\n/* global React, ReactDOM */",
-      globals: {
-        react: "React",
-        "react-dom": "ReactDOM",
-      },
     },
     onwarn(warning) {
       // ignore circular dependency warnings
@@ -79,7 +56,6 @@ export default (/**@type {import("./src/types").RollupArgs}*/ args) => (async ()
         console.error(`\x1b[33m(!)\x1b[0m ${message}\n`, rest);
       }
     },
-    external: id => /^react(-dom)?$/.test(id)
   };
 
   return config;

src/constants.ts

@@ -13,6 +13,12 @@ export const repo = "Sv443/BetterYTM";
 /** Which host the userscript was installed from */
 export const host = (hostRaw.match(/^#{{.+}}$/) ? "github" : hostRaw) as "github" | "greasyfork" | "openuserjs";
 
+export const platformNames: Record<typeof host, string> = {
+  github: "GitHub",
+  greasyfork: "GreasyFork",
+  openuserjs: "OpenUserJS",
+};
+
 /**
  * How much info should be logged to the devtools console  
  * 0 = Debug (show everything) or 1 = Info (show only important stuff)

src/dialogs/README.md

@@ -1,3 +1,3 @@
 ## Dialogs
 This directory contains the code of all the different dialog menus of the userscript.  
-All of these are built using React JSX and the BytmMenu class.  
+All of these are built using the BytmDialog class.  

src/dialogs/versionNotif.tsx → src/dialogs/versionNotif.ts

@@ -1,10 +1,8 @@
 import { host, scriptInfo } from "../constants";
-import { BytmMenu, t } from "../utils";
+import { BytmDialog, t } from "../utils";
 import pkg from "../../package.json" assert { type: "json" };
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
-import React from "react";
 
-let verNotifDialog: BytmMenu | null = null;
+let verNotifDialog: BytmDialog | null = null;
 
 export type VersionNotifDialogRenderProps = {
   latestTag: string;
@@ -15,7 +13,7 @@ export function getVersionNotifDialog({
   latestTag,
 }: VersionNotifDialogRenderProps) {
   if(!verNotifDialog) {
-    verNotifDialog = new BytmMenu({
+    verNotifDialog = new BytmDialog({
       id: "version-notif",
       closeOnBgClick: false,
       closeOnEscPress: false,

src/index.ts

@@ -57,7 +57,6 @@ import {
     `─ My song metadata API: ${geniUrlBase}`,
     "─ My userscript utility library: https://github.com/Sv443-Network/UserUtils",
     "─ This tiny event listener library: https://github.com/ai/nanoevents",
-    "─ The React library: https://github.com/facebook/react",
   ].join("\n"));
   console.log();
 }

src/menu/README.md

@@ -1,4 +1,4 @@
 ## Menu
 This directory contains the code of all the different menus of the userscript.  
-Some of them are built with JS directly (with `document.createElement()`) and some are built using React JSX.  
-In the long term all of these will be built and rendered using React JSX and put in the `dialogs` directory.
+All of them are jankily built with JS directly (with `document.createElement()`) and there's lots of repeated code.  
+In the long term all of these will be built with the BytmDialog class and put in the `dialogs` directory.

src/menu/__DEPRECATED.txt

@@ -1,3 +1,2 @@
-The files in this folder are to be slowly migrated to use React JSX and the BytmMenu class.
-They will end up in the new "dialogs" folder.
-No more menus should be created in here.
+The files in this folder are to be slowly migrated to use the BytmDialog class.
+They will end up in the new "dialogs" folder and so no more menus should be created in here.

src/tools/post-build.ts

@@ -149,11 +149,6 @@ I welcome every contribution on GitHub!
     else
       userscript = userscript.replace(/sourceMappingURL=/gm, `sourceMappingURL=http://localhost:${devServerPort}/`);
 
-    // replace with arrow IIFE
-    userscript = userscript.replace(/\(function\s?\(ReactDOM,\s?React\)\s?\{/m, "((ReactDOM, React) => {");
-    userscript = userscript.replace(/\(function\s?\(\s*\)\s?\{/m, "(() => {");
-    userscript = userscript.replace(/\(function \(reactDom, React\) \{/m, "((reactDOM, React) => {");
-
     // insert userscript header and final newline
     const finalUserscript = `${header}\n${userscript}${userscript.endsWith("\n") ? "" : "\n"}`;
 

src/utils/BytmMenu.tsx → src/utils/BytmDialog.ts

@@ -28,7 +28,7 @@ export interface BytmMenuOptions {
 let lastMenuId: string | null = null;
 
 /** Creates and manages a modal menu element */
-export class BytmMenu extends NanoEmitter<{
+export class BytmDialog extends NanoEmitter<{
   /** Emitted just after the menu is closed */
   close: () => void;
   /** Emitted just after the menu is opened */
@@ -163,7 +163,7 @@ export class BytmMenu extends NanoEmitter<{
     menuBg.style.display = "none";
     menuBg.inert = true;
 
-    if(BytmMenu.getLastMenuId() === this.id)
+    if(BytmDialog.getLastMenuId() === this.id)
       lastMenuId = null;
 
     this.events.emit("close");
@@ -209,7 +209,7 @@ export class BytmMenu extends NanoEmitter<{
 
     if(this.options.closeOnEscPress) {
       document.body.addEventListener("keydown", (e) => {
-        if(e.key === "Escape" && this.isOpen() && BytmMenu.getLastMenuId() === this.id)
+        if(e.key === "Escape" && this.isOpen() && BytmDialog.getLastMenuId() === this.id)
           this.close(e);
       });
     }

src/utils/index.ts

@@ -1,4 +1,4 @@
-export * from "./BytmMenu";
+export * from "./BytmDialog";
 export * from "./dom";
 export * from "./logging";
 export * from "./misc";

tsconfig.json

@@ -10,7 +10,6 @@
       "DOM",
       "DOM.Iterable"
     ],
-    "jsx": "react",
     "allowJs": true,
     "allowSyntheticDefaultImports": true,
     "baseUrl": ".",