@memberjunction/ng-dashboards 2.54.0 → 2.55.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (24) hide show
  1. package/dist/AI/ai-dashboard.component.d.ts.map +1 -1
  2. package/dist/AI/ai-dashboard.component.js +47 -47
  3. package/dist/AI/ai-dashboard.component.js.map +1 -1
  4. package/dist/AI/components/agents/agent-configuration.component.d.ts +8 -3
  5. package/dist/AI/components/agents/agent-configuration.component.d.ts.map +1 -1
  6. package/dist/AI/components/agents/agent-configuration.component.js +99 -67
  7. package/dist/AI/components/agents/agent-configuration.component.js.map +1 -1
  8. package/dist/AI/components/prompts/prompt-management-v2.component.d.ts +3 -0
  9. package/dist/AI/components/prompts/prompt-management-v2.component.d.ts.map +1 -1
  10. package/dist/AI/components/prompts/prompt-management-v2.component.js +148 -104
  11. package/dist/AI/components/prompts/prompt-management-v2.component.js.map +1 -1
  12. package/dist/Actions/actions-management-dashboard.component.d.ts +1 -0
  13. package/dist/Actions/actions-management-dashboard.component.d.ts.map +1 -1
  14. package/dist/Actions/actions-management-dashboard.component.js +31 -16
  15. package/dist/Actions/actions-management-dashboard.component.js.map +1 -1
  16. package/dist/Actions/components/actions-overview.component.d.ts +3 -1
  17. package/dist/Actions/components/actions-overview.component.d.ts.map +1 -1
  18. package/dist/Actions/components/actions-overview.component.js +97 -77
  19. package/dist/Actions/components/actions-overview.component.js.map +1 -1
  20. package/dist/module.d.ts +10 -6
  21. package/dist/module.d.ts.map +1 -1
  22. package/dist/module.js +22 -3
  23. package/dist/module.js.map +1 -1
  24. package/package.json +12 -7
@@ -1,8 +1,11 @@
1
1
  import { Component, Output, EventEmitter, Input } from '@angular/core';
2
- import { RunView, CompositeKey } from '@memberjunction/core';
2
+ import { RunView } from '@memberjunction/core';
3
3
  import * as i0 from "@angular/core";
4
- import * as i1 from "@progress/kendo-angular-layout";
5
- import * as i2 from "./agent-filter-panel.component";
4
+ import * as i1 from "@memberjunction/ng-core-entity-forms";
5
+ import * as i2 from "@progress/kendo-angular-layout";
6
+ import * as i3 from "@progress/kendo-angular-dialog";
7
+ import * as i4 from "@memberjunction/ng-ai-test-harness";
8
+ import * as i5 from "./agent-filter-panel.component";
6
9
  const _forTrack0 = ($index, $item) => $item.ID;
7
10
  function AgentConfigurationComponent_Conditional_8_Template(rf, ctx) { if (rf & 1) {
8
11
  i0.ɵɵtext(0, " Hide Filters ");
@@ -11,16 +14,16 @@ function AgentConfigurationComponent_Conditional_9_Template(rf, ctx) { if (rf &
11
14
  i0.ɵɵtext(0, " Show Filters ");
12
15
  } }
13
16
  function AgentConfigurationComponent_Conditional_27_Template(rf, ctx) { if (rf & 1) {
14
- i0.ɵɵelementStart(0, "div", 22)(1, "div", 23)(2, "div", 24);
15
- i0.ɵɵelement(3, "div", 25)(4, "div", 25)(5, "div", 25);
17
+ i0.ɵɵelementStart(0, "div", 22)(1, "div", 24)(2, "div", 25);
18
+ i0.ɵɵelement(3, "div", 26)(4, "div", 26)(5, "div", 26);
16
19
  i0.ɵɵelementEnd();
17
- i0.ɵɵelementStart(6, "div", 26);
20
+ i0.ɵɵelementStart(6, "div", 27);
18
21
  i0.ɵɵtext(7, "Loading agents...");
19
22
  i0.ɵɵelementEnd()()();
20
23
  } }
21
24
  function AgentConfigurationComponent_Conditional_28_Conditional_0_Template(rf, ctx) { if (rf & 1) {
22
25
  const _r1 = i0.ɵɵgetCurrentView();
23
- i0.ɵɵelementStart(0, "div", 27);
26
+ i0.ɵɵelementStart(0, "div", 28);
24
27
  i0.ɵɵelement(1, "i", 4);
25
28
  i0.ɵɵelementStart(2, "h3");
26
29
  i0.ɵɵtext(3, "No agents found");
@@ -28,15 +31,15 @@ function AgentConfigurationComponent_Conditional_28_Conditional_0_Template(rf, c
28
31
  i0.ɵɵelementStart(4, "p");
29
32
  i0.ɵɵtext(5, "No agents match your current filters. Try adjusting your search criteria or create a new agent.");
30
33
  i0.ɵɵelementEnd();
31
- i0.ɵɵelementStart(6, "button", 28);
34
+ i0.ɵɵelementStart(6, "button", 29);
32
35
  i0.ɵɵlistener("click", function AgentConfigurationComponent_Conditional_28_Conditional_0_Template_button_click_6_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.createNewAgent()); });
33
36
  i0.ɵɵelement(7, "i", 15);
34
37
  i0.ɵɵtext(8, " Create New Agent ");
35
38
  i0.ɵɵelementEnd()();
36
39
  } }
37
40
  function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_12_Template(rf, ctx) { if (rf & 1) {
38
- i0.ɵɵelementStart(0, "span", 39);
39
- i0.ɵɵelement(1, "i", 51);
41
+ i0.ɵɵelementStart(0, "span", 40);
42
+ i0.ɵɵelement(1, "i", 52);
40
43
  i0.ɵɵtext(2);
41
44
  i0.ɵɵelementEnd();
42
45
  } if (rf & 2) {
@@ -46,13 +49,13 @@ function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_
46
49
  i0.ɵɵtextInterpolate1(" ", agent_r4.Status, " ");
47
50
  } }
48
51
  function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_13_Template(rf, ctx) { if (rf & 1) {
49
- i0.ɵɵelementStart(0, "span", 39);
50
- i0.ɵɵelement(1, "i", 52);
52
+ i0.ɵɵelementStart(0, "span", 40);
53
+ i0.ɵɵelement(1, "i", 53);
51
54
  i0.ɵɵtext(2, " Exposed ");
52
55
  i0.ɵɵelementEnd();
53
56
  } }
54
57
  function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_16_Template(rf, ctx) { if (rf & 1) {
55
- i0.ɵɵelementStart(0, "p", 44);
58
+ i0.ɵɵelementStart(0, "p", 45);
56
59
  i0.ɵɵtext(1);
57
60
  i0.ɵɵelementEnd();
58
61
  } if (rf & 2) {
@@ -61,15 +64,15 @@ function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_
61
64
  i0.ɵɵtextInterpolate(agent_r4.Description);
62
65
  } }
63
66
  function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_17_Template(rf, ctx) { if (rf & 1) {
64
- i0.ɵɵelementStart(0, "p", 45);
67
+ i0.ɵɵelementStart(0, "p", 46);
65
68
  i0.ɵɵtext(1, "No description provided");
66
69
  i0.ɵɵelementEnd();
67
70
  } }
68
71
  function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_18_Conditional_2_Template(rf, ctx) { if (rf & 1) {
69
- i0.ɵɵelementStart(0, "div", 54)(1, "span", 55);
72
+ i0.ɵɵelementStart(0, "div", 55)(1, "span", 56);
70
73
  i0.ɵɵtext(2, "Parent");
71
74
  i0.ɵɵelementEnd();
72
- i0.ɵɵelementStart(3, "span", 56);
75
+ i0.ɵɵelementStart(3, "span", 57);
73
76
  i0.ɵɵtext(4);
74
77
  i0.ɵɵelementEnd()();
75
78
  } if (rf & 2) {
@@ -78,20 +81,20 @@ function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_
78
81
  i0.ɵɵtextInterpolate(agent_r4.Parent);
79
82
  } }
80
83
  function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_18_Conditional_7_Template(rf, ctx) { if (rf & 1) {
81
- i0.ɵɵelement(0, "i", 57);
84
+ i0.ɵɵelement(0, "i", 58);
82
85
  i0.ɵɵtext(1, " Enabled ");
83
86
  } }
84
87
  function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_18_Conditional_8_Template(rf, ctx) { if (rf & 1) {
85
- i0.ɵɵelement(0, "i", 58);
88
+ i0.ɵɵelement(0, "i", 59);
86
89
  i0.ɵɵtext(1, " Disabled ");
87
90
  } }
88
91
  function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_18_Template(rf, ctx) { if (rf & 1) {
89
- i0.ɵɵelementStart(0, "div", 46)(1, "div", 53);
90
- i0.ɵɵtemplate(2, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_18_Conditional_2_Template, 5, 1, "div", 54);
91
- i0.ɵɵelementStart(3, "div", 54)(4, "span", 55);
92
+ i0.ɵɵelementStart(0, "div", 47)(1, "div", 54);
93
+ i0.ɵɵtemplate(2, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_18_Conditional_2_Template, 5, 1, "div", 55);
94
+ i0.ɵɵelementStart(3, "div", 55)(4, "span", 56);
92
95
  i0.ɵɵtext(5, "Context Compression");
93
96
  i0.ɵɵelementEnd();
94
- i0.ɵɵelementStart(6, "span", 56);
97
+ i0.ɵɵelementStart(6, "span", 57);
95
98
  i0.ɵɵtemplate(7, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_18_Conditional_7_Template, 2, 0)(8, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_18_Conditional_8_Template, 2, 0);
96
99
  i0.ɵɵelementEnd()()()();
97
100
  } if (rf & 2) {
@@ -103,39 +106,39 @@ function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_
103
106
  } }
104
107
  function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_23_Template(rf, ctx) { if (rf & 1) {
105
108
  const _r5 = i0.ɵɵgetCurrentView();
106
- i0.ɵɵelementStart(0, "button", 59);
109
+ i0.ɵɵelementStart(0, "button", 60);
107
110
  i0.ɵɵlistener("click", function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_23_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r5); const agent_r4 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.runAgent(agent_r4)); });
108
- i0.ɵɵelement(1, "i", 60);
111
+ i0.ɵɵelement(1, "i", 61);
109
112
  i0.ɵɵtext(2, " Run ");
110
113
  i0.ɵɵelementEnd();
111
114
  } }
112
115
  function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Template(rf, ctx) { if (rf & 1) {
113
116
  const _r3 = i0.ɵɵgetCurrentView();
114
- i0.ɵɵelementStart(0, "div", 32)(1, "div", 33);
117
+ i0.ɵɵelementStart(0, "div", 33)(1, "div", 34);
115
118
  i0.ɵɵlistener("click", function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Template_div_click_1_listener() { const agent_r4 = i0.ɵɵrestoreView(_r3).$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.toggleAgentExpansion(agent_r4.ID)); });
116
- i0.ɵɵelementStart(2, "div", 34)(3, "div", 35);
119
+ i0.ɵɵelementStart(2, "div", 35)(3, "div", 36);
117
120
  i0.ɵɵelement(4, "i");
118
121
  i0.ɵɵelementEnd();
119
- i0.ɵɵelementStart(5, "div", 36)(6, "h4", 37);
122
+ i0.ɵɵelementStart(5, "div", 37)(6, "h4", 38);
120
123
  i0.ɵɵtext(7);
121
124
  i0.ɵɵelementEnd();
122
- i0.ɵɵelementStart(8, "div", 38)(9, "span", 39);
123
- i0.ɵɵelement(10, "i", 40);
125
+ i0.ɵɵelementStart(8, "div", 39)(9, "span", 40);
126
+ i0.ɵɵelement(10, "i", 41);
124
127
  i0.ɵɵtext(11);
125
128
  i0.ɵɵelementEnd();
126
- i0.ɵɵtemplate(12, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_12_Template, 3, 3, "span", 41)(13, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_13_Template, 3, 0, "span", 39);
129
+ i0.ɵɵtemplate(12, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_12_Template, 3, 3, "span", 42)(13, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_13_Template, 3, 0, "span", 40);
127
130
  i0.ɵɵelementEnd()()();
128
- i0.ɵɵelement(14, "i", 42);
131
+ i0.ɵɵelement(14, "i", 43);
129
132
  i0.ɵɵelementEnd();
130
- i0.ɵɵelementStart(15, "div", 43);
131
- i0.ɵɵtemplate(16, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_16_Template, 2, 1, "p", 44)(17, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_17_Template, 2, 0, "p", 45)(18, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_18_Template, 9, 2, "div", 46);
133
+ i0.ɵɵelementStart(15, "div", 44);
134
+ i0.ɵɵtemplate(16, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_16_Template, 2, 1, "p", 45)(17, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_17_Template, 2, 0, "p", 46)(18, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_18_Template, 9, 2, "div", 47);
132
135
  i0.ɵɵelementEnd();
133
- i0.ɵɵelementStart(19, "div", 47)(20, "button", 48);
136
+ i0.ɵɵelementStart(19, "div", 48)(20, "button", 49);
134
137
  i0.ɵɵlistener("click", function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Template_button_click_20_listener() { const agent_r4 = i0.ɵɵrestoreView(_r3).$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.openAgentRecord(agent_r4.ID)); });
