Merge pull request #457 from ChartIQ/FDC3-workbench

FDC3 workbench

toolbox/fdc3-workbench/.env

@@ -0,0 +1 @@
+SKIP_PREFLIGHT_CHECK=true

toolbox/fdc3-workbench/.eslintignore

@@ -0,0 +1,8 @@
+.github/
+build/
+dist/
+node_modules/
+*.d.ts
+*.md
+yarn.lock
+package.json

toolbox/fdc3-workbench/.eslintrc.json

@@ -0,0 +1,73 @@
+{
+	"parser": "@typescript-eslint/parser",
+	"env": {
+		"browser": true,
+		"es6": true,
+		"commonjs": true
+	},
+	"extends": ["plugin:react/recommended", "prettier"],
+	"settings": {
+		"react": {
+			"version": "detect"
+		}
+	},
+	"globals": {
+		"fdc3": "readonly"
+	},
+	"parserOptions": {
+		"ecmaFeatures": {
+			"jsx": true
+		},
+		"ecmaVersion": 2018,
+		"sourceType": "module"
+	},
+	"plugins": ["react", "import", "@typescript-eslint"],
+	"rules": {
+		"react/jsx-uses-vars": 2,
+		"class-methods-use-this": 0,
+		"no-plusplus": 0,
+		"no-undef": 2,
+		"prefer-arrow-callback": 1,
+		"prefer-destructuring": [
+			"warn",
+			{
+				"object": true,
+				"array": false
+			}
+		],
+		"quote-props": ["warn", "as-needed"],
+		"lines-between-class-members": 1,
+		"@typescript-eslint/no-unused-vars": 1,
+		"prefer-template": 1,
+		"arrow-parens": 1,
+		"no-extra-semi": 1,
+		"no-shadow": 1,
+		"import/first": 1,
+		"@typescript-eslint/no-use-before-define": 1,
+		"no-redeclare": 1,
+		"arrow-body-style": [
+			"warn",
+			"as-needed",
+			{
+				"requireReturnForObjectLiteral": true
+			}
+		],
+		"one-var-declaration-per-line": ["warn", "always"],
+		"no-mixed-operators": 1,
+		"no-multiple-empty-lines": 1,
+		"no-multi-spaces": 1,
+		"default-case": 1,
+		"no-unneeded-ternary": 1,
+		"operator-assignment": ["warn", "never"],
+		"object-property-newline": [
+			"warn",
+			{
+				"allowAllPropertiesOnSameLine": true
+			}
+		],
+		"new-cap": 1,
+		"no-case-declarations": 1,
+		"react/prop-types": 0,
+		"react/no-string-refs": 0
+	}
+}

toolbox/fdc3-workbench/.gitignore

@@ -0,0 +1,24 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# production
+/build
+
+# misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+.eslintcache
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*

toolbox/fdc3-workbench/.prettierignore

@@ -0,0 +1,8 @@
+.github/
+build/
+dist/
+node_modules/
+*.d.ts
+*.md
+yarn.lock
+package.json

toolbox/fdc3-workbench/.prettierrc

@@ -0,0 +1,7 @@
+{
+    "useTabs": true,
+    "arrowParens": "always",
+    "trailingComma": "es5",
+    "proseWrap": "always",
+    "printWidth": 120
+}

toolbox/fdc3-workbench/NOTICE

