Refactor plugin installation and purchase handling

- Enhanced HandleIntent function to validate plugin installation requests.
- Modified getLoggedInUser method to return a Promise.
- Removed IAP_AVAILABLE from config and adjusted related logic.
- Improved main.js to handle app installation source and define appInstallSource.
- Refactored plugin page to streamline plugin installation and purchase logic.
- Added external purchase handling in plugin view and buttons.
- Updated IAP plugin to track availability status.
- Enhanced ListItem component to manage plugin installation and purchase flow.
- Introduced shouldAllowExternalPurchase helper function for better purchase logic.

Author: Ajit Kumar

package-lock.json

@@ -41,8 +41,8 @@
       "com.foxdebug.acode.rk.plugin.plugincontext": {},
       "cordova-plugin-system": {},
       "com.foxdebug.acode.rk.auth": {},
-      "cordova-plugin-iap": {},
-      "com.foxdebug.acode.rk.exec.proot": {}
+      "com.foxdebug.acode.rk.exec.proot": {},
+      "cordova-plugin-iap": {}
     },
     "platforms": [
       "android"
@@ -151,7 +151,6 @@
     "acorn": "^8.15.0",
     "autosize": "^6.0.1",
     "codemirror": "^6.0.2",
-    "cordova": "13.0.0",
     "core-js": "^3.47.0",
     "dayjs": "^1.11.19",
     "dompurify": "^3.4.0",

package.json

@@ -35,8 +35,13 @@ export default async function HandleIntent(intent = {}) {
 
 			if (defaultPrevented) return;
 
-			if (module === "plugin") {
+			if (module === "plugin" && action === "install") {
 				const { default: Plugin } = await import("pages/plugin");
+
+				if (!value || !/^([a-z0-9\.]+)$/.test(value)) {
+					return;
+				}
+
 				const installed = await fsOperation(PLUGIN_DIR, value).exists();
 				Plugin({ id: value, installed, install: action === "install" });
 			}

src/handlers/intent.js

@@ -100,7 +100,7 @@ class AuthService {
 
 	/**
 	 *
-	 * @returns {User}
+	 * @returns {Promise<User>}
 	 */
 	async getLoggedInUser() {
 		if (loggedInUser) return loggedInUser;

src/lib/auth.js

@@ -39,9 +39,6 @@ const config = {
 	INSTAGRAM_URL: "https://www.instagram.com/foxbiz.io/",
 	FOXBIZ_URL: "https://foxbiz.io",
 
-	//assume playstore build until proven otherwise
-	IAP_AVAILABLE: true,
-
 	get HAS_PRO() {
 		return hasPro;
 	},
@@ -51,17 +48,4 @@ const config = {
 	},
 };
 
-
-cordova.exec((installer) => {
-		config.IAP_AVAILABLE =
-			typeof iap !== "undefined" &&
-			installer != null &&
-			installer !== "null" &&
-			installer === "com.android.vending";
-	},
-	(error) => {
-		console.error(error);
-		config.IAP_AVAILABLE = typeof iap !== "undefined";
-	}, 'System', 'getInstaller', []);
-
 export default config;

src/lib/config.js

@@ -66,6 +66,7 @@ import $_fileMenu from "views/file-menu.hbs";
 import $_menu from "views/menu.hbs";
 import auth, { loginEvents } from "./lib/auth";
 
+const INSTALL_SOURCE_PLAY = "com.android.vending";
 const previousVersionCode = Number.parseInt(localStorage.versionCode, 10);
 
 window.onload = Main;
@@ -195,6 +196,25 @@ async function onDeviceReady() {
 
 	startAd();
 
+	let installSource = INSTALL_SOURCE_PLAY;
+
+	try {
+		installSource = await helpers.promisify(system.getInstaller);
+	} catch (error) {
+		console.error(error);
+	}
+
+	Object.defineProperty(window, "appInstallSource", {
+		get() {
+			return installSource;
+		},
+		set() {
+			console.warn("appInstallSource is readonly");
+		},
+		configurable: false,
+		enumerable: false,
+	});
+
 	try {
 		await helpers.promisify(iap.startConnection).catch((e) => {
 			window.log("error", "connection error");

src/main.js

@@ -1,7 +1,7 @@
-function plugin({ id, installed, install }, onInstall, onUninstall) {
+function plugin({ id, install }, onInstall, onUninstall) {
 	import(/* webpackChunkName: "plugins" */ "./plugin").then((res) => {
 		const Plugin = res.default;
-		Plugin(id, installed, onInstall, onUninstall, install);
+		Plugin(id, onInstall, onUninstall, install);
 	});
 }
 

src/pages/plugin/index.js

@@ -3,9 +3,10 @@ import fsOperation from "fileSystem";
 import Page from "components/page";
 import alert from "dialogs/alert";
 import loader from "dialogs/loader";
+import { addIntentHandler, removeIntentHandler } from "handlers/intent";
 import purchaseListener from "handlers/purchase";
 import actionStack from "lib/actionStack";
-import auth from "lib/auth";
+import auth, { loginEvents } from "lib/auth";
 import config from "lib/config";
 import installPlugin from "lib/installPlugin";
 import InstallState from "lib/installState";
@@ -19,21 +20,19 @@ import markdownItTaskLists from "markdown-it-task-lists";
 import { highlightCodeBlock, initHighlighting } from "utils/codeHighlight";
 import helpers from "utils/helpers";
 import Url from "utils/Url";
-import view from "./plugin.view.js";
+import view, { cleanups } from "./plugin.view.js";
 
 let $lastPluginPage;
 
 /**
  * Plugin page
  * @param {string} id
- * @param {boolean} installed
  * @param {() => void} [onInstall]
  * @param {() => void} [onUninstall]
  * @param {boolean} [installOnRender]
  */
 export default async function PluginInclude(
 	id,
-	installed,
 	onInstall,
 	onUninstall,
 	installOnRender,
@@ -42,8 +41,8 @@ export default async function PluginInclude(
 		$lastPluginPage.hide();
 	}
 
-	installed = typeof installed !== "boolean" ? installed === "true" : installed;
 	const $page = Page(strings["plugin"]);
+	let installed = await fsOperation(PLUGIN_DIR, id).exists();
 	let plugin = {};
 	let currentVersion = "";
 	let purchased = false;
@@ -56,6 +55,8 @@ export default async function PluginInclude(
 	let $settingsIcon;
 	let minVersionCode = -1;
 	let isSupported = true;
+	let refundHandlerSet = false;
+	let purchaseHandlerSet = false;
 
 	actionStack.push({
 		id: "plugin",
@@ -68,6 +69,11 @@ export default async function PluginInclude(
 		loader.removeTitleLoader();
 		cancelled = true;
 		$lastPluginPage = null;
+		cleanups.forEach((cleanup) => {
+			try {
+				cleanup();
+			} catch {}
+		});
 	};
 
 	$lastPluginPage = $page;
@@ -169,7 +175,11 @@ export default async function PluginInclude(
 						remotePlugin.supported_editor,
 					);
 
-					if (!purchased && (await helpers.checkAPIStatus())) {
+					if (
+						iap.isIapAvailable() &&
+						!purchased &&
+						(await helpers.checkAPIStatus())
+					) {
 						try {
 							[product] = await helpers.promisify(iap.getProducts, [
 								remotePlugin.sku,
@@ -252,6 +262,45 @@ export default async function PluginInclude(
 		const $button = e.target;
 		const oldText = $button.textContent;
 
+		try {
+			if (helpers.shouldAllowExternalPurchase()) {
+				CustomTabs.open(
+					`${config.BASE_URL}/plugin/${id}?callback=app`,
+					{ showTitle: true },
+					() => {},
+					() => {},
+				);
+				if (!purchaseHandlerSet) {
+					purchaseHandlerSet = true;
+					const handler = async ({ module, action, value }) => {
+						if (module === "plugin" && action === "purchased" && value === id) {
+							loader.show();
+
+							try {
+								const pluginData = await fsOperation(
+									config.API_BASE,
+									`plugin/${id}`,
+								).readFile("json");
+
+								purchased = pluginData.owned;
+								render();
+							} catch (error) {
+								window.log(error);
+								helpers.error(error);
+							}
+
+							loader.hide();
+							purchaseHandlerSet = false;
+							removeIntentHandler(handler);
+						}
+					};
+					addIntentHandler(handler);
+					cleanups.push(() => removeIntentHandler(handler));
+				}
+				return;
+			}
+		} catch (error) {}
+
 		try {
 			if (!product) throw new Error("Product not found");
 			const apiStatus = await helpers.checkAPIStatus();
@@ -296,6 +345,38 @@ export default async function PluginInclude(
 	async function refund(e) {
 		const $button = e.target;
 		const oldText = $button.textContent;
+
+		if (helpers.shouldAllowExternalPurchase()) {
+			CustomTabs.open(
+				`${config.BASE_URL}/plugin/${id}?callback=app`,
+				{ showTitle: true },
+				() => {},
+				() => {},
+			);
+
+			if (!refundHandlerSet) {
+				refundHandlerSet = true;
+				const handler = ({ module, action, value }) => {
+					if (module === "plugin" && action === "uninstall" && value === id) {
+						purchased = false;
+
+						if (installed) {
+							uninstall();
+						} else {
+							render();
+						}
+
+						refundHandlerSet = false;
+						removeIntentHandler(handler);
+					}
+				};
+
+				addIntentHandler(handler);
+				cleanups.push(() => removeIntentHandler(handler));
+			}
+			return;
+		}
+
 		try {
 			if (!product) throw new Error("Product not found");
 			$button.textContent = strings["loading..."];

src/pages/plugin/plugin.js

@@ -9,7 +9,7 @@ import alert from "dialogs/alert";
 import DOMPurify from "dompurify";
 import Ref from "html-tag-js/ref";
 import actionStack from "lib/actionStack";
-import auth from "lib/auth";
+import auth, { loginEvents } from "lib/auth";
 import config from "lib/config";
 import helpers from "utils/helpers";
 import Url from "utils/Url";
@@ -43,6 +43,8 @@ dayjs.updateLocale("en", {
 	},
 });
 
+export const cleanups = [];
+
 export default (props) => {
 	const {
 		id,
@@ -271,43 +273,24 @@ function handleTabClick(e) {
 	document.getElementById(tabId).classList.add("active");
 }
 
-function Buttons({
-	id,
-	name,
-	isPaid,
-	installed,
-	update,
-	install,
-	uninstall,
-	purchased,
-	price,
-	buy,
-	minVersionCode,
-	isSupported = true,
-}) {
-	async function openPluginWebsite() {
-		try {
-			const user = await auth.getLoggedInUser();
-			if (!user) {
-				CustomTabs.open(
-					`${config.BASE_URL}/login?redirect=app`,
-					{ showTitle: true },
-					() => {},
-					() => {},
-				);
-				return;
-			}
+async function Buttons(props) {
+	const {
+		id,
+		name,
+		isPaid,
+		installed,
+		update,
+		install,
+		uninstall,
+		purchased,
+		price,
+		buy,
+		minVersionCode,
+		isSupported = true,
+	} = props;
+
+	console.log("buttons", { installed });
 
-			CustomTabs.open(
-				`${config.BASE_URL}/plugin/${id}`,
-				{ showTitle: true },
-				() => {},
-				() => {},
-			);
-		} catch (e) {
-			console.error(e);
-		}
-	}
 	if (!isSupported) {
 		return (
 			<div
@@ -371,15 +354,34 @@ function Buttons({
 		);
 	}
 
-	if (!config.IAP_AVAILABLE && isPaid && !purchased && price) {
+	const user = await auth.getLoggedInUser();
+	if (isPaid && helpers.shouldAllowExternalPurchase() && !user) {
+		const buttonRef = Ref();
 		return (
 			<button
-				data-type="buy"
+				ref={buttonRef}
+				data-type="info"
 				className="btn btn-install"
-				onclick={openPluginWebsite}
+				onclick={() => {
+					CustomTabs.open(
+						`${config.BASE_URL}/login?redirect=app`,
+						{ showTitle: true },
+						() => {},
+						() => {},
+					);
+
+					const onLogin = async () => {
+						loginEvents.off(onLogin);
+
+						const newButton = await Buttons(props);
+						buttonRef.el.replaceWith(newButton);
+					};
+					loginEvents.on(onLogin);
+					cleanups.push(() => loginEvents.off(onLogin));
+				}}
 			>
-				<i className="icon open_in_browser"></i>
-				{price}
+				<i className="icon user-round"></i>
+				{strings.login}
 			</button>
 		);
 	}