feat: Agent & Hub Frontend (#178)

* feat: socket server path is now always /best

package.json

@@ -12,8 +12,9 @@
     "clean": "lerna run clean && lerna clean --yes && rimraf -g packages/**/build && rimraf packages/**/tsconfig.tsbuildinfo && rimraf -g packages/**/dist && rimraf -g packages/**/node_modules",
     "lint": "eslint packages/ --ext=js,ts",
     "prettier": "prettier --write '**/*.{js,md}'",
-    "prepare": "yarn build",
+    "prepare": "yarn build && yarn build:frontends",
     "build": "tsc -b",
+    "build:frontends": "lerna exec --scope **/agent-frontend --scope **/frontend -- yarn build",
     "build:docs": "cd docs && yarn build",
     "watch:docs": "cd docs && yarn watch",
     "release": "yarn prepare && lerna publish -m 'chore(release): publish %s' --exact --force-publish=* && yarn changelog",

packages/@best/agent-frontend/package.json

@@ -20,7 +20,6 @@
     "scripts": {
         "build": "lwc-services build -m production",
         "build:development": "lwc-services build",
-        "serve": "lwc-services serve",
         "watch": "lwc-services watch"
     },
     "files": [

packages/@best/agent-frontend/src/client/modules/view/dashboard/dashboard.js

@@ -4,7 +4,7 @@ import { connect } from 'store/socket';
 import { Job } from 'store/model';
 
 export default class ViewDashboard extends LightningElement {
-    config = { host: 'http://localhost:5555', path: '/hub', name: 'Hub 5555' };
+    config = { host: window.location.origin, path: '/best' };
 
     @track agents = [];
     allJobs = [];

packages/@best/agent-frontend/src/server/manager.ts

@@ -1,14 +1,6 @@
 import socketIO from 'socket.io';
 import AgentLogger from '@best/agent-logger';
 
-// const proxifyWithAfter = (object: any, method: string, fn: Function) => {
-//     const orig = object[method]
-//     object[method] = function (...args: any[]) {
-//         fn.apply(this, args)
-//         return orig.apply(this, args)
-//     }
-// }
-
 const FRONTEND_EVENTS = ['benchmark added', 'benchmark start', 'benchmark update', 'benchmark end', 'benchmark error', 'benchmark results', 'benchmark queued', 'benchmark cancel']
 
 export default class Manager {
@@ -30,10 +22,6 @@ export default class Manager {
     }
 
     private attachListeners() {
-        // proxifyWithAfter(client, 'emit', (name: string, packet: any) => {
-        //     this.notifyFrontends(client.id, name, packet);
-        // })
-
         FRONTEND_EVENTS.forEach(e => {
             this.logger.on(e, (packet: any) => {
                 this.notifyFrontends(e, packet);

packages/@best/agent-hub/src/cli/index.ts

@@ -1,6 +1,7 @@
 import { readFileSync } from 'fs';
 import express from 'express';
 import { HubConfig, runHub } from '../hub-server';
+
 const PORT = process.env.PORT || 5000;
 const SSL_PFX_FILE = process.env.SSL_PFX_FILE;
 const SSL_PFX_PASSPHRASE = process.env.SSL_PFX_PASSPHRASE;
@@ -22,6 +23,7 @@ function getDefaultConfig(tokenSecret: string, configAsJSON?: string): HubConfig
 
 export function run(config?: HubConfig) {
     const app = express();
+
     const enableHttps = SSL_PFX_FILE && SSL_PFX_PASSPHRASE;
     const http = require(enableHttps ? 'https' : 'http');
 
@@ -35,7 +37,6 @@ export function run(config?: HubConfig) {
 
     app.use(express.json());
 
-    app.get('/', (req, res) => res.send('BEST agent hub running!'));
     process.stdout.write(`Best agent hub listening in port ${PORT}... \n\n`);
 
     runHub(server, app, config ? config : DEFAULT_CONFIG);

packages/@best/agent-hub/src/hub-server.ts

@@ -7,7 +7,7 @@ import { createAgentManager } from "./AgentManager";
 import { HubApplication } from "./HubApplication";
 import { AgentConfig } from "./Agent";
 import { configureAgentsApi } from "./agents-api";
-import { attachMiddleware } from '@best/agent-frontend';
+import { attachMiddleware, serveFrontend } from '@best/agent-frontend';
 import AgentLogger from '@best/agent-logger';
 
 export interface HubConfig {
@@ -23,11 +23,12 @@ function createHubApplication(config: HubConfig, logger: AgentLogger): HubApplic
 }
 
 export function runHub(server: any, app: Application, hubConfig: HubConfig) {
-    const socketServer: SocketIO.Server = socketIO(server, { path: '/hub' });
+    const socketServer: SocketIO.Server = socketIO(server, { path: '/best' });
     const logger = new AgentLogger();
     const hub: HubApplication = createHubApplication(hubConfig, logger);
 
     configureAgentsApi(app, hub.agentManager, logger, hubConfig.tokenSecret);
+    serveFrontend(app);
 
     // Authentication middleware
     socketServer.use((socket, next) => {

packages/@best/agent/src/cli/index.ts

@@ -12,6 +12,7 @@ const hubRegistrationConfig: HubConfig = process.env.HUB_CONFIG ? JSON.parse(pro
 export function run() {
     const app = express();
     serveFrontend(app);
+
     const enableHttps = SSL_PFX_FILE && SSL_PFX_PASSPHRASE;
     const http = require(enableHttps ? 'https' : 'http');
 

packages/@best/frontend/package.json

@@ -40,8 +40,8 @@
         "node": ">=10.0.0"
     },
     "scripts": {
-        "lwc:build": "lwc-services build",
-        "lwc:serve": "lwc-services build && lwc-services serve",
+        "build": "lwc-services build -m production",
+        "build:development": "lwc-services build",
         "lwc:watch": "lwc-services watch --webpack=webpack.config.js",
         "api:watch": "nodemon --watch server -e ts --exec 'NODE_ENV=development ts-node server/serve.ts'",
         "watch": "concurrently 'yarn lwc:watch' 'yarn api:watch'"

packages/@best/runner-hub/src/HubClient.ts

@@ -45,7 +45,12 @@ function proxifyRunner(benchmarkEntryBundle: BenchmarkInfo, projectConfig: Froze
             return reject(new Error(`Benchmark artifact not found (${tarBundle})`));
         }
 
-        const socket = socketIO(host, options);
+        const normalizedSocketOptions = {
+            path: '/best',
+            ...options
+        }
+
+        const socket = socketIO(host, normalizedSocketOptions);
 
         socket.on('connect', () => {
             if (cancelledRun) {
@@ -137,7 +142,12 @@ export class HubClient {
             const jobResults: Promise<BenchmarkResultsSnapshot>[] = [];
             const jobRuns: HubRun[] = [];
 
-            const socket = socketIO(host, options);
+            const normalizedSocketOptions = {
+                path: '/best',
+                ...options
+            }
+
+            const socket = socketIO(host, normalizedSocketOptions);
 
             socket.on('connect', () => {
                 socket.on('disconnect', (reason: string) => {

packages/@best/runner-remote/src/index.ts

@@ -29,7 +29,12 @@ function proxifyRunner(benchmarkEntryBundle: BenchmarkInfo, projectConfig: Froze
             return reject(new Error('Benchmark artifact not found (${tarBundle})'));
         }
 
-        const socket = socketIO(host, options);
+        const normalizedSocketOptions = {
+            path: '/best',
+            ...options
+        }
+
+        const socket = socketIO(host, normalizedSocketOptions);
 
         socket.on('connect', () => {
             socket.on('load_benchmark', () => {

packages/best-benchmarks/best.config.js

@@ -10,7 +10,6 @@ module.exports = {
             "alias": "remote-agent",
             "config": {
                 "host": "http://localhost:5000",
-                "options": { path: "/best" },
                 "remoteRunner": "@best/runner-headless"
             }
         },
@@ -20,7 +19,6 @@ module.exports = {
             "config": {
                 "host": "http://localhost:5555",
                 "options": {
-                    path: "/hub",
                     query: {
                         token: "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzY29wZSI6ImNsaWVudCIsImlhdCI6MTU2MzI5NjkyMywiZXhwIjoxNTY1ODg4OTIzfQ.3TN91ySnte8_dhJ1Iabe4fUcOvS7lp9J700YywCMC5Q"
                     }