add os.openURL

Website/src/components/ModConfView/index.tsx

@@ -1,13 +1,11 @@
 import { useLog } from "@Hooks/native/useLog";
 import { ModFS, useModFS } from "@Hooks/useModFS";
-import { useTheme } from "@Hooks/useTheme";
 import { IsolatedEval } from "@Native/IsolatedEval";
 import { os } from "@Native/Os";
 import * as React from "react";
 import { libraries } from "./libs";
 
-export const ModConfView = React.forwardRef<any, { children: string; modid: string }>((props, ref) => {
-  const { theme } = useTheme();
+export const ModConfView = (props: { children: string; modid: string }) => {
   const { modFS } = useModFS();
 
   const { modid, children } = props;
@@ -31,14 +29,7 @@ export const ModConfView = React.forwardRef<any, { children: string; modid: stri
         __modpath: format("MODULECWD"),
         window: {
           fetch: internalFetch,
-          open(href: string) {
-            os.open(href, {
-              target: "_blank",
-              features: {
-                color: theme.palette.primary.main,
-              },
-            });
-          },
+          open: os.openURL,
         },
         fetch: internalFetch,
 
@@ -66,4 +57,4 @@ export const ModConfView = React.forwardRef<any, { children: string; modid: stri
   }
 
   return <></>;
-});
+};

Website/src/components/dapi/Anchor.tsx

@@ -86,7 +86,7 @@ const Anchor: React.FC<AnchorProps> = (props) => {
   const { context } = useActivity();
   const { settings } = useSettings();
   const { strings } = useStrings();
-  const { href, children, noIcon, module, color = theme.palette.text.link, target = "_blank" } = props;
+  const { href, children, noIcon, module, color = theme.palette.text.link, target = os.WindowMMRLOwn } = props;
 
   const { modules } = useRepos();
   const findModule = React.useMemo(() => modules.find((m) => m.id === module), [module]);
@@ -116,12 +116,7 @@ const Anchor: React.FC<AnchorProps> = (props) => {
   const __href = React.useMemo(() => (!(module && findModule) ? href : module), [href]);
 
   const openLink = React.useCallback(() => {
-    os.open(__href, {
-      target: target,
-      features: {
-        color: theme.palette.background.default,
-      },
-    });
+    os.openURL(__href, target, `color=${theme.palette.background.default}`);
   }, [__href]);
 
   return (

Website/src/native/Os.ts

@@ -22,14 +22,77 @@ class OsClass extends Native {
     super(window.__os__);
   }
 
+  readonly WindowMMRLOwn = "_mmrlOwn";
+  readonly WindowBlank = "_blank";
+  readonly WindowSelf = "_self";
+  readonly WindowParent = "_parent";
+  readonly WindowTop = "_top";
+  readonly WindowUnfancedTop = "_unfencedTop";
+
+  /**
+   * @deprecated Use `os.openURL()` instead
+   */
   public open(url?: string | URL | undefined, options?: OpenOptions): Window | null {
     if (this.isAndroid) {
-      return this.interface.open(url, options?.features?.color || "#fffddd");
+      return this.interface.open(url, options?.features?.color || "#101010");
     } else {
       return window.open(url, options?.target, options?.features?.window);
     }
   }
 
+  private _windowObjectReference: Window | null = null;
+  private _previousURL: string | URL | null | undefined = null;
+
+  /**
+   * Handle opening link on Android and browsers. Android supports additional `color=#101010` feature
+   * @param url
+   * @param target
+   * @param features
+   * @returns
+   */
+  public openURL(url?: string | URL, target?: string, features?: string): void {
+    const openRequestedSingleTab = (url?: string | URL, features?: string) => {
+      if (this._windowObjectReference === null || this._windowObjectReference.closed) {
+        this._windowObjectReference = open(url, this.WindowMMRLOwn, features);
+      } else if (this._previousURL !== url) {
+        this._windowObjectReference = open(url, this.WindowMMRLOwn, features);
+        /* if the resource to load is different,
+           then we load it in the already opened secondary window and then
+           we bring such window back on top/in front of its parent window. */
+        this._windowObjectReference && this._windowObjectReference.focus();
+      } else {
+        this._windowObjectReference.focus();
+      }
+      this._previousURL = url;
+      /* explanation: we store the current url in order to compare url
+         in the event of another call of this function. */
+    };
+
+    function parseWindowFeatures(features?: string) {
+      if (!features) return {};
+      const featurePairs = features.split(",");
+      const featureObject = {};
+
+      featurePairs.forEach((pair) => { 
+        const [key, value] = pair.split("=");
+        featureObject[key.trim()] = parseInt(value.trim()); // Parse value as integer
+      });
+
+      return featureObject;
+    }
+
+    if (this.isAndroid) {
+      const parseFetures: Record<string, number | string> = parseWindowFeatures(features);
+      this.interface.open(url, parseFetures.color || "#101010");
+    } else {
+      if (target === this.WindowMMRLOwn) {
+        openRequestedSingleTab(url, features);
+      } else {
+        window.open(url, target, features);
+      }
+    }
+  }
+
   public hasStoragePermission(): boolean {
     if (this.isAndroid) {
       return this.interface.hasStoragePermission();

docs/ModConf/functions/Window.md

@@ -0,0 +1,23 @@
+# Window
+
+Here is the window API documentated, restricted.
+
+## `.open`
+
+This is currently the only method avaiable here
+
+```js
+const windowFeatures = "left=100,top=100,width=320,height=320";
+window.open(
+  "https://www.mozilla.org/",
+  "mozillaWindow",
+  windowFeatures
+);
+```
+
+Android supports a additional feature `color`
+
+```js
+const windowFeatures = "color=#ffffff";
+window.open("https://www.mozilla.org/", "mozillaWindow", windowFeatures);
+```