migrate workbench to getAgent

packages/fdc3-standard/src/api/Types.ts

@@ -3,8 +3,9 @@
  * Copyright FINOS FDC3 contributors - see NOTICE file
  */
 
-import { Channel, ContextMetadata } from '..';
 import { Context } from '@kite9/fdc3-context';
+import { Channel } from './Channel';
+import { ContextMetadata } from './ContextMetadata';
 
 /**
  * Describes a callback that handles a context event.

toolbox/fdc3-workbench/package.json

@@ -9,6 +9,7 @@
     "start": "vite",
     "preview": "vite preview",
     "build": "tsc && vite build",
+    "build:watch": "tsc --watch",
     "lint": "eslint --cache --quiet **/*.{ts,tsx,js,jsx} && prettier --check **/*.{ts,tsx,js,jsx,json,yml,css,html,md}",
     "lint:fix": "eslint --cache --quiet --fix **/*.{ts,tsx,js,jsx} && prettier --write **/*.{ts,tsx,js,jsx} && prettier --write **/*.{json,yml,css,html,md}"
   },

toolbox/fdc3-workbench/src/App.tsx

@@ -22,8 +22,8 @@ import { ContextCreate } from "./components/ContextCreate";
 import { Intents } from "./components/Intents";
 import { AppChannels } from "./components/AppChannels";
 import snackbarStore from "./store/SnackbarStore";
-import fdc3 from "./utility/Fdc3Api";
 import "./App.css";
