switch to replugged popover injection

manifest.json

@@ -7,7 +7,7 @@
     "discordID": "372148345894076416",
     "github": "SammCheese"
   },
-  "version": "1.2.4",
+  "version": "1.2.5",
   "updater": {
     "type": "github",
     "id": "SammCheese/invisible-chat"

package.json

@@ -1,6 +1,6 @@
 {
   "name": "invisible-chat",
-  "version": "1.2.4",
+  "version": "1.2.5",
   "description": "Encrypt your Discord Messages",
   "engines": {
     "node": ">=14.0.0"
@@ -22,15 +22,15 @@
   "license": "Unlicensed",
   "devDependencies": {
     "@types/node": "^18.11.2",
+    "@types/react": "^18.0.27",
     "@typescript-eslint/eslint-plugin": "^5.40.1",
     "@typescript-eslint/parser": "^5.40.1",
     "eslint": "^8.25.0",
     "eslint-config-dmitmel": "github:dmitmel/eslint-config-dmitmel",
     "eslint-plugin-node": "^11.1.0",
     "eslint-plugin-react": "^7.31.10",
     "prettier": "^2.8.1",
-    "replugged": "4.0.0-beta0.25",
-    "typescript": "^4.8.4",
-    "@types/react": "^18.0.27"
+    "replugged": "4.1.0",
+    "typescript": "^4.8.4"
   }
 }

src/index.ts

@@ -1,3 +1,4 @@
+import { Injector } from "replugged";
 import { Indicator } from "./assets/indicator";
 import { popoverIcon } from "./assets/popoverIcon";
 import { chatbarLock } from "./assets/chatbarLock";
@@ -9,10 +10,15 @@ const URL_DETECTION = new RegExp(
   /(http(s)?:\/\/.)?(www\.)?[-a-zA-Z0-9@:%._+~#=]{2,256}\.[a-z]{2,6}\b([-a-zA-Z0-9@:%_+.~#?&//=]*)/,
 );
 
+const injector = new Injector();
+
 export async function start(): Promise<void> {
   // Prepare Lib and Settings
   await stegInit();
 
+  // Execute Injections
+  injectPopover();
+
   // Register the Message Receiver
   // @ts-expect-error adding to window
   window.invisiblechat = {
@@ -23,8 +29,23 @@ export async function start(): Promise<void> {
     Indicator,
   };
 }
+export function stop(): void {
+  injector.uninjectAll();
+}
 
-export { Settings } from "./components/Settings";
+function injectPopover(): void {
+  injector.utils.addPopoverButton((message: DiscordMessage) => {
+    const isEncrypted = INV_DETECTION.test(message.content);
+
+    if (!isEncrypted) return null;
+
+    return {
+      label: "Decrypt Message",
+      icon: popoverIcon,
+      onClick: () => void receiver(message),
+    };
+  });
+}
 
 // Grab the data from the above Plaintext Patches
 async function receiver(message: DiscordMessage): Promise<void> {
@@ -56,3 +77,5 @@ export async function buildEmbed(message: DiscordMessage, revealed: string): Pro
   updateMessage(message);
   return Promise.resolve();
 }
+
+export { Settings } from "./components/Settings";

src/plaintextPatches.ts

@@ -3,12 +3,6 @@ import { types } from "replugged";
 const patches: types.PlaintextPatch[] = [
   {
     replacements: [
-      {
-        // Minipopover Lock
-        match:
-          /.\?(..)\(\{key:"reply-other",channel:(.{1,5}),message:(.{1,5}),label:.{1,50},icon:.{1,5},onClick:.{1,6}\}\):null/gm,
-        replace: `$&,$3.content.match(window.invisiblechat?.INV_DETECTION)?$1({key:"decrypt",label:"Decrypt Message",icon:window.invisiblechat.popoverIcon,channel:$2,message:$3,onClick:()=>window.invisiblechat.receiver($3)}):null`,
-      },
       {
         // Chatbar Lock
         match: /(.)\.push.{1,}\(.{1,3},\{.{1,30}\},"gift"\)\)/,