perf: refine css selectors

.env.chromium

@@ -1 +1 @@
-TARGET_BROWSER=chrome
+VITE_TARGET_BROWSER=chrome

.env.gecko

@@ -1 +1 @@
-TARGET_BROWSER=firefox
+VITE_TARGET_BROWSER=firefox

docs/changelog.md

@@ -2,10 +2,18 @@
 
 ---
 
+Complexity is going freemium soon, offering access to more advanced features. Features up to the official transition will remain free forever. Read more about it [here](https://github.com/pnd280/complexity/issues/19).
+
 Consider giving a star ⭐ on [Github](https://github.com/pnd280/complexity).
 
 💖 Support the development via [Ko-fi](https://ko-fi.com/pnd280) or [Paypal](https://paypal.me/pnd280).
 
+## v0.0.4.1
+
+_Release date: 20th Oct, 2024_
+
+-   **FIX**: Fixed performance issues.
+
 ## v0.0.4.0
 
 _Release date: 18th Oct, 2024_

gulpfile.js

@@ -29,7 +29,7 @@ function removeUnwantedFiles(cb) {
 function zip() {
   const require = createRequire(import.meta.url);
   const manifest = require("./package.json");
-  const zipFileName = `${manifest.name.replaceAll(" ", "-")}-${manifest.version}-${process.env.TARGET_BROWSER}.zip`;
+  const zipFileName = `${manifest.name.replaceAll(" ", "-")}-${manifest.version}-${process.env.VITE_TARGET_BROWSER}.zip`;
 
   return gulp
     .src("dist/**")

package.json

@@ -1,7 +1,7 @@
 {
   "name": "complexity",
   "displayName": "Complexity - Perplexity AI Supercharged",
-  "version": "0.0.4.0",
+  "version": "0.0.4.1",
   "author": "pnd280",
   "description": "⚡ Supercharge your Perplexity AI",
   "type": "module",

src/app.config.ts

@@ -4,17 +4,18 @@ const env = typeof process === "undefined" ? import.meta.env : process.env;
 
 const envSchema = z.object({
   NODE_ENV: z.enum(["development", "production", "test"]).optional(),
-  TARGET_BROWSER: z.enum(["chrome", "firefox"]).optional().default("chrome"),
+  VITE_TARGET_BROWSER: z
+    .enum(["chrome", "firefox"])
+    .optional()
+    .default("chrome"),
   DEV: z.string().or(z.boolean()).optional(),
-  VITE_METADATA_BRANCH: z.string().optional().default("alpha"),
 });
 
 const parsedEnv = envSchema.parse(env);
 
 const appConfig = {
-  BROWSER: parsedEnv.TARGET_BROWSER,
+  BROWSER: parsedEnv.VITE_TARGET_BROWSER,
   IS_DEV: Boolean(parsedEnv.DEV) || parsedEnv.NODE_ENV === "development",
-  METADATA_BRANCH: parsedEnv.VITE_METADATA_BRANCH,
   "perplexity-ai": {
     globalMatches: ["https://www.perplexity.ai/*", "https://perplexity.ai/*"],
     globalExcludeMatches: [

src/content-script/hooks/useQueryBoxObserver.ts

@@ -67,6 +67,7 @@ export default function useQueryBoxObserver({
         DomObserver.destroy(mainId);
         DomObserver.destroy(followUpId);
         DomObserver.destroy(alterAttachButtonId);
+        DomObserver.destroy(imageGenerationPopoverId);
       };
     },
     [
@@ -127,7 +128,7 @@ function observeFollowUpQueryBox({
   if (location !== "thread" && location !== "page")
     return DomObserver.destroy(id);
 
-  const $toolbar = $('textarea[placeholder="Ask follow-up"]').parent().next();
+  const $toolbar = $(DomSelectors.QUERY_BOX.TEXTAREA.FOLLOW_UP).parent().next();
 
   if (!$toolbar.length || $toolbar.attr(`data-${id}`)) return;
 

src/utils/DomSelectors.ts

@@ -52,9 +52,9 @@ const DomSelectors = {
   },
   QUERY_BOX: {
     TEXTAREA: {
-      MAIN: '[data-testid="quick-search-modal"] textarea[placeholder][autocomplete][style*="height: 48px !important;"], .max-w-screen-md textarea[placeholder][autocomplete][style*="height: 48px !important;"]',
+      MAIN: '.max-w-screen-md textarea[placeholder][autocomplete][style*="height: 48px !important;"]',
       FOLLOW_UP:
-        '[location="thread"] textarea[placeholder][autocomplete][style*="height: 48px !important;"]',
+        '[location="thread"] textarea[placeholder][autocomplete][style*="height: 24px !important;"]',
       SPACE:
         '[location="space"] textarea[placeholder][autocomplete][style*="height: 48px !important;"]',
       ARBITRARY: