add admin option to force enable extension detection

without having it installed

src/assets/locales/en.json

@@ -830,7 +830,15 @@
       "admin": {
         "title": "Admin panel",
         "text": "Utilize tools made for testing P-Stream's condition.",
-        "button": "Check it out"
+        "button": "Check it out",
+        "extensionOverride": {
+          "title": "Extension Override",
+          "text": "Override extension detection for testing purposes. This will make the app believe the extension is active even if it's not installed.",
+          "button": "Enable Override",
+          "buttonDisabled": "Disable Override",
+          "enabled": "Extension override is currently enabled",
+          "disabled": "Extension override is currently disabled"
+        }
       },
       "actions": {
         "delete": {

src/backend/extension/messaging.ts

@@ -22,6 +22,13 @@ const isExtensionReady = new Promise<void>((resolve) => {
 
 let activeExtension = false;
 
+const EXTENSION_OVERRIDE_KEY = "___dev_extension_override";
+
+function isExtensionOverrideEnabled(): boolean {
+  if (typeof window === "undefined") return false;
+  return localStorage.getItem(EXTENSION_OVERRIDE_KEY) === "true";
+}
+
 async function sendMessage<MessageKey extends keyof MessagesMetadata>(
   message: MessageKey,
   payload: MessagesMetadata[MessageKey]["req"] | undefined = undefined,
@@ -74,10 +81,12 @@ export async function extensionInfo(): Promise<
 }
 
 export function isExtensionActiveCached(): boolean {
+  if (isExtensionOverrideEnabled()) return true;
   return activeExtension;
 }
 
 export async function isExtensionActive(): Promise<boolean> {
+  if (isExtensionOverrideEnabled()) return true;
   const info = await extensionInfo();
   if (!info?.success) return false;
   const allowedVersion = isAllowedExtensionVersion(info.version);

src/pages/admin/AdminPage.tsx

@@ -2,6 +2,7 @@ import { ThinContainer } from "@/components/layout/ThinContainer";
 import { Heading1, Paragraph } from "@/components/utils/Text";
 import { SubPageLayout } from "@/pages/layouts/SubPageLayout";
 import { ConfigValuesPart } from "@/pages/parts/admin/ConfigValuesPart";
+import { ExtensionOverridePart } from "@/pages/parts/admin/ExtensionOverridePart";
 import { RegionSelectorPart } from "@/pages/parts/admin/RegionSelectorPart";
 import { TMDBTestPart } from "@/pages/parts/admin/TMDBTestPart";
 import { WorkerTestPart } from "@/pages/parts/admin/WorkerTestPart";
@@ -19,6 +20,7 @@ export function AdminPage() {
         <BackendTestPart />
         <WorkerTestPart />
         <TMDBTestPart />
+        <ExtensionOverridePart />
         <RegionSelectorPart />
       </ThinContainer>
     </SubPageLayout>

src/pages/parts/admin/ExtensionOverridePart.tsx

@@ -0,0 +1,67 @@
+import { t } from "i18next";
+import { useEffect, useState } from "react";
+
+import { Button } from "@/components/buttons/Button";
+import { Icon, Icons } from "@/components/Icon";
+import { Box } from "@/components/layout/Box";
+import { Heading2 } from "@/components/utils/Text";
+
+const EXTENSION_OVERRIDE_KEY = "___dev_extension_override";
+
+export function ExtensionOverridePart() {
+  const [isOverrideEnabled, setIsOverrideEnabled] = useState(false);
+
+  useEffect(() => {
+    const stored = localStorage.getItem(EXTENSION_OVERRIDE_KEY);
+    setIsOverrideEnabled(stored === "true");
+  }, []);
+
+  const toggleOverride = () => {
+    const newState = !isOverrideEnabled;
+    setIsOverrideEnabled(newState);
+
+    if (newState) {
+      localStorage.setItem(EXTENSION_OVERRIDE_KEY, "true");
+    } else {
+      localStorage.removeItem(EXTENSION_OVERRIDE_KEY);
+    }
+
+    // Refresh the page to apply the change
+    window.location.reload();
+  };
+
+  return (
+    <>
+      <Heading2 className="mb-8 mt-12">
+        {t("settings.account.admin.extensionOverride.title")}
+      </Heading2>
+      <Box>
+        <div className="w-full flex gap-6 justify-between items-center">
+          <div className="flex-1">
+            <p className="text-sm">
+              {t("settings.account.admin.extensionOverride.text")}
+            </p>
+            {isOverrideEnabled && (
+              <p className="flex items-center text-md mt-2">
+                <Icon
+                  icon={Icons.CIRCLE_CHECK}
+                  className="text-video-scraping-success mr-2"
+                />
+                {t("settings.account.admin.extensionOverride.enabled")}
+              </p>
+            )}
+          </div>
+          <Button
+            theme={isOverrideEnabled ? "danger" : "purple"}
+            onClick={toggleOverride}
+            className="whitespace-nowrap"
+          >
+            {isOverrideEnabled
+              ? t("settings.account.admin.extensionOverride.buttonDisabled")
+              : t("settings.account.admin.extensionOverride.button")}
+          </Button>
+        </div>
+      </Box>
+    </>
+  );
+}

src/utils/extension.ts

@@ -9,7 +9,15 @@ export type ExtensionStatus =
   | "outdated"
   | "success";
 
+const EXTENSION_OVERRIDE_KEY = "___dev_extension_override";
+
+function isExtensionOverrideEnabled(): boolean {
+  if (typeof window === "undefined") return false;
+  return localStorage.getItem(EXTENSION_OVERRIDE_KEY) === "true";
+}
+
 export async function getExtensionState(): Promise<ExtensionStatus> {
+  if (isExtensionOverrideEnabled()) return "success";
   const info = await extensionInfo();
   if (!info) return "unknown"; // cant talk to extension
   if (!info.success) return "failed"; // extension failed to respond