+import { getAgent } from "@kite9/fdc3";
 
 const mainTheme = createTheme({
 	palette: {
@@ -218,7 +218,7 @@ export const App = observer(() => {
 	useEffect(() => {
 		(async () => {
 			try {
-				await fdc3.fdc3Ready(5000);
+				await getAgent();
 				setFdc3Available(true);
 			} catch (e) {}
 		})();
@@ -280,10 +280,7 @@ export const App = observer(() => {
 						<Grid container direction="column" justifyContent="center" alignItems="center" spacing={2} item xs={12}>
 							<Paper className={classes.paper}>
 								<Typography variant="h4">FDC3 API not detected!</Typography>
-								<Typography variant="body1">
-									An FDC3 desktop agent implementation was not found at{" "}
-									<span className={classes.code}>window.fdc3</span>.
-								</Typography>
+								<Typography variant="body1">An FDC3 desktop agent implementation was not found.</Typography>
 								<Typography variant="body1">
 									For web applications to be FDC3-enabled, they need to run in the context of an agent that makes the
 									FDC3 API available to the application. This desktop agent is also responsible for launching and

toolbox/fdc3-workbench/src/components/Header.tsx

@@ -7,7 +7,8 @@ import React, { useEffect, useState } from "react";
 import { createStyles, makeStyles, Theme } from "@material-ui/core/styles";
 import { AppBar, Toolbar, Tooltip, Typography } from "@material-ui/core";
 import WarningIcon from "@material-ui/icons/Warning";
-import fdc3, { ImplementationMetadata } from "../utility/Fdc3Api";
+import { getAgent } from "@kite9/fdc3";
+import { ImplementationMetadata } from "../utility/Fdc3Api";
 
 declare global {
 	interface Window {
@@ -87,7 +88,7 @@ export const Header = (props: { fdc3Available: boolean }) => {
 
 				//Then if chosenVersion == "2.0"  then implInfo = await implInfoPromise   else implInfo = implInfoPromise  (with handling for <1.2 where getInfo() doesn't exist at all.
 				try {
-					const implInfoPromise: Promise<ImplementationMetadata> | ImplementationMetadata = fdc3.getInfo();
+					const implInfoPromise = getAgent().then((agent) => agent.getInfo());
 					if (paramVersion == "1.2" && (implInfoPromise as unknown as ImplementationMetadata).fdc3Version) {
 						//should not expect a promise if we're really working with 1.2
 						implInfo = implInfoPromise as unknown as ImplementationMetadata;

toolbox/fdc3-workbench/src/components/Intents.tsx

@@ -4,7 +4,14 @@
  */
 
 import React, { ChangeEvent, ReactElement, useEffect, useState } from "react";
-import fdc3, { AppMetadata, ContextType, IntentResolution, IntentTargetOption } from "../utility/Fdc3Api";
+import {
+	AppMetadata,
+	ContextType,
+	getTargetOptions,
+	getTargetOptionsForContext,
+	IntentResolution,
+	IntentTargetOption,
+} from "../utility/Fdc3Api";
 import { toJS } from "mobx";
 import { createStyles, makeStyles, Theme } from "@material-ui/core/styles";
 import {
@@ -41,6 +48,7 @@ import { FormControlLabel } from "@material-ui/core";
 import { RadioGroup } from "@material-ui/core";
 import { Alert, ToggleButton, ToggleButtonGroup } from "@material-ui/lab";
 import InfoOutlinedIcon from "@material-ui/icons/InfoOutlined";
+import { getAgent } from "@kite9/fdc3";
 
 // interface copied from lib @material-ui/lab/Autocomplete
 interface FilterOptionsState<T> {
@@ -312,7 +320,7 @@ export const Intents = observer(({ handleTabChange }: { handleTabChange: any })
 			} else if (!raiseIntentContext) {
 				setRaiseIntentError("Select a context first");
 			} else {
-				const intentTargetOptions: IntentTargetOption[] = await fdc3.getTargetOptions(
+				const intentTargetOptions: IntentTargetOption[] = await getTargetOptions(
 					intentValue.value,
 					toJS(raiseIntentContext)
 				);
@@ -382,7 +390,7 @@ export const Intents = observer(({ handleTabChange }: { handleTabChange: any })
 				if (!raiseIntentWithContextContext) {
 					//no settable error at the moment... setRaiseIntentError("enter context name");
 				} else {
-					const contextTargetOptions = await fdc3.getTargetOptionsForContext(toJS(raiseIntentWithContextContext));
+					const contextTargetOptions = await getTargetOptionsForContext(toJS(raiseIntentWithContextContext));
 
 					if (Object.keys(contextTargetOptions).length > 0) {
 						menuItems.push(
@@ -520,7 +528,7 @@ export const Intents = observer(({ handleTabChange }: { handleTabChange: any })
 					return;
 				}
 				setRaiseIntentError(false);
-				let appIntents = await fdc3.findIntentsByContext(toJS(raiseIntentContext));
+				let appIntents = await getAgent().then((agent) => agent.findIntentsByContext(toJS(raiseIntentContext)));
 
 				setUseTargets(false);
 				clearTargets();

toolbox/fdc3-workbench/src/store/AppChannelStore.tsx

@@ -3,9 +3,10 @@
  * Copyright FINOS FDC3 contributors - see NOTICE file
  */
 import { makeObservable, observable, action, runInAction, toJS } from "mobx";
-import fdc3, { ContextType, Channel, Fdc3Listener } from "../utility/Fdc3Api";
+import { ContextType, Fdc3Listener } from "../utility/Fdc3Api";
 import systemLogStore from "./SystemLogStore";
 import { nanoid } from "nanoid";
+import { Channel, getAgent } from "@kite9/fdc3";
 
 interface ListenerOptionType {
 	title: string;
@@ -41,7 +42,7 @@ class AppChannelStore {
 
 	async getOrCreateChannel(channelId: string) {
 		try {
-			const currentAppChannelObj = await fdc3.getOrCreateChannel(channelId);
+			const currentAppChannelObj = await getAgent().then((agent) => agent.getOrCreateChannel(channelId));
 			if (currentAppChannelObj) {
 				const record = {
 					id: channelId,
@@ -130,8 +131,9 @@ class AppChannelStore {
 
 	async leaveChannel() {
 		try {
+			const agent = await getAgent();
 			//check that we're on a channel
-			let currentChannel = await fdc3.getCurrentChannel();
+			let currentChannel = await agent.getCurrentChannel();
 			if (!currentChannel) {
 				systemLogStore.addLog({
 					name: "leaveChannel",
@@ -140,8 +142,8 @@ class AppChannelStore {
 					variant: "text",
 				});
 			} else {
-				await fdc3.leaveCurrentChannel();
-				currentChannel = await fdc3.getCurrentChannel();
+				await agent.leaveCurrentChannel();
+				currentChannel = await agent.getCurrentChannel();
 				const isSuccess = currentChannel === null;
 
 				runInAction(() => {

toolbox/fdc3-workbench/src/store/ChannelStore.ts

@@ -3,8 +3,8 @@
  * Copyright FINOS FDC3 contributors - see NOTICE file
  */
 import { makeObservable, observable, action, runInAction } from "mobx";
-import fdc3, { Channel } from "../utility/Fdc3Api";
 import systemLogStore from "./SystemLogStore";
+import { Channel, getAgent } from "@kite9/fdc3";
 
 class ChannelStore {
 	userChannels: Channel[] = [];
@@ -25,8 +25,9 @@ class ChannelStore {
 	}
 
 	async getCurrentUserChannel() {
+		const agent = await getAgent();
 		try {
-			const userChannel = await fdc3.getCurrentChannel();
+			const userChannel = await agent.getCurrentChannel();
 			runInAction(() => {
 				systemLogStore.addLog({
 					name: "getCurrentChannel",
@@ -48,45 +49,35 @@ class ChannelStore {
 	}
 
 	async getUserChannels() {
+		const agent = await getAgent();
 		//defer retrieving channels until fdc3 API is ready
-		fdc3
-			.fdc3Ready(5000)
-			.then(async () => {
-				try {
-					const userChannels = await fdc3.getUserChannels();
-					const currentUserChannel = await fdc3.getCurrentChannel();
+		try {
+			const userChannels = await agent.getUserChannels();
+			const currentUserChannel = await agent.getCurrentChannel();
 
-					runInAction(() => {
-						systemLogStore.addLog({
-							name: "getChannels",
-							type: "success",
-						});
-						this.userChannels = userChannels;
-						this.currentUserChannel = currentUserChannel;
-					});
-				} catch (e) {
-					systemLogStore.addLog({
-						name: "getChannels",
-						type: "error",
-						variant: "code",
-						body: JSON.stringify(e, null, 4),
-					});
-				}
-			})
-			.catch((reason) => {
+			runInAction(() => {
 				systemLogStore.addLog({
-					name: "getFdc3",
-					type: "error",
-					variant: "text",
-					value: reason,
+					name: "getChannels",
+					type: "success",
 				});
+				this.userChannels = userChannels;
+				this.currentUserChannel = currentUserChannel;
+			});
+		} catch (e) {
+			systemLogStore.addLog({
+				name: "getChannels",
+				type: "error",
+				variant: "code",
+				body: JSON.stringify(e, null, 4),
 			});
+		}
 	}
 
 	async joinUserChannel(channelId: string) {
+		const agent = await getAgent();
 		try {
-			await fdc3.joinUserChannel(channelId);
-			const currentUserChannel = await fdc3.getCurrentChannel();
+			await agent.joinUserChannel(channelId);
+			const currentUserChannel = await agent.getCurrentChannel();
 			const isSuccess = currentUserChannel !== null;
 
 			runInAction(() => {
@@ -110,9 +101,10 @@ class ChannelStore {
 	}
 
 	async leaveUserChannel() {
+		const agent = await getAgent();
 		try {
 			//check that we're on a channel
-			let currentUserChannel = await fdc3.getCurrentChannel();
+			let currentUserChannel = await agent.getCurrentChannel();
 			if (!currentUserChannel) {
 				systemLogStore.addLog({
 					name: "leaveChannel",
@@ -121,8 +113,8 @@ class ChannelStore {
 					variant: "text",
 				});
 			} else {
-				await fdc3.leaveCurrentChannel();
-				currentUserChannel = await fdc3.getCurrentChannel();
+				await agent.leaveCurrentChannel();
+				currentUserChannel = await agent.getCurrentChannel();
 				const isSuccess = currentUserChannel === null;
 
 				runInAction(() => {

toolbox/fdc3-workbench/src/store/ContextStore.ts

@@ -3,11 +3,12 @@
  * Copyright FINOS FDC3 contributors - see NOTICE file
  */
 import { makeObservable, observable, runInAction, action, toJS } from "mobx";
-import fdc3, { ContextType, Fdc3Listener } from "../utility/Fdc3Api";
+import { ContextType, Fdc3Listener } from "../utility/Fdc3Api";
 import { nanoid } from "nanoid";
 import { contexts } from "../fixtures/contexts";
 import systemLogStore from "./SystemLogStore";
 import { v4 as uuidv4 } from "uuid";
+import { getAgent } from "@kite9/fdc3";
 
 export type ContextItem = {
 	id: string;
@@ -90,6 +91,8 @@ class ContextStore {
 	}
 
 	async broadcast(context: ContextType) {
+		const agent = await getAgent();
+
 		if (!context) {
 			systemLogStore.addLog({
 				name: "broadcast",
@@ -100,7 +103,7 @@ class ContextStore {
 			return;
 		} else {
 			//check that we're on a channel
-			let currentChannel = await fdc3.getCurrentChannel();
+			let currentChannel = await agent.getCurrentChannel();
 			if (!currentChannel) {
 				systemLogStore.addLog({
 					name: "broadcast",
@@ -110,7 +113,7 @@ class ContextStore {
 				});
 			} else {
 				try {
-					await fdc3.broadcast(toJS(context));
+					await agent.broadcast(toJS(context));
 					systemLogStore.addLog({
 						name: "broadcast",
 						type: "success",
@@ -134,8 +137,10 @@ class ContextStore {
 			if (typeof contextType === "string") {
 				const listenerId = nanoid();
 
+				const agent = await getAgent();
+
 				// TODO: remove window after fixing https://github.com/finos/FDC3/issues/435
-				const contextListener = await fdc3.addContextListener(
+				const contextListener = await agent.addContextListener(
 					contextType.toLowerCase() === "all" ? null : contextType,
 					(context: ContextType, metaData?: any) => {
 						const currentListener = this.contextListeners.find(({ id }) => id === listenerId);