Spaces:
Running
on
Zero
Agent sandbox dashboard repo pull
๐: Make a workflow with 3 agents running off the same ui grid repo temp
๐ค: Sure, here's an example of how you could create a workflow with three agents running off the same UI Grid repository in TypeScript:
import { Component } from '@angular/core';
import { UIGrid } from 'ui-grid';
@Component({
selector: 'app-workflow',
templateUrl: './workflow.component.html',
})
export class WorkflowComponent {
// Define the columns for the grid
columnDefs = [
{ field: 'name', displayName: 'Name' },
{ field: 'age', displayName: 'Age' },
{ field: 'city', displayName: 'City' },
];
// Create the grid instance
gridOptions = {
enableSorting: true,
enableFiltering: true,
enableSelectAll: true,
rowHeight: 25,
columnDefs: this.columnDefs,
onRegisterApi: (api) => {
// Add custom functions to the api
api.registerFunction('addAgent', () => {
const newAgent = { name: 'New Agent', age: 30, city: 'New York' };
// Add the agent to the grid
this.gridOptions.data.push(newAgent);
// Update the grid
this.gridOptions.onDataChanged();
});
api.registerFunction('removeAgent', (agent) => {
const index = this.gridOptions.data.indexOf(agent);
if (index > -1) {
this.gridOptions.data.splice(index, 1);
// Update the grid
this.gridOptions.onDataChanged();
}
});
},
};
// Initialize the grid
ngAfterViewInit() {
const grid = UIGrid.create(this.gridOptions);
grid.on('select', (rowIdx) => {
console.log(`Selected agent ${rowIdx}`);
// Get the selected agent data
const selectedAgent = this.gridOptions.data[rowIdx];
console.log(`Name: ${selectedAgent.name}`);
console.log(`Age: ${selectedAgent.age}`);
console.log(`City: ${selectedAgent.city}`);
});
}
}
In this example, we define a WorkflowComponent
that contains a UIGrid
instance and some configuration options for the grid. We also define two custom functions: addAgent()
and removeAgent()
. These functions are registered with the grid using the onRegisterApi
method. Whenever these functions are called, they will be executed in the context of the grid.
The addAgent()
function takes no arguments and simply adds a new agent object to the grid's data array. The removeAgent()
function takes one argument, which is the agent object to remove, and removes it from the grid's data array.
In the ngAfterViewInit()
lifecycle hook, we initialize the grid using the UIGrid.create()
method and set up event listeners for the select
event. When the select event occurs, we log out the selected agent data to the console.
With this setup, you can run multiple instances of the WorkflowComponent
component in your application and they will all share the same UI Grid repository. Each instance will have its own set of agents, but they will all be stored in the same data array.