@memberjunction/ng-ai-test-harness
Version:
MemberJunction AI Test Harness - A reusable component for testing AI agents and prompts with beautiful UX
183 lines • 10.2 kB
JavaScript
import { Component, Input, Output, EventEmitter } from '@angular/core';
import { Metadata } from '@memberjunction/core';
import * as i0 from "@angular/core";
import * as i1 from "@progress/kendo-angular-indicators";
import * as i2 from "./ai-test-harness.component";
function AITestHarnessWindowComponent_Conditional_1_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵelementStart(0, "div", 1);
i0.ɵɵelement(1, "kendo-loader", 4);
i0.ɵɵelementStart(2, "p");
i0.ɵɵtext(3);
i0.ɵɵelementEnd()();
} if (rf & 2) {
const ctx_r0 = i0.ɵɵnextContext();
i0.ɵɵadvance(3);
i0.ɵɵtextInterpolate1("Loading ", ctx_r0.mode === "agent" ? "AI Agent" : "AI Prompt", "...");
} }
function AITestHarnessWindowComponent_Conditional_2_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵelementStart(0, "div", 2);
i0.ɵɵelement(1, "i", 5);
i0.ɵɵelementStart(2, "p");
i0.ɵɵtext(3);
i0.ɵɵelementEnd()();
} if (rf & 2) {
const ctx_r0 = i0.ɵɵnextContext();
i0.ɵɵadvance(3);
i0.ɵɵtextInterpolate(ctx_r0.error);
} }
function AITestHarnessWindowComponent_Conditional_3_Template(rf, ctx) { if (rf & 1) {
const _r2 = i0.ɵɵgetCurrentView();
i0.ɵɵelementStart(0, "mj-ai-test-harness", 6);
i0.ɵɵlistener("minimizeRequested", function AITestHarnessWindowComponent_Conditional_3_Template_mj_ai_test_harness_minimizeRequested_0_listener() { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onMinimizeRequested()); });
i0.ɵɵelementEnd();
} if (rf & 2) {
const ctx_r0 = i0.ɵɵnextContext();
i0.ɵɵproperty("entity", ctx_r0.agent || ctx_r0.prompt || null)("mode", ctx_r0.mode)("isVisible", true)("originalPromptRunId", ctx_r0.data.promptRunId || null);
} }
export class AITestHarnessWindowComponent {
constructor() {
this.data = {};
this.closeWindow = new EventEmitter();
this.windowTitle = 'AI Test Harness';
this.width = 1200;
this.height = 800;
this.loading = true;
this.error = '';
this.mode = 'agent';
this.metadata = new Metadata();
}
ngOnInit() {
console.log('🪟 AITestHarnessWindowComponent.ngOnInit - data:', this.data);
console.log('📌 promptRunId:', this.data.promptRunId);
// Set window dimensions
this.width = this.convertToNumber(this.data.width) || 1200;
this.height = this.convertToNumber(this.data.height) || 800;
// Determine mode
this.mode = this.data.mode || (this.data.promptId || this.data.prompt ? 'prompt' : 'agent');
// Load entity
this.loadEntity();
}
async loadEntity() {
try {
if (this.mode === 'agent') {
if (this.data.agent) {
this.agent = this.data.agent;
this.windowTitle = this.data.title || `Test Agent: ${this.agent.Name}`;
}
else if (this.data.agentId) {
const agentEntity = await this.metadata.GetEntityObject('AI Agents');
await agentEntity.Load(this.data.agentId);
if (agentEntity.IsSaved) {
this.agent = agentEntity;
this.windowTitle = this.data.title || `Test Agent: ${this.agent.Name}`;
}
else {
throw new Error('Agent not found');
}
}
else {
throw new Error('No agent provided');
}
}
else {
if (this.data.prompt) {
this.prompt = this.data.prompt;
this.windowTitle = this.data.title || `Test Prompt: ${this.prompt.Name}`;
}
else if (this.data.promptId) {
const promptEntity = await this.metadata.GetEntityObject('AI Prompts');
await promptEntity.Load(this.data.promptId);
if (promptEntity.IsSaved) {
this.prompt = promptEntity;
this.windowTitle = this.data.title || `Test Prompt: ${this.prompt.Name}`;
}
else {
throw new Error('Prompt not found');
}
}
else {
throw new Error('No prompt provided');
}
}
this.loading = false;
}
catch (err) {
this.error = err.message || 'Failed to load entity';
this.loading = false;
}
}
onClose() {
this.closeWindow.emit();
}
onMinimizeRequested() {
// Since Kendo Window doesn't support minimize functionality,
// we'll close the window when navigating to view the agent run
this.closeWindow.emit();
}
convertToNumber(value) {
if (!value)
return undefined;
if (typeof value === 'number')
return value;
// Handle percentage values
if (value.endsWith('vw') || value.endsWith('vh')) {
const percentage = parseFloat(value) / 100;
if (value.endsWith('vw')) {
return window.innerWidth * percentage;
}
else {
return window.innerHeight * percentage;
}
}
// Handle pixel values
if (value.endsWith('px')) {
return parseFloat(value);
}
// Try to parse as number
const parsed = parseFloat(value);
return isNaN(parsed) ? undefined : parsed;
}
static { this.ɵfac = function AITestHarnessWindowComponent_Factory(t) { return new (t || AITestHarnessWindowComponent)(); }; }
static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: AITestHarnessWindowComponent, selectors: [["mj-ai-test-harness-window"]], inputs: { data: "data" }, outputs: { closeWindow: "closeWindow" }, decls: 4, vars: 1, consts: [[1, "window-content"], [1, "loading-container"], [1, "error-container"], [3, "entity", "mode", "isVisible", "originalPromptRunId"], ["type", "converging-spinner", "size", "large"], [1, "fa-solid", "fa-exclamation-triangle"], [3, "minimizeRequested", "entity", "mode", "isVisible", "originalPromptRunId"]], template: function AITestHarnessWindowComponent_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵelementStart(0, "div", 0);
i0.ɵɵtemplate(1, AITestHarnessWindowComponent_Conditional_1_Template, 4, 1, "div", 1)(2, AITestHarnessWindowComponent_Conditional_2_Template, 4, 1, "div", 2)(3, AITestHarnessWindowComponent_Conditional_3_Template, 1, 4, "mj-ai-test-harness", 3);
i0.ɵɵelementEnd();
} if (rf & 2) {
i0.ɵɵadvance();
i0.ɵɵconditional(ctx.loading ? 1 : ctx.error ? 2 : 3);
} }, dependencies: [i1.LoaderComponent, i2.AITestHarnessComponent], styles: ["[_nghost-%COMP%] {\n display: block;\n height: 100%;\n }\n \n .window-content[_ngcontent-%COMP%] {\n height: 100%;\n display: flex;\n flex-direction: column;\n }\n \n .loading-container[_ngcontent-%COMP%], \n .error-container[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n height: 100%;\n gap: 1rem;\n }\n \n .error-container[_ngcontent-%COMP%] {\n color: #dc3545;\n \n i {\n font-size: 3rem;\n }\n }\n \n mj-ai-test-harness[_ngcontent-%COMP%] {\n flex: 1;\n overflow: hidden;\n }"] }); }
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(AITestHarnessWindowComponent, [{
type: Component,
args: [{ selector: 'mj-ai-test-harness-window', template: `
<div class="window-content">
(loading) {
<div class="loading-container">
<kendo-loader type="converging-spinner" size="large"></kendo-loader>
<p>Loading {{mode === 'agent' ? 'AI Agent' : 'AI Prompt'}}...</p>
</div>
}
if (error) {
<div class="error-container">
<i class="fa-solid fa-exclamation-triangle"></i>
<p>{{ error }}</p>
</div>
}
{
<mj-ai-test-harness
[entity]="(agent || prompt) || null"
[mode]="mode"
[isVisible]="true"
[originalPromptRunId]="data.promptRunId || null"
(minimizeRequested)="onMinimizeRequested()">
</mj-ai-test-harness>
}
</div>
`, styles: ["\n :host {\n display: block;\n height: 100%;\n }\n \n .window-content {\n height: 100%;\n display: flex;\n flex-direction: column;\n }\n \n .loading-container,\n .error-container {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n height: 100%;\n gap: 1rem;\n }\n \n .error-container {\n color: #dc3545;\n \n i {\n font-size: 3rem;\n }\n }\n \n mj-ai-test-harness {\n flex: 1;\n overflow: hidden;\n }\n "] }]
}], null, { data: [{
type: Input
}], closeWindow: [{
type: Output
}] }); })();
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(AITestHarnessWindowComponent, { className: "AITestHarnessWindowComponent", filePath: "lib/ai-test-harness-window.component.ts", lineNumber: 84 }); })();
//# sourceMappingURL=ai-test-harness-window.component.js.map