@@ -173,40 +173,46 @@ <h3 class="text-sm font-black text-black mb-2 flex items-center gap-1">
173
173
// Render agents (max 4)
174
174
const agentsContainer = document . getElementById ( 'agents-container' ) ;
175
175
if ( agentsContainer && data . agents ) {
176
- agentsContainer . innerHTML = data . agents . slice ( 0 , 4 ) . map ( agent => `
177
- <button class="action-button action-button--primary" onclick="addAgent('${ agent . name } ')">
176
+ agentsContainer . innerHTML = data . agents . slice ( 0 , 4 ) . map ( agent => {
177
+ const name = agent . name || 'Unknown' ;
178
+ return `
179
+ <button class="action-button action-button--primary" onclick="addAgent('${ name . replace ( / ' / g, "\\'" ) } ')">
178
180
<div class="action-button__plus">+</div>
179
181
<div class="action-button__content">
180
- <span class="action-button__label">${ agent . name } </span>
182
+ <span class="action-button__label">${ name } </span>
181
183
</div>
182
184
</button>
183
- ` ) . join ( '' ) ;
185
+ ` } ) . join ( '' ) ;
184
186
}
185
187
186
188
// Render MCPs (max 4)
187
189
const mcpsContainer = document . getElementById ( 'mcps-container' ) ;
188
190
if ( mcpsContainer && data . mcps ) {
189
- mcpsContainer . innerHTML = data . mcps . slice ( 0 , 4 ) . map ( mcp => `
190
- <button class="action-button action-button--secondary" onclick="addMCP('${ mcp . name } ')">
191
+ mcpsContainer . innerHTML = data . mcps . slice ( 0 , 4 ) . map ( mcp => {
192
+ const name = mcp . name || 'Unknown' ;
193
+ return `
194
+ <button class="action-button action-button--secondary" onclick="addMCP('${ name . replace ( / ' / g, "\\'" ) } ')">
191
195
<div class="action-button__plus">+</div>
192
196
<div class="action-button__content">
193
- <span class="action-button__label">${ mcp . name } </span>
197
+ <span class="action-button__label">${ name } </span>
194
198
</div>
195
199
</button>
196
- ` ) . join ( '' ) ;
200
+ ` } ) . join ( '' ) ;
197
201
}
198
202
199
203
// Render rules (max 4)
200
204
const rulesContainer = document . getElementById ( 'rules-container' ) ;
201
205
if ( rulesContainer && data . rules ) {
202
- rulesContainer . innerHTML = data . rules . slice ( 0 , 4 ) . map ( rule => `
203
- <button class="action-button action-button--accent" onclick="addRule('${ rule . name } ')">
206
+ rulesContainer . innerHTML = data . rules . slice ( 0 , 4 ) . map ( rule => {
207
+ const name = rule . name || 'Unknown' ;
208
+ return `
209
+ <button class="action-button action-button--accent" onclick="addRule('${ name . replace ( / ' / g, "\\'" ) } ')">
204
210
<div class="action-button__plus">+</div>
205
211
<div class="action-button__content">
206
- <span class="action-button__label">${ rule . name } </span>
212
+ <span class="action-button__label">${ name } </span>
207
213
</div>
208
214
</button>
209
- ` ) . join ( '' ) ;
215
+ ` } ) . join ( '' ) ;
210
216
}
211
217
} catch ( error ) {
212
218
console . error ( 'Error loading actions:' , error ) ;
@@ -255,14 +261,26 @@ <h3 class="text-sm font-black text-black mb-2 flex items-center gap-1">
255
261
256
262
// Action functions that use backend data
257
263
function addAgent ( name ) {
264
+ if ( ! name || name === 'Unknown' ) {
265
+ console . error ( 'Invalid agent name' ) ;
266
+ return ;
267
+ }
258
268
createNewContextAndInstallAgent ( name ) ;
259
269
}
260
270
261
271
function addRule ( name ) {
272
+ if ( ! name || name === 'Unknown' ) {
273
+ console . error ( 'Invalid rule name' ) ;
274
+ return ;
275
+ }
262
276
createNewContextAndInsertRule ( name ) ;
263
277
}
264
278
265
279
function addMCP ( name ) {
280
+ if ( ! name || name === 'Unknown' ) {
281
+ console . error ( 'Invalid MCP name' ) ;
282
+ return ;
283
+ }
266
284
createNewContextAndInstallMCP ( name ) ;
267
285
}
268
286
0 commit comments