Agent sandbox dashboard repo pull

#39
by Tripdafan - opened

๐Ÿ˜ƒ: 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.

Sign up or log in to comment