135
- i0.ɵɵelement(21, "i", 49);
138
+ i0.ɵɵelement(21, "i", 50);
136
139
  i0.ɵɵtext(22, " Open ");
137
140
  i0.ɵɵelementEnd();
138
- i0.ɵɵtemplate(23, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_23_Template, 3, 0, "button", 50);
141
+ i0.ɵɵtemplate(23, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Conditional_23_Template, 3, 0, "button", 51);
139
142
  i0.ɵɵelementEnd()();
140
143
  } if (rf & 2) {
141
144
  const agent_r4 = ctx.$implicit;
@@ -163,8 +166,8 @@ function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_
163
166
  i0.ɵɵconditional(agent_r4.Status === "Active" ? 23 : -1);
164
167
  } }
165
168
  function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_Template(rf, ctx) { if (rf & 1) {
166
- i0.ɵɵelementStart(0, "div", 29);
167
- i0.ɵɵrepeaterCreate(1, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Template, 24, 15, "div", 31, _forTrack0);
169
+ i0.ɵɵelementStart(0, "div", 30);
170
+ i0.ɵɵrepeaterCreate(1, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_For_2_Template, 24, 15, "div", 32, _forTrack0);
168
171
  i0.ɵɵelementEnd();
169
172
  } if (rf & 2) {
170
173
  const ctx_r1 = i0.ɵɵnextContext(3);
@@ -172,7 +175,7 @@ function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_
172
175
  i0.ɵɵrepeater(ctx_r1.filteredAgents);
173
176
  } }
174
177
  function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_For_14_Conditional_8_Template(rf, ctx) { if (rf & 1) {
175
- i0.ɵɵelementStart(0, "div", 64);
178
+ i0.ɵɵelementStart(0, "div", 65);
176
179
  i0.ɵɵtext(1);
177
180
  i0.ɵɵelementEnd();
178
181
  } if (rf & 2) {
@@ -182,33 +185,33 @@ function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_
182
185
  } }
183
186
  function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_For_14_Conditional_20_Template(rf, ctx) { if (rf & 1) {
184
187
  const _r8 = i0.ɵɵgetCurrentView();
185
- i0.ɵɵelementStart(0, "button", 70);
188
+ i0.ɵɵelementStart(0, "button", 71);
186
189
  i0.ɵɵlistener("click", function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_For_14_Conditional_20_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r8); const agent_r7 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.runAgent(agent_r7)); });
187
- i0.ɵɵelement(1, "i", 60);
190
+ i0.ɵɵelement(1, "i", 61);
188
191
  i0.ɵɵelementEnd();
189
192
  } }
190
193
  function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_For_14_Template(rf, ctx) { if (rf & 1) {
191
194
  const _r6 = i0.ɵɵgetCurrentView();
192
- i0.ɵɵelementStart(0, "tr")(1, "td")(2, "div", 62)(3, "div", 63);
195
+ i0.ɵɵelementStart(0, "tr")(1, "td")(2, "div", 63)(3, "div", 64);
193
196
  i0.ɵɵelement(4, "i");
194
197
  i0.ɵɵelementEnd();
195
- i0.ɵɵelementStart(5, "div")(6, "div", 37);
198
+ i0.ɵɵelementStart(5, "div")(6, "div", 38);
196
199
  i0.ɵɵtext(7);
197
200
  i0.ɵɵelementEnd();
198
- i0.ɵɵtemplate(8, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_For_14_Conditional_8_Template, 2, 1, "div", 64);
201
+ i0.ɵɵtemplate(8, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_For_14_Conditional_8_Template, 2, 1, "div", 65);
199
202
  i0.ɵɵelementEnd()()();
200
- i0.ɵɵelementStart(9, "td")(10, "span", 65);
203
+ i0.ɵɵelementStart(9, "td")(10, "span", 66);
201
204
  i0.ɵɵtext(11);
202
205
  i0.ɵɵelementEnd()();
203
- i0.ɵɵelementStart(12, "td")(13, "span", 66);
206
+ i0.ɵɵelementStart(12, "td")(13, "span", 67);
204
207
  i0.ɵɵelement(14, "i");
205
208
  i0.ɵɵtext(15);
206
209
  i0.ɵɵelementEnd()();
207
- i0.ɵɵelementStart(16, "td")(17, "div", 67)(18, "button", 68);
210
+ i0.ɵɵelementStart(16, "td")(17, "div", 68)(18, "button", 69);
208
211
  i0.ɵɵlistener("click", function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_For_14_Template_button_click_18_listener() { const agent_r7 = i0.ɵɵrestoreView(_r6).$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.openAgentRecord(agent_r7.ID)); });
209
- i0.ɵɵelement(19, "i", 49);
212
+ i0.ɵɵelement(19, "i", 50);
210
213
  i0.ɵɵelementEnd();
211
- i0.ɵɵtemplate(20, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_For_14_Conditional_20_Template, 2, 0, "button", 69);
214
+ i0.ɵɵtemplate(20, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_For_14_Conditional_20_Template, 2, 0, "button", 70);
212
215
  i0.ɵɵelementEnd()()();
213
216
  } if (rf & 2) {
214
217
  const agent_r7 = ctx.$implicit;
@@ -233,7 +236,7 @@ function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_
233
236
  i0.ɵɵconditional(agent_r7.Status === "Active" ? 20 : -1);
234
237
  } }
235
238
  function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_Template(rf, ctx) { if (rf & 1) {
236
- i0.ɵɵelementStart(0, "div", 30)(1, "table", 61)(2, "thead")(3, "tr")(4, "th");
239
+ i0.ɵɵelementStart(0, "div", 31)(1, "table", 62)(2, "thead")(3, "tr")(4, "th");
237
240
  i0.ɵɵtext(5, "Name");
238
241
  i0.ɵɵelementEnd();
239
242
  i0.ɵɵelementStart(6, "th");
@@ -254,7 +257,7 @@ function AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_
254
257
  i0.ɵɵrepeater(ctx_r1.filteredAgents);
255
258
  } }
