webclipper auth integration

extension/entry.tsx

@@ -13,7 +13,7 @@ window.Electron = {
 	currentWindow: () => ({ windowId: 1 }),
 	Api: () => {},
 };
-window.AnytypeGlobalConfig = { emojiPrefix: Url.emojiPrefix };
+window.AnytypeGlobalConfig = { emojiPrefix: Url.emojiPrefix, debug: { mw: true } };
 
 let rootId = '';
 let component: any = null;

extension/iframe.tsx

@@ -44,25 +44,24 @@ const rootStore = {
 declare global {
 	interface Window {
 		Electron: any;
-		Store: any;
 		$: any;
-		Lib: any;
-		Graph: any;
-
+		Anytype: any;
 		isWebVersion: boolean;
 		AnytypeGlobalConfig: any;
-		Renderer: any;
 	}
 };
 
 window.$ = $;
-window.Store = rootStore;
-window.Lib = {
-	C,
-	UtilCommon,
-	dispatcher,
-	Storage,
-	Animation,
+window.$ = $;
+window.Anytype = {
+	Store: rootStore,
+	Lib: {
+		C,
+		UtilCommon,
+		dispatcher,
+		Storage,
+		Animation,
+	},
 };
 
 class RoutePage extends React.Component<RouteComponentProps> {

extension/popup.tsx

@@ -11,6 +11,7 @@ import { commonStore, authStore, blockStore, detailStore, dbStore, menuStore, po
 import Extension from 'json/extension.json';
 
 import Index from './popup/index';
+import Challenge from './popup/challenge';
 import Create from './popup/create';
 import Success from './popup/success';
 import Util from './lib/util';
@@ -26,6 +27,7 @@ const Routes = [
 
 const Components = {
 	index: Index,
+	challenge: Challenge,
 	create: Create,
 	success: Success,
 };
@@ -47,25 +49,23 @@ const rootStore = {
 declare global {
 	interface Window {
 		Electron: any;
-		Store: any;
 		$: any;
-		Lib: any;
-		Graph: any;
-
+		Anytype: any;
 		isWebVersion: boolean;
 		AnytypeGlobalConfig: any;
-		Renderer: any;
 	}
 };
 
 window.$ = $;
-window.Store = rootStore;
-window.Lib = {
-	C,
-	UtilCommon,
-	dispatcher,
-	Storage,
-	Animation,
+window.Anytype = {
+	Store: rootStore,
+	Lib: {
+		C,
+		UtilCommon,
+		dispatcher,
+		Storage,
+		Animation,
+	},
 };
 
 class RoutePage extends React.Component<RouteComponentProps> {

extension/popup/challenge.tsx

@@ -0,0 +1,40 @@
+import * as React from 'react';
+import { observer } from 'mobx-react';
+import { Button, Input } from 'Component';
+import { I, C } from 'Lib';
+import { extensionStore } from 'Store';
+
+interface State {
+	error: string;
+};
+
+const Challenge = observer(class Challenge extends React.Component<I.PageComponent, State> {
+
+	ref: any = null;
+
+	constructor (props: I.PageComponent) {
+		super(props);
+
+		this.onSubmit = this.onSubmit.bind(this);
+	};
+
+	render () {
+		return (
+			<form className="page pageChallenge" onSubmit={this.onSubmit}>
+				<Input ref={ref => this.ref = ref} />
+				<Button type="input" color="pink" text="Ok" />
+			</form>
+		);
+	};
+
+	onSubmit (e: any) {
+		e.preventDefault();
+
+		C.AccountLocalLinkSolveChallenge(extensionStore.challengeId, this.ref?.getValue(), (message: any) => {
+			console.log(message);
+		});
+	};
+
+});
+
+export default Challenge;

extension/popup/index.tsx

@@ -1,8 +1,8 @@
 import * as React from 'react';
 import { observer } from 'mobx-react';
 import { Label, Button, Error } from 'Component';
-import { I, UtilRouter, UtilData, dispatcher } from 'Lib';
-import { authStore, commonStore } from 'Store';
+import { I, C, UtilRouter, UtilData, dispatcher } from 'Lib';
+import { authStore, commonStore, extensionStore } from 'Store';
 import Url from 'json/url.json';
 
 import Util from '../lib/util';
@@ -50,12 +50,17 @@ const Index = observer(class Index extends React.Component<I.PageComponent, Stat
 				return;
 			};
 
+			/* @ts-ignore */
+			const manifest = chrome.runtime.getManifest();
+
 			authStore.tokenSet('eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzZWVkIjoiUkNRbnFkcnYifQ.g22qTAnn7fOD9KB9Z1xQBN3Iy6sSUvPgLSWfQSxcqCw');
 			dispatcher.init(`http://127.0.0.1:${response.ports[1]}`);
 			commonStore.gatewaySet(`http://127.0.0.1:${response.ports[2]}`);
 
-			UtilData.createsSubscriptions(() => {
-				UtilRouter.go('/create', {});
+			C.AccountLocalLinkNewChallenge(manifest.name, (message: any) => {
+				extensionStore.challengeId = message.challengeId;
+
+				UtilRouter.go('/challenge', {});
 			});
 		});
 	};

src/ts/lib/api/command.ts

@@ -220,6 +220,23 @@ const AccountRecoverFromLegacyExport = (path: string, rootPath: string, icon: nu
 	dispatcher.request(AccountRecoverFromLegacyExport.name, request, callBack);
 };
 
+const AccountLocalLinkNewChallenge = (name: string, callBack?: (message: any) => void) => {
+	const request = new Rpc.Account.LocalLink.NewChallenge.Request();
+
+	request.setAppname(name);
+
+	dispatcher.request(AccountLocalLinkNewChallenge.name, request, callBack);
+};
+
+const AccountLocalLinkSolveChallenge = (id: string, answer: string, callBack?: (message: any) => void) => {
+	const request = new Rpc.Account.LocalLink.SolveChallenge.Request();
+
+	request.setChallengeid(id);
+	request.setAnswer(answer);
+
+	dispatcher.request(AccountLocalLinkSolveChallenge.name, request, callBack);
+};
+
 // ---------------------- FILE ---------------------- //
 
 const FileDrop = (contextId: string, targetId: string, position: I.BlockPosition, paths: string[], callBack?: (message: any) => void) => {
@@ -1860,6 +1877,9 @@ export {
 	AccountRevertDeletion,
 	AccountMove,
 
+	AccountLocalLinkNewChallenge,
+	AccountLocalLinkSolveChallenge,
+
 	FileUpload,
 	FileDownload,
 	FileDrop,

src/ts/lib/api/dispatcher.ts

@@ -5,7 +5,7 @@ import { observable, set } from 'mobx';
 import Commands from 'protobuf/pb/protos/commands_pb';
 import Events from 'protobuf/pb/protos/events_pb';
 import Service from 'protobuf/pb/protos/service/service_grpc_web_pb';
-import { authStore, commonStore, blockStore, detailStore, dbStore, notificationStore } from 'Store';
+import { authStore, commonStore, blockStore, detailStore, dbStore, notificationStore, popupStore } from 'Store';
 import { UtilCommon, UtilObject, I, M, translate, analytics, Renderer, Action, Dataview, Preview, Mapper, Decode, UtilRouter, Storage } from 'Lib';
 import * as Response from './response';
 import { ClientReadableStream } from 'grpc-web';
@@ -90,6 +90,7 @@ class Dispatcher {
 		if (v == V.ACCOUNTDETAILS)				 t = 'accountDetails';
 		if (v == V.ACCOUNTUPDATE)				 t = 'accountUpdate';
 		if (v == V.ACCOUNTCONFIGUPDATE)			 t = 'accountConfigUpdate';
+		if (v == V.ACCOUNTLINKCHALLENGE)		 t = 'accountLinkChallenge';
 
 		if (v == V.THREADSTATUS)				 t = 'threadStatus';
 
@@ -218,6 +219,21 @@ class Dispatcher {
 					break;
 				};
 
+				case 'accountLinkChallenge': {
+					const info = data.getClientinfo();
+					const challenge = data.getChallenge();
+
+					popupStore.open('confirm', {
+						data: {
+							title: 'Challenge',
+							text: challenge,
+						}
+					});
+
+					window.focus();
+					break;
+				};
+
 				case 'threadStatus': {
 					authStore.threadSet(rootId, {
 						summary: Mapper.From.ThreadSummary(data.getSummary()),

src/ts/lib/api/response.ts

@@ -33,6 +33,19 @@ export const AccountRecoverFromLegacyExport = (response: Rpc.Account.RecoverFrom
 	};
 };
 
+export const AccountLocalLinkNewChallenge = (response: Rpc.Account.LocalLink.NewChallenge.Response) => {
+	return {
+		challengeId: response.getChallengeid(),
+	};
+};
+
+export const AccountLocalLinkSolveChallenge = (response: Rpc.Account.LocalLink.SolveChallenge.Response) => {
+	return {
+		token: response.getSessiontoken(),
+		key: response.getAppkey(),
+	};
+};
+
 export const DebugSpaceSummary = (response: Rpc.Debug.SpaceSummary.Response) => {
 	return response.toObject();
 };

src/ts/store/extension.ts

@@ -1,6 +1,8 @@
 class ExtensionStore {
 
 	public createdObject = null;
+	public challengeId = '';
+	
 
 };