From aee53eccb5f5be966b91cc0df6f8d4ce1cfff176 Mon Sep 17 00:00:00 2001
From: Vendicated <vendicated@riseup.net>
Date: Thu, 20 Apr 2023 00:40:21 +0200
Subject: [PATCH] Make JSX work

---
 build/build.mjs                               | 10 +++++----
 build/tsconfig.json                           |  7 +++++++
 build/vencordDep.mjs                          | 12 ++++-------
 .../MyExamplePlugin/{index.ts => index.tsx}   | 21 ++++++++++++++++++-
 4 files changed, 37 insertions(+), 13 deletions(-)
 create mode 100644 build/tsconfig.json
 rename plugins/MyExamplePlugin/{index.ts => index.tsx} (61%)

diff --git a/build/build.mjs b/build/build.mjs
index c26fb2d..d5e04bb 100644
--- a/build/build.mjs
+++ b/build/build.mjs
@@ -13,15 +13,17 @@ const contexts = await Promise.all(
             entryPoints: [`./plugins/${p}`],
             outfile: `dist/${p}/index.js`,
             format: "iife",
-            jsxFactory: "VCR.createElement",
-            jsxFragment: "VCR.Fragment",
+            globalName: "VencordPlugin",
+            jsxFactory: "Vencord.Webpack.Common.React.createElement",
+            jsxFragment: "Vencord.Webpack.Common.React.Fragment",
             external: ["@vencord/types/*"],
             plugins: [vencordDep],
-            footer: { js: `//# sourceURL=${encodeURI(p)}` },
+            footer: { js: `return VencordPlugin;\n//# sourceURL=${encodeURI(p)}` },
             minify: !isDev,
             bundle: true,
             sourcemap: "linked",
-            logLevel: "info"
+            logLevel: "info",
+            tsconfig: "./build/tsconfig.json"
         })
     )
 );
diff --git a/build/tsconfig.json b/build/tsconfig.json
new file mode 100644
index 0000000..184a3dd
--- /dev/null
+++ b/build/tsconfig.json
@@ -0,0 +1,7 @@
+// Work around https://github.com/evanw/esbuild/issues/2460
+{
+    "extends": "../tsconfig.json",
+    "compilerOptions": {
+        "jsx": "react"
+    }
+}
diff --git a/build/vencordDep.mjs b/build/vencordDep.mjs
index 56b87bf..5563149 100644
--- a/build/vencordDep.mjs
+++ b/build/vencordDep.mjs
@@ -4,7 +4,6 @@ const names = {
     webpack: "Vencord.Webpack",
     "webpack/common": "Vencord.Webpack.Common",
     utils: "Vencord.Util",
-    "utils/types": "Vencord.Plugins.External",
     api: "Vencord.Api",
     components: "Vencord.Components"
 };
@@ -15,14 +14,11 @@ export default globalExternalsWithRegExp({
 
         let varName = names[path];
         if (!varName) {
-            const altMapping = names[path.split("/")[0]];
-            if (!altMapping) throw new Error("Unknown module path: " + modulePath);
+            const elements = path.split("/");
+            varName = names[elements.shift()];
+            if (!varName) throw new Error("Unknown module path: " + modulePath);
 
-            varName =
-                altMapping +
-                "." +
-                // @ts-ignore
-                path.split("/")[1].replaceAll("/", ".");
+            if (varName !== "Vencord.Util" || elements[0] === "types") varName += "." + elements.join(".");
         }
 
         return {
diff --git a/plugins/MyExamplePlugin/index.ts b/plugins/MyExamplePlugin/index.tsx
similarity index 61%
rename from plugins/MyExamplePlugin/index.ts
rename to plugins/MyExamplePlugin/index.tsx
index 054c9e0..7ae4b7f 100644
--- a/plugins/MyExamplePlugin/index.ts
+++ b/plugins/MyExamplePlugin/index.tsx
@@ -1,6 +1,8 @@
+import { GlobalContextMenuPatchCallback, addGlobalContextMenuPatch, removeGlobalContextMenuPatch } from "@vencord/types/api/ContextMenu";
 import { definePluginSettings } from "@vencord/types/api/settings";
 import definePlugin, { OptionType } from "@vencord/types/utils/types";
 import { findStoreLazy } from "@vencord/types/webpack";
+import { Menu } from "@vencord/types/webpack/common";
 
 // This is already a webpack common so maybe don't search it again.
 // just an example heh :3
@@ -14,7 +16,19 @@ const settings = definePluginSettings({
     }
 });
 
-definePlugin({
+const patchContextMenu: GlobalContextMenuPatchCallback = (navId, children) => () => {
+    children.unshift((
+        <Menu.MenuItem
+            id="example-context-menu-item"
+            label="read if cute"
+            action={() => {
+                alert(":3");
+            }}
+        />
+    ));
+};
+
+export default definePlugin({
     name: "MyExamplePlugin",
     description: "Very cute plugin",
     authors: [
@@ -30,10 +44,15 @@ definePlugin({
 
     start() {
         console.log(this.name, "just started");
+
+        addGlobalContextMenuPatch(patchContextMenu);
+
         console.log(UserStore.getCurrentUser().username, "is", settings.store.cuteSetting);
     },
 
     stop() {
         console.log(this.name, "just stopped");
+
+        removeGlobalContextMenuPatch(patchContextMenu);
     }
 });