@@ -0,0 +1,3 @@
+FDC3 Workbench - Fintech Open Source Foundation (https://www.finos.org/)
+Copyright 2021 Cosaic, inc. info@cosaic.io
+Copyright 2021 Contributors to the FDC3 standards project

toolbox/fdc3-workbench/README.md

@@ -0,0 +1,46 @@
+# <a href='http://fdc3.finos.org'><img src='https://fdc3.finos.org/img/fdc3-logo-2019-color.png' height='150' alt='FDC3 Logo' aria-label='fdc3.finos.org' /></a>
+
+# FDC3 Workbench
+When developing interoperability for your application with other apps on a Financial services desktop, using the [FDC3 standard](https://fdc3.finos.org/docs/fdc3-intro), the first step is often to develop a test harness or workbench tool with which to exchange messaging. The FDC3 Workbench is designed to provide that tooling so that you can focus on implementing FDC3 support in your application.
+
+_Created and contributed to [FDC3](http://fdc3.finos.org) by [Cosaic, Inc.](https://cosaic.io/) in 2021._
+
+## Getting Started
+
+1. Clone the repository
+
+`git clone https://github.com/ChartIQ/fdc3-workbench`
+
+2. Install dependencies
+
+`cd fdc3-workbench & yarn install`
+
+3. Start the development server
+
+`yarn start`
+
+4. Add the URL http://localhost:3000 to your FDC3-enabled container or desktop agent and ensure it has access to the `window.fdc3` object.
+
+## TODO
+- Implement a panel for working with [App channels](https://fdc3.finos.org/docs/api/spec#direct-listening-and-broadcast-on-channels).
+- Implement `findIntent` in the intents panel with support for a targetted `raiseIntent` using one of the results.
+- Add support for saving context tempaltes across sessions (e.g. via localstorage)
+## Packages
+
+Core:
+- [Create React App](https://github.com/facebook/create-react-app) - with TypeScript
+- [MATERIAL-UI](https://material-ui.com) - v4
+- [MobX](https://mobx.js.org/README.html) - state management
+
+Also using Eslint, Husky and Prettier please configure your IDE to work properly with code style rules.
+
+Minor:
+- [JsonEditor](https://github.com/josdejong/jsoneditor) - lib to add json editor field with json schema validation
+- [nanoid](https://www.npmjs.com/package/nanoid) - A tiny, secure, URL-friendly, unique string ID generator for JavaScript.
+
+## Known Issues
+
+- The following console error may appear periodically: `Warning: findDOMNode is deprecated in StrictMode.`, this is a [well-known issue in material-ui](https://github.com/mui-org/material-ui/issues/13394) and will be fixed in v5, which (at the time of writing) is currently in beta.
+
+
+

toolbox/fdc3-workbench/package.json

@@ -0,0 +1,74 @@
+{
+  "name": "fdc3-workbench",
+  "version": "1.2.0",
+  "private": true,
+  "homepage": ".",
+  "dependencies": {
+    "@apidevtools/json-schema-ref-parser": "^9.0.9",
+    "@finos/fdc3": "^1.2.0",
+    "@fontsource/roboto": "^4.4.5",
+    "@fontsource/source-code-pro": "^4.5.0",
+    "@material-ui/core": "^4.11.4",
+    "@material-ui/icons": "^4.11.2",
+    "@material-ui/lab": "^4.0.0-alpha.59",
+    "@types/node": "^12.0.0",
+    "@types/react": "^17.0.0",
+    "@types/react-dom": "^17.0.0",
+    "jsoneditor": "^9.5.1",
+    "mobx": "^6.3.2",
+    "mobx-react": "^7.2.0",
+    "nanoid": "^3.1.23",
+    "normalize.css": "^8.0.1",
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2",
+    "react-scripts": "4.0.3",
+    "typescript": "^4.1.2",
+    "web-vitals": "^1.0.1"
+  },
+  "scripts": {
+    "start": "react-scripts start",
+    "build": "react-scripts build",
+    "test": "react-scripts test",
+    "eject": "react-scripts eject",
+    "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}"
+  },
+  "eslintConfig": {
+    "extends": [
+      "react-app"
+    ]
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  },
+  "devDependencies": {
+    "@types/jsoneditor": "^8.6.1",
+    "@typescript-eslint/eslint-plugin": "^4.27.0",
+    "@typescript-eslint/parser": "^4.27.0",
+    "eslint": "^7.28.0",
+    "eslint-config-prettier": "^8.3.0",
+    "eslint-plugin-import": "^2.23.4",
+    "eslint-plugin-react": "^7.24.0",
+    "lint-staged": "^11.0.0",
+    "prettier": "^2.3.1",
+    "pretty-quick": "^3.1.0"
+  },
+  "lint-staged": {
+    "*.{ts,tsx,js,jsx}": [
+      "eslint --cache --quiet --fix",
+      "prettier --write --prose-wrap never"
+    ],
+    "*.{json,yml,css,html,md}": "prettier --write --prose-wrap never",
+    "*.js": "eslint --cache --fix",
+    "*.{js,css,md}": "prettier --write"
+  }
+}

toolbox/fdc3-workbench/public/index.html

@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<meta charset="utf-8" />
+		<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
+		<meta name="viewport" content="width=device-width, initial-scale=1" />
+		<meta name="theme-color" content="#000000" />
+		<meta
+			name="description"
+			content="FDC3 workbench application, designed to help develop and test FDC3 integrations"
+		/>
+		<link rel="apple-touch-icon" href="%PUBLIC_URL%/fdc3-icon-192.png" />
+		<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
+		<title>FDC3 Workbench</title>
+	</head>
+	<body>
+		<noscript>You need to enable JavaScript to run this app.</noscript>
+		<div id="root"></div>
+	</body>
+</html>

toolbox/fdc3-workbench/public/manifest.json

@@ -0,0 +1,25 @@
+{
+	"short_name": "FDC3 Workbench",
+	"name": "FDC3 Workbench",
+	"icons": [
+		{
+			"src": "favicon.ico",
+			"sizes": "64x64 32x32 24x24 16x16",
+			"type": "image/x-icon"
+		},
+		{
+			"src": "fdc3-icon-256.png",
+			"type": "image/png",
+			"sizes": "256x256"
+		},
+		{
+			"src": "fdc3-icon-192.png",
+			"type": "image/png",
+			"sizes": "192x192"
+		}
+	],
+	"start_url": ".",
+	"display": "standalone",
+	"theme_color": "#000000",
+	"background_color": "#ffffff"
+}

toolbox/fdc3-workbench/public/robots.txt

@@ -0,0 +1,3 @@
+# https://www.robotstxt.org/robotstxt.html
+User-agent: *
+Disallow:

toolbox/fdc3-workbench/src/App.css

@@ -0,0 +1,32 @@
+html {
+	font-size: 15px;
+	height: 100%;
+}
+
+body {
+	background-color: #f7f7f7;
+	font-size: 14px;
+	font-family: "Roboto", "Helvetica", "Arial", sans-serif;
+	height: 100%;
+}
+
+#root {
+	height: 100%;
+}
+
+#providerInfo {
+	border-collapse: collapse;
+}
+
+#providerInfo th {
+	border-right: 1px solid white;
+	padding: 5px;
+	text-align: right;
+	text-transform: uppercase;
+	margin: 0px;
+	font-weight: normal;
+}
+
+#providerInfo td {
+	padding-left: 5px;
+}