feat: Implement TLink API request proxy

Author: micwallace

javascript/card-sdk/src/index.ts

@@ -6,7 +6,7 @@ import {
     ITokenData,
     ITokenScriptSDK,
     ITransactionListener,
-    ITransactionStatus,
+    ITransactionStatus, TLinkRequest,
     TokenScriptEvents,
     TXOptions
 } from "./types";
@@ -206,6 +206,17 @@ class TokenScriptSDK  implements ITokenScriptSDK {
         },
     }
 
+    public readonly tlink = {
+        request: async (request: TLinkRequest) => {
+            try {
+                const res = await this.engineAdapter.request<any>(RequestFromView.TLINK_REQUEST, request, true) as any;
+                return res.result;
+            } catch (e) {
+                throw e;
+            }
+        }
+    }
+
     /**
      * Emit a TokenScript engine event to the user-agent
      * @param eventType

javascript/card-sdk/src/messaging/IEngineAdapter.ts

@@ -20,7 +20,8 @@ export enum RequestFromView {
 	EXEC_TRANSACTION = "execTransaction",
 	REFRESH_TOKENS = "refreshTokens",
 	SHOW_TX_TOAST = "showTransactionToast",
-	SHOW_TOAST = "showToast"
+	SHOW_TOAST = "showToast",
+	TLINK_REQUEST = "tlinkRequest"
 }
 
 export interface IEngineAdapter {

javascript/card-sdk/src/types/index.ts

@@ -38,6 +38,11 @@ export interface TokenScriptEvents {
 	TRANSACTION_EVENT: ITransactionStatus
 }
 
+export interface TLinkRequest {
+	method: string,
+	payload: Object
+}
+
 export interface ITokenScriptSDK {
 	engineAdapter: IEngineAdapter;
 	instanceData: IInstanceData;
@@ -66,6 +71,9 @@ export interface ITokenScriptSDK {
 		getContractInfo: (name: string, chain?: number) => {chain: number, address: string, abi: any}
 		getContractInstance: (name: string, chain?: number) => Contract
 	}
+	tlink: {
+		request: (request: TLinkRequest) => void
+	}
 	env: {[key: string]: string}
 	emitEvent: <
 			T extends keyof TokenScriptEvents, // <- T points to a key

javascript/engine-js/src/Engine.ts

@@ -9,6 +9,7 @@ import {AttestationDefinition} from "./tokenScript/attestation/AttestationDefini
 import {ILocalStorageAdapter} from "./view/data/ILocalStorageAdapter";
 import {IViewBinding} from "./view/IViewBinding";
 import {IWalletAdapter} from "./wallet/IWalletAdapter";
+import {ITlinkAdapter} from "./tlink/ITlinkAdapter";
 
 /**
  * Engine.ts is the top level component for the TokenScript engine, it can be used to create a new TokenScript instance

javascript/engine-js/src/IEngine.ts

@@ -7,13 +7,15 @@ import { ITokenDiscoveryAdapter } from './tokens/ITokenDiscoveryAdapter';
 import { ITokenScript } from './ITokenScript';
 import { ILocalStorageAdapter } from './view/data/ILocalStorageAdapter';
 import { IWalletAdapter } from './wallet/IWalletAdapter';
+import {ITlinkAdapter} from "./tlink/ITlinkAdapter";
 
 export interface IEngineConfig {
   ipfsGateway?: string;
   noLocalStorage?: boolean;
   trustedKeys?: TrustedKey[]; // Define signing keys which are always valid
   txValidationCallback?: (txInfo: ITxValidationInfo) => boolean | Promise<boolean>;
   viewerOrigin?: string;
+  tlinkRequestAdapter?: ITlinkAdapter;
 }
 
 export enum ScriptSourceType {

javascript/engine-js/src/tlink/ITlinkAdapter.ts

@@ -0,0 +1,8 @@
+
+export interface TLinkRequest {
+	uid: string,
+	method: string,
+	payload: Object
+}
+
+export type ITlinkAdapter = (request: TLinkRequest) => Promise<any>;

javascript/engine-js/src/view/ViewController.ts

@@ -5,6 +5,8 @@ import {RpcRequest, RpcResponse} from "../wallet/IWalletAdapter";
 import {LocalStorageProxy, LocalStorageRequest} from "./data/LocalStorageProxy";
 import {IViewBinding} from "./IViewBinding";
 import {TokenViewData} from "./TokenViewData";
+import {TLinkRequest} from "../tlink/ITlinkAdapter";
+import {TokenScriptEngine} from "../Engine";
 
 export enum ViewEvent {
 	TOKENS_UPDATED = "tokensUpdated",
@@ -27,7 +29,8 @@ export enum RequestFromView {
 	EXEC_TRANSACTION = "execTransaction",
 	REFRESH_TOKENS = "refreshTokens",
 	SHOW_TX_TOAST = "showTransactionToast",
-	SHOW_TOAST = "showToast"
+	SHOW_TOAST = "showToast",
+	TLINK_REQUEST = "tlinkRequest"
 }
 
 export type TXTrigger = "refreshTokens"|"invalidateAttributes";
@@ -314,6 +317,10 @@ export class ViewController {
 				await this.updateCardData(params.id);
 				break;
 
+			case RequestFromView.TLINK_REQUEST:
+				await this.tlinkRequest({method: params.method, payload: params.payload, uid: params.id});
+				break;
+
 			default:
 				throw new Error("TokenScript view API method: " + method + " is not implemented.");
 		}
@@ -340,6 +347,21 @@ export class ViewController {
 		this.viewAdapter.showLoader(false);
 	}
 
+	private async tlinkRequest(request: TLinkRequest){
+		try {
+			if (!this.tokenScript.getEngine().config.tlinkRequestAdapter)
+				throw new Error("TLink adapter not available");
+
+			const res = await this.tokenScript.getEngine().config.tlinkRequestAdapter(request);
+
+			this.dispatchViewEvent(ViewEvent.EXECUTE_CALLBACK, {error: null, result: res.response}, request.uid);
+
+		} catch (e){
+			console.error(e);
+			this.dispatchViewEvent(ViewEvent.EXECUTE_CALLBACK, {error: e.message, result: null}, request.uid);
+		}
+	}
+
 	/**
 	 *
 	 * @param request

javascript/engine-js/src/view/sdk/v1.txt

@@ -15,6 +15,7 @@ import {dbProvider} from "../../providers/databaseProvider";
 import {showToastNotification} from "../viewers/util/showToast";
 import {LocalStorageAdapter} from "../../integration/localStorageAdapter";
 import {StaticProviders} from "../wallet/Web3WalletProvider";
+import {TLinkRequest} from "../../../../engine-js/src/tlink/ITlinkAdapter";
 
 export type TokenScriptSource = "resolve" | "file" | "url";
 
@@ -135,7 +136,38 @@ export class AppRoot {
 					return true;
 					//return this.confirmTxPopover.confirmTransaction(txInfo);
 				},
-				viewerOrigin: this.viewerType.indexOf("tlink") === 0 ? "*" : document.location.origin
+				viewerOrigin: this.viewerType.indexOf("tlink") === 0 ? "*" : document.location.origin,
+				tlinkRequestAdapter: (data: TLinkRequest) => {
+
+					if (this.viewerType.indexOf("tlink") === -1)
+						throw new Error("Tlink adapter is not available in this context");
+
+					console.log("TLink request: ", data);
+
+					return new Promise((resolve, reject) => {
+						const messageHandler = (event) => {
+							const response = event.data
+							if (
+								response.type === 'TLINK_API_RESPONSE' &&
+								response.data?.method === data.method &&
+								response.data?.uid === data.uid
+							) {
+								window.removeEventListener('message', messageHandler)
+								console.log("response from TLink adapter: ", response);
+								resolve(response.data)
+							}
+						}
+
+						window.addEventListener('message', messageHandler)
+
+						window.parent.postMessage({ type: 'TLINK_API_REQUEST', data }, '*')
+
+						setTimeout(() => {
+							window.removeEventListener('message', messageHandler)
+							reject(new Error('Message timeout'))
+						}, 5000)
+					})
+				}
 			}
 		);