mobile: fix share extension not able to clip webpage

apps/mobile/share/fetch-webview.js

@@ -28,7 +28,6 @@ import RNFetchBlob from "react-native-blob-util";
 import WebView from "react-native-webview";
 import { Config } from "./store";
 import { db } from "../app/common/database";
-import { SUBSCRIPTION_STATUS } from "../app/utils/constants";
 
 export const fetchHandle = createRef();
 export const HtmlLoadingWebViewAgent = React.memo(
@@ -40,6 +39,7 @@ export const HtmlLoadingWebViewAgent = React.memo(
     const webview = useRef();
     const premium = useRef(false);
     const corsProxy = Config.corsProxy;
+    const [isLoggedIn, setIsLoggedIn] = useState();
 
     useImperativeHandle(
       fetchHandle,
@@ -72,11 +72,8 @@ export const HtmlLoadingWebViewAgent = React.memo(
     useEffect(() => {
       (async () => {
         const user = await db.user.getUser();
-        const subscriptionStatus =
+        setIsLoggedIn(!!user);
-          user?.subscription?.type || SUBSCRIPTION_STATUS.BASIC;
+        console.log("USER", !!user);
-        premium.current =
-          user && subscriptionStatus !== SUBSCRIPTION_STATUS.BASIC;
-
         const clipperPath =
           Platform.OS === "ios"
             ? RNFetchBlob.fs.dirs.MainBundleDir +
@@ -91,6 +88,7 @@ export const HtmlLoadingWebViewAgent = React.memo(
           .catch((e) => console.log(e));
       })();
     }, []);
+    console.log(isLoggedIn);
 
     return !source || !clipper ? null : (
       <WebView
@@ -103,7 +101,8 @@ export const HtmlLoadingWebViewAgent = React.memo(
           height: 100,
           position: "absolute",
           opacity: 0,
-          zIndex: -1
+          zIndex: -1,
+          pointerEvents: "none"
         }}
         useSharedProcessPool={false}
         pointerEvents="none"
@@ -123,7 +122,11 @@ export const HtmlLoadingWebViewAgent = React.memo(
             console.log("Error handling webview message", e);
           }
         }}
-        injectedJavaScriptBeforeContentLoaded={script(clipper, premium.current)}
+        injectedJavaScriptBeforeContentLoaded={script(
+          clipper,
+          corsProxy,
+          isLoggedIn
+        )}
         onError={() => {
           console.log("Error loading page");
           loadHandler.current?.();
@@ -137,9 +140,11 @@ export const HtmlLoadingWebViewAgent = React.memo(
   () => true
 );
 
-const script = (clipper, pro) => `
+const script = (clipper, corsProxy, loggedIn) => `
+globalThis.module = {};
 ${clipper}
 
+
 function postMessage(type, value) {
   if (window.ReactNativeWebView) {
     window.ReactNativeWebView.postMessage(
@@ -158,10 +163,10 @@ function postMessage(type, value) {
         postMessage("error", globalThis.Clipper.clipPage);
       } else {
         globalThis.Clipper.clipPage(document,false, {
-          images: ${pro},
+          images: ${loggedIn ? "true" : "false"},
           inlineImages: false,
           styles: false,
-          corsProxy: undefined
+          corsProxy: ${corsProxy ? `"${corsProxy}"` : "undefined"}
         }).then(result => {
           postMessage("html", result);
         }).catch(e => {

apps/mobile/share/share.js

@@ -267,7 +267,6 @@ const ShareView = () => {
   );
 
   const onLoad = useCallback(() => {
-    console.log(noteContent.current, "current...");
     eSendEvent(eOnLoadNote + "shareEditor", {
       id: null,
       content: {
@@ -747,7 +746,7 @@ const ShareView = () => {
                   </Paragraph>
                   {rawData.value && isURL(rawData.value) ? (
                     <Button
-                      type={mode === 2 ? "inverted" : "transparent"}
+                      type={mode === 2 ? "inverted" : "plain"}
                       icon={mode === 2 ? "radiobox-marked" : "radiobox-blank"}
                       onPress={() => changeMode(2)}
                       title={modes[2].title}
@@ -758,9 +757,9 @@ const ShareView = () => {
                     />
                   ) : null}
                   <Button
-                    type={mode === 1 ? "inverted" : "transparent"}
+                    type={mode === 1 ? "inverted" : "plain"}
                     icon={mode === 1 ? "radiobox-marked" : "radiobox-blank"}
-                    onPress={() => changeMode(2)}
+                    onPress={() => changeMode(1)}
                     title={modes[1].title}
                     height={30}
                     style={{

packages/clipper/src/index.global.ts

@@ -26,7 +26,7 @@ declare global {
   };
 }
 
-global.Clipper = {
+globalThis.Clipper = {
   clipArticle,
   clipPage
 };