JS-3943: fix, refactoring

extension/entry.tsx

@@ -1,18 +1,42 @@
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 import $ from 'jquery';
+import { C, UtilCommon, UtilRouter } from 'Lib'; 
 import Popup from './popup';
 import Iframe from './iframe';
 import Util from './lib/util';
 import Extension from 'json/extension.json';
+import * as Store from 'Store';
 
 import './scss/common.scss';
 
+declare global {
+	interface Window {
+		isExtension: boolean;
+		Electron: any;
+		$: any;
+		Anytype: any;
+		isWebVersion: boolean;
+		AnytypeGlobalConfig: any;
+	}
+};
+
+window.$ = $;
+window.isExtension = true;
 window.Electron = {
 	currentWindow: () => ({ windowId: 1 }),
 	Api: () => {},
 };
 
+window.Anytype = {
+	Store,
+	Lib: {
+		C,
+		UtilCommon,
+		UtilRouter, 
+	},
+};
+
 window.AnytypeGlobalConfig = { 
 	emojiUrl: Extension.clipper.emojiUrl, 
 	menuBorderTop: 16, 
@@ -32,6 +56,8 @@ if (Util.isIframe()) {
 	component = <Iframe />;
 };
 
+console.log(window.Anytype);
+
 if (!rootId) {
 	console.error('[Entry] rootId is not defined');
 } else {

extension/iframe.tsx

@@ -1,12 +1,11 @@
 import * as React from 'react';
 import * as hs from 'history';
-import $ from 'jquery';
 import { Router, Route, Switch } from 'react-router-dom';
 import { RouteComponentProps } from 'react-router';
 import { Provider } from 'mobx-react';
 import { configure } from 'mobx';
 import { ListMenu } from 'Component';
-import { dispatcher, C, UtilCommon, UtilRouter } from 'Lib'; 
+import { UtilRouter } from 'Lib'; 
 import { commonStore, authStore, blockStore, detailStore, dbStore, menuStore, popupStore, extensionStore } from 'Store';
 
 import Index from './iframe/index';
@@ -41,28 +40,6 @@ const rootStore = {
 	extensionStore,
 };
 
-declare global {
-	interface Window {
-		Electron: any;
-		$: any;
-		Anytype: any;
-		isWebVersion: boolean;
-		AnytypeGlobalConfig: any;
-	}
-};
-
-window.$ = $;
-window.$ = $;
-window.Anytype = {
-	Store: rootStore,
-	Lib: {
-		C,
-		UtilCommon,
-		dispatcher,
-		Storage,
-	},
-};
-
 class RoutePage extends React.Component<RouteComponentProps> {
 	render () {
 		const { match } = this.props;

extension/popup.tsx

@@ -1,12 +1,11 @@
 import * as React from 'react';
 import * as hs from 'history';
-import $ from 'jquery';
 import { Router, Route, Switch } from 'react-router-dom';
 import { RouteComponentProps } from 'react-router';
 import { Provider } from 'mobx-react';
 import { configure } from 'mobx';
 import { ListMenu } from 'Component';
-import { dispatcher, C, UtilCommon, UtilRouter } from 'Lib'; 
+import { UtilRouter } from 'Lib'; 
 import { commonStore, authStore, blockStore, detailStore, dbStore, menuStore, popupStore, extensionStore } from 'Store';
 import Extension from 'json/extension.json';
 
@@ -45,27 +44,6 @@ const rootStore = {
 	extensionStore,
 };
 
-declare global {
-	interface Window {
-		Electron: any;
-		$: any;
-		Anytype: any;
-		isWebVersion: boolean;
-		AnytypeGlobalConfig: any;
-	}
-};
-
-window.$ = $;
-window.Anytype = {
-	Store: rootStore,
-	Lib: {
-		C,
-		UtilCommon,
-		dispatcher,
-		Storage,
-	},
-};
-
 class RoutePage extends React.Component<RouteComponentProps> {
 	render () {
 		const { match } = this.props;

extension/scss/common.scss

@@ -81,4 +81,6 @@ html.anytypeWebclipper-popup {
 		.inner { border-color: var(--color-ice) !important; box-shadow: 0px 0px 0px 1px var(--color-ice) !important; }
 		.input { border: unset !important; box-shadow: unset !important; }
 	}
+
+	.passThrough { pointer-events: all; }
 }

src/scss/common.scss

@@ -75,7 +75,7 @@ html.platformWindows, html.platformLinux {
 .txt { vertical-align: middle; display: inline-block; line-height: 1; }
 .flex { display: flex; }
 .nw { white-space: nowrap; }
-.through { pointer-events: none; }
+.passThrough { pointer-events: none; }
 .rel { position: relative; }
 .disabled { opacity: 0.5; cursor: default !important; }
 .dis { cursor: default !important; }

src/ts/app.tsx

@@ -55,6 +55,7 @@ interface State {
 
 declare global {
 	interface Window {
+		isExtension: boolean;
 		$: any;
 		Electron: any;
 		Anytype: any;

src/ts/component/menu/index.tsx

@@ -248,7 +248,7 @@ const Menu = observer(class Menu extends React.Component<I.Menu, State> {
 		};
 
 		if (passThrough) {
-			cd.push('through');
+			cd.push('passThrough');
 		};
 
 		const Tab = (item: any) => (

src/ts/store/popup.ts

@@ -47,6 +47,14 @@ class PopupStore {
 
 		param.data = param.data || {};
 
+		// Auto-confirm in extension
+		if (window.isExtension && (id == 'confirm')) {
+			if (param.data.onConfirm) {
+				param.data.onConfirm();
+			};
+			return;
+		};
+
 		if (!param.preventMenuClose) {
 			menuStore.closeAll();
 		};