256
259
  function AgentConfigurationComponent_Conditional_28_Conditional_1_Template(rf, ctx) { if (rf & 1) {
257
- i0.ɵɵtemplate(0, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_Template, 3, 0, "div", 29)(1, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_Template, 15, 0, "div", 30);
260
+ i0.ɵɵtemplate(0, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_0_Template, 3, 0, "div", 30)(1, AgentConfigurationComponent_Conditional_28_Conditional_1_Conditional_1_Template, 15, 0, "div", 31);
258
261
  } if (rf & 2) {
259
262
  const ctx_r1 = i0.ɵɵnextContext(2);
260
263
  i0.ɵɵconditional(ctx_r1.viewMode === "grid" ? 0 : -1);
@@ -262,12 +265,28 @@ function AgentConfigurationComponent_Conditional_28_Conditional_1_Template(rf, c
262
265
  i0.ɵɵconditional(ctx_r1.viewMode === "list" ? 1 : -1);
263
266
  } }
264
267
  function AgentConfigurationComponent_Conditional_28_Template(rf, ctx) { if (rf & 1) {
265
- i0.ɵɵtemplate(0, AgentConfigurationComponent_Conditional_28_Conditional_0_Template, 9, 0, "div", 27)(1, AgentConfigurationComponent_Conditional_28_Conditional_1_Template, 2, 2);
268
+ i0.ɵɵtemplate(0, AgentConfigurationComponent_Conditional_28_Conditional_0_Template, 9, 0, "div", 28)(1, AgentConfigurationComponent_Conditional_28_Conditional_1_Template, 2, 2);
266
269
  } if (rf & 2) {
267
270
  const ctx_r1 = i0.ɵɵnextContext();
268
271
  i0.ɵɵconditional(ctx_r1.filteredAgents.length === 0 ? 0 : 1);
269
272
  } }
273
+ function AgentConfigurationComponent_Conditional_29_Template(rf, ctx) { if (rf & 1) {
274
+ const _r9 = i0.ɵɵgetCurrentView();
275
+ i0.ɵɵelementStart(0, "kendo-window", 72);
276
+ i0.ɵɵlistener("close", function AgentConfigurationComponent_Conditional_29_Template_kendo_window_close_0_listener() { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.closeTestHarness()); });
277
+ i0.ɵɵelementStart(1, "mj-ai-test-harness", 73);
278
+ i0.ɵɵlistener("visibilityChange", function AgentConfigurationComponent_Conditional_29_Template_mj_ai_test_harness_visibilityChange_1_listener() { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.closeTestHarness()); });
279
+ i0.ɵɵelementEnd()();
280
+ } if (rf & 2) {
281
+ const ctx_r1 = i0.ɵɵnextContext();
282
+ i0.ɵɵpropertyInterpolate1("title", "Run AI Agent - ", ctx_r1.selectedAgentForTest.Name || "Untitled", "");
283
+ i0.ɵɵproperty("width", 1200)("height", 800)("minWidth", 800)("minHeight", 600)("draggable", true)("resizable", true)("state", "default");
284
+ i0.ɵɵadvance();
285
+ i0.ɵɵproperty("aiAgent", ctx_r1.selectedAgentForTest)("isVisible", true);
286
+ } }
270
287
  export class AgentConfigurationComponent {
288
+ newAgentDialogService;
289
+ viewContainerRef;
271
290
  initialState = null;
272
291
  openEntityRecord = new EventEmitter();
273
292
  stateChange = new EventEmitter();
@@ -285,7 +304,11 @@ export class AgentConfigurationComponent {
285
304
  executionMode: 'all',
286
305
  exposeAsAction: 'all'
287
306
  };
288
- constructor() { }
307
+ selectedAgentForTest = null;
308
+ constructor(newAgentDialogService, viewContainerRef) {
309
+ this.newAgentDialogService = newAgentDialogService;
310
+ this.viewContainerRef = viewContainerRef;
311
+ }
289
312
  ngOnInit() {
290
313
  if (this.initialState) {
291
314
  this.applyInitialState(this.initialState);
@@ -317,9 +340,10 @@ export class AgentConfigurationComponent {
317
340
  EntityName: 'AI Agents',
318
341
  ExtraFilter: '',
319
342
  OrderBy: 'Name',
320
- MaxRows: 1000
343
+ MaxRows: 1000,
344
+ ResultType: 'entity_object'
321
345
  });
322
- this.agents = result.Results;
346
+ this.agents = result.Results || [];
323
347
  this.filteredAgents = [...this.agents];
324
348
  }
325
349
  catch (error) {
@@ -417,13 +441,18 @@ export class AgentConfigurationComponent {
417
441
  this.openEntityRecord.emit({ entityName: 'AI Agents', recordId: agentId });
418
442
  }
419
443
  createNewAgent() {
420
- // Emit event to open a new agent form
421
- const compositeKey = new CompositeKey([]);
422
- this.openEntityRecord.emit({ entityName: 'AI Agents', recordId: '' });
444
+ this.newAgentDialogService.openForNewAgent(this.viewContainerRef).subscribe(result => {
445
+ if (result.action === 'created' && result.agent) {
446
+ // Reload the agents list to show the new agent
447
+ this.loadAgents();
448
+ }
449
+ });
450
+ }
451
+ runAgent(agent) {
452
+ this.selectedAgentForTest = agent;
423
453
  }
424
- async runAgent(agent) {
425
- // Emit event to open test harness for the agent
426
- this.openEntityRecord.emit({ entityName: 'AI Agents', recordId: agent.ID });
454
+ closeTestHarness() {
455
+ this.selectedAgentForTest = null;
427
456
  }
428
457
  getAgentIconColor(agent) {
429
458
  // Generate a consistent color based on agent properties
@@ -448,8 +477,8 @@ export class AgentConfigurationComponent {
448
477
  default: return 'fa-solid fa-robot';
449
478
  }
450
479
  }
451
- static ɵfac = function AgentConfigurationComponent_Factory(t) { return new (t || AgentConfigurationComponent)(); };
452
- static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: AgentConfigurationComponent, selectors: [["app-agent-configuration"]], inputs: { initialState: "initialState" }, outputs: { openEntityRecord: "openEntityRecord", stateChange: "stateChange" }, decls: 29, vars: 18, consts: [[1, "agent-configuration-container"], [1, "dashboard-header"], [1, "header-info"], [1, "dashboard-title"], [1, "fa-solid", "fa-robot"], ["type", "button", "title", "Toggle Filters", 1, "filter-toggle-btn", 3, "click"], [1, "fa-solid", "fa-filter"], [1, "item-count"], [1, "header-controls"], [1, "view-toggle"], ["type", "button", "title", "Grid View", 1, "view-btn", 3, "click"], [1, "fa-solid", "fa-grip"], ["type", "button", "title", "List View", 1, "view-btn", 3, "click"], [1, "fa-solid", "fa-list"], ["type", "button", "title", "Create New Agent", 1, "control-btn", "primary", 3, "click"], [1, "fa-solid", "fa-plus"], [1, "main-content"], ["orientation", "horizontal", 1, "main-splitter", 3, "layoutChange"], [3, "size", "collapsible", "resizable", "scrollable", "hidden"], [3, "filtersChange", "filterChange", "resetFilters", "closePanel", "agents", "filteredAgents", "filters"], [3, "resizable", "scrollable"], [1, "agents-content"], [1, "loading-container"], [1, "loading-content"], [1, "loading-spinner"], [1, "spinner-ring"], [1, "loading-text"], [1, "empty-state"], ["type", "button", 1, "empty-state-btn", 3, "click"], [1, "agents-grid"], [1, "agents-list"], [1, "agent-card", 3, "expanded"], [1, "agent-card"], [1, "card-header", 3, "click"], [1, "agent-info"], [1, "agent-icon"], [1, "agent-details"], [1, "agent-name"], [1, "agent-meta"], [1, "meta-item"], [1, "fa-solid", "fa-microchip"], [1, "meta-item", 3, "class"], [1, "fa-solid", "fa-chevron-down", "expand-icon"], [1, "card-body"], [1, "agent-description"], [1, "agent-description", "text-muted"], [1, "expanded-content"], [1, "card-actions"], ["type", "button", "title", "Open Agent", 1, "action-btn", 3, "click"], [1, "fa-solid", "fa-external-link-alt"], ["type", "button", "title", "Run Agent", 1, "action-btn", "action-btn-primary"], [1, "fa-solid", "fa-circle", 2, "font-size", "8px"], [1, "fa-solid", "fa-bolt"], [1, "agent-stats"], [1, "stat-item"], [1, "stat-label"], [1, "stat-value"], [1, "fa-solid", "fa-check", 2, "color", "#28a745"], [1, "fa-solid", "fa-times", 2, "color", "#dc3545"], ["type", "button", "title", "Run Agent", 1, "action-btn", "action-btn-primary", 3, "click"], [1, "fa-solid", "fa-play"], [1, "agents-table"], [1, "agent-name-cell"], [1, "agent-icon-small"], [1, "agent-description-small"], [1, "status-badge"], [1, "execution-mode"], [1, "table-actions"], ["type", "button", "title", "Open Agent", 1, "action-btn-small", 3, "click"], ["type", "button", "title", "Run Agent", 1, "action-btn-small", "primary"], ["type", "button", "title", "Run Agent", 1, "action-btn-small", "primary", 3, "click"]], template: function AgentConfigurationComponent_Template(rf, ctx) { if (rf & 1) {
480
+ static ɵfac = function AgentConfigurationComponent_Factory(t) { return new (t || AgentConfigurationComponent)(i0.ɵɵdirectiveInject(i1.NewAgentDialogService), i0.ɵɵdirectiveInject(i0.ViewContainerRef)); };
481
+ static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: AgentConfigurationComponent, selectors: [["app-agent-configuration"]], inputs: { initialState: "initialState" }, outputs: { openEntityRecord: "openEntityRecord", stateChange: "stateChange" }, decls: 30, vars: 19, consts: [[1, "agent-configuration-container"], [1, "dashboard-header"], [1, "header-info"], [1, "dashboard-title"], [1, "fa-solid", "fa-robot"], ["type", "button", "title", "Toggle Filters", 1, "filter-toggle-btn", 3, "click"], [1, "fa-solid", "fa-filter"], [1, "item-count"], [1, "header-controls"], [1, "view-toggle"], ["type", "button", "title", "Grid View", 1, "view-btn", 3, "click"], [1, "fa-solid", "fa-grip"], ["type", "button", "title", "List View", 1, "view-btn", 3, "click"], [1, "fa-solid", "fa-list"], ["type", "button", "title", "Create New Agent", 1, "control-btn", "primary", 3, "click"], [1, "fa-solid", "fa-plus"], [1, "main-content"], ["orientation", "horizontal", 1, "main-splitter", 3, "layoutChange"], [3, "size", "collapsible", "resizable", "scrollable", "hidden"], [3, "filtersChange", "filterChange", "resetFilters", "closePanel", "agents", "filteredAgents", "filters"], [3, "resizable", "scrollable"], [1, "agents-content"], [1, "loading-container"], [3, "width", "height", "minWidth", "minHeight", "draggable", "resizable", "state", "title"], [1, "loading-content"], [1, "loading-spinner"], [1, "spinner-ring"], [1, "loading-text"], [1, "empty-state"], ["type", "button", 1, "empty-state-btn", 3, "click"], [1, "agents-grid"], [1, "agents-list"], [1, "agent-card", 3, "expanded"], [1, "agent-card"], [1, "card-header", 3, "click"], [1, "agent-info"], [1, "agent-icon"], [1, "agent-details"], [1, "agent-name"], [1, "agent-meta"], [1, "meta-item"], [1, "fa-solid", "fa-microchip"], [1, "meta-item", 3, "class"], [1, "fa-solid", "fa-chevron-down", "expand-icon"], [1, "card-body"], [1, "agent-description"], [1, "agent-description", "text-muted"], [1, "expanded-content"], [1, "card-actions"], ["type", "button", "title", "Open Agent", 1, "action-btn", 3, "click"], [1, "fa-solid", "fa-external-link-alt"], ["type", "button", "title", "Run Agent", 1, "action-btn", "action-btn-primary"], [1, "fa-solid", "fa-circle", 2, "font-size", "8px"], [1, "fa-solid", "fa-bolt"], [1, "agent-stats"], [1, "stat-item"], [1, "stat-label"], [1, "stat-value"], [1, "fa-solid", "fa-check", 2, "color", "#28a745"], [1, "fa-solid", "fa-times", 2, "color", "#dc3545"], ["type", "button", "title", "Run Agent", 1, "action-btn", "action-btn-primary", 3, "click"], [1, "fa-solid", "fa-play"], [1, "agents-table"], [1, "agent-name-cell"], [1, "agent-icon-small"], [1, "agent-description-small"], [1, "status-badge"], [1, "execution-mode"], [1, "table-actions"], ["type", "button", "title", "Open Agent", 1, "action-btn-small", 3, "click"], ["type", "button", "title", "Run Agent", 1, "action-btn-small", "primary"], ["type", "button", "title", "Run Agent", 1, "action-btn-small", "primary", 3, "click"], [3, "close", "width", "height", "minWidth", "minHeight", "draggable", "resizable", "state", "title"], [3, "visibilityChange", "aiAgent", "isVisible"]], template: function AgentConfigurationComponent_Template(rf, ctx) { if (rf & 1) {
453
482
  i0.ɵɵelementStart(0, "div", 0)(1, "div", 1)(2, "div", 2)(3, "h2", 3);
454
483
  i0.ɵɵelement(4, "i", 4);
455
484
  i0.ɵɵtext(5, " Agent Configuration ");
@@ -483,6 +512,7 @@ export class AgentConfigurationComponent {
483
512
  i0.ɵɵelementStart(25, "kendo-splitter-pane", 20)(26, "div", 21);
484
513
  i0.ɵɵtemplate(27, AgentConfigurationComponent_Conditional_27_Template, 8, 0, "div", 22)(28, AgentConfigurationComponent_Conditional_28_Template, 2, 1);
485
514
  i0.ɵɵelementEnd()()()()();
515
+ i0.ɵɵtemplate(29, AgentConfigurationComponent_Conditional_29_Template, 2, 11, "kendo-window", 23);
486
516
  } if (rf & 2) {
487
517
  i0.ɵɵadvance(8);
488
518
  i0.ɵɵconditional(ctx.filterPanelVisible ? 8 : 9);
@@ -502,17 +532,19 @@ export class AgentConfigurationComponent {
502
532
  i0.ɵɵconditional(ctx.isLoading ? 27 : -1);
503
533
  i0.ɵɵadvance();
504
534
  i0.ɵɵconditional(!ctx.isLoading ? 28 : -1);
505
- } }, dependencies: [i1.SplitterComponent, i1.SplitterPaneComponent, i2.AgentFilterPanelComponent], styles: ["\n\n.agent-configuration-container[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n height: 100%;\n background: #f5f7fa;\n}\n\n\n\n.dashboard-header[_ngcontent-%COMP%] {\n background: white;\n padding: 16px 24px;\n border-bottom: 1px solid #e0e6ed;\n display: flex;\n justify-content: space-between;\n align-items: center;\n box-shadow: 0 2px 4px rgba(0,0,0,0.04);\n}\n\n.header-info[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n.dashboard-title[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 20px;\n font-weight: 600;\n color: #2c3e50;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.dashboard-title[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #17a2b8;\n}\n\n.filter-toggle-btn[_ngcontent-%COMP%] {\n background: #f8f9fa;\n border: 1px solid #dee2e6;\n padding: 8px 16px;\n border-radius: 6px;\n font-size: 14px;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.filter-toggle-btn[_ngcontent-%COMP%]:hover {\n background: #e9ecef;\n border-color: #ced4da;\n}\n\n.item-count[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 14px;\n font-weight: 500;\n}\n\n.header-controls[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n\n\n.view-toggle[_ngcontent-%COMP%] {\n display: flex;\n background: #f8f9fa;\n border-radius: 6px;\n padding: 2px;\n border: 1px solid #dee2e6;\n}\n\n.view-btn[_ngcontent-%COMP%] {\n background: transparent;\n border: none;\n padding: 6px 12px;\n border-radius: 4px;\n color: #6c757d;\n cursor: pointer;\n transition: all 0.2s ease;\n font-size: 16px;\n}\n\n.view-btn[_ngcontent-%COMP%]:hover {\n color: #495057;\n}\n\n.view-btn.active[_ngcontent-%COMP%] {\n background: white;\n color: #17a2b8;\n box-shadow: 0 1px 2px rgba(0,0,0,0.08);\n}\n\n.control-btn[_ngcontent-%COMP%] {\n background: white;\n border: 1px solid #dee2e6;\n padding: 8px 16px;\n border-radius: 6px;\n font-size: 14px;\n font-weight: 500;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.control-btn[_ngcontent-%COMP%]:hover {\n background: #f8f9fa;\n border-color: #ced4da;\n}\n\n.control-btn.primary[_ngcontent-%COMP%] {\n background: #17a2b8;\n border-color: #17a2b8;\n color: white;\n}\n\n.control-btn.primary[_ngcontent-%COMP%]:hover {\n background: #1485a3;\n border-color: #1485a3;\n}\n\n\n\n.main-content[_ngcontent-%COMP%] {\n flex: 1;\n overflow: hidden;\n}\n\n.agents-content[_ngcontent-%COMP%] {\n height: 100%;\n overflow-y: auto;\n padding: 24px;\n background: #f5f7fa;\n}\n\n\n\n.agents-grid[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));\n gap: 20px;\n}\n\n.agent-card[_ngcontent-%COMP%] {\n background: white;\n border-radius: 12px;\n box-shadow: 0 2px 8px rgba(0,0,0,0.04);\n border: 1px solid #e0e6ed;\n transition: all 0.3s ease;\n overflow: hidden;\n}\n\n.agent-card[_ngcontent-%COMP%]:hover {\n box-shadow: 0 4px 16px rgba(0,0,0,0.08);\n transform: translateY(-2px);\n}\n\n.agent-card.expanded[_ngcontent-%COMP%] {\n box-shadow: 0 4px 20px rgba(0,0,0,0.12);\n}\n\n.card-header[_ngcontent-%COMP%] {\n padding: 20px;\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n cursor: pointer;\n user-select: none;\n border-bottom: 1px solid #f0f4f8;\n}\n\n.agent-info[_ngcontent-%COMP%] {\n display: flex;\n gap: 16px;\n flex: 1;\n}\n\n.agent-icon[_ngcontent-%COMP%] {\n width: 48px;\n height: 48px;\n border-radius: 10px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.agent-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: white;\n font-size: 20px;\n}\n\n.agent-details[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n}\n\n.agent-name[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n margin-bottom: 6px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.agent-meta[_ngcontent-%COMP%] {\n display: flex;\n gap: 12px;\n flex-wrap: wrap;\n}\n\n.meta-item[_ngcontent-%COMP%] {\n font-size: 13px;\n color: #6c757d;\n display: flex;\n align-items: center;\n gap: 4px;\n}\n\n.meta-item[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 12px;\n}\n\n.meta-item.status-active[_ngcontent-%COMP%] {\n color: #28a745;\n}\n\n.meta-item.status-pending[_ngcontent-%COMP%] {\n color: #ffc107;\n}\n\n.meta-item.status-disabled[_ngcontent-%COMP%] {\n color: #6c757d;\n}\n\n.expand-icon[_ngcontent-%COMP%] {\n font-size: 14px;\n color: #6c757d;\n transition: transform 0.3s ease;\n}\n\n.expand-icon.rotated[_ngcontent-%COMP%] {\n transform: rotate(180deg);\n}\n\n.card-body[_ngcontent-%COMP%] {\n padding: 0 20px 20px 20px;\n}\n\n.agent-description[_ngcontent-%COMP%] {\n margin: 16px 0 0 0;\n font-size: 14px;\n line-height: 1.6;\n color: #6c757d;\n}\n\n.agent-description.text-muted[_ngcontent-%COMP%] {\n font-style: italic;\n color: #adb5bd;\n}\n\n\n\n.expanded-content[_ngcontent-%COMP%] {\n margin-top: 16px;\n padding-top: 16px;\n border-top: 1px solid #f0f4f8;\n animation: _ngcontent-%COMP%_slideDown 0.3s ease;\n}\n\n@keyframes _ngcontent-%COMP%_slideDown {\n from {\n opacity: 0;\n transform: translateY(-10px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n.agent-stats[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));\n gap: 16px;\n}\n\n.stat-item[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n\n.stat-label[_ngcontent-%COMP%] {\n font-size: 12px;\n font-weight: 600;\n color: #6c757d;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.stat-value[_ngcontent-%COMP%] {\n font-size: 14px;\n color: #495057;\n font-weight: 500;\n}\n\n\n\n.card-actions[_ngcontent-%COMP%] {\n padding: 16px 20px;\n background: #f8f9fa;\n border-top: 1px solid #e0e6ed;\n display: flex;\n gap: 12px;\n justify-content: flex-end;\n}\n\n.action-btn[_ngcontent-%COMP%] {\n background: white;\n border: 1px solid #dee2e6;\n padding: 6px 16px;\n border-radius: 6px;\n font-size: 13px;\n font-weight: 500;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 6px;\n}\n\n.action-btn[_ngcontent-%COMP%]:hover {\n background: #f8f9fa;\n border-color: #ced4da;\n}\n\n.action-btn-primary[_ngcontent-%COMP%] {\n background: #17a2b8;\n border-color: #17a2b8;\n color: white;\n}\n\n.action-btn-primary[_ngcontent-%COMP%]:hover {\n background: #1485a3;\n border-color: #1485a3;\n}\n\n\n\n.agents-list[_ngcontent-%COMP%] {\n background: white;\n border-radius: 12px;\n box-shadow: 0 2px 8px rgba(0,0,0,0.04);\n border: 1px solid #e0e6ed;\n overflow: hidden;\n}\n\n.agents-table[_ngcontent-%COMP%] {\n width: 100%;\n border-collapse: collapse;\n}\n\n.agents-table[_ngcontent-%COMP%] thead[_ngcontent-%COMP%] {\n background: #f8f9fa;\n border-bottom: 2px solid #e0e6ed;\n}\n\n.agents-table[_ngcontent-%COMP%] th[_ngcontent-%COMP%] {\n padding: 12px 16px;\n text-align: left;\n font-size: 13px;\n font-weight: 600;\n color: #495057;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.agents-table[_ngcontent-%COMP%] tbody[_ngcontent-%COMP%] tr[_ngcontent-%COMP%] {\n border-bottom: 1px solid #f0f4f8;\n}\n\n.agents-table[_ngcontent-%COMP%] tbody[_ngcontent-%COMP%] tr[_ngcontent-%COMP%]:hover {\n background: #f8f9fa;\n}\n\n.agents-table[_ngcontent-%COMP%] td[_ngcontent-%COMP%] {\n padding: 16px;\n font-size: 14px;\n color: #495057;\n}\n\n.agent-name-cell[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n}\n\n.agent-icon-small[_ngcontent-%COMP%] {\n width: 36px;\n height: 36px;\n border-radius: 8px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.agent-icon-small[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: white;\n font-size: 16px;\n}\n\n.agent-description-small[_ngcontent-%COMP%] {\n font-size: 13px;\n color: #6c757d;\n margin-top: 2px;\n}\n\n.status-badge[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n padding: 4px 12px;\n border-radius: 16px;\n font-size: 12px;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.status-badge.status-active[_ngcontent-%COMP%] {\n background: #d4edda;\n color: #155724;\n}\n\n.status-badge.status-pending[_ngcontent-%COMP%] {\n background: #fff3cd;\n color: #856404;\n}\n\n.status-badge.status-disabled[_ngcontent-%COMP%] {\n background: #e2e3e5;\n color: #383d41;\n}\n\n.status-badge.status-unknown[_ngcontent-%COMP%] {\n background: #f8f9fa;\n color: #6c757d;\n}\n\n.execution-mode[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n}\n\n.table-actions[_ngcontent-%COMP%] {\n display: flex;\n gap: 8px;\n}\n\n.action-btn-small[_ngcontent-%COMP%] {\n background: white;\n border: 1px solid #dee2e6;\n padding: 4px 8px;\n border-radius: 4px;\n font-size: 12px;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n}\n\n.action-btn-small[_ngcontent-%COMP%]:hover {\n background: #f8f9fa;\n border-color: #ced4da;\n}\n\n.action-btn-small.primary[_ngcontent-%COMP%] {\n background: #17a2b8;\n border-color: #17a2b8;\n color: white;\n}\n\n.action-btn-small.primary[_ngcontent-%COMP%]:hover {\n background: #1485a3;\n border-color: #1485a3;\n}\n\n\n\n.empty-state[_ngcontent-%COMP%] {\n text-align: center;\n padding: 80px 20px;\n color: #6c757d;\n}\n\n.empty-state[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 64px;\n color: #dee2e6;\n margin-bottom: 24px;\n display: block;\n}\n\n.empty-state[_ngcontent-%COMP%] h3[_ngcontent-%COMP%] {\n color: #495057;\n font-weight: 600;\n margin-bottom: 12px;\n}\n\n.empty-state[_ngcontent-%COMP%] p[_ngcontent-%COMP%] {\n font-size: 15px;\n line-height: 1.6;\n max-width: 400px;\n margin: 0 auto 24px;\n}\n\n.empty-state-btn[_ngcontent-%COMP%] {\n background: #17a2b8;\n color: white;\n border: none;\n padding: 10px 24px;\n border-radius: 6px;\n font-size: 14px;\n font-weight: 500;\n cursor: pointer;\n transition: all 0.2s ease;\n display: inline-flex;\n align-items: center;\n gap: 8px;\n}\n\n.empty-state-btn[_ngcontent-%COMP%]:hover {\n background: #1485a3;\n transform: translateY(-1px);\n box-shadow: 0 2px 8px rgba(23, 162, 184, 0.3);\n}\n\n\n\n.loading-container[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 400px;\n}\n\n.loading-content[_ngcontent-%COMP%] {\n text-align: center;\n}\n\n.loading-spinner[_ngcontent-%COMP%] {\n display: inline-block;\n margin-bottom: 16px;\n}\n\n.spinner-ring[_ngcontent-%COMP%] {\n display: inline-block;\n width: 40px;\n height: 40px;\n margin: 3px;\n border-radius: 50%;\n border: 3px solid #17a2b8;\n border-color: #17a2b8 transparent #17a2b8 transparent;\n animation: _ngcontent-%COMP%_spinner-ring 1.2s linear infinite;\n}\n\n.spinner-ring[_ngcontent-%COMP%]:nth-child(2) {\n animation-delay: -0.45s;\n}\n\n.spinner-ring[_ngcontent-%COMP%]:nth-child(3) {\n animation-delay: -0.3s;\n}\n\n@keyframes _ngcontent-%COMP%_spinner-ring {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n\n.loading-text[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 14px;\n}\n\n\n\n@media (max-width: 768px) {\n .dashboard-header[_ngcontent-%COMP%] {\n flex-direction: column;\n gap: 16px;\n align-items: stretch;\n }\n \n .header-info[_ngcontent-%COMP%] {\n justify-content: space-between;\n }\n \n .header-controls[_ngcontent-%COMP%] {\n justify-content: space-between;\n }\n \n .agents-grid[_ngcontent-%COMP%] {\n grid-template-columns: 1fr;\n }\n \n .agent-stats[_ngcontent-%COMP%] {\n grid-template-columns: 1fr;\n }\n}"] });
535
+ i0.ɵɵadvance();
536
+ i0.ɵɵconditional(ctx.selectedAgentForTest ? 29 : -1);
537
+ } }, dependencies: [i2.SplitterComponent, i2.SplitterPaneComponent, i3.WindowComponent, i4.AITestHarnessComponent, i5.AgentFilterPanelComponent], styles: ["\n\n.agent-configuration-container[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n height: 100%;\n background: #f5f7fa;\n}\n\n\n\n.dashboard-header[_ngcontent-%COMP%] {\n background: white;\n padding: 16px 24px;\n border-bottom: 1px solid #e0e6ed;\n display: flex;\n justify-content: space-between;\n align-items: center;\n box-shadow: 0 2px 4px rgba(0,0,0,0.04);\n}\n\n.header-info[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n.dashboard-title[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 20px;\n font-weight: 600;\n color: #2c3e50;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.dashboard-title[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: #17a2b8;\n}\n\n.filter-toggle-btn[_ngcontent-%COMP%] {\n background: #f8f9fa;\n border: 1px solid #dee2e6;\n padding: 8px 16px;\n border-radius: 6px;\n font-size: 14px;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.filter-toggle-btn[_ngcontent-%COMP%]:hover {\n background: #e9ecef;\n border-color: #ced4da;\n}\n\n.item-count[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 14px;\n font-weight: 500;\n}\n\n.header-controls[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n\n\n.view-toggle[_ngcontent-%COMP%] {\n display: flex;\n background: #f8f9fa;\n border-radius: 6px;\n padding: 2px;\n border: 1px solid #dee2e6;\n}\n\n.view-btn[_ngcontent-%COMP%] {\n background: transparent;\n border: none;\n padding: 6px 12px;\n border-radius: 4px;\n color: #6c757d;\n cursor: pointer;\n transition: all 0.2s ease;\n font-size: 16px;\n}\n\n.view-btn[_ngcontent-%COMP%]:hover {\n color: #495057;\n}\n\n.view-btn.active[_ngcontent-%COMP%] {\n background: white;\n color: #17a2b8;\n box-shadow: 0 1px 2px rgba(0,0,0,0.08);\n}\n\n.control-btn[_ngcontent-%COMP%] {\n background: white;\n border: 1px solid #dee2e6;\n padding: 8px 16px;\n border-radius: 6px;\n font-size: 14px;\n font-weight: 500;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.control-btn[_ngcontent-%COMP%]:hover {\n background: #f8f9fa;\n border-color: #ced4da;\n}\n\n.control-btn.primary[_ngcontent-%COMP%] {\n background: #17a2b8;\n border-color: #17a2b8;\n color: white;\n}\n\n.control-btn.primary[_ngcontent-%COMP%]:hover {\n background: #1485a3;\n border-color: #1485a3;\n}\n\n\n\n.main-content[_ngcontent-%COMP%] {\n flex: 1;\n overflow: hidden;\n}\n\n.agents-content[_ngcontent-%COMP%] {\n height: 100%;\n overflow-y: auto;\n padding: 24px;\n background: #f5f7fa;\n}\n\n\n\n.agents-grid[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));\n gap: 20px;\n}\n\n.agent-card[_ngcontent-%COMP%] {\n background: white;\n border-radius: 12px;\n box-shadow: 0 2px 8px rgba(0,0,0,0.04);\n border: 1px solid #e0e6ed;\n transition: all 0.3s ease;\n overflow: hidden;\n}\n\n.agent-card[_ngcontent-%COMP%]:hover {\n box-shadow: 0 4px 16px rgba(0,0,0,0.08);\n transform: translateY(-2px);\n}\n\n.agent-card.expanded[_ngcontent-%COMP%] {\n box-shadow: 0 4px 20px rgba(0,0,0,0.12);\n}\n\n.card-header[_ngcontent-%COMP%] {\n padding: 20px;\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n cursor: pointer;\n user-select: none;\n border-bottom: 1px solid #f0f4f8;\n}\n\n.agent-info[_ngcontent-%COMP%] {\n display: flex;\n gap: 16px;\n flex: 1;\n}\n\n.agent-icon[_ngcontent-%COMP%] {\n width: 48px;\n height: 48px;\n border-radius: 10px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.agent-icon[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: white;\n font-size: 20px;\n}\n\n.agent-details[_ngcontent-%COMP%] {\n flex: 1;\n min-width: 0;\n}\n\n.agent-name[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n margin-bottom: 6px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.agent-meta[_ngcontent-%COMP%] {\n display: flex;\n gap: 12px;\n flex-wrap: wrap;\n}\n\n.meta-item[_ngcontent-%COMP%] {\n font-size: 13px;\n color: #6c757d;\n display: flex;\n align-items: center;\n gap: 4px;\n}\n\n.meta-item[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 12px;\n}\n\n.meta-item.status-active[_ngcontent-%COMP%] {\n color: #28a745;\n}\n\n.meta-item.status-pending[_ngcontent-%COMP%] {\n color: #ffc107;\n}\n\n.meta-item.status-disabled[_ngcontent-%COMP%] {\n color: #6c757d;\n}\n\n.expand-icon[_ngcontent-%COMP%] {\n font-size: 14px;\n color: #6c757d;\n transition: transform 0.3s ease;\n}\n\n.expand-icon.rotated[_ngcontent-%COMP%] {\n transform: rotate(180deg);\n}\n\n.card-body[_ngcontent-%COMP%] {\n padding: 0 20px 20px 20px;\n}\n\n.agent-description[_ngcontent-%COMP%] {\n margin: 16px 0 0 0;\n font-size: 14px;\n line-height: 1.6;\n color: #6c757d;\n}\n\n.agent-description.text-muted[_ngcontent-%COMP%] {\n font-style: italic;\n color: #adb5bd;\n}\n\n\n\n.expanded-content[_ngcontent-%COMP%] {\n margin-top: 16px;\n padding-top: 16px;\n border-top: 1px solid #f0f4f8;\n animation: _ngcontent-%COMP%_slideDown 0.3s ease;\n}\n\n@keyframes _ngcontent-%COMP%_slideDown {\n from {\n opacity: 0;\n transform: translateY(-10px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n.agent-stats[_ngcontent-%COMP%] {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));\n gap: 16px;\n}\n\n.stat-item[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n\n.stat-label[_ngcontent-%COMP%] {\n font-size: 12px;\n font-weight: 600;\n color: #6c757d;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.stat-value[_ngcontent-%COMP%] {\n font-size: 14px;\n color: #495057;\n font-weight: 500;\n}\n\n\n\n.card-actions[_ngcontent-%COMP%] {\n padding: 16px 20px;\n background: #f8f9fa;\n border-top: 1px solid #e0e6ed;\n display: flex;\n gap: 12px;\n justify-content: flex-end;\n}\n\n.action-btn[_ngcontent-%COMP%] {\n background: white;\n border: 1px solid #dee2e6;\n padding: 6px 16px;\n border-radius: 6px;\n font-size: 13px;\n font-weight: 500;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 6px;\n}\n\n.action-btn[_ngcontent-%COMP%]:hover {\n background: #f8f9fa;\n border-color: #ced4da;\n}\n\n.action-btn-primary[_ngcontent-%COMP%] {\n background: #17a2b8;\n border-color: #17a2b8;\n color: white;\n}\n\n.action-btn-primary[_ngcontent-%COMP%]:hover {\n background: #1485a3;\n border-color: #1485a3;\n}\n\n\n\n.agents-list[_ngcontent-%COMP%] {\n background: white;\n border-radius: 12px;\n box-shadow: 0 2px 8px rgba(0,0,0,0.04);\n border: 1px solid #e0e6ed;\n overflow: hidden;\n}\n\n.agents-table[_ngcontent-%COMP%] {\n width: 100%;\n border-collapse: collapse;\n}\n\n.agents-table[_ngcontent-%COMP%] thead[_ngcontent-%COMP%] {\n background: #f8f9fa;\n border-bottom: 2px solid #e0e6ed;\n}\n\n.agents-table[_ngcontent-%COMP%] th[_ngcontent-%COMP%] {\n padding: 12px 16px;\n text-align: left;\n font-size: 13px;\n font-weight: 600;\n color: #495057;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.agents-table[_ngcontent-%COMP%] tbody[_ngcontent-%COMP%] tr[_ngcontent-%COMP%] {\n border-bottom: 1px solid #f0f4f8;\n}\n\n.agents-table[_ngcontent-%COMP%] tbody[_ngcontent-%COMP%] tr[_ngcontent-%COMP%]:hover {\n background: #f8f9fa;\n}\n\n.agents-table[_ngcontent-%COMP%] td[_ngcontent-%COMP%] {\n padding: 16px;\n font-size: 14px;\n color: #495057;\n}\n\n.agent-name-cell[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 12px;\n}\n\n.agent-icon-small[_ngcontent-%COMP%] {\n width: 36px;\n height: 36px;\n border-radius: 8px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.agent-icon-small[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n color: white;\n font-size: 16px;\n}\n\n.agent-description-small[_ngcontent-%COMP%] {\n font-size: 13px;\n color: #6c757d;\n margin-top: 2px;\n}\n\n.status-badge[_ngcontent-%COMP%] {\n display: inline-flex;\n align-items: center;\n padding: 4px 12px;\n border-radius: 16px;\n font-size: 12px;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.status-badge.status-active[_ngcontent-%COMP%] {\n background: #d4edda;\n color: #155724;\n}\n\n.status-badge.status-pending[_ngcontent-%COMP%] {\n background: #fff3cd;\n color: #856404;\n}\n\n.status-badge.status-disabled[_ngcontent-%COMP%] {\n background: #e2e3e5;\n color: #383d41;\n}\n\n.status-badge.status-unknown[_ngcontent-%COMP%] {\n background: #f8f9fa;\n color: #6c757d;\n}\n\n.execution-mode[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 6px;\n}\n\n.table-actions[_ngcontent-%COMP%] {\n display: flex;\n gap: 8px;\n}\n\n.action-btn-small[_ngcontent-%COMP%] {\n background: white;\n border: 1px solid #dee2e6;\n padding: 4px 8px;\n border-radius: 4px;\n font-size: 12px;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n}\n\n.action-btn-small[_ngcontent-%COMP%]:hover {\n background: #f8f9fa;\n border-color: #ced4da;\n}\n\n.action-btn-small.primary[_ngcontent-%COMP%] {\n background: #17a2b8;\n border-color: #17a2b8;\n color: white;\n}\n\n.action-btn-small.primary[_ngcontent-%COMP%]:hover {\n background: #1485a3;\n border-color: #1485a3;\n}\n\n\n\n.empty-state[_ngcontent-%COMP%] {\n text-align: center;\n padding: 80px 20px;\n color: #6c757d;\n}\n\n.empty-state[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 64px;\n color: #dee2e6;\n margin-bottom: 24px;\n display: block;\n}\n\n.empty-state[_ngcontent-%COMP%] h3[_ngcontent-%COMP%] {\n color: #495057;\n font-weight: 600;\n margin-bottom: 12px;\n}\n\n.empty-state[_ngcontent-%COMP%] p[_ngcontent-%COMP%] {\n font-size: 15px;\n line-height: 1.6;\n max-width: 400px;\n margin: 0 auto 24px;\n}\n\n.empty-state-btn[_ngcontent-%COMP%] {\n background: #17a2b8;\n color: white;\n border: none;\n padding: 10px 24px;\n border-radius: 6px;\n font-size: 14px;\n font-weight: 500;\n cursor: pointer;\n transition: all 0.2s ease;\n display: inline-flex;\n align-items: center;\n gap: 8px;\n}\n\n.empty-state-btn[_ngcontent-%COMP%]:hover {\n background: #1485a3;\n transform: translateY(-1px);\n box-shadow: 0 2px 8px rgba(23, 162, 184, 0.3);\n}\n\n\n\n.loading-container[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 400px;\n}\n\n.loading-content[_ngcontent-%COMP%] {\n text-align: center;\n}\n\n.loading-spinner[_ngcontent-%COMP%] {\n display: inline-block;\n margin-bottom: 16px;\n}\n\n.spinner-ring[_ngcontent-%COMP%] {\n display: inline-block;\n width: 40px;\n height: 40px;\n margin: 3px;\n border-radius: 50%;\n border: 3px solid #17a2b8;\n border-color: #17a2b8 transparent #17a2b8 transparent;\n animation: _ngcontent-%COMP%_spinner-ring 1.2s linear infinite;\n}\n\n.spinner-ring[_ngcontent-%COMP%]:nth-child(2) {\n animation-delay: -0.45s;\n}\n\n.spinner-ring[_ngcontent-%COMP%]:nth-child(3) {\n animation-delay: -0.3s;\n}\n\n@keyframes _ngcontent-%COMP%_spinner-ring {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n\n.loading-text[_ngcontent-%COMP%] {\n color: #6c757d;\n font-size: 14px;\n}\n\n\n\n@media (max-width: 768px) {\n .dashboard-header[_ngcontent-%COMP%] {\n flex-direction: column;\n gap: 16px;\n align-items: stretch;\n }\n \n .header-info[_ngcontent-%COMP%] {\n justify-content: space-between;\n }\n \n .header-controls[_ngcontent-%COMP%] {\n justify-content: space-between;\n }\n \n .agents-grid[_ngcontent-%COMP%] {\n grid-template-columns: 1fr;\n }\n \n .agent-stats[_ngcontent-%COMP%] {\n grid-template-columns: 1fr;\n }\n}"] });
506
538
  }
507
539
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(AgentConfigurationComponent, [{
508
540
  type: Component,
509
- args: [{ selector: 'app-agent-configuration', template: "<div class=\"agent-configuration-container\">\n <!-- Header -->\n <div class=\"dashboard-header\">\n <div class=\"header-info\">\n <h2 class=\"dashboard-title\">\n <i class=\"fa-solid fa-robot\"></i>\n Agent Configuration\n </h2>\n <button \n type=\"button\" \n class=\"filter-toggle-btn\"\n (click)=\"toggleFilterPanel()\"\n title=\"Toggle Filters\">\n <i class=\"fa-solid fa-filter\"></i>\n @if (filterPanelVisible) {\n Hide Filters\n } @else {\n Show Filters\n }\n </button>\n <span class=\"item-count\">{{ filteredAgents.length }} agents</span>\n </div>\n \n <div class=\"header-controls\">\n <div class=\"view-toggle\">\n <button \n type=\"button\" \n class=\"view-btn\"\n [class.active]=\"viewMode === 'grid'\"\n (click)=\"setViewMode('grid')\"\n title=\"Grid View\">\n <i class=\"fa-solid fa-grip\"></i>\n </button>\n <button \n type=\"button\" \n class=\"view-btn\"\n [class.active]=\"viewMode === 'list'\"\n (click)=\"setViewMode('list')\"\n title=\"List View\">\n <i class=\"fa-solid fa-list\"></i>\n </button>\n </div>\n \n <button \n type=\"button\" \n class=\"control-btn primary\"\n (click)=\"createNewAgent()\"\n title=\"Create New Agent\">\n <i class=\"fa-solid fa-plus\"></i>\n New Agent\n </button>\n </div>\n </div>\n\n <!-- Main Content with Splitter -->\n <div class=\"main-content\" >\n <kendo-splitter \n class=\"main-splitter\"\n orientation=\"horizontal\"\n (layoutChange)=\"onMainSplitterChange($event)\"\n >\n \n <!-- Filter Panel (Left) -->\n <kendo-splitter-pane \n [size]=\"filterPanelVisible ? '320px' : '0px'\"\n [collapsible]=\"false\"\n [resizable]=\"filterPanelVisible\"\n [scrollable]=\"false\"\n [hidden]=\"!filterPanelVisible\">\n <mj-agent-filter-panel\n [agents]=\"agents\"\n [filteredAgents]=\"filteredAgents\"\n [filters]=\"currentFilters\"\n (filtersChange)=\"onFiltersChange($event)\"\n (filterChange)=\"onFilterChange()\"\n (resetFilters)=\"onResetFilters()\"\n (closePanel)=\"toggleFilterPanel()\">\n </mj-agent-filter-panel>\n </kendo-splitter-pane>\n \n <!-- Agents List Panel -->\n <kendo-splitter-pane \n [resizable]=\"true\"\n [scrollable]=\"false\">\n <div class=\"agents-content\">\n <!-- Loading State -->\n @if (isLoading) {\n <div class=\"loading-container\">\n <div class=\"loading-content\">\n <div class=\"loading-spinner\">\n <div class=\"spinner-ring\"></div>\n <div class=\"spinner-ring\"></div>\n <div class=\"spinner-ring\"></div>\n </div>\n <div class=\"loading-text\">Loading agents...</div>\n </div>\n </div>\n }\n\n <!-- Agents Display -->\n @if (!isLoading) {\n @if (filteredAgents.length === 0) {\n <div class=\"empty-state\">\n <i class=\"fa-solid fa-robot\"></i>\n <h3>No agents found</h3>\n <p>No agents match your current filters. Try adjusting your search criteria or create a new agent.</p>\n <button \n type=\"button\" \n class=\"empty-state-btn\"\n (click)=\"createNewAgent()\">\n <i class=\"fa-solid fa-plus\"></i>\n Create New Agent\n </button>\n </div>\n } @else {\n <!-- Grid View -->\n @if (viewMode === 'grid') {\n <div class=\"agents-grid\">\n @for (agent of filteredAgents; track agent.ID) {\n <div class=\"agent-card\" [class.expanded]=\"expandedAgentId === agent.ID\">\n <!-- Card Header -->\n <div class=\"card-header\" (click)=\"toggleAgentExpansion(agent.ID)\">\n <div class=\"agent-info\">\n <div class=\"agent-icon\" [style.background-color]=\"getAgentIconColor(agent)\">\n <i [class]=\"getExecutionModeIcon(agent.ExecutionMode)\"></i>\n </div>\n <div class=\"agent-details\">\n <h4 class=\"agent-name\">{{ agent.Name }}</h4>\n <div class=\"agent-meta\">\n <span class=\"meta-item\">\n <i class=\"fa-solid fa-microchip\"></i>\n {{ agent.ExecutionMode }}\n </span>\n @if (agent.Status) {\n <span class=\"meta-item\" [class]=\"'status-' + agent.Status.toLowerCase()\">\n <i class=\"fa-solid fa-circle\" style=\"font-size: 8px;\"></i>\n {{ agent.Status }}\n </span>\n }\n @if (agent.ExposeAsAction) {\n <span class=\"meta-item\">\n <i class=\"fa-solid fa-bolt\"></i>\n Exposed\n </span>\n }\n </div>\n </div>\n </div>\n \n <i class=\"fa-solid fa-chevron-down expand-icon\" \n [class.rotated]=\"expandedAgentId === agent.ID\"></i>\n </div>\n\n <!-- Card Body -->\n <div class=\"card-body\">\n @if (agent.Description) {\n <p class=\"agent-description\">{{ agent.Description }}</p>\n } @else {\n <p class=\"agent-description text-muted\">No description provided</p>\n }\n \n <!-- Expandable Content -->\n @if (expandedAgentId === agent.ID) {\n <div class=\"expanded-content\">\n <div class=\"agent-stats\">\n @if (agent.Parent) {\n <div class=\"stat-item\">\n <span class=\"stat-label\">Parent</span>\n <span class=\"stat-value\">{{ agent.Parent }}</span>\n </div>\n }\n <div class=\"stat-item\">\n <span class=\"stat-label\">Context Compression</span>\n <span class=\"stat-value\">\n @if (agent.EnableContextCompression) {\n <i class=\"fa-solid fa-check\" style=\"color: #28a745;\"></i> Enabled\n } @else {\n <i class=\"fa-solid fa-times\" style=\"color: #dc3545;\"></i> Disabled\n }\n </span>\n </div>\n </div>\n </div>\n }\n </div>\n\n <!-- Card Actions -->\n <div class=\"card-actions\">\n <button \n type=\"button\" \n class=\"action-btn\"\n (click)=\"openAgentRecord(agent.ID)\"\n title=\"Open Agent\">\n <i class=\"fa-solid fa-external-link-alt\"></i>\n Open\n </button>\n \n @if (agent.Status === 'Active') {\n <button \n type=\"button\" \n class=\"action-btn action-btn-primary\"\n (click)=\"runAgent(agent)\"\n title=\"Run Agent\">\n <i class=\"fa-solid fa-play\"></i>\n Run\n </button>\n }\n </div>\n </div>\n }\n </div>\n }\n \n <!-- List View -->\n @if (viewMode === 'list') {\n <div class=\"agents-list\">\n <table class=\"agents-table\">\n <thead>\n <tr>\n <th>Name</th>\n <th>Status</th>\n <th>Execution Mode</th>\n <th>Actions</th>\n </tr>\n </thead>\n <tbody>\n @for (agent of filteredAgents; track agent.ID) {\n <tr>\n <td>\n <div class=\"agent-name-cell\">\n <div class=\"agent-icon-small\" [style.background-color]=\"getAgentIconColor(agent)\">\n <i [class]=\"getExecutionModeIcon(agent.ExecutionMode)\"></i>\n </div>\n <div>\n <div class=\"agent-name\">{{ agent.Name }}</div>\n @if (agent.Description) {\n <div class=\"agent-description-small\">{{ agent.Description }}</div>\n }\n </div>\n </div>\n </td>\n <td>\n <span class=\"status-badge\" [class]=\"'status-' + (agent.Status || 'unknown').toLowerCase()\">\n {{ agent.Status || 'Unknown' }}\n </span>\n </td>\n <td>\n <span class=\"execution-mode\">\n <i [class]=\"getExecutionModeIcon(agent.ExecutionMode)\"></i>\n {{ agent.ExecutionMode }}\n </span>\n </td>\n <td>\n <div class=\"table-actions\">\n <button \n type=\"button\" \n class=\"action-btn-small\"\n (click)=\"openAgentRecord(agent.ID)\"\n title=\"Open Agent\">\n <i class=\"fa-solid fa-external-link-alt\"></i>\n </button>\n @if (agent.Status === 'Active') {\n <button \n type=\"button\" \n class=\"action-btn-small primary\"\n (click)=\"runAgent(agent)\"\n title=\"Run Agent\">\n <i class=\"fa-solid fa-play\"></i>\n </button>\n }\n </div>\n </td>\n </tr>\n }\n </tbody>\n </table>\n </div>\n }\n }\n }\n </div>\n </kendo-splitter-pane>\n </kendo-splitter>\n </div>\n</div>", styles: ["/* Agent Configuration Component - Modern Design */\n.agent-configuration-container {\n display: flex;\n flex-direction: column;\n height: 100%;\n background: #f5f7fa;\n}\n\n/* Dashboard Header */\n.dashboard-header {\n background: white;\n padding: 16px 24px;\n border-bottom: 1px solid #e0e6ed;\n display: flex;\n justify-content: space-between;\n align-items: center;\n box-shadow: 0 2px 4px rgba(0,0,0,0.04);\n}\n\n.header-info {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n.dashboard-title {\n margin: 0;\n font-size: 20px;\n font-weight: 600;\n color: #2c3e50;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.dashboard-title i {\n color: #17a2b8;\n}\n\n.filter-toggle-btn {\n background: #f8f9fa;\n border: 1px solid #dee2e6;\n padding: 8px 16px;\n border-radius: 6px;\n font-size: 14px;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.filter-toggle-btn:hover {\n background: #e9ecef;\n border-color: #ced4da;\n}\n\n.item-count {\n color: #6c757d;\n font-size: 14px;\n font-weight: 500;\n}\n\n.header-controls {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n/* View Toggle */\n.view-toggle {\n display: flex;\n background: #f8f9fa;\n border-radius: 6px;\n padding: 2px;\n border: 1px solid #dee2e6;\n}\n\n.view-btn {\n background: transparent;\n border: none;\n padding: 6px 12px;\n border-radius: 4px;\n color: #6c757d;\n cursor: pointer;\n transition: all 0.2s ease;\n font-size: 16px;\n}\n\n.view-btn:hover {\n color: #495057;\n}\n\n.view-btn.active {\n background: white;\n color: #17a2b8;\n box-shadow: 0 1px 2px rgba(0,0,0,0.08);\n}\n\n.control-btn {\n background: white;\n border: 1px solid #dee2e6;\n padding: 8px 16px;\n border-radius: 6px;\n font-size: 14px;\n font-weight: 500;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.control-btn:hover {\n background: #f8f9fa;\n border-color: #ced4da;\n}\n\n.control-btn.primary {\n background: #17a2b8;\n border-color: #17a2b8;\n color: white;\n}\n\n.control-btn.primary:hover {\n background: #1485a3;\n border-color: #1485a3;\n}\n\n/* Main Content */\n.main-content {\n flex: 1;\n overflow: hidden;\n}\n\n.agents-content {\n height: 100%;\n overflow-y: auto;\n padding: 24px;\n background: #f5f7fa;\n}\n\n/* Grid View */\n.agents-grid {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));\n gap: 20px;\n}\n\n.agent-card {\n background: white;\n border-radius: 12px;\n box-shadow: 0 2px 8px rgba(0,0,0,0.04);\n border: 1px solid #e0e6ed;\n transition: all 0.3s ease;\n overflow: hidden;\n}\n\n.agent-card:hover {\n box-shadow: 0 4px 16px rgba(0,0,0,0.08);\n transform: translateY(-2px);\n}\n\n.agent-card.expanded {\n box-shadow: 0 4px 20px rgba(0,0,0,0.12);\n}\n\n.card-header {\n padding: 20px;\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n cursor: pointer;\n user-select: none;\n border-bottom: 1px solid #f0f4f8;\n}\n\n.agent-info {\n display: flex;\n gap: 16px;\n flex: 1;\n}\n\n.agent-icon {\n width: 48px;\n height: 48px;\n border-radius: 10px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.agent-icon i {\n color: white;\n font-size: 20px;\n}\n\n.agent-details {\n flex: 1;\n min-width: 0;\n}\n\n.agent-name {\n margin: 0;\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n margin-bottom: 6px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.agent-meta {\n display: flex;\n gap: 12px;\n flex-wrap: wrap;\n}\n\n.meta-item {\n font-size: 13px;\n color: #6c757d;\n display: flex;\n align-items: center;\n gap: 4px;\n}\n\n.meta-item i {\n font-size: 12px;\n}\n\n.meta-item.status-active {\n color: #28a745;\n}\n\n.meta-item.status-pending {\n color: #ffc107;\n}\n\n.meta-item.status-disabled {\n color: #6c757d;\n}\n\n.expand-icon {\n font-size: 14px;\n color: #6c757d;\n transition: transform 0.3s ease;\n}\n\n.expand-icon.rotated {\n transform: rotate(180deg);\n}\n\n.card-body {\n padding: 0 20px 20px 20px;\n}\n\n.agent-description {\n margin: 16px 0 0 0;\n font-size: 14px;\n line-height: 1.6;\n color: #6c757d;\n}\n\n.agent-description.text-muted {\n font-style: italic;\n color: #adb5bd;\n}\n\n/* Expanded Content */\n.expanded-content {\n margin-top: 16px;\n padding-top: 16px;\n border-top: 1px solid #f0f4f8;\n animation: slideDown 0.3s ease;\n}\n\n@keyframes slideDown {\n from {\n opacity: 0;\n transform: translateY(-10px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n.agent-stats {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));\n gap: 16px;\n}\n\n.stat-item {\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n\n.stat-label {\n font-size: 12px;\n font-weight: 600;\n color: #6c757d;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.stat-value {\n font-size: 14px;\n color: #495057;\n font-weight: 500;\n}\n\n/* Card Actions */\n.card-actions {\n padding: 16px 20px;\n background: #f8f9fa;\n border-top: 1px solid #e0e6ed;\n display: flex;\n gap: 12px;\n justify-content: flex-end;\n}\n\n.action-btn {\n background: white;\n border: 1px solid #dee2e6;\n padding: 6px 16px;\n border-radius: 6px;\n font-size: 13px;\n font-weight: 500;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 6px;\n}\n\n.action-btn:hover {\n background: #f8f9fa;\n border-color: #ced4da;\n}\n\n.action-btn-primary {\n background: #17a2b8;\n border-color: #17a2b8;\n color: white;\n}\n\n.action-btn-primary:hover {\n background: #1485a3;\n border-color: #1485a3;\n}\n\n/* List View */\n.agents-list {\n background: white;\n border-radius: 12px;\n box-shadow: 0 2px 8px rgba(0,0,0,0.04);\n border: 1px solid #e0e6ed;\n overflow: hidden;\n}\n\n.agents-table {\n width: 100%;\n border-collapse: collapse;\n}\n\n.agents-table thead {\n background: #f8f9fa;\n border-bottom: 2px solid #e0e6ed;\n}\n\n.agents-table th {\n padding: 12px 16px;\n text-align: left;\n font-size: 13px;\n font-weight: 600;\n color: #495057;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.agents-table tbody tr {\n border-bottom: 1px solid #f0f4f8;\n}\n\n.agents-table tbody tr:hover {\n background: #f8f9fa;\n}\n\n.agents-table td {\n padding: 16px;\n font-size: 14px;\n color: #495057;\n}\n\n.agent-name-cell {\n display: flex;\n align-items: center;\n gap: 12px;\n}\n\n.agent-icon-small {\n width: 36px;\n height: 36px;\n border-radius: 8px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.agent-icon-small i {\n color: white;\n font-size: 16px;\n}\n\n.agent-description-small {\n font-size: 13px;\n color: #6c757d;\n margin-top: 2px;\n}\n\n.status-badge {\n display: inline-flex;\n align-items: center;\n padding: 4px 12px;\n border-radius: 16px;\n font-size: 12px;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.status-badge.status-active {\n background: #d4edda;\n color: #155724;\n}\n\n.status-badge.status-pending {\n background: #fff3cd;\n color: #856404;\n}\n\n.status-badge.status-disabled {\n background: #e2e3e5;\n color: #383d41;\n}\n\n.status-badge.status-unknown {\n background: #f8f9fa;\n color: #6c757d;\n}\n\n.execution-mode {\n display: flex;\n align-items: center;\n gap: 6px;\n}\n\n.table-actions {\n display: flex;\n gap: 8px;\n}\n\n.action-btn-small {\n background: white;\n border: 1px solid #dee2e6;\n padding: 4px 8px;\n border-radius: 4px;\n font-size: 12px;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n}\n\n.action-btn-small:hover {\n background: #f8f9fa;\n border-color: #ced4da;\n}\n\n.action-btn-small.primary {\n background: #17a2b8;\n border-color: #17a2b8;\n color: white;\n}\n\n.action-btn-small.primary:hover {\n background: #1485a3;\n border-color: #1485a3;\n}\n\n/* Empty State */\n.empty-state {\n text-align: center;\n padding: 80px 20px;\n color: #6c757d;\n}\n\n.empty-state i {\n font-size: 64px;\n color: #dee2e6;\n margin-bottom: 24px;\n display: block;\n}\n\n.empty-state h3 {\n color: #495057;\n font-weight: 600;\n margin-bottom: 12px;\n}\n\n.empty-state p {\n font-size: 15px;\n line-height: 1.6;\n max-width: 400px;\n margin: 0 auto 24px;\n}\n\n.empty-state-btn {\n background: #17a2b8;\n color: white;\n border: none;\n padding: 10px 24px;\n border-radius: 6px;\n font-size: 14px;\n font-weight: 500;\n cursor: pointer;\n transition: all 0.2s ease;\n display: inline-flex;\n align-items: center;\n gap: 8px;\n}\n\n.empty-state-btn:hover {\n background: #1485a3;\n transform: translateY(-1px);\n box-shadow: 0 2px 8px rgba(23, 162, 184, 0.3);\n}\n\n/* Loading State */\n.loading-container {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 400px;\n}\n\n.loading-content {\n text-align: center;\n}\n\n.loading-spinner {\n display: inline-block;\n margin-bottom: 16px;\n}\n\n.spinner-ring {\n display: inline-block;\n width: 40px;\n height: 40px;\n margin: 3px;\n border-radius: 50%;\n border: 3px solid #17a2b8;\n border-color: #17a2b8 transparent #17a2b8 transparent;\n animation: spinner-ring 1.2s linear infinite;\n}\n\n.spinner-ring:nth-child(2) {\n animation-delay: -0.45s;\n}\n\n.spinner-ring:nth-child(3) {\n animation-delay: -0.3s;\n}\n\n@keyframes spinner-ring {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n\n.loading-text {\n color: #6c757d;\n font-size: 14px;\n}\n\n/* Responsive Design */\n@media (max-width: 768px) {\n .dashboard-header {\n flex-direction: column;\n gap: 16px;\n align-items: stretch;\n }\n \n .header-info {\n justify-content: space-between;\n }\n \n .header-controls {\n justify-content: space-between;\n }\n \n .agents-grid {\n grid-template-columns: 1fr;\n }\n \n .agent-stats {\n grid-template-columns: 1fr;\n }\n}"] }]
510
- }], () => [], { initialState: [{
541
+ args: [{ selector: 'app-agent-configuration', template: "<div class=\"agent-configuration-container\">\n <!-- Header -->\n <div class=\"dashboard-header\">\n <div class=\"header-info\">\n <h2 class=\"dashboard-title\">\n <i class=\"fa-solid fa-robot\"></i>\n Agent Configuration\n </h2>\n <button \n type=\"button\" \n class=\"filter-toggle-btn\"\n (click)=\"toggleFilterPanel()\"\n title=\"Toggle Filters\">\n <i class=\"fa-solid fa-filter\"></i>\n @if (filterPanelVisible) {\n Hide Filters\n } @else {\n Show Filters\n }\n </button>\n <span class=\"item-count\">{{ filteredAgents.length }} agents</span>\n </div>\n \n <div class=\"header-controls\">\n <div class=\"view-toggle\">\n <button \n type=\"button\" \n class=\"view-btn\"\n [class.active]=\"viewMode === 'grid'\"\n (click)=\"setViewMode('grid')\"\n title=\"Grid View\">\n <i class=\"fa-solid fa-grip\"></i>\n </button>\n <button \n type=\"button\" \n class=\"view-btn\"\n [class.active]=\"viewMode === 'list'\"\n (click)=\"setViewMode('list')\"\n title=\"List View\">\n <i class=\"fa-solid fa-list\"></i>\n </button>\n </div>\n \n <button \n type=\"button\" \n class=\"control-btn primary\"\n (click)=\"createNewAgent()\"\n title=\"Create New Agent\">\n <i class=\"fa-solid fa-plus\"></i>\n New Agent\n </button>\n </div>\n </div>\n\n <!-- Main Content with Splitter -->\n <div class=\"main-content\" >\n <kendo-splitter \n class=\"main-splitter\"\n orientation=\"horizontal\"\n (layoutChange)=\"onMainSplitterChange($event)\"\n >\n \n <!-- Filter Panel (Left) -->\n <kendo-splitter-pane \n [size]=\"filterPanelVisible ? '320px' : '0px'\"\n [collapsible]=\"false\"\n [resizable]=\"filterPanelVisible\"\n [scrollable]=\"false\"\n [hidden]=\"!filterPanelVisible\">\n <mj-agent-filter-panel\n [agents]=\"agents\"\n [filteredAgents]=\"filteredAgents\"\n [filters]=\"currentFilters\"\n (filtersChange)=\"onFiltersChange($event)\"\n (filterChange)=\"onFilterChange()\"\n (resetFilters)=\"onResetFilters()\"\n (closePanel)=\"toggleFilterPanel()\">\n </mj-agent-filter-panel>\n </kendo-splitter-pane>\n \n <!-- Agents List Panel -->\n <kendo-splitter-pane \n [resizable]=\"true\"\n [scrollable]=\"false\">\n <div class=\"agents-content\">\n <!-- Loading State -->\n @if (isLoading) {\n <div class=\"loading-container\">\n <div class=\"loading-content\">\n <div class=\"loading-spinner\">\n <div class=\"spinner-ring\"></div>\n <div class=\"spinner-ring\"></div>\n <div class=\"spinner-ring\"></div>\n </div>\n <div class=\"loading-text\">Loading agents...</div>\n </div>\n </div>\n }\n\n <!-- Agents Display -->\n @if (!isLoading) {\n @if (filteredAgents.length === 0) {\n <div class=\"empty-state\">\n <i class=\"fa-solid fa-robot\"></i>\n <h3>No agents found</h3>\n <p>No agents match your current filters. Try adjusting your search criteria or create a new agent.</p>\n <button \n type=\"button\" \n class=\"empty-state-btn\"\n (click)=\"createNewAgent()\">\n <i class=\"fa-solid fa-plus\"></i>\n Create New Agent\n </button>\n </div>\n } @else {\n <!-- Grid View -->\n @if (viewMode === 'grid') {\n <div class=\"agents-grid\">\n @for (agent of filteredAgents; track agent.ID) {\n <div class=\"agent-card\" [class.expanded]=\"expandedAgentId === agent.ID\">\n <!-- Card Header -->\n <div class=\"card-header\" (click)=\"toggleAgentExpansion(agent.ID)\">\n <div class=\"agent-info\">\n <div class=\"agent-icon\" [style.background-color]=\"getAgentIconColor(agent)\">\n <i [class]=\"getExecutionModeIcon(agent.ExecutionMode)\"></i>\n </div>\n <div class=\"agent-details\">\n <h4 class=\"agent-name\">{{ agent.Name }}</h4>\n <div class=\"agent-meta\">\n <span class=\"meta-item\">\n <i class=\"fa-solid fa-microchip\"></i>\n {{ agent.ExecutionMode }}\n </span>\n @if (agent.Status) {\n <span class=\"meta-item\" [class]=\"'status-' + agent.Status.toLowerCase()\">\n <i class=\"fa-solid fa-circle\" style=\"font-size: 8px;\"></i>\n {{ agent.Status }}\n </span>\n }\n @if (agent.ExposeAsAction) {\n <span class=\"meta-item\">\n <i class=\"fa-solid fa-bolt\"></i>\n Exposed\n </span>\n }\n </div>\n </div>\n </div>\n \n <i class=\"fa-solid fa-chevron-down expand-icon\" \n [class.rotated]=\"expandedAgentId === agent.ID\"></i>\n </div>\n\n <!-- Card Body -->\n <div class=\"card-body\">\n @if (agent.Description) {\n <p class=\"agent-description\">{{ agent.Description }}</p>\n } @else {\n <p class=\"agent-description text-muted\">No description provided</p>\n }\n \n <!-- Expandable Content -->\n @if (expandedAgentId === agent.ID) {\n <div class=\"expanded-content\">\n <div class=\"agent-stats\">\n @if (agent.Parent) {\n <div class=\"stat-item\">\n <span class=\"stat-label\">Parent</span>\n <span class=\"stat-value\">{{ agent.Parent }}</span>\n </div>\n }\n <div class=\"stat-item\">\n <span class=\"stat-label\">Context Compression</span>\n <span class=\"stat-value\">\n @if (agent.EnableContextCompression) {\n <i class=\"fa-solid fa-check\" style=\"color: #28a745;\"></i> Enabled\n } @else {\n <i class=\"fa-solid fa-times\" style=\"color: #dc3545;\"></i> Disabled\n }\n </span>\n </div>\n </div>\n </div>\n }\n </div>\n\n <!-- Card Actions -->\n <div class=\"card-actions\">\n <button \n type=\"button\" \n class=\"action-btn\"\n (click)=\"openAgentRecord(agent.ID)\"\n title=\"Open Agent\">\n <i class=\"fa-solid fa-external-link-alt\"></i>\n Open\n </button>\n \n @if (agent.Status === 'Active') {\n <button \n type=\"button\" \n class=\"action-btn action-btn-primary\"\n (click)=\"runAgent(agent)\"\n title=\"Run Agent\">\n <i class=\"fa-solid fa-play\"></i>\n Run\n </button>\n }\n </div>\n </div>\n }\n </div>\n }\n \n <!-- List View -->\n @if (viewMode === 'list') {\n <div class=\"agents-list\">\n <table class=\"agents-table\">\n <thead>\n <tr>\n <th>Name</th>\n <th>Status</th>\n <th>Execution Mode</th>\n <th>Actions</th>\n </tr>\n </thead>\n <tbody>\n @for (agent of filteredAgents; track agent.ID) {\n <tr>\n <td>\n <div class=\"agent-name-cell\">\n <div class=\"agent-icon-small\" [style.background-color]=\"getAgentIconColor(agent)\">\n <i [class]=\"getExecutionModeIcon(agent.ExecutionMode)\"></i>\n </div>\n <div>\n <div class=\"agent-name\">{{ agent.Name }}</div>\n @if (agent.Description) {\n <div class=\"agent-description-small\">{{ agent.Description }}</div>\n }\n </div>\n </div>\n </td>\n <td>\n <span class=\"status-badge\" [class]=\"'status-' + (agent.Status || 'unknown').toLowerCase()\">\n {{ agent.Status || 'Unknown' }}\n </span>\n </td>\n <td>\n <span class=\"execution-mode\">\n <i [class]=\"getExecutionModeIcon(agent.ExecutionMode)\"></i>\n {{ agent.ExecutionMode }}\n </span>\n </td>\n <td>\n <div class=\"table-actions\">\n <button \n type=\"button\" \n class=\"action-btn-small\"\n (click)=\"openAgentRecord(agent.ID)\"\n title=\"Open Agent\">\n <i class=\"fa-solid fa-external-link-alt\"></i>\n </button>\n @if (agent.Status === 'Active') {\n <button \n type=\"button\" \n class=\"action-btn-small primary\"\n (click)=\"runAgent(agent)\"\n title=\"Run Agent\">\n <i class=\"fa-solid fa-play\"></i>\n </button>\n }\n </div>\n </td>\n </tr>\n }\n </tbody>\n </table>\n </div>\n }\n }\n }\n </div>\n </kendo-splitter-pane>\n </kendo-splitter>\n </div>\n</div>\n\n<!-- AI Agent Test Harness -->\n@if (selectedAgentForTest) {\n <kendo-window \n [width]=\"1200\" \n [height]=\"800\" \n [minWidth]=\"800\"\n [minHeight]=\"600\"\n [draggable]=\"true\"\n [resizable]=\"true\"\n [state]=\"'default'\"\n (close)=\"closeTestHarness()\"\n title=\"Run AI Agent - {{ selectedAgentForTest.Name || 'Untitled' }}\">\n <mj-ai-test-harness\n [aiAgent]=\"selectedAgentForTest\"\n [isVisible]=\"true\"\n (visibilityChange)=\"closeTestHarness()\">\n </mj-ai-test-harness>\n </kendo-window>\n}", styles: ["/* Agent Configuration Component - Modern Design */\n.agent-configuration-container {\n display: flex;\n flex-direction: column;\n height: 100%;\n background: #f5f7fa;\n}\n\n/* Dashboard Header */\n.dashboard-header {\n background: white;\n padding: 16px 24px;\n border-bottom: 1px solid #e0e6ed;\n display: flex;\n justify-content: space-between;\n align-items: center;\n box-shadow: 0 2px 4px rgba(0,0,0,0.04);\n}\n\n.header-info {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n.dashboard-title {\n margin: 0;\n font-size: 20px;\n font-weight: 600;\n color: #2c3e50;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.dashboard-title i {\n color: #17a2b8;\n}\n\n.filter-toggle-btn {\n background: #f8f9fa;\n border: 1px solid #dee2e6;\n padding: 8px 16px;\n border-radius: 6px;\n font-size: 14px;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.filter-toggle-btn:hover {\n background: #e9ecef;\n border-color: #ced4da;\n}\n\n.item-count {\n color: #6c757d;\n font-size: 14px;\n font-weight: 500;\n}\n\n.header-controls {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n\n/* View Toggle */\n.view-toggle {\n display: flex;\n background: #f8f9fa;\n border-radius: 6px;\n padding: 2px;\n border: 1px solid #dee2e6;\n}\n\n.view-btn {\n background: transparent;\n border: none;\n padding: 6px 12px;\n border-radius: 4px;\n color: #6c757d;\n cursor: pointer;\n transition: all 0.2s ease;\n font-size: 16px;\n}\n\n.view-btn:hover {\n color: #495057;\n}\n\n.view-btn.active {\n background: white;\n color: #17a2b8;\n box-shadow: 0 1px 2px rgba(0,0,0,0.08);\n}\n\n.control-btn {\n background: white;\n border: 1px solid #dee2e6;\n padding: 8px 16px;\n border-radius: 6px;\n font-size: 14px;\n font-weight: 500;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 8px;\n}\n\n.control-btn:hover {\n background: #f8f9fa;\n border-color: #ced4da;\n}\n\n.control-btn.primary {\n background: #17a2b8;\n border-color: #17a2b8;\n color: white;\n}\n\n.control-btn.primary:hover {\n background: #1485a3;\n border-color: #1485a3;\n}\n\n/* Main Content */\n.main-content {\n flex: 1;\n overflow: hidden;\n}\n\n.agents-content {\n height: 100%;\n overflow-y: auto;\n padding: 24px;\n background: #f5f7fa;\n}\n\n/* Grid View */\n.agents-grid {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));\n gap: 20px;\n}\n\n.agent-card {\n background: white;\n border-radius: 12px;\n box-shadow: 0 2px 8px rgba(0,0,0,0.04);\n border: 1px solid #e0e6ed;\n transition: all 0.3s ease;\n overflow: hidden;\n}\n\n.agent-card:hover {\n box-shadow: 0 4px 16px rgba(0,0,0,0.08);\n transform: translateY(-2px);\n}\n\n.agent-card.expanded {\n box-shadow: 0 4px 20px rgba(0,0,0,0.12);\n}\n\n.card-header {\n padding: 20px;\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n cursor: pointer;\n user-select: none;\n border-bottom: 1px solid #f0f4f8;\n}\n\n.agent-info {\n display: flex;\n gap: 16px;\n flex: 1;\n}\n\n.agent-icon {\n width: 48px;\n height: 48px;\n border-radius: 10px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.agent-icon i {\n color: white;\n font-size: 20px;\n}\n\n.agent-details {\n flex: 1;\n min-width: 0;\n}\n\n.agent-name {\n margin: 0;\n font-size: 16px;\n font-weight: 600;\n color: #2c3e50;\n margin-bottom: 6px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.agent-meta {\n display: flex;\n gap: 12px;\n flex-wrap: wrap;\n}\n\n.meta-item {\n font-size: 13px;\n color: #6c757d;\n display: flex;\n align-items: center;\n gap: 4px;\n}\n\n.meta-item i {\n font-size: 12px;\n}\n\n.meta-item.status-active {\n color: #28a745;\n}\n\n.meta-item.status-pending {\n color: #ffc107;\n}\n\n.meta-item.status-disabled {\n color: #6c757d;\n}\n\n.expand-icon {\n font-size: 14px;\n color: #6c757d;\n transition: transform 0.3s ease;\n}\n\n.expand-icon.rotated {\n transform: rotate(180deg);\n}\n\n.card-body {\n padding: 0 20px 20px 20px;\n}\n\n.agent-description {\n margin: 16px 0 0 0;\n font-size: 14px;\n line-height: 1.6;\n color: #6c757d;\n}\n\n.agent-description.text-muted {\n font-style: italic;\n color: #adb5bd;\n}\n\n/* Expanded Content */\n.expanded-content {\n margin-top: 16px;\n padding-top: 16px;\n border-top: 1px solid #f0f4f8;\n animation: slideDown 0.3s ease;\n}\n\n@keyframes slideDown {\n from {\n opacity: 0;\n transform: translateY(-10px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n\n.agent-stats {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));\n gap: 16px;\n}\n\n.stat-item {\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n\n.stat-label {\n font-size: 12px;\n font-weight: 600;\n color: #6c757d;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.stat-value {\n font-size: 14px;\n color: #495057;\n font-weight: 500;\n}\n\n/* Card Actions */\n.card-actions {\n padding: 16px 20px;\n background: #f8f9fa;\n border-top: 1px solid #e0e6ed;\n display: flex;\n gap: 12px;\n justify-content: flex-end;\n}\n\n.action-btn {\n background: white;\n border: 1px solid #dee2e6;\n padding: 6px 16px;\n border-radius: 6px;\n font-size: 13px;\n font-weight: 500;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n display: flex;\n align-items: center;\n gap: 6px;\n}\n\n.action-btn:hover {\n background: #f8f9fa;\n border-color: #ced4da;\n}\n\n.action-btn-primary {\n background: #17a2b8;\n border-color: #17a2b8;\n color: white;\n}\n\n.action-btn-primary:hover {\n background: #1485a3;\n border-color: #1485a3;\n}\n\n/* List View */\n.agents-list {\n background: white;\n border-radius: 12px;\n box-shadow: 0 2px 8px rgba(0,0,0,0.04);\n border: 1px solid #e0e6ed;\n overflow: hidden;\n}\n\n.agents-table {\n width: 100%;\n border-collapse: collapse;\n}\n\n.agents-table thead {\n background: #f8f9fa;\n border-bottom: 2px solid #e0e6ed;\n}\n\n.agents-table th {\n padding: 12px 16px;\n text-align: left;\n font-size: 13px;\n font-weight: 600;\n color: #495057;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.agents-table tbody tr {\n border-bottom: 1px solid #f0f4f8;\n}\n\n.agents-table tbody tr:hover {\n background: #f8f9fa;\n}\n\n.agents-table td {\n padding: 16px;\n font-size: 14px;\n color: #495057;\n}\n\n.agent-name-cell {\n display: flex;\n align-items: center;\n gap: 12px;\n}\n\n.agent-icon-small {\n width: 36px;\n height: 36px;\n border-radius: 8px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.agent-icon-small i {\n color: white;\n font-size: 16px;\n}\n\n.agent-description-small {\n font-size: 13px;\n color: #6c757d;\n margin-top: 2px;\n}\n\n.status-badge {\n display: inline-flex;\n align-items: center;\n padding: 4px 12px;\n border-radius: 16px;\n font-size: 12px;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n}\n\n.status-badge.status-active {\n background: #d4edda;\n color: #155724;\n}\n\n.status-badge.status-pending {\n background: #fff3cd;\n color: #856404;\n}\n\n.status-badge.status-disabled {\n background: #e2e3e5;\n color: #383d41;\n}\n\n.status-badge.status-unknown {\n background: #f8f9fa;\n color: #6c757d;\n}\n\n.execution-mode {\n display: flex;\n align-items: center;\n gap: 6px;\n}\n\n.table-actions {\n display: flex;\n gap: 8px;\n}\n\n.action-btn-small {\n background: white;\n border: 1px solid #dee2e6;\n padding: 4px 8px;\n border-radius: 4px;\n font-size: 12px;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s ease;\n}\n\n.action-btn-small:hover {\n background: #f8f9fa;\n border-color: #ced4da;\n}\n\n.action-btn-small.primary {\n background: #17a2b8;\n border-color: #17a2b8;\n color: white;\n}\n\n.action-btn-small.primary:hover {\n background: #1485a3;\n border-color: #1485a3;\n}\n\n/* Empty State */\n.empty-state {\n text-align: center;\n padding: 80px 20px;\n color: #6c757d;\n}\n\n.empty-state i {\n font-size: 64px;\n color: #dee2e6;\n margin-bottom: 24px;\n display: block;\n}\n\n.empty-state h3 {\n color: #495057;\n font-weight: 600;\n margin-bottom: 12px;\n}\n\n.empty-state p {\n font-size: 15px;\n line-height: 1.6;\n max-width: 400px;\n margin: 0 auto 24px;\n}\n\n.empty-state-btn {\n background: #17a2b8;\n color: white;\n border: none;\n padding: 10px 24px;\n border-radius: 6px;\n font-size: 14px;\n font-weight: 500;\n cursor: pointer;\n transition: all 0.2s ease;\n display: inline-flex;\n align-items: center;\n gap: 8px;\n}\n\n.empty-state-btn:hover {\n background: #1485a3;\n transform: translateY(-1px);\n box-shadow: 0 2px 8px rgba(23, 162, 184, 0.3);\n}\n\n/* Loading State */\n.loading-container {\n display: flex;\n align-items: center;\n justify-content: center;\n height: 400px;\n}\n\n.loading-content {\n text-align: center;\n}\n\n.loading-spinner {\n display: inline-block;\n margin-bottom: 16px;\n}\n\n.spinner-ring {\n display: inline-block;\n width: 40px;\n height: 40px;\n margin: 3px;\n border-radius: 50%;\n border: 3px solid #17a2b8;\n border-color: #17a2b8 transparent #17a2b8 transparent;\n animation: spinner-ring 1.2s linear infinite;\n}\n\n.spinner-ring:nth-child(2) {\n animation-delay: -0.45s;\n}\n\n.spinner-ring:nth-child(3) {\n animation-delay: -0.3s;\n}\n\n@keyframes spinner-ring {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n}\n\n.loading-text {\n color: #6c757d;\n font-size: 14px;\n}\n\n/* Responsive Design */\n@media (max-width: 768px) {\n .dashboard-header {\n flex-direction: column;\n gap: 16px;\n align-items: stretch;\n }\n \n .header-info {\n justify-content: space-between;\n }\n \n .header-controls {\n justify-content: space-between;\n }\n \n .agents-grid {\n grid-template-columns: 1fr;\n }\n \n .agent-stats {\n grid-template-columns: 1fr;\n }\n}"] }]
542
+ }], () => [{ type: i1.NewAgentDialogService }, { type: i0.ViewContainerRef }], { initialState: [{
511
543
  type: Input
512
544
  }], openEntityRecord: [{
513
545
  type: Output
514
546
  }], stateChange: [{
515
547
  type: Output
516
548
  }] }); })();
517
- (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(AgentConfigurationComponent, { className: "AgentConfigurationComponent", filePath: "src/AI/components/agents/agent-configuration.component.ts", lineNumber: 19 }); })();
549
+ (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(AgentConfigurationComponent, { className: "AgentConfigurationComponent", filePath: "src/AI/components/agents/agent-configuration.component.ts", lineNumber: 20 }); })();
518
550
  //# sourceMappingURL=agent-configuration.component.js.map