@memberjunction/ng-core-entity-forms 2.69.1 → 2.71.0

package/dist/lib/custom/AIPrompts/ai-prompt-form.component.js

@@ -16,21 +16,22 @@ import * as i0 from "@angular/core";
 import * as i1 from "@memberjunction/ng-shared";
 import * as i2 from "@angular/router";
 import * as i3 from "@memberjunction/ng-ai-test-harness";
-import * as i4 from "@angular/common";
-import * as i5 from "@angular/forms";
-import * as i6 from "@progress/kendo-angular-layout";
-import * as i7 from "@progress/kendo-angular-dialog";
-import * as i8 from "@progress/kendo-angular-inputs";
-import * as i9 from "@progress/kendo-angular-dropdowns";
-import * as i10 from "@progress/kendo-angular-buttons";
-import * as i11 from "@memberjunction/ng-user-view-grid";
-import * as i12 from "@memberjunction/ng-base-forms";
-import * as i13 from "@memberjunction/ng-form-toolbar";
-import * as i14 from "@memberjunction/ng-code-editor";
-import * as i15 from "../../shared/components/template-editor.component";
+import * as i4 from "./ai-prompt-management.service";
+import * as i5 from "@angular/common";
+import * as i6 from "@angular/forms";
+import * as i7 from "@progress/kendo-angular-layout";
+import * as i8 from "@progress/kendo-angular-dialog";
+import * as i9 from "@progress/kendo-angular-inputs";
+import * as i10 from "@progress/kendo-angular-dropdowns";
+import * as i11 from "@progress/kendo-angular-buttons";
+import * as i12 from "@memberjunction/ng-user-view-grid";
+import * as i13 from "@memberjunction/ng-base-forms";
+import * as i14 from "@memberjunction/ng-form-toolbar";
+import * as i15 from "@memberjunction/ng-code-editor";
+import * as i16 from "../../shared/components/template-editor.component";
 const _c0 = ["templateEditor"];
-const _forTrack0 = ($index, $item) => $item.ID;
-function _forTrack1($index, $item) { return this.getModelTrackId($item) || $index; }
+function _forTrack0($index, $item) { return this.getModelTrackId($item) || $index; }
+const _forTrack1 = ($index, $item) => $item.ID;
 const _c1 = () => ({ text: "Active", value: "Active" });
 const _c2 = () => ({ text: "Pending", value: "Pending" });
 const _c3 = () => ({ text: "Disabled", value: "Disabled" });
@@ -203,8 +204,27 @@ function AIPromptFormComponentExtended_form_2_Conditional_37_Template(rf, ctx) {
     i0.ɵɵtext(2, " Loading template... ");
     i0.ɵɵelementEnd();
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_38_Template(rf, ctx) { if (rf & 1) {
+function AIPromptFormComponentExtended_form_2_Conditional_38_Conditional_7_Template(rf, ctx) { if (rf & 1) {
     const _r7 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 72);
+    i0.ɵɵlistener("click", function AIPromptFormComponentExtended_form_2_Conditional_38_Conditional_7_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r7); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.createNewTemplate()); });
+    i0.ɵɵelement(1, "i", 73);
+    i0.ɵɵtext(2, " Create New Template ");
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    i0.ɵɵproperty("themeColor", "primary");
+} }
+function AIPromptFormComponentExtended_form_2_Conditional_38_Conditional_8_Template(rf, ctx) { if (rf & 1) {
+    const _r8 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 74);
+    i0.ɵɵlistener("click", function AIPromptFormComponentExtended_form_2_Conditional_38_Conditional_8_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r8); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.linkExistingTemplate()); });
+    i0.ɵɵelement(1, "i", 75);
+    i0.ɵɵtext(2, " Link Existing Template ");
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    i0.ɵɵproperty("fillMode", "outline");
+} }
+function AIPromptFormComponentExtended_form_2_Conditional_38_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div", 34);
     i0.ɵɵelement(1, "i", 66);
     i0.ɵɵelementStart(2, "h5", 67);
@@ -213,261 +233,97 @@ function AIPromptFormComponentExtended_form_2_Conditional_38_Template(rf, ctx) {
     i0.ɵɵelementStart(4, "p", 68);
     i0.ɵɵtext(5, " This AI prompt needs a template to define its structure and parameters. Create a new template or link to an existing one. ");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(6, "div", 69)(7, "button", 70);
-    i0.ɵɵlistener("click", function AIPromptFormComponentExtended_form_2_Conditional_38_Template_button_click_7_listener() { i0.ɵɵrestoreView(_r7); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.createNewTemplate()); });
-    i0.ɵɵelement(8, "i", 71);
-    i0.ɵɵtext(9, " Create New Template ");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(10, "button", 72);
-    i0.ɵɵlistener("click", function AIPromptFormComponentExtended_form_2_Conditional_38_Template_button_click_10_listener() { i0.ɵɵrestoreView(_r7); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.linkExistingTemplate()); });
-    i0.ɵɵelement(11, "i", 73);
-    i0.ɵɵtext(12, " Link Existing Template ");
-    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(6, "div", 69);
+    i0.ɵɵtemplate(7, AIPromptFormComponentExtended_form_2_Conditional_38_Conditional_7_Template, 3, 1, "button", 70)(8, AIPromptFormComponentExtended_form_2_Conditional_38_Conditional_8_Template, 3, 1, "button", 71);
+    i0.ɵɵelementEnd()();
 } if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance(7);
+    i0.ɵɵconditional(ctx_r1.UserCanCreateTemplates ? 7 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.UserCanReadTemplates ? 8 : -1);
+} }
+function AIPromptFormComponentExtended_form_2_Conditional_39_Conditional_10_Template(rf, ctx) { if (rf & 1) {
+    const _r10 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 72);
+    i0.ɵɵlistener("click", function AIPromptFormComponentExtended_form_2_Conditional_39_Conditional_10_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r10); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.createNewTemplate()); });
+    i0.ɵɵelement(1, "i", 73);
+    i0.ɵɵtext(2, " Create New Template ");
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
     i0.ɵɵproperty("themeColor", "primary");
-    i0.ɵɵadvance(3);
-    i0.ɵɵproperty("fillMode", "outline");
 } }
 function AIPromptFormComponentExtended_form_2_Conditional_39_Template(rf, ctx) { if (rf & 1) {
-    const _r8 = i0.ɵɵgetCurrentView();
+    const _r9 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "div", 35);
-    i0.ɵɵelement(1, "i", 74);
-    i0.ɵɵelementStart(2, "h5", 75);
+    i0.ɵɵelement(1, "i", 76);
+    i0.ɵɵelementStart(2, "h5", 77);
     i0.ɵɵtext(3, "Template Not Found");
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(4, "p", 68);
     i0.ɵɵtext(5, " The referenced template could not be loaded. It may have been deleted or moved. ");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(6, "div", 69)(7, "button", 72);
-    i0.ɵɵlistener("click", function AIPromptFormComponentExtended_form_2_Conditional_39_Template_button_click_7_listener() { i0.ɵɵrestoreView(_r8); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.loadTemplate()); });
-    i0.ɵɵelement(8, "i", 76);
+    i0.ɵɵelementStart(6, "div", 69)(7, "button", 74);
+    i0.ɵɵlistener("click", function AIPromptFormComponentExtended_form_2_Conditional_39_Template_button_click_7_listener() { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.loadTemplate()); });
+    i0.ɵɵelement(8, "i", 78);
     i0.ɵɵtext(9, " Retry Loading ");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(10, "button", 70);
-    i0.ɵɵlistener("click", function AIPromptFormComponentExtended_form_2_Conditional_39_Template_button_click_10_listener() { i0.ɵɵrestoreView(_r8); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.createNewTemplate()); });
-    i0.ɵɵelement(11, "i", 71);
-    i0.ɵɵtext(12, " Create New Template ");
-    i0.ɵɵelementEnd()()();
+    i0.ɵɵtemplate(10, AIPromptFormComponentExtended_form_2_Conditional_39_Conditional_10_Template, 3, 1, "button", 70);
+    i0.ɵɵelementEnd()();
 } if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance(7);
     i0.ɵɵproperty("fillMode", "outline");
     i0.ɵɵadvance(3);
-    i0.ɵɵproperty("themeColor", "primary");
+    i0.ɵɵconditional(ctx_r1.UserCanCreateTemplates ? 10 : -1);
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_40_Template(rf, ctx) { if (rf & 1) {
-    const _r9 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 36)(1, "div", 77)(2, "mj-template-editor", 78, 1);
-    i0.ɵɵlistener("contentChange", function AIPromptFormComponentExtended_form_2_Conditional_40_Template_mj_template_editor_contentChange_2_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onTemplateContentChange($event)); })("runTemplate", function AIPromptFormComponentExtended_form_2_Conditional_40_Template_mj_template_editor_runTemplate_2_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onTemplateRun($event)); });
-    i0.ɵɵelementEnd()()();
-} if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(2);
-    i0.ɵɵadvance(2);
-    i0.ɵɵproperty("template", ctx_r1.template)("config", ctx_r1.templateEditorConfig);
-} }
-function AIPromptFormComponentExtended_form_2_Conditional_41_ng_template_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 63);
-    i0.ɵɵelement(1, "i", 81);
-    i0.ɵɵtext(2, " Template Parameters ");
-    i0.ɵɵelementStart(3, "span", 82);
-    i0.ɵɵtext(4);
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(5, "span", 83);
-    i0.ɵɵelement(6, "i", 84);
-    i0.ɵɵtext(7, " Parameters defined in the template ");
-    i0.ɵɵelementEnd()();
-} if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(3);
-    i0.ɵɵadvance(4);
-    i0.ɵɵtextInterpolate1(" ", ctx_r1.templateParams.length, " ");
-} }
-function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 79);
-    i0.ɵɵelement(1, "i", 55);
-    i0.ɵɵtext(2, " Loading template parameters... ");
-    i0.ɵɵelementEnd();
-} }
-function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_4_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 80);
+function AIPromptFormComponentExtended_form_2_Conditional_40_Conditional_1_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    const _r12 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 84);
+    i0.ɵɵlistener("click", function AIPromptFormComponentExtended_form_2_Conditional_40_Conditional_1_Conditional_1_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r12); const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.linkExistingTemplate()); });
     i0.ɵɵelement(1, "i", 85);
-    i0.ɵɵtext(2, " This template has no parameters defined ");
-    i0.ɵɵelementEnd();
-} }
-function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_For_2_Conditional_6_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 97);
-    i0.ɵɵtext(1, "*");
-    i0.ɵɵelementEnd();
-} }
-function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_For_2_Conditional_10_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 99);
-    i0.ɵɵtext(1, "Required");
-    i0.ɵɵelementEnd();
-} }
-function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_For_2_Conditional_11_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 100);
-    i0.ɵɵtext(1, "Optional");
-    i0.ɵɵelementEnd();
-} }
-function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_For_2_Conditional_12_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "p", 101);
-    i0.ɵɵtext(1);
+    i0.ɵɵtext(2, " Change Template ");
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const param_r10 = i0.ɵɵnextContext().$implicit;
-    i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1(" ", param_r10.Description, " ");
+    i0.ɵɵproperty("fillMode", "outline")("size", "small");
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_For_2_Conditional_18_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 106)(1, "label", 107);
-    i0.ɵɵtext(2, "Default Value");
+function AIPromptFormComponentExtended_form_2_Conditional_40_Conditional_1_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    const _r13 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 86);
+    i0.ɵɵlistener("click", function AIPromptFormComponentExtended_form_2_Conditional_40_Conditional_1_Conditional_2_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r13); const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.openTemplateInNewWindow()); });
+    i0.ɵɵelement(1, "i", 87);
+    i0.ɵɵtext(2, " Open in New Window ");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "code", 108);
-    i0.ɵɵtext(4);
-    i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    const param_r10 = i0.ɵɵnextContext().$implicit;
-    i0.ɵɵadvance(4);
-    i0.ɵɵtextInterpolate(param_r10.DefaultValue);
+    i0.ɵɵproperty("fillMode", "outline")("size", "small");
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_For_2_Conditional_19_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 106)(1, "label", 107);
-    i0.ɵɵtext(2, "Entity");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "span", 102);
-    i0.ɵɵtext(4);
-    i0.ɵɵelementEnd()();
-} if (rf & 2) {
-    const param_r10 = i0.ɵɵnextContext().$implicit;
-    i0.ɵɵadvance(4);
-    i0.ɵɵtextInterpolate(param_r10.Entity || "Entity ID: " + param_r10.EntityID);
-} }
-function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_For_2_Conditional_20_Conditional_5_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵtext(0);
-} if (rf & 2) {
-    const param_r10 = i0.ɵɵnextContext(2).$implicit;
-    i0.ɵɵtextInterpolate1(" (", param_r10.LinkedParameterField, ") ");
-} }
-function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_For_2_Conditional_20_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 106)(1, "label", 107);
-    i0.ɵɵtext(2, "Linked To");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "span", 102);
-    i0.ɵɵtext(4);
-    i0.ɵɵtemplate(5, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_For_2_Conditional_20_Conditional_5_Template, 1, 1);
-    i0.ɵɵelementEnd()();
-} if (rf & 2) {
-    const param_r10 = i0.ɵɵnextContext().$implicit;
-    i0.ɵɵadvance(4);
-    i0.ɵɵtextInterpolate1(" ", param_r10.LinkedParameterName, " ");
-    i0.ɵɵadvance();
-    i0.ɵɵconditional(param_r10.LinkedParameterField ? 5 : -1);
-} }
-function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_For_2_Conditional_21_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 106)(1, "label", 107);
-    i0.ɵɵtext(2, "Filter");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "code", 109);
-    i0.ɵɵtext(4);
-    i0.ɵɵelementEnd()();
-} if (rf & 2) {
-    const param_r10 = i0.ɵɵnextContext().$implicit;
-    i0.ɵɵadvance(4);
-    i0.ɵɵtextInterpolate(param_r10.ExtraFilter);
-} }
-function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_For_2_Conditional_22_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 106)(1, "label", 107);
-    i0.ɵɵtext(2, "Record ID");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "code", 102);
-    i0.ɵɵtext(4);
-    i0.ɵɵelementEnd()();
-} if (rf & 2) {
-    const param_r10 = i0.ɵɵnextContext().$implicit;
-    i0.ɵɵadvance(4);
-    i0.ɵɵtextInterpolate(param_r10.RecordID);
-} }
-function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_For_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 92)(1, "div", 93)(2, "div", 94);
-    i0.ɵɵelement(3, "i", 95);
-    i0.ɵɵelementStart(4, "h6", 96);
-    i0.ɵɵtext(5);
-    i0.ɵɵtemplate(6, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_For_2_Conditional_6_Template, 2, 0, "span", 97);
-    i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(7, "div", 94)(8, "span", 98);
-    i0.ɵɵtext(9);
+function AIPromptFormComponentExtended_form_2_Conditional_40_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 79);
+    i0.ɵɵtemplate(1, AIPromptFormComponentExtended_form_2_Conditional_40_Conditional_1_Conditional_1_Template, 3, 2, "button", 82)(2, AIPromptFormComponentExtended_form_2_Conditional_40_Conditional_1_Conditional_2_Template, 3, 2, "button", 83);
     i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(10, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_For_2_Conditional_10_Template, 2, 0, "span", 99)(11, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_For_2_Conditional_11_Template, 2, 0, "span", 100);
-    i0.ɵɵelementEnd()();
-    i0.ɵɵtemplate(12, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_For_2_Conditional_12_Template, 2, 1, "p", 101);
-    i0.ɵɵelementStart(13, "div", 102)(14, "span", 103);
-    i0.ɵɵelement(15, "i", 104);
-    i0.ɵɵtext(16);
-    i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(17, "div", 105);
-    i0.ɵɵtemplate(18, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_For_2_Conditional_18_Template, 5, 1, "div", 106)(19, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_For_2_Conditional_19_Template, 5, 1, "div", 106)(20, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_For_2_Conditional_20_Template, 6, 2, "div", 106)(21, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_For_2_Conditional_21_Template, 5, 1, "div", 106)(22, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_For_2_Conditional_22_Template, 5, 1, "div", 106);
-    i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    const param_r10 = ctx.$implicit;
-    const ctx_r1 = i0.ɵɵnextContext(4);
-    i0.ɵɵstyleProp("border-left", "4px solid " + ctx_r1.getParamTypeColor(param_r10.Type));
-    i0.ɵɵadvance(3);
-    i0.ɵɵclassMap("fa-solid " + ctx_r1.getParamTypeIcon(param_r10.Type));
-    i0.ɵɵstyleProp("color", ctx_r1.getParamTypeColor(param_r10.Type));
-    i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1(" ", param_r10.Name, " ");
-    i0.ɵɵadvance();
-    i0.ɵɵconditional(param_r10.IsRequired ? 6 : -1);
-    i0.ɵɵadvance(2);
-    i0.ɵɵstyleProp("background-color", ctx_r1.getParamTypeColor(param_r10.Type));
-    i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1(" ", param_r10.Type, " ");
-    i0.ɵɵadvance();
-    i0.ɵɵconditional(param_r10.IsRequired ? 10 : 11);
-    i0.ɵɵadvance(2);
-    i0.ɵɵconditional(param_r10.Description ? 12 : -1);
-    i0.ɵɵadvance(4);
-    i0.ɵɵtextInterpolate1(" ", ctx_r1.getParamTypeDescription(param_r10), " ");
-    i0.ɵɵadvance(2);
-    i0.ɵɵconditional(param_r10.DefaultValue ? 18 : -1);
-    i0.ɵɵadvance();
-    i0.ɵɵconditional(param_r10.EntityID ? 19 : -1);
-    i0.ɵɵadvance();
-    i0.ɵɵconditional(param_r10.LinkedParameterName ? 20 : -1);
+    const ctx_r1 = i0.ɵɵnextContext(3);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(param_r10.ExtraFilter ? 21 : -1);
+    i0.ɵɵconditional(ctx_r1.UserCanUpdateTemplates ? 1 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(param_r10.RecordID ? 22 : -1);
+    i0.ɵɵconditional(ctx_r1.UserCanReadTemplates ? 2 : -1);
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 86);
-    i0.ɵɵrepeaterCreate(1, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_For_2_Template, 23, 19, "div", 87, _forTrack0);
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "div", 88)(4, "div", 89);
-    i0.ɵɵelement(5, "i", 90);
-    i0.ɵɵelementStart(6, "div", 91)(7, "strong");
-    i0.ɵɵtext(8, "Using Template Parameters:");
-    i0.ɵɵelementEnd();
-    i0.ɵɵtext(9, " When executing this prompt, you'll be prompted to provide values for all required parameters. Parameters can be simple values (text, numbers) or complex data structures (JSON objects, database records, or entire entity collections). The template will use these parameters to generate dynamic content based on the values provided at execution time. ");
+function AIPromptFormComponentExtended_form_2_Conditional_40_Template(rf, ctx) { if (rf & 1) {
+    const _r11 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 36);
+    i0.ɵɵtemplate(1, AIPromptFormComponentExtended_form_2_Conditional_40_Conditional_1_Template, 3, 2, "div", 79);
+    i0.ɵɵelementStart(2, "div", 80)(3, "mj-template-editor", 81, 1);
+    i0.ɵɵlistener("contentChange", function AIPromptFormComponentExtended_form_2_Conditional_40_Template_mj_template_editor_contentChange_3_listener($event) { i0.ɵɵrestoreView(_r11); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onTemplateContentChange($event)); })("runTemplate", function AIPromptFormComponentExtended_form_2_Conditional_40_Template_mj_template_editor_runTemplate_3_listener($event) { i0.ɵɵrestoreView(_r11); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onTemplateRun($event)); });
     i0.ɵɵelementEnd()()();
-} if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(3);
-    i0.ɵɵadvance();
-    i0.ɵɵrepeater(ctx_r1.templateParams);
-} }
-function AIPromptFormComponentExtended_form_2_Conditional_41_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "kendo-expansionpanel", 30);
-    i0.ɵɵtemplate(1, AIPromptFormComponentExtended_form_2_Conditional_41_ng_template_1_Template, 8, 1, "ng-template", 31);
-    i0.ɵɵelementStart(2, "div", 37);
-    i0.ɵɵtemplate(3, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_3_Template, 3, 0, "div", 79)(4, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_4_Template, 3, 0, "div", 80)(5, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Template, 10, 0);
-    i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
-    i0.ɵɵproperty("expanded", true);
-    i0.ɵɵadvance(3);
-    i0.ɵɵconditional(ctx_r1.isLoadingTemplateParams ? 3 : ctx_r1.templateParams.length === 0 ? 4 : 5);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.template && ctx_r1.EditMode ? 1 : -1);
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("template", ctx_r1.template)("config", ctx_r1.templateEditorConfig);
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_ng_template_1_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 112);
+function AIPromptFormComponentExtended_form_2_Conditional_41_ng_template_1_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 91);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -475,13 +331,13 @@ function AIPromptFormComponentExtended_form_2_Conditional_42_ng_template_1_Condi
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate1(" ", ctx_r1.promptModels.length, " ");
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_ng_template_1_Template(rf, ctx) { if (rf & 1) {
+function AIPromptFormComponentExtended_form_2_Conditional_41_ng_template_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span", 63);
-    i0.ɵɵelement(1, "i", 111);
+    i0.ɵɵelement(1, "i", 90);
     i0.ɵɵtext(2, " Models ");
-    i0.ɵɵtemplate(3, AIPromptFormComponentExtended_form_2_Conditional_42_ng_template_1_Conditional_3_Template, 2, 1, "span", 112);
-    i0.ɵɵelementStart(4, "span", 83);
-    i0.ɵɵelement(5, "i", 113);
+    i0.ɵɵtemplate(3, AIPromptFormComponentExtended_form_2_Conditional_41_ng_template_1_Conditional_3_Template, 2, 1, "span", 91);
+    i0.ɵɵelementStart(4, "span", 92);
+    i0.ɵɵelement(5, "i", 93);
     i0.ɵɵtext(6, " Priority order (first available model will be used) ");
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
@@ -489,410 +345,456 @@ function AIPromptFormComponentExtended_form_2_Conditional_42_ng_template_1_Templ
     i0.ɵɵadvance(3);
     i0.ɵɵconditional(ctx_r1.promptModels.length > 0 ? 3 : -1);
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_4_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 79);
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 89);
     i0.ɵɵelement(1, "i", 55);
     i0.ɵɵtext(2, " Loading models... ");
     i0.ɵɵelementEnd();
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_0_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    const _r11 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 114)(1, "button", 115);
-    i0.ɵɵlistener("click", function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_0_Conditional_3_Template_button_click_1_listener() { i0.ɵɵrestoreView(_r11); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.addNewModel()); });
-    i0.ɵɵelement(2, "i", 71);
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_0_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    const _r14 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 96)(1, "button", 97);
+    i0.ɵɵlistener("click", function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_0_Conditional_3_Template_button_click_1_listener() { i0.ɵɵrestoreView(_r14); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.addNewModel()); });
+    i0.ɵɵelement(2, "i", 73);
     i0.ɵɵtext(3, " Add Model ");
     i0.ɵɵelementEnd()();
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 80);
-    i0.ɵɵelement(1, "i", 85);
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 94);
+    i0.ɵɵelement(1, "i", 95);
     i0.ɵɵtext(2, " No models configured ");
-    i0.ɵɵtemplate(3, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_0_Conditional_3_Template, 4, 0, "div", 114);
+    i0.ɵɵtemplate(3, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_0_Conditional_3_Template, 4, 0, "div", 96);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(4);
     i0.ɵɵadvance(3);
-    i0.ɵɵconditional(ctx_r1.EditMode ? 3 : -1);
+    i0.ɵɵconditional(ctx_r1.EditMode && ctx_r1.UserCanCreatePromptModels ? 3 : -1);
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_Conditional_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 116);
-    i0.ɵɵelement(1, "i", 121);
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 98);
+    i0.ɵɵelement(1, "i", 103);
     i0.ɵɵtext(2, " Models are tried in priority order (highest priority first). The first available model that meets requirements will be used for execution. ");
     i0.ɵɵelementEnd();
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "i", 135);
-    i0.ɵɵelementStart(1, "span", 136);
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "i", 119);
+    i0.ɵɵelementStart(1, "span", 120);
     i0.ɵɵtext(2);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ɵ$index_417_r13 = i0.ɵɵnextContext().$index;
+    const ɵ$index_302_r16 = i0.ɵɵnextContext().$index;
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1("#", ɵ$index_417_r13 + 1, "");
+    i0.ɵɵtextInterpolate1("#", ɵ$index_302_r16 + 1, "");
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 124);
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 106);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r13 = i0.ɵɵnextContext();
-    const model_r15 = ctx_r13.$implicit;
-    const ɵ$index_417_r13 = ctx_r13.$index;
-    i0.ɵɵpropertyInterpolate1("title", "Priority ", model_r15.Priority, " - Higher priority numbers are tried first");
+    const ctx_r16 = i0.ɵɵnextContext();
+    const model_r18 = ctx_r16.$implicit;
+    const ɵ$index_302_r16 = ctx_r16.$index;
+    i0.ɵɵpropertyInterpolate1("title", "Priority ", model_r18.Priority, " - Higher priority numbers are tried first");
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1("#", ɵ$index_417_r13 + 1, "");
+    i0.ɵɵtextInterpolate1("#", ɵ$index_302_r16 + 1, "");
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_5_Template(rf, ctx) { if (rf & 1) {
-    const _r16 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "kendo-dropdownlist", 137);
-    i0.ɵɵtwoWayListener("ngModelChange", function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_5_Template_kendo_dropdownlist_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r16); const model_r15 = i0.ɵɵnextContext().$implicit; i0.ɵɵtwoWayBindingSet(model_r15.ModelID, $event) || (model_r15.ModelID = $event); return i0.ɵɵresetView($event); });
-    i0.ɵɵlistener("valueChange", function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_5_Template_kendo_dropdownlist_valueChange_0_listener($event) { i0.ɵɵrestoreView(_r16); const ɵ$index_417_r13 = i0.ɵɵnextContext().$index; const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.onModelChange($event, ɵ$index_417_r13)); });
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    const _r19 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "kendo-dropdownlist", 121);
+    i0.ɵɵtwoWayListener("ngModelChange", function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_5_Template_kendo_dropdownlist_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r19); const model_r18 = i0.ɵɵnextContext().$implicit; i0.ɵɵtwoWayBindingSet(model_r18.ModelID, $event) || (model_r18.ModelID = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵlistener("valueChange", function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_5_Template_kendo_dropdownlist_valueChange_0_listener($event) { i0.ɵɵrestoreView(_r19); const ɵ$index_302_r16 = i0.ɵɵnextContext().$index; const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.onModelChange($event, ɵ$index_302_r16)); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const model_r15 = i0.ɵɵnextContext().$implicit;
+    const model_r18 = i0.ɵɵnextContext().$implicit;
     const ctx_r1 = i0.ɵɵnextContext(5);
-    i0.ɵɵtwoWayProperty("ngModel", model_r15.ModelID);
-    i0.ɵɵproperty("name", "modelId_" + ctx_r1.getModelTrackId(model_r15))("data", ctx_r1.availableModels)("valuePrimitive", true)("filterable", true);
+    i0.ɵɵtwoWayProperty("ngModel", model_r18.ModelID);
+    i0.ɵɵproperty("name", "modelId_" + ctx_r1.getModelTrackId(model_r18))("data", ctx_r1.availableModels)("valuePrimitive", true)("filterable", true);
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_6_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span", 24);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const model_r15 = i0.ɵɵnextContext().$implicit;
+    const model_r18 = i0.ɵɵnextContext().$implicit;
     const ctx_r1 = i0.ɵɵnextContext(5);
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate(ctx_r1.getModelDisplayName(model_r15.ModelID));
+    i0.ɵɵtextInterpolate(ctx_r1.getModelDisplayName(model_r18.ModelID));
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_8_Conditional_0_Conditional_0_ng_template_1_Conditional_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 142);
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_8_Conditional_0_Conditional_0_ng_template_1_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 126);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const dataItem_r18 = i0.ɵɵnextContext().$implicit;
-    const model_r15 = i0.ɵɵnextContext(4).$implicit;
+    const dataItem_r21 = i0.ɵɵnextContext().$implicit;
+    const model_r18 = i0.ɵɵnextContext(4).$implicit;
     const ctx_r1 = i0.ɵɵnextContext(5);
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1("(", ctx_r1.getModelVendorStatus(model_r15.ModelID, dataItem_r18.ID), ")");
+    i0.ɵɵtextInterpolate1("(", ctx_r1.getModelVendorStatus(model_r18.ModelID, dataItem_r21.ID), ")");
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_8_Conditional_0_Conditional_0_ng_template_1_Template(rf, ctx) { if (rf & 1) {
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_8_Conditional_0_Conditional_0_ng_template_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span");
     i0.ɵɵtext(1);
-    i0.ɵɵtemplate(2, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_8_Conditional_0_Conditional_0_ng_template_1_Conditional_2_Template, 2, 1, "span", 142);
+    i0.ɵɵtemplate(2, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_8_Conditional_0_Conditional_0_ng_template_1_Conditional_2_Template, 2, 1, "span", 126);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const dataItem_r18 = ctx.$implicit;
-    const model_r15 = i0.ɵɵnextContext(4).$implicit;
+    const dataItem_r21 = ctx.$implicit;
+    const model_r18 = i0.ɵɵnextContext(4).$implicit;
     const ctx_r1 = i0.ɵɵnextContext(5);
-    i0.ɵɵstyleProp("color", ctx_r1.getVendorStatusColor(model_r15.ModelID, dataItem_r18.ID));
+    i0.ɵɵstyleProp("color", ctx_r1.getVendorStatusColor(model_r18.ModelID, dataItem_r21.ID));
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1(" ", dataItem_r18.Name, " ");
+    i0.ɵɵtextInterpolate1(" ", dataItem_r21.Name, " ");
     i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r1.getModelVendorStatus(model_r15.ModelID, dataItem_r18.ID) !== "Active" ? 2 : -1);
+    i0.ɵɵconditional(ctx_r1.getModelVendorStatus(model_r18.ModelID, dataItem_r21.ID) !== "Active" ? 2 : -1);
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_8_Conditional_0_Conditional_0_Template(rf, ctx) { if (rf & 1) {
-    const _r17 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "kendo-dropdownlist", 140);
-    i0.ɵɵtwoWayListener("ngModelChange", function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_8_Conditional_0_Conditional_0_Template_kendo_dropdownlist_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r17); const model_r15 = i0.ɵɵnextContext(3).$implicit; i0.ɵɵtwoWayBindingSet(model_r15.VendorID, $event) || (model_r15.VendorID = $event); return i0.ɵɵresetView($event); });
-    i0.ɵɵtemplate(1, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_8_Conditional_0_Conditional_0_ng_template_1_Template, 3, 4, "ng-template", 141);
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_8_Conditional_0_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    const _r20 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "kendo-dropdownlist", 124);
+    i0.ɵɵtwoWayListener("ngModelChange", function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_8_Conditional_0_Conditional_0_Template_kendo_dropdownlist_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r20); const model_r18 = i0.ɵɵnextContext(3).$implicit; i0.ɵɵtwoWayBindingSet(model_r18.VendorID, $event) || (model_r18.VendorID = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵtemplate(1, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_8_Conditional_0_Conditional_0_ng_template_1_Template, 3, 4, "ng-template", 125);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const model_r15 = i0.ɵɵnextContext(3).$implicit;
+    const model_r18 = i0.ɵɵnextContext(3).$implicit;
     const ctx_r1 = i0.ɵɵnextContext(5);
-    i0.ɵɵtwoWayProperty("ngModel", model_r15.VendorID);
-    i0.ɵɵproperty("name", "vendorId_" + ctx_r1.getModelTrackId(model_r15))("data", ctx_r1.getVendorsForModelSync(model_r15.ModelID))("valuePrimitive", true)("filterable", true);
+    i0.ɵɵtwoWayProperty("ngModel", model_r18.VendorID);
+    i0.ɵɵproperty("name", "vendorId_" + ctx_r1.getModelTrackId(model_r18))("data", ctx_r1.getVendorsForModelSync(model_r18.ModelID))("valuePrimitive", true)("filterable", true);
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_8_Conditional_0_Conditional_1_Conditional_0_Conditional_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 142);
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_8_Conditional_0_Conditional_1_Conditional_0_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 126);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const model_r15 = i0.ɵɵnextContext(5).$implicit;
+    const model_r18 = i0.ɵɵnextContext(5).$implicit;
     const ctx_r1 = i0.ɵɵnextContext(5);
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1("(", ctx_r1.getModelVendorStatus(model_r15.ModelID, ctx_r1.getVendorsForModelSync(model_r15.ModelID)[0].ID), ")");
+    i0.ɵɵtextInterpolate1("(", ctx_r1.getModelVendorStatus(model_r18.ModelID, ctx_r1.getVendorsForModelSync(model_r18.ModelID)[0].ID), ")");
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_8_Conditional_0_Conditional_1_Conditional_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 144);
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_8_Conditional_0_Conditional_1_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 128);
     i0.ɵɵtext(1);
-    i0.ɵɵtemplate(2, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_8_Conditional_0_Conditional_1_Conditional_0_Conditional_2_Template, 2, 1, "span", 142);
+    i0.ɵɵtemplate(2, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_8_Conditional_0_Conditional_1_Conditional_0_Conditional_2_Template, 2, 1, "span", 126);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const model_r15 = i0.ɵɵnextContext(4).$implicit;
+    const model_r18 = i0.ɵɵnextContext(4).$implicit;
     const ctx_r1 = i0.ɵɵnextContext(5);
-    i0.ɵɵstyleProp("color", ctx_r1.getVendorStatusColor(model_r15.ModelID, ctx_r1.getVendorsForModelSync(model_r15.ModelID)[0].ID));
+    i0.ɵɵstyleProp("color", ctx_r1.getVendorStatusColor(model_r18.ModelID, ctx_r1.getVendorsForModelSync(model_r18.ModelID)[0].ID));
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1(" ", ctx_r1.getVendorsForModelSync(model_r15.ModelID)[0].Name, " ");
+    i0.ɵɵtextInterpolate1(" ", ctx_r1.getVendorsForModelSync(model_r18.ModelID)[0].Name, " ");
     i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r1.getModelVendorStatus(model_r15.ModelID, ctx_r1.getVendorsForModelSync(model_r15.ModelID)[0].ID) !== "Active" ? 2 : -1);
+    i0.ɵɵconditional(ctx_r1.getModelVendorStatus(model_r18.ModelID, ctx_r1.getVendorsForModelSync(model_r18.ModelID)[0].ID) !== "Active" ? 2 : -1);
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_8_Conditional_0_Conditional_1_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 138);
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_8_Conditional_0_Conditional_1_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 122);
     i0.ɵɵtext(1, "No vendors available");
     i0.ɵɵelementEnd();
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_8_Conditional_0_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵtemplate(0, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_8_Conditional_0_Conditional_1_Conditional_0_Template, 3, 4, "span", 143)(1, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_8_Conditional_0_Conditional_1_Conditional_1_Template, 2, 0, "span", 138);
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_8_Conditional_0_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtemplate(0, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_8_Conditional_0_Conditional_1_Conditional_0_Template, 3, 4, "span", 127)(1, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_8_Conditional_0_Conditional_1_Conditional_1_Template, 2, 0, "span", 122);
 } if (rf & 2) {
-    const model_r15 = i0.ɵɵnextContext(3).$implicit;
+    const model_r18 = i0.ɵɵnextContext(3).$implicit;
     const ctx_r1 = i0.ɵɵnextContext(5);
-    i0.ɵɵconditional(ctx_r1.getVendorsForModelSync(model_r15.ModelID).length === 1 ? 0 : 1);
+    i0.ɵɵconditional(ctx_r1.getVendorsForModelSync(model_r18.ModelID).length === 1 ? 0 : 1);
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_8_Conditional_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵtemplate(0, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_8_Conditional_0_Conditional_0_Template, 2, 5, "kendo-dropdownlist", 139)(1, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_8_Conditional_0_Conditional_1_Template, 2, 1);
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_8_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtemplate(0, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_8_Conditional_0_Conditional_0_Template, 2, 5, "kendo-dropdownlist", 123)(1, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_8_Conditional_0_Conditional_1_Template, 2, 1);
 } if (rf & 2) {
-    const model_r15 = i0.ɵɵnextContext(2).$implicit;
+    const model_r18 = i0.ɵɵnextContext(2).$implicit;
     const ctx_r1 = i0.ɵɵnextContext(5);
-    i0.ɵɵconditional(ctx_r1.shouldShowVendorDropdown(model_r15.ModelID) ? 0 : 1);
+    i0.ɵɵconditional(ctx_r1.shouldShowVendorDropdown(model_r18.ModelID) ? 0 : 1);
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_8_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 138);
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_8_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 122);
     i0.ɵɵtext(1, "Select model first");
     i0.ɵɵelementEnd();
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_8_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵtemplate(0, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_8_Conditional_0_Template, 2, 1)(1, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_8_Conditional_1_Template, 2, 0, "span", 138);
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_8_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtemplate(0, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_8_Conditional_0_Template, 2, 1)(1, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_8_Conditional_1_Template, 2, 0, "span", 122);
 } if (rf & 2) {
-    const model_r15 = i0.ɵɵnextContext().$implicit;
-    i0.ɵɵconditional(model_r15.ModelID ? 0 : 1);
+    const model_r18 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵconditional(model_r18.ModelID ? 0 : 1);
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_9_Conditional_0_Conditional_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 142);
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_9_Conditional_0_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 126);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const model_r15 = i0.ɵɵnextContext(3).$implicit;
+    const model_r18 = i0.ɵɵnextContext(3).$implicit;
     const ctx_r1 = i0.ɵɵnextContext(5);
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1("(", ctx_r1.getModelVendorStatus(model_r15.ModelID, model_r15.VendorID), ")");
+    i0.ɵɵtextInterpolate1("(", ctx_r1.getModelVendorStatus(model_r18.ModelID, model_r18.VendorID), ")");
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_9_Conditional_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 147);
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_9_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 111);
     i0.ɵɵtext(1);
-    i0.ɵɵtemplate(2, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_9_Conditional_0_Conditional_2_Template, 2, 1, "span", 142);
+    i0.ɵɵtemplate(2, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_9_Conditional_0_Conditional_2_Template, 2, 1, "span", 126);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const model_r15 = i0.ɵɵnextContext(2).$implicit;
+    const model_r18 = i0.ɵɵnextContext(2).$implicit;
     const ctx_r1 = i0.ɵɵnextContext(5);
-    i0.ɵɵstyleProp("color", ctx_r1.getVendorStatusColor(model_r15.ModelID, model_r15.VendorID));
+    i0.ɵɵstyleProp("color", ctx_r1.getVendorStatusColor(model_r18.ModelID, model_r18.VendorID));
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1(" ", ctx_r1.getVendorDisplayName(model_r15.VendorID), " ");
+    i0.ɵɵtextInterpolate1(" ", ctx_r1.getVendorDisplayName(model_r18.VendorID), " ");
     i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r1.getModelVendorStatus(model_r15.ModelID, model_r15.VendorID) !== "Active" ? 2 : -1);
+    i0.ɵɵconditional(ctx_r1.getModelVendorStatus(model_r18.ModelID, model_r18.VendorID) !== "Active" ? 2 : -1);
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_9_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 146);
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_9_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 130);
     i0.ɵɵtext(1, "-");
     i0.ɵɵelementEnd();
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_9_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵtemplate(0, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_9_Conditional_0_Template, 3, 4, "span", 145)(1, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_9_Conditional_1_Template, 2, 0, "span", 146);
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_9_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtemplate(0, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_9_Conditional_0_Template, 3, 4, "span", 129)(1, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_9_Conditional_1_Template, 2, 0, "span", 130);
+} if (rf & 2) {
+    const model_r18 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵconditional(model_r18.VendorID && model_r18.ModelID ? 0 : 1);
+} }
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_11_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 131);
+    i0.ɵɵelement(1, "i", 55);
+    i0.ɵɵtext(2, " Loading... ");
+    i0.ɵɵelementEnd();
+} }
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_11_Conditional_1_ng_template_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 135);
+    i0.ɵɵtext(1, " No configurations available ");
+    i0.ɵɵelementEnd();
+} }
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_11_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    const _r22 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "kendo-dropdownlist", 133);
+    i0.ɵɵtwoWayListener("ngModelChange", function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_11_Conditional_1_Template_kendo_dropdownlist_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r22); const model_r18 = i0.ɵɵnextContext(2).$implicit; i0.ɵɵtwoWayBindingSet(model_r18.ConfigurationID, $event) || (model_r18.ConfigurationID = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵlistener("valueChange", function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_11_Conditional_1_Template_kendo_dropdownlist_valueChange_0_listener($event) { i0.ɵɵrestoreView(_r22); const ɵ$index_302_r16 = i0.ɵɵnextContext(2).$index; const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.onConfigurationChange($event, ɵ$index_302_r16)); });
+    i0.ɵɵtemplate(1, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_11_Conditional_1_ng_template_1_Template, 2, 0, "ng-template", 134);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const model_r18 = i0.ɵɵnextContext(2).$implicit;
+    const ctx_r1 = i0.ɵɵnextContext(5);
+    i0.ɵɵtwoWayProperty("ngModel", model_r18.ConfigurationID);
+    i0.ɵɵproperty("name", "configurationId_" + ctx_r1.getModelTrackId(model_r18))("data", ctx_r1.availableConfigurations)("valuePrimitive", true)("filterable", true);
+} }
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_11_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtemplate(0, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_11_Conditional_0_Template, 3, 0, "div", 131)(1, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_11_Conditional_1_Template, 2, 5, "kendo-dropdownlist", 132);
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(6);
+    i0.ɵɵconditional(ctx_r1.isLoadingConfigurations ? 0 : 1);
+} }
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_12_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 111);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const model_r15 = i0.ɵɵnextContext().$implicit;
-    i0.ɵɵconditional(model_r15.VendorID && model_r15.ModelID ? 0 : 1);
+    const model_r18 = i0.ɵɵnextContext().$implicit;
+    const ctx_r1 = i0.ɵɵnextContext(5);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(ctx_r1.getConfigurationDisplayName(model_r18.ConfigurationID));
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_11_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 129);
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_14_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 113);
     i0.ɵɵtext(1);
     i0.ɵɵpipe(2, "date");
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const model_r15 = i0.ɵɵnextContext().$implicit;
+    const model_r18 = i0.ɵɵnextContext().$implicit;
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(2, 1, model_r15.__mj_CreatedAt, "short"));
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(2, 1, model_r18.__mj_CreatedAt, "short"));
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_12_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 130);
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_15_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 114);
     i0.ɵɵtext(1, "New");
     i0.ɵɵelementEnd();
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_14_Template(rf, ctx) { if (rf & 1) {
-    const _r19 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 148)(1, "button", 149);
-    i0.ɵɵlistener("click", function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_14_Template_button_click_1_listener() { i0.ɵɵrestoreView(_r19); const ɵ$index_417_r13 = i0.ɵɵnextContext().$index; const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.moveModelUp(ɵ$index_417_r13)); });
-    i0.ɵɵelement(2, "i", 150);
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_17_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    const _r23 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 138);
+    i0.ɵɵlistener("click", function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_17_Conditional_1_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r23); const ɵ$index_302_r16 = i0.ɵɵnextContext(2).$index; const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.moveModelUp(ɵ$index_302_r16)); });
+    i0.ɵɵelement(1, "i", 139);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "button", 151);
-    i0.ɵɵlistener("click", function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_14_Template_button_click_3_listener() { i0.ɵɵrestoreView(_r19); const ɵ$index_417_r13 = i0.ɵɵnextContext().$index; const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.moveModelDown(ɵ$index_417_r13)); });
-    i0.ɵɵelement(4, "i", 152);
-    i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(5, "button", 153);
-    i0.ɵɵlistener("click", function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_14_Template_button_click_5_listener() { i0.ɵɵrestoreView(_r19); const ɵ$index_417_r13 = i0.ɵɵnextContext().$index; const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.removePromptModel(ɵ$index_417_r13)); });
-    i0.ɵɵelement(6, "i", 154);
+    i0.ɵɵelementStart(2, "button", 140);
+    i0.ɵɵlistener("click", function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_17_Conditional_1_Template_button_click_2_listener() { i0.ɵɵrestoreView(_r23); const ɵ$index_302_r16 = i0.ɵɵnextContext(2).$index; const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.moveModelDown(ɵ$index_302_r16)); });
+    i0.ɵɵelement(3, "i", 141);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ɵ$index_417_r13 = i0.ɵɵnextContext().$index;
+    const ɵ$index_302_r16 = i0.ɵɵnextContext(2).$index;
     const ctx_r1 = i0.ɵɵnextContext(5);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("disabled", ɵ$index_417_r13 === 0);
+    i0.ɵɵproperty("disabled", ɵ$index_302_r16 === 0);
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("disabled", ɵ$index_417_r13 === ctx_r1.promptModels.length - 1);
+    i0.ɵɵproperty("disabled", ɵ$index_302_r16 === ctx_r1.promptModels.length - 1);
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_19_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span")(1, "strong");
-    i0.ɵɵtext(2, "Status:");
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_17_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    const _r24 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 142);
+    i0.ɵɵlistener("click", function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_17_Conditional_2_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r24); const ɵ$index_302_r16 = i0.ɵɵnextContext(2).$index; const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.removePromptModel(ɵ$index_302_r16)); });
+    i0.ɵɵelement(1, "i", 143);
     i0.ɵɵelementEnd();
-    i0.ɵɵtext(3);
+} }
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_17_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 136);
+    i0.ɵɵtemplate(1, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_17_Conditional_1_Template, 4, 2);
     i0.ɵɵelementEnd();
+    i0.ɵɵtemplate(2, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_17_Conditional_2_Template, 2, 0, "button", 137);
 } if (rf & 2) {
-    const model_r15 = i0.ɵɵnextContext().$implicit;
-    i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate1(" ", model_r15.Status, "");
+    const ctx_r1 = i0.ɵɵnextContext(6);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.UserCanUpdatePromptModels ? 1 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.UserCanDeletePromptModels ? 2 : -1);
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_20_Template(rf, ctx) { if (rf & 1) {
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_22_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span")(1, "strong");
-    i0.ɵɵtext(2, "Configuration:");
+    i0.ɵɵtext(2, "Status:");
     i0.ɵɵelementEnd();
     i0.ɵɵtext(3);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const model_r15 = i0.ɵɵnextContext().$implicit;
+    const model_r18 = i0.ɵɵnextContext().$implicit;
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate1(" ", model_r15.ConfigurationID, "");
+    i0.ɵɵtextInterpolate1(" ", model_r18.Status, "");
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_21_Conditional_4_Conditional_5_Template(rf, ctx) { if (rf & 1) {
-    const _r21 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div")(1, "label", 159);
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_23_Conditional_4_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    const _r26 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div")(1, "label", 148);
     i0.ɵɵtext(2, "Parallel Count");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "kendo-numerictextbox", 161);
-    i0.ɵɵtwoWayListener("ngModelChange", function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_21_Conditional_4_Conditional_5_Template_kendo_numerictextbox_ngModelChange_3_listener($event) { i0.ɵɵrestoreView(_r21); const model_r15 = i0.ɵɵnextContext(3).$implicit; i0.ɵɵtwoWayBindingSet(model_r15.ParallelCount, $event) || (model_r15.ParallelCount = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵelementStart(3, "kendo-numerictextbox", 150);
+    i0.ɵɵtwoWayListener("ngModelChange", function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_23_Conditional_4_Conditional_5_Template_kendo_numerictextbox_ngModelChange_3_listener($event) { i0.ɵɵrestoreView(_r26); const model_r18 = i0.ɵɵnextContext(3).$implicit; i0.ɵɵtwoWayBindingSet(model_r18.ParallelCount, $event) || (model_r18.ParallelCount = $event); return i0.ɵɵresetView($event); });
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    const ctx_r13 = i0.ɵɵnextContext(3);
-    const model_r15 = ctx_r13.$implicit;
-    const ɵ$index_417_r13 = ctx_r13.$index;
+    const ctx_r16 = i0.ɵɵnextContext(3);
+    const model_r18 = ctx_r16.$implicit;
+    const ɵ$index_302_r16 = ctx_r16.$index;
     i0.ɵɵadvance(3);
-    i0.ɵɵtwoWayProperty("ngModel", model_r15.ParallelCount);
-    i0.ɵɵproperty("name", "parallelCount_" + ɵ$index_417_r13)("min", 1)("step", 1)("format", "n0");
+    i0.ɵɵtwoWayProperty("ngModel", model_r18.ParallelCount);
+    i0.ɵɵproperty("name", "parallelCount_" + ɵ$index_302_r16)("min", 1)("step", 1)("format", "n0");
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_21_Conditional_4_Conditional_6_Template(rf, ctx) { if (rf & 1) {
-    const _r22 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div")(1, "label", 159);
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_23_Conditional_4_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    const _r27 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div")(1, "label", 148);
     i0.ɵɵtext(2, "Config Parameter");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "kendo-textbox", 162);
-    i0.ɵɵtwoWayListener("ngModelChange", function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_21_Conditional_4_Conditional_6_Template_kendo_textbox_ngModelChange_3_listener($event) { i0.ɵɵrestoreView(_r22); const model_r15 = i0.ɵɵnextContext(3).$implicit; i0.ɵɵtwoWayBindingSet(model_r15.ParallelConfigParam, $event) || (model_r15.ParallelConfigParam = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵelementStart(3, "kendo-textbox", 151);
+    i0.ɵɵtwoWayListener("ngModelChange", function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_23_Conditional_4_Conditional_6_Template_kendo_textbox_ngModelChange_3_listener($event) { i0.ɵɵrestoreView(_r27); const model_r18 = i0.ɵɵnextContext(3).$implicit; i0.ɵɵtwoWayBindingSet(model_r18.ParallelConfigParam, $event) || (model_r18.ParallelConfigParam = $event); return i0.ɵɵresetView($event); });
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    const ctx_r13 = i0.ɵɵnextContext(3);
-    const model_r15 = ctx_r13.$implicit;
-    const ɵ$index_417_r13 = ctx_r13.$index;
+    const ctx_r16 = i0.ɵɵnextContext(3);
+    const model_r18 = ctx_r16.$implicit;
+    const ɵ$index_302_r16 = ctx_r16.$index;
     i0.ɵɵadvance(3);
-    i0.ɵɵtwoWayProperty("ngModel", model_r15.ParallelConfigParam);
-    i0.ɵɵproperty("name", "parallelConfigParam_" + ɵ$index_417_r13);
+    i0.ɵɵtwoWayProperty("ngModel", model_r18.ParallelConfigParam);
+    i0.ɵɵproperty("name", "parallelConfigParam_" + ɵ$index_302_r16);
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_21_Conditional_4_Template(rf, ctx) { if (rf & 1) {
-    const _r20 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 157)(1, "div")(2, "label", 159);
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_23_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+    const _r25 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 146)(1, "div")(2, "label", 148);
     i0.ɵɵtext(3, "Parallel Mode");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "kendo-dropdownlist", 160);
-    i0.ɵɵtwoWayListener("ngModelChange", function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_21_Conditional_4_Template_kendo_dropdownlist_ngModelChange_4_listener($event) { i0.ɵɵrestoreView(_r20); const model_r15 = i0.ɵɵnextContext(2).$implicit; i0.ɵɵtwoWayBindingSet(model_r15.ParallelizationMode, $event) || (model_r15.ParallelizationMode = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵelementStart(4, "kendo-dropdownlist", 149);
+    i0.ɵɵtwoWayListener("ngModelChange", function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_23_Conditional_4_Template_kendo_dropdownlist_ngModelChange_4_listener($event) { i0.ɵɵrestoreView(_r25); const model_r18 = i0.ɵɵnextContext(2).$implicit; i0.ɵɵtwoWayBindingSet(model_r18.ParallelizationMode, $event) || (model_r18.ParallelizationMode = $event); return i0.ɵɵresetView($event); });
     i0.ɵɵelementEnd()();
-    i0.ɵɵtemplate(5, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_21_Conditional_4_Conditional_5_Template, 4, 5, "div")(6, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_21_Conditional_4_Conditional_6_Template, 4, 2, "div");
+    i0.ɵɵtemplate(5, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_23_Conditional_4_Conditional_5_Template, 4, 5, "div")(6, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_23_Conditional_4_Conditional_6_Template, 4, 2, "div");
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r13 = i0.ɵɵnextContext(2);
-    const model_r15 = ctx_r13.$implicit;
-    const ɵ$index_417_r13 = ctx_r13.$index;
+    const ctx_r16 = i0.ɵɵnextContext(2);
+    const model_r18 = ctx_r16.$implicit;
+    const ɵ$index_302_r16 = ctx_r16.$index;
     i0.ɵɵadvance(4);
-    i0.ɵɵtwoWayProperty("ngModel", model_r15.ParallelizationMode);
-    i0.ɵɵproperty("name", "parallelMode_" + ɵ$index_417_r13)("data", i0.ɵɵpureFunction3(9, _c4, i0.ɵɵpureFunction0(6, _c5), i0.ɵɵpureFunction0(7, _c6), i0.ɵɵpureFunction0(8, _c7)))("valuePrimitive", true);
+    i0.ɵɵtwoWayProperty("ngModel", model_r18.ParallelizationMode);
+    i0.ɵɵproperty("name", "parallelMode_" + ɵ$index_302_r16)("data", i0.ɵɵpureFunction3(9, _c4, i0.ɵɵpureFunction0(6, _c5), i0.ɵɵpureFunction0(7, _c6), i0.ɵɵpureFunction0(8, _c7)))("valuePrimitive", true);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(model_r15.ParallelizationMode === "StaticCount" ? 5 : -1);
+    i0.ɵɵconditional(model_r18.ParallelizationMode === "StaticCount" ? 5 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(model_r15.ParallelizationMode === "ConfigParam" ? 6 : -1);
+    i0.ɵɵconditional(model_r18.ParallelizationMode === "ConfigParam" ? 6 : -1);
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_21_Conditional_5_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_23_Conditional_5_Conditional_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span")(1, "strong");
     i0.ɵɵtext(2, "Parallel Mode:");
     i0.ɵɵelementEnd();
     i0.ɵɵtext(3);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const model_r15 = i0.ɵɵnextContext(3).$implicit;
+    const model_r18 = i0.ɵɵnextContext(3).$implicit;
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate1(" ", model_r15.ParallelizationMode, "");
+    i0.ɵɵtextInterpolate1(" ", model_r18.ParallelizationMode, "");
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_21_Conditional_5_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_23_Conditional_5_Conditional_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span")(1, "strong");
     i0.ɵɵtext(2, "Parallel Count:");
     i0.ɵɵelementEnd();
     i0.ɵɵtext(3);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const model_r15 = i0.ɵɵnextContext(3).$implicit;
+    const model_r18 = i0.ɵɵnextContext(3).$implicit;
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate1(" ", model_r15.ParallelCount, "");
+    i0.ɵɵtextInterpolate1(" ", model_r18.ParallelCount, "");
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_21_Conditional_5_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_23_Conditional_5_Conditional_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span")(1, "strong");
     i0.ɵɵtext(2, "Config Param:");
     i0.ɵɵelementEnd();
     i0.ɵɵtext(3);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const model_r15 = i0.ɵɵnextContext(3).$implicit;
+    const model_r18 = i0.ɵɵnextContext(3).$implicit;
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate1(" ", model_r15.ParallelConfigParam, "");
+    i0.ɵɵtextInterpolate1(" ", model_r18.ParallelConfigParam, "");
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_21_Conditional_5_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 158);
-    i0.ɵɵtemplate(1, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_21_Conditional_5_Conditional_1_Template, 4, 1, "span")(2, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_21_Conditional_5_Conditional_2_Template, 4, 1, "span")(3, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_21_Conditional_5_Conditional_3_Template, 4, 1, "span");
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_23_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 147);
+    i0.ɵɵtemplate(1, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_23_Conditional_5_Conditional_1_Template, 4, 1, "span")(2, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_23_Conditional_5_Conditional_2_Template, 4, 1, "span")(3, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_23_Conditional_5_Conditional_3_Template, 4, 1, "span");
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const model_r15 = i0.ɵɵnextContext(2).$implicit;
+    const model_r18 = i0.ɵɵnextContext(2).$implicit;
     i0.ɵɵadvance();
-    i0.ɵɵconditional(model_r15.ParallelizationMode ? 1 : -1);
+    i0.ɵɵconditional(model_r18.ParallelizationMode ? 1 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(model_r15.ParallelCount ? 2 : -1);
+    i0.ɵɵconditional(model_r18.ParallelCount ? 2 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(model_r15.ParallelConfigParam ? 3 : -1);
+    i0.ɵɵconditional(model_r18.ParallelConfigParam ? 3 : -1);
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_21_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 134)(1, "div", 155);
-    i0.ɵɵelement(2, "i", 156);
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_23_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 118)(1, "div", 144);
+    i0.ɵɵelement(2, "i", 145);
     i0.ɵɵtext(3, " Model-Specific Parallel Execution ");
     i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(4, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_21_Conditional_4_Template, 7, 13, "div", 157)(5, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_21_Conditional_5_Template, 4, 3, "div", 158);
+    i0.ɵɵtemplate(4, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_23_Conditional_4_Template, 7, 13, "div", 146)(5, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_23_Conditional_5_Template, 4, 3, "div", 147);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(6);
     i0.ɵɵadvance(4);
     i0.ɵɵconditional(ctx_r1.EditMode ? 4 : 5);
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Template(rf, ctx) { if (rf & 1) {
-    const _r12 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 122);
-    i0.ɵɵlistener("dragstart", function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Template_div_dragstart_0_listener($event) { const ɵ$index_417_r13 = i0.ɵɵrestoreView(_r12).$index; const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.onDragStart($event, ɵ$index_417_r13)); })("dragover", function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Template_div_dragover_0_listener($event) { i0.ɵɵrestoreView(_r12); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.onDragOver($event)); })("drop", function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Template_div_drop_0_listener($event) { const ɵ$index_417_r13 = i0.ɵɵrestoreView(_r12).$index; const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.onDrop($event, ɵ$index_417_r13)); })("dragend", function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Template_div_dragend_0_listener($event) { i0.ɵɵrestoreView(_r12); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.onDragEnd($event)); });
-    i0.ɵɵelementStart(1, "div", 123);
-    i0.ɵɵtemplate(2, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_2_Template, 3, 1)(3, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_3_Template, 2, 3, "span", 124);
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Template(rf, ctx) { if (rf & 1) {
+    const _r15 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 104);
+    i0.ɵɵlistener("dragstart", function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Template_div_dragstart_0_listener($event) { const ɵ$index_302_r16 = i0.ɵɵrestoreView(_r15).$index; const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.onDragStart($event, ɵ$index_302_r16)); })("dragover", function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Template_div_dragover_0_listener($event) { i0.ɵɵrestoreView(_r15); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.onDragOver($event)); })("drop", function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Template_div_drop_0_listener($event) { const ɵ$index_302_r16 = i0.ɵɵrestoreView(_r15).$index; const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.onDrop($event, ɵ$index_302_r16)); })("dragend", function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Template_div_dragend_0_listener($event) { i0.ɵɵrestoreView(_r15); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.onDragEnd($event)); });
+    i0.ɵɵelementStart(1, "div", 105);
+    i0.ɵɵtemplate(2, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_2_Template, 3, 1)(3, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_3_Template, 2, 3, "span", 106);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "div", 125);
-    i0.ɵɵtemplate(5, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_5_Template, 1, 5, "kendo-dropdownlist", 126)(6, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_6_Template, 2, 1, "span", 24);
+    i0.ɵɵelementStart(4, "div", 107);
+    i0.ɵɵtemplate(5, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_5_Template, 1, 5, "kendo-dropdownlist", 108)(6, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_6_Template, 2, 1, "span", 24);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(7, "div", 127);
-    i0.ɵɵtemplate(8, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_8_Template, 2, 1)(9, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_9_Template, 2, 1);
+    i0.ɵɵelementStart(7, "div", 109);
+    i0.ɵɵtemplate(8, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_8_Template, 2, 1)(9, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_9_Template, 2, 1);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(10, "div", 128);
-    i0.ɵɵtemplate(11, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_11_Template, 3, 4, "span", 129)(12, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_12_Template, 2, 0, "span", 130);
+    i0.ɵɵelementStart(10, "div", 110);
+    i0.ɵɵtemplate(11, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_11_Template, 2, 1)(12, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_12_Template, 2, 1, "span", 111);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(13, "div", 131);
-    i0.ɵɵtemplate(14, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_14_Template, 7, 2);
+    i0.ɵɵelementStart(13, "div", 112);
+    i0.ɵɵtemplate(14, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_14_Template, 3, 4, "span", 113)(15, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_15_Template, 2, 0, "span", 114);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(16, "div", 115);
+    i0.ɵɵtemplate(17, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_17_Template, 3, 2);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(15, "div", 132);
-    i0.ɵɵelement(16, "div");
-    i0.ɵɵelementStart(17, "div")(18, "div", 133);
-    i0.ɵɵtemplate(19, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_19_Template, 4, 1, "span")(20, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_20_Template, 4, 1, "span");
+    i0.ɵɵelementStart(18, "div", 116);
+    i0.ɵɵelement(19, "div");
+    i0.ɵɵelementStart(20, "div")(21, "div", 117);
+    i0.ɵɵtemplate(22, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_22_Template, 4, 1, "span");
     i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(21, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Conditional_21_Template, 6, 1, "div", 134);
+    i0.ɵɵtemplate(23, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Conditional_23_Template, 6, 1, "div", 118);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    const model_r15 = ctx.$implicit;
-    const ɵ$index_417_r13 = ctx.$index;
+    const model_r18 = ctx.$implicit;
+    const ɵ$index_302_r16 = ctx.$index;
     const ctx_r1 = i0.ɵɵnextContext(5);
-    i0.ɵɵstyleProp("background", !model_r15.ModelID ? "#fff3cd" : ctx_r1.draggedIndex === ɵ$index_417_r13 ? "#e3f2fd" : "white")("border-left", !model_r15.ModelID ? "3px solid #ffc107" : "none")("opacity", ctx_r1.draggedIndex === ɵ$index_417_r13 ? "0.5" : "1");
+    i0.ɵɵstyleProp("background", !model_r18.ModelID ? "#fff3cd" : ctx_r1.draggedIndex === ɵ$index_302_r16 ? "#e3f2fd" : "white")("border-left", !model_r18.ModelID ? "3px solid #ffc107" : "none")("opacity", ctx_r1.draggedIndex === ɵ$index_302_r16 ? "0.5" : "1");
     i0.ɵɵproperty("draggable", ctx_r1.EditMode);
     i0.ɵɵadvance(2);
     i0.ɵɵconditional(ctx_r1.EditMode ? 2 : 3);
@@ -901,28 +803,28 @@ function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Condi
     i0.ɵɵadvance(3);
     i0.ɵɵconditional(ctx_r1.EditMode ? 8 : 9);
     i0.ɵɵadvance(3);
-    i0.ɵɵconditional(model_r15.ID ? 11 : 12);
+    i0.ɵɵconditional(ctx_r1.EditMode ? 11 : 12);
+    i0.ɵɵadvance(3);
+    i0.ɵɵconditional(model_r18.ID ? 14 : 15);
     i0.ɵɵadvance(3);
-    i0.ɵɵconditional(ctx_r1.EditMode ? 14 : -1);
+    i0.ɵɵconditional(ctx_r1.EditMode ? 17 : -1);
     i0.ɵɵadvance(5);
-    i0.ɵɵconditional(model_r15.Status ? 19 : -1);
+    i0.ɵɵconditional(model_r18.Status ? 22 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(model_r15.ConfigurationID ? 20 : -1);
-    i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r1.record.ParallelizationMode === "ModelSpecific" ? 21 : -1);
+    i0.ɵɵconditional(ctx_r1.record.ParallelizationMode === "ModelSpecific" ? 23 : -1);
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_Conditional_16_Template(rf, ctx) { if (rf & 1) {
-    const _r23 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 120)(1, "button", 163);
-    i0.ɵɵlistener("click", function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_Conditional_16_Template_button_click_1_listener() { i0.ɵɵrestoreView(_r23); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.addNewModel()); });
-    i0.ɵɵelement(2, "i", 71);
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_Conditional_18_Template(rf, ctx) { if (rf & 1) {
+    const _r28 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 102)(1, "button", 152);
+    i0.ɵɵlistener("click", function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_Conditional_18_Template_button_click_1_listener() { i0.ɵɵrestoreView(_r28); const ctx_r1 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r1.addNewModel()); });
+    i0.ɵɵelement(2, "i", 73);
     i0.ɵɵtext(3, " Add Model ");
     i0.ɵɵelementEnd()();
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵtemplate(0, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_Conditional_0_Template, 3, 0, "div", 116);
-    i0.ɵɵelementStart(1, "div", 117)(2, "div", 118);
-    i0.ɵɵelement(3, "i", 119);
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtemplate(0, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_Conditional_0_Template, 3, 0, "div", 98);
+    i0.ɵɵelementStart(1, "div", 99)(2, "div", 100);
+    i0.ɵɵelement(3, "i", 101);
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(4, "div");
     i0.ɵɵtext(5, "AI Model ");
@@ -933,81 +835,84 @@ function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Condi
     i0.ɵɵtext(9, "Vendor");
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(10, "div");
-    i0.ɵɵtext(11, "Created");
+    i0.ɵɵtext(11, "Configuration");
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(12, "div");
-    i0.ɵɵtext(13, "Actions");
+    i0.ɵɵtext(13, "Created");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(14, "div");
+    i0.ɵɵtext(15, "Actions");
     i0.ɵɵelementEnd()();
-    i0.ɵɵrepeaterCreate(14, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_For_15_Template, 22, 15, null, null, _forTrack1, true);
-    i0.ɵɵtemplate(16, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_Conditional_16_Template, 4, 0, "div", 120);
+    i0.ɵɵrepeaterCreate(16, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_For_17_Template, 24, 15, null, null, _forTrack0, true);
+    i0.ɵɵtemplate(18, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_Conditional_18_Template, 4, 0, "div", 102);
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(4);
     i0.ɵɵconditional(ctx_r1.promptModels.length > 1 ? 0 : -1);
-    i0.ɵɵadvance(14);
+    i0.ɵɵadvance(16);
     i0.ɵɵrepeater(ctx_r1.promptModels);
     i0.ɵɵadvance(2);
-    i0.ɵɵconditional(ctx_r1.EditMode ? 16 : -1);
+    i0.ɵɵconditional(ctx_r1.EditMode && ctx_r1.UserCanCreatePromptModels ? 18 : -1);
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵtemplate(0, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_0_Template, 4, 1, "div", 80)(1, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Conditional_1_Template, 17, 2);
+function AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtemplate(0, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_0_Template, 4, 1, "div", 94)(1, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Conditional_1_Template, 19, 2);
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(3);
     i0.ɵɵconditional(ctx_r1.promptModels.length === 0 ? 0 : 1);
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_42_Template(rf, ctx) { if (rf & 1) {
+function AIPromptFormComponentExtended_form_2_Conditional_41_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "kendo-expansionpanel", 30);
-    i0.ɵɵtemplate(1, AIPromptFormComponentExtended_form_2_Conditional_42_ng_template_1_Template, 7, 1, "ng-template", 31);
-    i0.ɵɵelementStart(2, "div", 37)(3, "div", 110);
-    i0.ɵɵtemplate(4, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_4_Template, 3, 0, "div", 79)(5, AIPromptFormComponentExtended_form_2_Conditional_42_Conditional_5_Template, 2, 1);
+    i0.ɵɵtemplate(1, AIPromptFormComponentExtended_form_2_Conditional_41_ng_template_1_Template, 7, 1, "ng-template", 31);
+    i0.ɵɵelementStart(2, "div", 37)(3, "div", 88);
+    i0.ɵɵtemplate(4, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_4_Template, 3, 0, "div", 89)(5, AIPromptFormComponentExtended_form_2_Conditional_41_Conditional_5_Template, 2, 1);
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
-    i0.ɵɵproperty("expanded", false);
+    i0.ɵɵproperty("expanded", true);
     i0.ɵɵadvance(4);
     i0.ɵɵconditional(ctx_r1.isLoadingModels ? 4 : 5);
 } }
-function AIPromptFormComponentExtended_form_2_ng_template_44_Template(rf, ctx) { if (rf & 1) {
+function AIPromptFormComponentExtended_form_2_ng_template_43_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span", 63);
-    i0.ɵɵelement(1, "i", 164);
+    i0.ɵɵelement(1, "i", 153);
     i0.ɵɵtext(2, " Advanced Configuration ");
     i0.ɵɵelementEnd();
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_49_Template(rf, ctx) { if (rf & 1) {
+function AIPromptFormComponentExtended_form_2_Conditional_48_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelement(0, "mj-form-field", 40);
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵproperty("record", ctx_r1.record)("ShowLabel", true)("EditMode", ctx_r1.EditMode);
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_50_Template(rf, ctx) { if (rf & 1) {
+function AIPromptFormComponentExtended_form_2_Conditional_49_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelement(0, "mj-form-field", 41);
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵproperty("record", ctx_r1.record)("ShowLabel", true)("EditMode", ctx_r1.EditMode);
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_58_Conditional_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 165);
+function AIPromptFormComponentExtended_form_2_Conditional_57_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 154);
     i0.ɵɵelement(1, "i", 55);
     i0.ɵɵtext(2, " Loading prompts... ");
     i0.ɵɵelementEnd();
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_58_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    const _r24 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "kendo-dropdowntree", 167);
-    i0.ɵɵtwoWayListener("ngModelChange", function AIPromptFormComponentExtended_form_2_Conditional_58_Conditional_1_Template_kendo_dropdowntree_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r24); const ctx_r1 = i0.ɵɵnextContext(3); i0.ɵɵtwoWayBindingSet(ctx_r1.record.ResultSelectorPromptID, $event) || (ctx_r1.record.ResultSelectorPromptID = $event); return i0.ɵɵresetView($event); });
-    i0.ɵɵlistener("valueChange", function AIPromptFormComponentExtended_form_2_Conditional_58_Conditional_1_Template_kendo_dropdowntree_valueChange_0_listener($event) { i0.ɵɵrestoreView(_r24); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.onResultSelectorChange($event)); });
+function AIPromptFormComponentExtended_form_2_Conditional_57_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    const _r29 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "kendo-dropdowntree", 156);
+    i0.ɵɵtwoWayListener("ngModelChange", function AIPromptFormComponentExtended_form_2_Conditional_57_Conditional_1_Template_kendo_dropdowntree_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r29); const ctx_r1 = i0.ɵɵnextContext(3); i0.ɵɵtwoWayBindingSet(ctx_r1.record.ResultSelectorPromptID, $event) || (ctx_r1.record.ResultSelectorPromptID = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵlistener("valueChange", function AIPromptFormComponentExtended_form_2_Conditional_57_Conditional_1_Template_kendo_dropdowntree_valueChange_0_listener($event) { i0.ɵɵrestoreView(_r29); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.onResultSelectorChange($event)); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(3);
     i0.ɵɵtwoWayProperty("ngModel", ctx_r1.record.ResultSelectorPromptID);
     i0.ɵɵproperty("data", ctx_r1.resultSelectorTreeData)("valuePrimitive", true)("filterable", true);
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_58_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵtemplate(0, AIPromptFormComponentExtended_form_2_Conditional_58_Conditional_0_Template, 3, 0, "div", 165)(1, AIPromptFormComponentExtended_form_2_Conditional_58_Conditional_1_Template, 1, 4, "kendo-dropdowntree", 166);
+function AIPromptFormComponentExtended_form_2_Conditional_57_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtemplate(0, AIPromptFormComponentExtended_form_2_Conditional_57_Conditional_0_Template, 3, 0, "div", 154)(1, AIPromptFormComponentExtended_form_2_Conditional_57_Conditional_1_Template, 1, 4, "kendo-dropdowntree", 155);
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵconditional(ctx_r1.isLoadingResultSelectorData ? 0 : 1);
 } }
-function AIPromptFormComponentExtended_form_2_Conditional_59_Template(rf, ctx) { if (rf & 1) {
+function AIPromptFormComponentExtended_form_2_Conditional_58_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span", 47);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
@@ -1016,21 +921,222 @@ function AIPromptFormComponentExtended_form_2_Conditional_59_Template(rf, ctx) {
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate(ctx_r1.getPromptDisplayName(ctx_r1.record.ResultSelectorPromptID || "") || "None selected");
 } }
+function AIPromptFormComponentExtended_form_2_Conditional_59_ng_template_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 63);
+    i0.ɵɵelement(1, "i", 157);
+    i0.ɵɵtext(2, " Template Parameters ");
+    i0.ɵɵelementStart(3, "span", 158);
+    i0.ɵɵtext(4);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(5, "span", 92);
+    i0.ɵɵelement(6, "i", 159);
+    i0.ɵɵtext(7, " Parameters defined in the template ");
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate1(" ", ctx_r1.templateParams.length, " ");
+} }
+function AIPromptFormComponentExtended_form_2_Conditional_59_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 89);
+    i0.ɵɵelement(1, "i", 55);
+    i0.ɵɵtext(2, " Loading template parameters... ");
+    i0.ɵɵelementEnd();
+} }
+function AIPromptFormComponentExtended_form_2_Conditional_59_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 94);
+    i0.ɵɵelement(1, "i", 95);
+    i0.ɵɵtext(2, " This template has no parameters defined ");
+    i0.ɵɵelementEnd();
+} }
+function AIPromptFormComponentExtended_form_2_Conditional_59_Conditional_5_For_2_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 171);
+    i0.ɵɵtext(1, "*");
+    i0.ɵɵelementEnd();
+} }
+function AIPromptFormComponentExtended_form_2_Conditional_59_Conditional_5_For_2_Conditional_10_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 173);
+    i0.ɵɵtext(1, "Required");
+    i0.ɵɵelementEnd();
+} }
+function AIPromptFormComponentExtended_form_2_Conditional_59_Conditional_5_For_2_Conditional_11_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 174);
+    i0.ɵɵtext(1, "Optional");
+    i0.ɵɵelementEnd();
+} }
+function AIPromptFormComponentExtended_form_2_Conditional_59_Conditional_5_For_2_Conditional_12_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "p", 175);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const param_r30 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", param_r30.Description, " ");
+} }
+function AIPromptFormComponentExtended_form_2_Conditional_59_Conditional_5_For_2_Conditional_18_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 180)(1, "label", 181);
+    i0.ɵɵtext(2, "Default Value");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(3, "code", 182);
+    i0.ɵɵtext(4);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const param_r30 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate(param_r30.DefaultValue);
+} }
+function AIPromptFormComponentExtended_form_2_Conditional_59_Conditional_5_For_2_Conditional_19_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 180)(1, "label", 181);
+    i0.ɵɵtext(2, "Entity");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(3, "span", 176);
+    i0.ɵɵtext(4);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const param_r30 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate(param_r30.Entity || "Entity ID: " + param_r30.EntityID);
+} }
+function AIPromptFormComponentExtended_form_2_Conditional_59_Conditional_5_For_2_Conditional_20_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtext(0);
+} if (rf & 2) {
+    const param_r30 = i0.ɵɵnextContext(2).$implicit;
+    i0.ɵɵtextInterpolate1(" (", param_r30.LinkedParameterField, ") ");
+} }
+function AIPromptFormComponentExtended_form_2_Conditional_59_Conditional_5_For_2_Conditional_20_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 180)(1, "label", 181);
+    i0.ɵɵtext(2, "Linked To");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(3, "span", 176);
+    i0.ɵɵtext(4);
+    i0.ɵɵtemplate(5, AIPromptFormComponentExtended_form_2_Conditional_59_Conditional_5_For_2_Conditional_20_Conditional_5_Template, 1, 1);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const param_r30 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate1(" ", param_r30.LinkedParameterName, " ");
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(param_r30.LinkedParameterField ? 5 : -1);
+} }
+function AIPromptFormComponentExtended_form_2_Conditional_59_Conditional_5_For_2_Conditional_21_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 180)(1, "label", 181);
+    i0.ɵɵtext(2, "Filter");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(3, "code", 183);
+    i0.ɵɵtext(4);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const param_r30 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate(param_r30.ExtraFilter);
+} }
+function AIPromptFormComponentExtended_form_2_Conditional_59_Conditional_5_For_2_Conditional_22_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 180)(1, "label", 181);
+    i0.ɵɵtext(2, "Record ID");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(3, "code", 176);
+    i0.ɵɵtext(4);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const param_r30 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate(param_r30.RecordID);
+} }
+function AIPromptFormComponentExtended_form_2_Conditional_59_Conditional_5_For_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 166)(1, "div", 167)(2, "div", 168);
+    i0.ɵɵelement(3, "i", 169);
+    i0.ɵɵelementStart(4, "h6", 170);
+    i0.ɵɵtext(5);
+    i0.ɵɵtemplate(6, AIPromptFormComponentExtended_form_2_Conditional_59_Conditional_5_For_2_Conditional_6_Template, 2, 0, "span", 171);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(7, "div", 168)(8, "span", 172);
+    i0.ɵɵtext(9);
+    i0.ɵɵelementEnd();
+    i0.ɵɵtemplate(10, AIPromptFormComponentExtended_form_2_Conditional_59_Conditional_5_For_2_Conditional_10_Template, 2, 0, "span", 173)(11, AIPromptFormComponentExtended_form_2_Conditional_59_Conditional_5_For_2_Conditional_11_Template, 2, 0, "span", 174);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵtemplate(12, AIPromptFormComponentExtended_form_2_Conditional_59_Conditional_5_For_2_Conditional_12_Template, 2, 1, "p", 175);
+    i0.ɵɵelementStart(13, "div", 176)(14, "span", 177);
+    i0.ɵɵelement(15, "i", 178);
+    i0.ɵɵtext(16);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(17, "div", 179);
+    i0.ɵɵtemplate(18, AIPromptFormComponentExtended_form_2_Conditional_59_Conditional_5_For_2_Conditional_18_Template, 5, 1, "div", 180)(19, AIPromptFormComponentExtended_form_2_Conditional_59_Conditional_5_For_2_Conditional_19_Template, 5, 1, "div", 180)(20, AIPromptFormComponentExtended_form_2_Conditional_59_Conditional_5_For_2_Conditional_20_Template, 6, 2, "div", 180)(21, AIPromptFormComponentExtended_form_2_Conditional_59_Conditional_5_For_2_Conditional_21_Template, 5, 1, "div", 180)(22, AIPromptFormComponentExtended_form_2_Conditional_59_Conditional_5_For_2_Conditional_22_Template, 5, 1, "div", 180);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const param_r30 = ctx.$implicit;
+    const ctx_r1 = i0.ɵɵnextContext(4);
+    i0.ɵɵstyleProp("border-left", "4px solid " + ctx_r1.getParamTypeColor(param_r30.Type));
+    i0.ɵɵadvance(3);
+    i0.ɵɵclassMap("fa-solid " + ctx_r1.getParamTypeIcon(param_r30.Type));
+    i0.ɵɵstyleProp("color", ctx_r1.getParamTypeColor(param_r30.Type));
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate1(" ", param_r30.Name, " ");
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(param_r30.IsRequired ? 6 : -1);
+    i0.ɵɵadvance(2);
+    i0.ɵɵstyleProp("background-color", ctx_r1.getParamTypeColor(param_r30.Type));
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", param_r30.Type, " ");
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(param_r30.IsRequired ? 10 : 11);
+    i0.ɵɵadvance(2);
+    i0.ɵɵconditional(param_r30.Description ? 12 : -1);
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate1(" ", ctx_r1.getParamTypeDescription(param_r30), " ");
+    i0.ɵɵadvance(2);
+    i0.ɵɵconditional(param_r30.DefaultValue ? 18 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(param_r30.EntityID ? 19 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(param_r30.LinkedParameterName ? 20 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(param_r30.ExtraFilter ? 21 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(param_r30.RecordID ? 22 : -1);
+} }
+function AIPromptFormComponentExtended_form_2_Conditional_59_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 160);
+    i0.ɵɵrepeaterCreate(1, AIPromptFormComponentExtended_form_2_Conditional_59_Conditional_5_For_2_Template, 23, 19, "div", 161, _forTrack1);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(3, "div", 162)(4, "div", 163);
+    i0.ɵɵelement(5, "i", 164);
+    i0.ɵɵelementStart(6, "div", 165)(7, "strong");
+    i0.ɵɵtext(8, "Using Template Parameters:");
+    i0.ɵɵelementEnd();
+    i0.ɵɵtext(9, " When executing this prompt, you'll be prompted to provide values for all required parameters. Parameters can be simple values (text, numbers) or complex data structures (JSON objects, database records, or entire entity collections). The template will use these parameters to generate dynamic content based on the values provided at execution time. ");
+    i0.ɵɵelementEnd()()();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵadvance();
+    i0.ɵɵrepeater(ctx_r1.templateParams);
+} }
+function AIPromptFormComponentExtended_form_2_Conditional_59_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "kendo-expansionpanel", 30);
+    i0.ɵɵtemplate(1, AIPromptFormComponentExtended_form_2_Conditional_59_ng_template_1_Template, 8, 1, "ng-template", 31);
+    i0.ɵɵelementStart(2, "div", 37);
+    i0.ɵɵtemplate(3, AIPromptFormComponentExtended_form_2_Conditional_59_Conditional_3_Template, 3, 0, "div", 89)(4, AIPromptFormComponentExtended_form_2_Conditional_59_Conditional_4_Template, 3, 0, "div", 94)(5, AIPromptFormComponentExtended_form_2_Conditional_59_Conditional_5_Template, 10, 0);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵproperty("expanded", false);
+    i0.ɵɵadvance(3);
+    i0.ɵɵconditional(ctx_r1.isLoadingTemplateParams ? 3 : ctx_r1.templateParams.length === 0 ? 4 : 5);
+} }
 function AIPromptFormComponentExtended_form_2_Conditional_60_ng_template_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span", 63);
     i0.ɵɵelement(1, "i", 23);
     i0.ɵɵtext(2, " Output Example (JSON) ");
-    i0.ɵɵelementStart(3, "span", 171);
+    i0.ɵɵelementStart(3, "span", 187);
     i0.ɵɵtext(4, "\u2022 Required for object output type");
     i0.ɵɵelementEnd()();
 } }
 function AIPromptFormComponentExtended_form_2_Conditional_60_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    const _r25 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "mj-code-editor", 172);
-    i0.ɵɵtwoWayListener("ngModelChange", function AIPromptFormComponentExtended_form_2_Conditional_60_Conditional_3_Template_mj_code_editor_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r25); const ctx_r1 = i0.ɵɵnextContext(3); i0.ɵɵtwoWayBindingSet(ctx_r1.record.OutputExample, $event) || (ctx_r1.record.OutputExample = $event); return i0.ɵɵresetView($event); });
+    const _r31 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "mj-code-editor", 188);
+    i0.ɵɵtwoWayListener("ngModelChange", function AIPromptFormComponentExtended_form_2_Conditional_60_Conditional_3_Template_mj_code_editor_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r31); const ctx_r1 = i0.ɵɵnextContext(3); i0.ɵɵtwoWayBindingSet(ctx_r1.record.OutputExample, $event) || (ctx_r1.record.OutputExample = $event); return i0.ɵɵresetView($event); });
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(1, "div", 173);
-    i0.ɵɵelement(2, "i", 85);
+    i0.ɵɵelementStart(1, "div", 189);
+    i0.ɵɵelement(2, "i", 95);
     i0.ɵɵtext(3, " Provide a JSON example that defines the expected structure for object output validation. ");
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -1038,7 +1144,7 @@ function AIPromptFormComponentExtended_form_2_Conditional_60_Conditional_3_Templ
     i0.ɵɵtwoWayProperty("ngModel", ctx_r1.record.OutputExample);
 } }
 function AIPromptFormComponentExtended_form_2_Conditional_60_Conditional_4_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 169);
+    i0.ɵɵelementStart(0, "div", 185);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -1047,16 +1153,16 @@ function AIPromptFormComponentExtended_form_2_Conditional_60_Conditional_4_Templ
     i0.ɵɵtextInterpolate(ctx_r1.record.OutputExample);
 } }
 function AIPromptFormComponentExtended_form_2_Conditional_60_Conditional_5_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 170);
-    i0.ɵɵelement(1, "i", 174);
+    i0.ɵɵelementStart(0, "div", 186);
+    i0.ɵɵelement(1, "i", 190);
     i0.ɵɵtext(2, " Output example is required when output type is 'object' ");
     i0.ɵɵelementEnd();
 } }
 function AIPromptFormComponentExtended_form_2_Conditional_60_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "kendo-expansionpanel", 30);
     i0.ɵɵtemplate(1, AIPromptFormComponentExtended_form_2_Conditional_60_ng_template_1_Template, 5, 0, "ng-template", 31);
-    i0.ɵɵelementStart(2, "div", 168);
-    i0.ɵɵtemplate(3, AIPromptFormComponentExtended_form_2_Conditional_60_Conditional_3_Template, 4, 1)(4, AIPromptFormComponentExtended_form_2_Conditional_60_Conditional_4_Template, 2, 1, "div", 169)(5, AIPromptFormComponentExtended_form_2_Conditional_60_Conditional_5_Template, 3, 0, "div", 170);
+    i0.ɵɵelementStart(2, "div", 184);
+    i0.ɵɵtemplate(3, AIPromptFormComponentExtended_form_2_Conditional_60_Conditional_3_Template, 4, 1)(4, AIPromptFormComponentExtended_form_2_Conditional_60_Conditional_4_Template, 2, 1, "div", 185)(5, AIPromptFormComponentExtended_form_2_Conditional_60_Conditional_5_Template, 3, 0, "div", 186);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
@@ -1065,7 +1171,7 @@ function AIPromptFormComponentExtended_form_2_Conditional_60_Template(rf, ctx) {
     i0.ɵɵconditional(ctx_r1.EditMode ? 3 : ctx_r1.record.OutputExample ? 4 : 5);
 } }
 function AIPromptFormComponentExtended_form_2_Conditional_61_ng_template_1_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 177);
+    i0.ɵɵelementStart(0, "span", 193);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -1075,9 +1181,9 @@ function AIPromptFormComponentExtended_form_2_Conditional_61_ng_template_1_Condi
 } }
 function AIPromptFormComponentExtended_form_2_Conditional_61_ng_template_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span", 63);
-    i0.ɵɵelement(1, "i", 176);
+    i0.ɵɵelement(1, "i", 192);
     i0.ɵɵtext(2, " Execution History ");
-    i0.ɵɵtemplate(3, AIPromptFormComponentExtended_form_2_Conditional_61_ng_template_1_Conditional_3_Template, 2, 1, "span", 177);
+    i0.ɵɵtemplate(3, AIPromptFormComponentExtended_form_2_Conditional_61_ng_template_1_Conditional_3_Template, 2, 1, "span", 193);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(3);
@@ -1085,165 +1191,165 @@ function AIPromptFormComponentExtended_form_2_Conditional_61_ng_template_1_Templ
     i0.ɵɵconditional(ctx_r1.executionHistory.length > 0 ? 3 : -1);
 } }
 function AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 175);
-    i0.ɵɵelement(1, "i", 178);
+    i0.ɵɵelementStart(0, "div", 191);
+    i0.ɵɵelement(1, "i", 194);
     i0.ɵɵelementStart(2, "p");
     i0.ɵɵtext(3, "Loading execution history...");
     i0.ɵɵelementEnd()();
 } }
 function AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_4_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 175);
-    i0.ɵɵelement(1, "i", 179);
+    i0.ɵɵelementStart(0, "div", 191);
+    i0.ɵɵelement(1, "i", 195);
     i0.ɵɵelementStart(2, "p");
     i0.ɵɵtext(3, "No execution history yet");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "p", 147);
+    i0.ɵɵelementStart(4, "p", 111);
     i0.ɵɵtext(5, "Run this prompt to see execution history here");
     i0.ɵɵelementEnd()();
 } }
 function AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_5_Conditional_9_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "i", 192);
+    i0.ɵɵelement(0, "i", 208);
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(4);
     i0.ɵɵclassMap("fa-solid fa-sort-" + (ctx_r1.historySortDirection === "asc" ? "up" : "down"));
 } }
 function AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_5_Conditional_12_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "i", 192);
+    i0.ɵɵelement(0, "i", 208);
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(4);
     i0.ɵɵclassMap("fa-solid fa-sort-" + (ctx_r1.historySortDirection === "asc" ? "up" : "down"));
 } }
 function AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_5_Conditional_15_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "i", 192);
+    i0.ɵɵelement(0, "i", 208);
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(4);
     i0.ɵɵclassMap("fa-solid fa-sort-" + (ctx_r1.historySortDirection === "asc" ? "up" : "down"));
 } }
 function AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_5_Conditional_18_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "i", 192);
+    i0.ɵɵelement(0, "i", 208);
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(4);
     i0.ɵɵclassMap("fa-solid fa-sort-" + (ctx_r1.historySortDirection === "asc" ? "up" : "down"));
 } }
 function AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_5_For_41_Conditional_20_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 199);
+    i0.ɵɵelementStart(0, "span", 215);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const run_r28 = i0.ɵɵnextContext().$implicit;
+    const run_r34 = i0.ɵɵnextContext().$implicit;
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1(" ", run_r28.RunType, " ");
+    i0.ɵɵtextInterpolate1(" ", run_r34.RunType, " ");
 } }
 function AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_5_For_41_Template(rf, ctx) { if (rf & 1) {
-    const _r27 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "tr", 193)(1, "td", 194)(2, "span", 195);
+    const _r33 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "tr", 209)(1, "td", 210)(2, "span", 211);
     i0.ɵɵelement(3, "i");
     i0.ɵɵelementStart(4, "span", 24);
     i0.ɵɵtext(5);
     i0.ɵɵelementEnd()()();
-    i0.ɵɵelementStart(6, "td", 196);
+    i0.ɵɵelementStart(6, "td", 212);
     i0.ɵɵtext(7);
     i0.ɵɵpipe(8, "date");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(9, "td", 196)(10, "span", 195);
-    i0.ɵɵelement(11, "i", 111);
+    i0.ɵɵelementStart(9, "td", 212)(10, "span", 211);
+    i0.ɵɵelement(11, "i", 90);
     i0.ɵɵtext(12);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(13, "td", 196);
+    i0.ɵɵelementStart(13, "td", 212);
     i0.ɵɵtext(14);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(15, "td", 197);
+    i0.ɵɵelementStart(15, "td", 213);
     i0.ɵɵtext(16);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(17, "td", 197);
+    i0.ɵɵelementStart(17, "td", 213);
     i0.ɵɵtext(18);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(19, "td", 198);
-    i0.ɵɵtemplate(20, AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_5_For_41_Conditional_20_Template, 2, 1, "span", 199);
+    i0.ɵɵelementStart(19, "td", 214);
+    i0.ɵɵtemplate(20, AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_5_For_41_Conditional_20_Template, 2, 1, "span", 215);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(21, "td", 198)(22, "button", 200);
-    i0.ɵɵlistener("click", function AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_5_For_41_Template_button_click_22_listener() { const run_r28 = i0.ɵɵrestoreView(_r27).$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.navigateToPromptRun(run_r28.ID)); });
-    i0.ɵɵelement(23, "i", 201);
+    i0.ɵɵelementStart(21, "td", 214)(22, "button", 216);
+    i0.ɵɵlistener("click", function AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_5_For_41_Template_button_click_22_listener() { const run_r34 = i0.ɵɵrestoreView(_r33).$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.navigateToPromptRun(run_r34.ID)); });
+    i0.ɵɵelement(23, "i", 217);
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
-    const run_r28 = ctx.$implicit;
-    const ɵ$index_792_r29 = ctx.$index;
+    const run_r34 = ctx.$implicit;
+    const ɵ$index_829_r35 = ctx.$index;
     const ctx_r1 = i0.ɵɵnextContext(4);
-    i0.ɵɵclassProp("even-row", ɵ$index_792_r29 % 2 === 0);
+    i0.ɵɵclassProp("even-row", ɵ$index_829_r35 % 2 === 0);
     i0.ɵɵadvance(3);
-    i0.ɵɵclassMap("fa-solid " + ctx_r1.getExecutionStatusIcon(run_r28.Success));
-    i0.ɵɵstyleProp("color", ctx_r1.getExecutionStatusColor(run_r28.Success));
+    i0.ɵɵclassMap("fa-solid " + ctx_r1.getExecutionStatusIcon(run_r34.Success));
+    i0.ɵɵstyleProp("color", ctx_r1.getExecutionStatusColor(run_r34.Success));
     i0.ɵɵadvance();
-    i0.ɵɵstyleProp("color", ctx_r1.getExecutionStatusColor(run_r28.Success));
+    i0.ɵɵstyleProp("color", ctx_r1.getExecutionStatusColor(run_r34.Success));
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1(" ", run_r28.Success === true ? "Success" : run_r28.Success === false ? "Failed" : "Running", " ");
+    i0.ɵɵtextInterpolate1(" ", run_r34.Success === true ? "Success" : run_r34.Success === false ? "Failed" : "Running", " ");
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind2(8, 15, run_r28.RunAt, "short"), " ");
+    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind2(8, 15, run_r34.RunAt, "short"), " ");
     i0.ɵɵadvance(5);
-    i0.ɵɵtextInterpolate1(" ", run_r28.Model || "Unknown", " ");
+    i0.ɵɵtextInterpolate1(" ", run_r34.Model || "Unknown", " ");
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1(" ", ctx_r1.formatDuration(run_r28.ExecutionTimeMS), " ");
+    i0.ɵɵtextInterpolate1(" ", ctx_r1.formatDuration(run_r34.ExecutionTimeMS), " ");
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1(" ", ctx_r1.formatTokens(run_r28.TokensUsed), " ");
+    i0.ɵɵtextInterpolate1(" ", ctx_r1.formatTokens(run_r34.TokensUsed), " ");
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1(" ", ctx_r1.formatCost(run_r28.TotalCost || run_r28.Cost), " ");
+    i0.ɵɵtextInterpolate1(" ", ctx_r1.formatCost(run_r34.TotalCost || run_r34.Cost), " ");
     i0.ɵɵadvance(2);
-    i0.ɵɵconditional(run_r28.RunType ? 20 : -1);
+    i0.ɵɵconditional(run_r34.RunType ? 20 : -1);
 } }
 function AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_5_Template(rf, ctx) { if (rf & 1) {
-    const _r26 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 180)(1, "div", 146);
+    const _r32 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 196)(1, "div", 130);
     i0.ɵɵtext(2);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "div", 181)(4, "span", 100);
+    i0.ɵɵelementStart(3, "div", 197)(4, "span", 174);
     i0.ɵɵtext(5, "Sort by:");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(6, "kendo-buttongroup", 182)(7, "button", 183);
-    i0.ɵɵlistener("click", function AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_5_Template_button_click_7_listener() { i0.ɵɵrestoreView(_r26); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.changeHistorySort("runAt")); });
+    i0.ɵɵelementStart(6, "kendo-buttongroup", 198)(7, "button", 199);
+    i0.ɵɵlistener("click", function AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_5_Template_button_click_7_listener() { i0.ɵɵrestoreView(_r32); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.changeHistorySort("runAt")); });
     i0.ɵɵtext(8, " Date ");
-    i0.ɵɵtemplate(9, AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_5_Conditional_9_Template, 1, 2, "i", 184);
+    i0.ɵɵtemplate(9, AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_5_Conditional_9_Template, 1, 2, "i", 200);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(10, "button", 183);
-    i0.ɵɵlistener("click", function AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_5_Template_button_click_10_listener() { i0.ɵɵrestoreView(_r26); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.changeHistorySort("executionTime")); });
+    i0.ɵɵelementStart(10, "button", 199);
+    i0.ɵɵlistener("click", function AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_5_Template_button_click_10_listener() { i0.ɵɵrestoreView(_r32); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.changeHistorySort("executionTime")); });
     i0.ɵɵtext(11, " Duration ");
-    i0.ɵɵtemplate(12, AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_5_Conditional_12_Template, 1, 2, "i", 184);
+    i0.ɵɵtemplate(12, AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_5_Conditional_12_Template, 1, 2, "i", 200);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(13, "button", 183);
-    i0.ɵɵlistener("click", function AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_5_Template_button_click_13_listener() { i0.ɵɵrestoreView(_r26); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.changeHistorySort("tokens")); });
+    i0.ɵɵelementStart(13, "button", 199);
+    i0.ɵɵlistener("click", function AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_5_Template_button_click_13_listener() { i0.ɵɵrestoreView(_r32); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.changeHistorySort("tokens")); });
     i0.ɵɵtext(14, " Tokens ");
-    i0.ɵɵtemplate(15, AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_5_Conditional_15_Template, 1, 2, "i", 184);
+    i0.ɵɵtemplate(15, AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_5_Conditional_15_Template, 1, 2, "i", 200);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(16, "button", 183);
-    i0.ɵɵlistener("click", function AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_5_Template_button_click_16_listener() { i0.ɵɵrestoreView(_r26); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.changeHistorySort("cost")); });
+    i0.ɵɵelementStart(16, "button", 199);
+    i0.ɵɵlistener("click", function AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_5_Template_button_click_16_listener() { i0.ɵɵrestoreView(_r32); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.changeHistorySort("cost")); });
     i0.ɵɵtext(17, " Cost ");
-    i0.ɵɵtemplate(18, AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_5_Conditional_18_Template, 1, 2, "i", 184);
+    i0.ɵɵtemplate(18, AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_5_Conditional_18_Template, 1, 2, "i", 200);
     i0.ɵɵelementEnd()()()();
-    i0.ɵɵelementStart(19, "div", 185)(20, "table", 186)(21, "thead")(22, "tr", 187)(23, "th", 188);
+    i0.ɵɵelementStart(19, "div", 201)(20, "table", 202)(21, "thead")(22, "tr", 203)(23, "th", 204);
     i0.ɵɵtext(24, "Status");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(25, "th", 188);
+    i0.ɵɵelementStart(25, "th", 204);
     i0.ɵɵtext(26, "Date & Time");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(27, "th", 188);
+    i0.ɵɵelementStart(27, "th", 204);
     i0.ɵɵtext(28, "Model");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(29, "th", 188);
+    i0.ɵɵelementStart(29, "th", 204);
     i0.ɵɵtext(30, "Duration");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(31, "th", 189);
+    i0.ɵɵelementStart(31, "th", 205);
     i0.ɵɵtext(32, "Tokens");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(33, "th", 189);
+    i0.ɵɵelementStart(33, "th", 205);
     i0.ɵɵtext(34, "Cost");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(35, "th", 190);
+    i0.ɵɵelementStart(35, "th", 206);
     i0.ɵɵtext(36, "Type");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(37, "th", 190);
+    i0.ɵɵelementStart(37, "th", 206);
     i0.ɵɵtext(38, "Actions");
     i0.ɵɵelementEnd()()();
     i0.ɵɵelementStart(39, "tbody");
-    i0.ɵɵrepeaterCreate(40, AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_5_For_41_Template, 24, 18, "tr", 191, _forTrack0);
+    i0.ɵɵrepeaterCreate(40, AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_5_For_41_Template, 24, 18, "tr", 207, _forTrack1);
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(3);
@@ -1271,8 +1377,8 @@ function AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_5_Templ
 function AIPromptFormComponentExtended_form_2_Conditional_61_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "kendo-expansionpanel", 30);
     i0.ɵɵtemplate(1, AIPromptFormComponentExtended_form_2_Conditional_61_ng_template_1_Template, 4, 1, "ng-template", 31);
-    i0.ɵɵelementStart(2, "div", 168);
-    i0.ɵɵtemplate(3, AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_3_Template, 4, 0, "div", 175)(4, AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_4_Template, 6, 0, "div", 175)(5, AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_5_Template, 42, 9);
+    i0.ɵɵelementStart(2, "div", 184);
+    i0.ɵɵtemplate(3, AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_3_Template, 4, 0, "div", 191)(4, AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_4_Template, 6, 0, "div", 191)(5, AIPromptFormComponentExtended_form_2_Conditional_61_Conditional_5_Template, 42, 9);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
@@ -1282,7 +1388,7 @@ function AIPromptFormComponentExtended_form_2_Conditional_61_Template(rf, ctx) {
 } }
 function AIPromptFormComponentExtended_form_2_Conditional_62_ng_template_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span", 63);
-    i0.ɵɵelement(1, "i", 203);
+    i0.ɵɵelement(1, "i", 219);
     i0.ɵɵtext(2, " Result Cache ");
     i0.ɵɵelementEnd();
 } }
@@ -1290,7 +1396,7 @@ function AIPromptFormComponentExtended_form_2_Conditional_62_Template(rf, ctx) {
     i0.ɵɵelementStart(0, "kendo-expansionpanel", 30);
     i0.ɵɵtemplate(1, AIPromptFormComponentExtended_form_2_Conditional_62_ng_template_1_Template, 3, 0, "ng-template", 31);
     i0.ɵɵelementStart(2, "div", 37);
-    i0.ɵɵelement(3, "mj-user-view-grid", 202);
+    i0.ɵɵelement(3, "mj-user-view-grid", 218);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
@@ -1300,22 +1406,22 @@ function AIPromptFormComponentExtended_form_2_Conditional_62_Template(rf, ctx) {
 } }
 function AIPromptFormComponentExtended_form_2_Conditional_63_ng_template_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span", 63);
-    i0.ɵɵelement(1, "i", 206);
+    i0.ɵɵelement(1, "i", 222);
     i0.ɵɵtext(2, " Related Items ");
     i0.ɵɵelementEnd();
 } }
 function AIPromptFormComponentExtended_form_2_Conditional_63_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "kendo-expansionpanel", 30);
     i0.ɵɵtemplate(1, AIPromptFormComponentExtended_form_2_Conditional_63_ng_template_1_Template, 3, 0, "ng-template", 31);
-    i0.ɵɵelementStart(2, "div", 37)(3, "div", 38)(4, "div")(5, "h6", 204);
+    i0.ɵɵelementStart(2, "div", 37)(3, "div", 38)(4, "div")(5, "h6", 220);
     i0.ɵɵtext(6, "AI Agents Using This Prompt");
     i0.ɵɵelementEnd();
-    i0.ɵɵelement(7, "mj-user-view-grid", 205);
+    i0.ɵɵelement(7, "mj-user-view-grid", 221);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(8, "div")(9, "h6", 204);
+    i0.ɵɵelementStart(8, "div")(9, "h6", 220);
     i0.ɵɵtext(10, "Prompts Using This as Result Selector");
     i0.ɵɵelementEnd();
-    i0.ɵɵelement(11, "mj-user-view-grid", 205);
+    i0.ɵɵelement(11, "mj-user-view-grid", 221);
     i0.ɵɵelementEnd()()()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
@@ -1361,24 +1467,24 @@ function AIPromptFormComponentExtended_form_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(33, "div", 29)(34, "kendo-expansionpanel", 30);
     i0.ɵɵtemplate(35, AIPromptFormComponentExtended_form_2_ng_template_35_Template, 4, 1, "ng-template", 31);
     i0.ɵɵelementStart(36, "div", 32);
-    i0.ɵɵtemplate(37, AIPromptFormComponentExtended_form_2_Conditional_37_Template, 3, 0, "div", 33)(38, AIPromptFormComponentExtended_form_2_Conditional_38_Template, 13, 2, "div", 34)(39, AIPromptFormComponentExtended_form_2_Conditional_39_Template, 13, 2, "div", 35)(40, AIPromptFormComponentExtended_form_2_Conditional_40_Template, 4, 2, "div", 36);
+    i0.ɵɵtemplate(37, AIPromptFormComponentExtended_form_2_Conditional_37_Template, 3, 0, "div", 33)(38, AIPromptFormComponentExtended_form_2_Conditional_38_Template, 9, 2, "div", 34)(39, AIPromptFormComponentExtended_form_2_Conditional_39_Template, 11, 2, "div", 35)(40, AIPromptFormComponentExtended_form_2_Conditional_40_Template, 5, 3, "div", 36);
     i0.ɵɵelementEnd()();
-    i0.ɵɵtemplate(41, AIPromptFormComponentExtended_form_2_Conditional_41_Template, 6, 2, "kendo-expansionpanel", 30)(42, AIPromptFormComponentExtended_form_2_Conditional_42_Template, 6, 2, "kendo-expansionpanel", 30);
-    i0.ɵɵelementStart(43, "kendo-expansionpanel", 30);
-    i0.ɵɵtemplate(44, AIPromptFormComponentExtended_form_2_ng_template_44_Template, 3, 0, "ng-template", 31);
-    i0.ɵɵelementStart(45, "div", 37)(46, "div", 38)(47, "div");
-    i0.ɵɵelement(48, "mj-form-field", 39);
-    i0.ɵɵtemplate(49, AIPromptFormComponentExtended_form_2_Conditional_49_Template, 1, 3, "mj-form-field", 40)(50, AIPromptFormComponentExtended_form_2_Conditional_50_Template, 1, 3, "mj-form-field", 41);
-    i0.ɵɵelement(51, "mj-form-field", 42);
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(52, "div");
-    i0.ɵɵelement(53, "mj-form-field", 43)(54, "mj-form-field", 44);
-    i0.ɵɵelementStart(55, "div", 45)(56, "label", 46);
-    i0.ɵɵtext(57, " Result Selector Prompt ");
-    i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(58, AIPromptFormComponentExtended_form_2_Conditional_58_Template, 2, 1)(59, AIPromptFormComponentExtended_form_2_Conditional_59_Template, 2, 1, "span", 47);
+    i0.ɵɵtemplate(41, AIPromptFormComponentExtended_form_2_Conditional_41_Template, 6, 2, "kendo-expansionpanel", 30);
+    i0.ɵɵelementStart(42, "kendo-expansionpanel", 30);
+    i0.ɵɵtemplate(43, AIPromptFormComponentExtended_form_2_ng_template_43_Template, 3, 0, "ng-template", 31);
+    i0.ɵɵelementStart(44, "div", 37)(45, "div", 38)(46, "div");
+    i0.ɵɵelement(47, "mj-form-field", 39);
+    i0.ɵɵtemplate(48, AIPromptFormComponentExtended_form_2_Conditional_48_Template, 1, 3, "mj-form-field", 40)(49, AIPromptFormComponentExtended_form_2_Conditional_49_Template, 1, 3, "mj-form-field", 41);
+    i0.ɵɵelement(50, "mj-form-field", 42);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(51, "div");
+    i0.ɵɵelement(52, "mj-form-field", 43)(53, "mj-form-field", 44);
+    i0.ɵɵelementStart(54, "div", 45)(55, "label", 46);
+    i0.ɵɵtext(56, " Result Selector Prompt ");
+    i0.ɵɵelementEnd();
+    i0.ɵɵtemplate(57, AIPromptFormComponentExtended_form_2_Conditional_57_Template, 2, 1)(58, AIPromptFormComponentExtended_form_2_Conditional_58_Template, 2, 1, "span", 47);
     i0.ɵɵelementEnd()()()()();
-    i0.ɵɵtemplate(60, AIPromptFormComponentExtended_form_2_Conditional_60_Template, 6, 2, "kendo-expansionpanel", 30)(61, AIPromptFormComponentExtended_form_2_Conditional_61_Template, 6, 2, "kendo-expansionpanel", 30)(62, AIPromptFormComponentExtended_form_2_Conditional_62_Template, 4, 5, "kendo-expansionpanel", 30)(63, AIPromptFormComponentExtended_form_2_Conditional_63_Template, 12, 9, "kendo-expansionpanel", 30);
+    i0.ɵɵtemplate(59, AIPromptFormComponentExtended_form_2_Conditional_59_Template, 6, 2, "kendo-expansionpanel", 30)(60, AIPromptFormComponentExtended_form_2_Conditional_60_Template, 6, 2, "kendo-expansionpanel", 30)(61, AIPromptFormComponentExtended_form_2_Conditional_61_Template, 6, 2, "kendo-expansionpanel", 30)(62, AIPromptFormComponentExtended_form_2_Conditional_62_Template, 4, 5, "kendo-expansionpanel", 30)(63, AIPromptFormComponentExtended_form_2_Conditional_63_Template, 12, 9, "kendo-expansionpanel", 30);
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
@@ -1409,17 +1515,15 @@ function AIPromptFormComponentExtended_form_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance(3);
     i0.ɵɵconditional(ctx_r1.isLoadingTemplate ? 37 : !ctx_r1.record.TemplateID ? 38 : ctx_r1.templateNotFoundInDatabase ? 39 : 40);
     i0.ɵɵadvance(4);
-    i0.ɵɵconditional(ctx_r1.template && ctx_r1.templateParams.length > 0 ? 41 : -1);
-    i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r1.record.IsSaved ? 42 : -1);
+    i0.ɵɵconditional(ctx_r1.record.IsSaved ? 41 : -1);
     i0.ɵɵadvance();
     i0.ɵɵproperty("expanded", false);
     i0.ɵɵadvance(5);
     i0.ɵɵproperty("record", ctx_r1.record)("ShowLabel", true)("EditMode", ctx_r1.EditMode);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r1.showParallelCount ? 49 : -1);
+    i0.ɵɵconditional(ctx_r1.showParallelCount ? 48 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r1.showParallelConfigParam ? 50 : -1);
+    i0.ɵɵconditional(ctx_r1.showParallelConfigParam ? 49 : -1);
     i0.ɵɵadvance();
     i0.ɵɵproperty("record", ctx_r1.record)("ShowLabel", true)("EditMode", ctx_r1.EditMode);
     i0.ɵɵadvance(2);
@@ -1427,8 +1531,10 @@ function AIPromptFormComponentExtended_form_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance();
     i0.ɵɵproperty("record", ctx_r1.record)("ShowLabel", true)("EditMode", ctx_r1.EditMode);
     i0.ɵɵadvance(4);
-    i0.ɵɵconditional(ctx_r1.EditMode ? 58 : 59);
+    i0.ɵɵconditional(ctx_r1.EditMode ? 57 : 58);
     i0.ɵɵadvance(2);
+    i0.ɵɵconditional(ctx_r1.template && ctx_r1.templateParams.length > 0 ? 59 : -1);
+    i0.ɵɵadvance();
     i0.ɵɵconditional(ctx_r1.showOutputExample ? 60 : -1);
     i0.ɵɵadvance();
     i0.ɵɵconditional(ctx_r1.record.IsSaved ? 61 : -1);
@@ -1438,11 +1544,11 @@ function AIPromptFormComponentExtended_form_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵconditional(ctx_r1.record.IsSaved ? 63 : -1);
 } }
 function AIPromptFormComponentExtended_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    const _r30 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "kendo-window", 207);
-    i0.ɵɵlistener("close", function AIPromptFormComponentExtended_Conditional_3_Template_kendo_window_close_0_listener() { i0.ɵɵrestoreView(_r30); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onTestHarnessVisibilityChanged(false)); });
-    i0.ɵɵelementStart(1, "mj-ai-test-harness", 208);
-    i0.ɵɵlistener("visibilityChange", function AIPromptFormComponentExtended_Conditional_3_Template_mj_ai_test_harness_visibilityChange_1_listener($event) { i0.ɵɵrestoreView(_r30); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onTestHarnessVisibilityChanged($event)); });
+    const _r36 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "kendo-window", 223);
+    i0.ɵɵlistener("close", function AIPromptFormComponentExtended_Conditional_3_Template_kendo_window_close_0_listener() { i0.ɵɵrestoreView(_r36); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onTestHarnessVisibilityChanged(false)); });
+    i0.ɵɵelementStart(1, "mj-ai-test-harness", 224);
+    i0.ɵɵlistener("visibilityChange", function AIPromptFormComponentExtended_Conditional_3_Template_mj_ai_test_harness_visibilityChange_1_listener($event) { i0.ɵɵrestoreView(_r36); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onTestHarnessVisibilityChanged($event)); });
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
@@ -1452,19 +1558,110 @@ function AIPromptFormComponentExtended_Conditional_3_Template(rf, ctx) { if (rf
     i0.ɵɵproperty("entity", ctx_r1.record)("mode", "prompt")("isVisible", ctx_r1.showTestHarness);
 } }
 let AIPromptFormComponentExtended = class AIPromptFormComponentExtended extends AIPromptFormComponent {
+    // Main AI Prompt permissions inherited from BaseFormComponent:
+    // - UserCanEdit (Update permission)
+    // - UserCanRead (Read permission) 
+    // - UserCanCreate (Create permission)
+    // - UserCanDelete (Delete permission)
+    /** Check if user can create Templates */
+    get UserCanCreateTemplates() {
+        return this.checkEntityPermission('Templates', 'Create');
+    }
+    /** Check if user can update Templates */
+    get UserCanUpdateTemplates() {
+        return this.checkEntityPermission('Templates', 'Update');
+    }
+    /** Check if user can delete Templates */
+    get UserCanDeleteTemplates() {
+        return this.checkEntityPermission('Templates', 'Delete');
+    }
+    /** Check if user can read Templates */
+    get UserCanReadTemplates() {
+        return this.checkEntityPermission('Templates', 'Read');
+    }
+    /** Check if user can create Template Contents */
+    get UserCanCreateTemplateContents() {
+        return this.checkEntityPermission('Template Contents', 'Create');
+    }
+    /** Check if user can update Template Contents */
+    get UserCanUpdateTemplateContents() {
+        return this.checkEntityPermission('Template Contents', 'Update');
+    }
+    /** Check if user can create AI Prompt Models */
+    get UserCanCreatePromptModels() {
+        return this.checkEntityPermission('MJ: AI Prompt Models', 'Create');
+    }
+    /** Check if user can update AI Prompt Models */
+    get UserCanUpdatePromptModels() {
+        return this.checkEntityPermission('MJ: AI Prompt Models', 'Update');
+    }
+    /** Check if user can delete AI Prompt Models */
+    get UserCanDeletePromptModels() {
+        return this.checkEntityPermission('MJ: AI Prompt Models', 'Delete');
+    }
+    /**
+     * Helper method to check entity permissions with caching
+     * @param entityName - The name of the entity to check permissions for
+     * @param permissionType - The type of permission to check (Create, Read, Update, Delete)
+     * @returns boolean indicating if user has the permission
+     */
+    checkEntityPermission(entityName, permissionType) {
+        const cacheKey = `${entityName}_${permissionType}`;
+        if (this._permissionCache.has(cacheKey)) {
+            return this._permissionCache.get(cacheKey);
+        }
+        try {
+            const entityInfo = this._metadata.Entities.find(e => e.Name === entityName);
+            if (!entityInfo) {
+                console.warn(`Entity '${entityName}' not found for permission check`);
+                this._permissionCache.set(cacheKey, false);
+                return false;
+            }
+            const userPermissions = entityInfo.GetUserPermisions(this._metadata.CurrentUser);
+            let hasPermission = false;
+            switch (permissionType) {
+                case 'Create':
+                    hasPermission = userPermissions.CanCreate;
+                    break;
+                case 'Read':
+                    hasPermission = userPermissions.CanRead;
+                    break;
+                case 'Update':
+                    hasPermission = userPermissions.CanUpdate;
+                    break;
+                case 'Delete':
+                    hasPermission = userPermissions.CanDelete;
+                    break;
+            }
+            this._permissionCache.set(cacheKey, hasPermission);
+            return hasPermission;
+        }
+        catch (error) {
+            console.error(`Error checking ${permissionType} permission for ${entityName}:`, error);
+            this._permissionCache.set(cacheKey, false);
+            return false;
+        }
+    }
+    /**
+     * Clears the permission cache. Call this when user context changes or permissions are updated.
+     */
+    clearPermissionCache() {
+        this._permissionCache.clear();
+    }
     // Template editor configuration
     get templateEditorConfig() {
         return {
-            allowEdit: this.EditMode,
+            allowEdit: this.EditMode && this.UserCanUpdateTemplateContents,
             showRunButton: false,
             compactMode: false
         };
     }
-    constructor(elementRef, sharedService, router, route, cdr, testHarnessService, viewContainerRef) {
+    constructor(elementRef, sharedService, router, route, cdr, testHarnessService, viewContainerRef, promptManagementService) {
         super(elementRef, sharedService, router, route, cdr);
         this.cdr = cdr;
         this.testHarnessService = testHarnessService;
         this.viewContainerRef = viewContainerRef;
+        this.promptManagementService = promptManagementService;
         this.template = null;
         this.templateContent = null;
         this.templateParams = [];
@@ -1482,6 +1679,9 @@ let AIPromptFormComponentExtended = class AIPromptFormComponentExtended extends
         // AI Prompt Types
         this.availablePromptTypes = [];
         this.isLoadingPromptTypes = false;
+        // AI Configurations
+        this.availableConfigurations = [];
+        this.isLoadingConfigurations = false;
         // Result Selector Tree Data
         this.resultSelectorTreeData = [];
         this.isLoadingResultSelectorData = false;
@@ -1492,6 +1692,13 @@ let AIPromptFormComponentExtended = class AIPromptFormComponentExtended extends
         this.isLoadingHistory = false;
         this.historySortField = 'runAt';
         this.historySortDirection = 'desc';
+        // Removed custom transaction tracking - we'll use base form's _pendingRecords instead
+        this.hasUnsavedChanges = false;
+        // Store original state for cancel/revert functionality
+        this.originalTemplateID = null;
+        // === Permission Checks for Related Entities ===
+        /** Cache for permission checks to avoid repeated calculations */
+        this._permissionCache = new Map();
         this._metadata = new Metadata();
         this.__InferenceProvider_VendorTypeDefinitionID = '';
     }
@@ -1515,11 +1722,12 @@ let AIPromptFormComponentExtended = class AIPromptFormComponentExtended extends
             // No template ID, so we're not loading
             this.isLoadingTemplate = false;
         }
-        // Load available models, vendors, prompt types, prompt models, and result selector data
+        // Load available models, vendors, prompt types, configurations, prompt models, and result selector data
         await Promise.all([
             this.loadAvailableModels(),
             this.loadAvailableVendors(),
             this.loadAvailablePromptTypes(),
+            this.loadAvailableConfigurations(),
             this.loadPromptModels(),
             this.loadResultSelectorTreeData()
         ]);
@@ -1548,6 +1756,19 @@ let AIPromptFormComponentExtended = class AIPromptFormComponentExtended extends
             this.templateNotFoundInDatabase = false;
             return;
         }
+        // First check if we already have this template in pending records (newly created)
+        const pendingTemplate = this.PendingRecords.find(p => p.entityObject.EntityInfo.Name === 'Templates' &&
+            p.entityObject.Get('ID') === this.record.TemplateID);
+        if (pendingTemplate) {
+            // Use the pending template
+            this.template = pendingTemplate.entityObject;
+            this.templateNotFoundInDatabase = false;
+            this.isLoadingTemplate = false;
+            // Clear template content and params since this is a new template
+            this.templateContent = null;
+            this.templateParams = [];
+            return;
+        }
         this.isLoadingTemplate = true;
         this.templateNotFoundInDatabase = false; // Reset the flag
         try {
@@ -1587,13 +1808,50 @@ let AIPromptFormComponentExtended = class AIPromptFormComponentExtended extends
             this.template = null;
             this.templateParams = [];
         }
+        this.hasUnsavedChanges = true;
     }
     /**
      * Opens a dialog to link an existing template
      */
     async linkExistingTemplate() {
-        // TODO: Implement template selection dialog
-        MJNotificationService.Instance.CreateSimpleNotification('Template linking functionality coming soon', 'info', 3000);
+        try {
+            this.promptManagementService.openTemplateSelectorDialog({
+                title: 'Link Existing Template',
+                multiSelect: false,
+                showCreateNew: true,
+                showActiveOnly: true,
+                selectedTemplateIds: this.record.TemplateID ? [this.record.TemplateID] : [],
+                viewContainerRef: this.viewContainerRef
+            }).subscribe({
+                next: async (result) => {
+                    if (result && result.selectedTemplates.length > 0) {
+                        const selectedTemplate = result.selectedTemplates[0];
+                        // First, clean up any pending changes related to the old template
+                        this.cleanupOldTemplateRecords();
+                        // Update the AI prompt to reference the selected template
+                        this.record.TemplateID = selectedTemplate.ID;
+                        this.hasUnsavedChanges = true;
+                        // Load the selected template
+                        await this.loadTemplate();
+                        // Trigger change detection to update UI
+                        this.cdr.detectChanges();
+                        MJNotificationService.Instance.CreateSimpleNotification(`Template "${selectedTemplate.Name}" linked successfully`, 'success', 3000);
+                    }
+                    else if (result && result.createNew) {
+                        // User wants to create a new template
+                        await this.createNewTemplate();
+                    }
+                },
+                error: (error) => {
+                    console.error('Error opening template selector:', error);
+                    MJNotificationService.Instance.CreateSimpleNotification('Error opening template selector. Please try again.', 'error', 3000);
+                }
+            });
+        }
+        catch (error) {
+            console.error('Error in linkExistingTemplate:', error);
+            MJNotificationService.Instance.CreateSimpleNotification('Error linking template. Please try again.', 'error', 3000);
+        }
     }
     /**
      * Opens the current template in a new window
@@ -1606,26 +1864,38 @@ let AIPromptFormComponentExtended = class AIPromptFormComponentExtended extends
         window.open(templateUrl, '_blank');
     }
     /**
-     * Creates a new template for this AI prompt
+     * Creates a new template for this AI prompt (deferred until save)
      */
     async createNewTemplate() {
         try {
+            // First, clean up any pending changes related to the old template
+            this.cleanupOldTemplateRecords();
             const newTemplate = await this._metadata.GetEntityObject('Templates');
+            console.log("Record Name:", this.record.Name);
             newTemplate.NewRecord();
             newTemplate.Name = `${this.record.Name || 'AI Prompt'} Template`;
             newTemplate.Description = `Template for AI Prompt: ${this.record.Name}`;
             newTemplate.UserID = this._metadata.CurrentUser.ID;
-            const saveResult = await newTemplate.Save();
-            if (!saveResult) {
-                const errorMessage = newTemplate.LatestResult?.Message || newTemplate.LatestResult?.Errors || 'Unknown error';
-                console.error('Template save failed:', errorMessage);
-                throw new Error(`Failed to save new template: ${errorMessage}`);
-            }
+            // Add to pending records instead of saving immediately
+            this.PendingRecords.push({
+                entityObject: newTemplate,
+                action: 'save'
+            });
             // Update the AI prompt to reference the new template
             this.record.TemplateID = newTemplate.ID;
-            // Load the new template
-            await this.loadTemplate();
-            MJNotificationService.Instance.CreateSimpleNotification('New template created and linked successfully', 'success', 4000);
+            this.hasUnsavedChanges = true;
+            // Set the template for UI purposes
+            this.template = newTemplate;
+            // Clear existing template content and params since we have a new template
+            this.templateContent = null;
+            this.templateParams = [];
+            this.isLoadingTemplate = false;
+            this.templateNotFoundInDatabase = false;
+            // Force UI update in next microtask to ensure template editor refreshes
+            Promise.resolve().then(() => {
+                this.cdr.detectChanges();
+            });
+            MJNotificationService.Instance.CreateSimpleNotification('New template created and will be saved when you save the AI prompt', 'info', 4000);
         }
         catch (error) {
             console.error('Error creating new template:', error);
@@ -1633,6 +1903,21 @@ let AIPromptFormComponentExtended = class AIPromptFormComponentExtended extends
             MJNotificationService.Instance.CreateSimpleNotification(`Error creating new template: ${errorMessage}`, 'error', 6000);
         }
     }
+    /**
+     * Cleans up any pending records related to the old template when changing templates
+     */
+    cleanupOldTemplateRecords() {
+        // Get current pending records and filter out template content/params from old template
+        const currentPendingRecords = this.PendingRecords;
+        // Remove template content and template param records
+        for (let i = currentPendingRecords.length - 1; i >= 0; i--) {
+            const record = currentPendingRecords[i];
+            const entityName = record.entityObject.EntityInfo.Name;
+            if (entityName === 'Template Contents' || entityName === 'Template Params') {
+                currentPendingRecords.splice(i, 1);
+            }
+        }
+    }
     /**
      * Loads template content for the current template
      */
@@ -1733,6 +2018,72 @@ let AIPromptFormComponentExtended = class AIPromptFormComponentExtended extends
     onTemplateContentChange(content) {
         // Handle template content changes if needed
         console.log('Template content changed:', content);
+        // Mark as having unsaved changes
+        this.hasUnsavedChanges = true;
+        // If we have content changes, we need to ensure they're added to pending records
+        // This is typically handled by the template editor component itself
+    }
+    /**
+     * Handles template content record deletion
+     * This method should be called by the template editor to properly manage deletions
+     */
+    handleTemplateContentDelete(templateContent) {
+        if (templateContent.IsSaved) {
+            // If it's saved, add to pending deletions
+            this.PendingRecords.push({
+                entityObject: templateContent,
+                action: 'delete'
+            });
+        }
+        else {
+            // If it's not saved, remove it from pending records if it exists there
+            const currentPendingRecords = this.PendingRecords;
+            for (let i = currentPendingRecords.length - 1; i >= 0; i--) {
+                const record = currentPendingRecords[i];
+                if (record.entityObject === templateContent ||
+                    (record.entityObject.EntityInfo.Name === 'Template Contents' &&
+                        record.entityObject.Get('ID') === templateContent.Get('ID'))) {
+                    currentPendingRecords.splice(i, 1);
+                    break;
+                }
+            }
+        }
+        this.hasUnsavedChanges = true;
+    }
+    /**
+     * Handles template content record creation/modification
+     * This method should be called by the template editor to properly manage saves
+     */
+    handleTemplateContentSave(templateContent) {
+        if (templateContent.Dirty || !templateContent.IsSaved) {
+            // Add to pending saves
+            this.PendingRecords.push({
+                entityObject: templateContent,
+                action: 'save'
+            });
+        }
+        this.hasUnsavedChanges = true;
+    }
+    /**
+     * Adds template content changes to pending records
+     */
+    addTemplateContentsToPendingRecords() {
+        // This method would typically get pending changes from the template editor
+        // The template editor should expose its pending changes through events or direct calls
+        // For now, we'll rely on the template editor to manage its own pending records
+        // and communicate them through the MJ event system
+        // If the template editor has a method to get pending changes, we would call it here
+        if (this.templateEditor && typeof this.templateEditor.getPendingChanges === 'function') {
+            try {
+                const pendingChanges = this.templateEditor.getPendingChanges();
+                if (pendingChanges && pendingChanges.length > 0) {
+                    this.PendingRecords.push(...pendingChanges);
+                }
+            }
+            catch (error) {
+                console.warn('Template editor does not support getPendingChanges method:', error);
+            }
+        }
     }
     /**
      * Handles template run requests from the editor
@@ -1864,6 +2215,25 @@ let AIPromptFormComponentExtended = class AIPromptFormComponentExtended extends
             this.isLoadingPromptTypes = false;
         }
     }
+    /**
+     * Loads available AI configurations for selection
+     */
+    async loadAvailableConfigurations() {
+        this.isLoadingConfigurations = true;
+        try {
+            const engine = AIEngineBase.Instance;
+            await engine.Config(false);
+            const configurations = engine.Configurations;
+            configurations.sort((a, b) => a.Name.localeCompare(b.Name));
+            this.availableConfigurations = configurations;
+        }
+        catch (error) {
+            console.error('Error loading available configurations:', error);
+        }
+        finally {
+            this.isLoadingConfigurations = false;
+        }
+    }
     /**
      * Loads vendors available for a specific model
      */
@@ -1929,6 +2299,7 @@ let AIPromptFormComponentExtended = class AIPromptFormComponentExtended extends
             return;
         // Clear the vendor selection when model changes
         promptModel.VendorID = null;
+        this.hasUnsavedChanges = true;
         // Load vendors for the new model
         if (modelId) {
             const vendorData = await this.loadVendorsForModel(modelId);
@@ -1937,6 +2308,20 @@ let AIPromptFormComponentExtended = class AIPromptFormComponentExtended extends
                 promptModel.VendorID = vendorData.vendors[0].ID;
             }
         }
+        // Trigger change detection
+        this.cdr.detectChanges();
+    }
+    /**
+     * Handles configuration change for a prompt model
+     */
+    onConfigurationChange(configurationId, promptModelIndex) {
+        const promptModel = this.promptModels[promptModelIndex];
+        if (!promptModel)
+            return;
+        promptModel.ConfigurationID = configurationId;
+        this.hasUnsavedChanges = true;
+        // Trigger change detection
+        this.cdr.detectChanges();
     }
     /**
      * Gets vendors for a specific model
@@ -1985,7 +2370,7 @@ let AIPromptFormComponentExtended = class AIPromptFormComponentExtended extends
         }
     }
     /**
-     * Adds a new model to the prompt
+     * Adds a new model to the prompt (deferred until save)
      */
     async addNewModel() {
         if (!this.record?.ID)
@@ -1997,10 +2382,16 @@ let AIPromptFormComponentExtended = class AIPromptFormComponentExtended extends
             newModel.Priority = 1;
             // Generate a temporary ID for tracking if the model doesn't have one
             if (!newModel.ID) {
-                newModel._tempId = `temp_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`;
+                newModel._tempId = `temp_${Date.now()}_${Math.random().toString(36).substring(2, 11)}`;
             }
             // ModelID will be set by user
             this.promptModels.push(newModel);
+            this.hasUnsavedChanges = true;
+            // Update priorities after adding
+            this.updateModelPriorities();
+            // Trigger change detection
+            this.cdr.detectChanges();
+            MJNotificationService.Instance.CreateSimpleNotification('New model added. Select a model and save to persist changes.', 'info', 3000);
         }
         catch (error) {
             console.error('Error creating new model:', error);
@@ -2008,23 +2399,28 @@ let AIPromptFormComponentExtended = class AIPromptFormComponentExtended extends
         }
     }
     /**
-     * Removes a model from the prompt
+     * Removes a model from the prompt (deferred until save)
      */
     async removePromptModel(index) {
         if (index < 0 || index >= this.promptModels.length)
             return;
         const model = this.promptModels[index];
         try {
-            // If it's a saved model, delete it from the database
+            // If it's a saved model, add it to pending deletions
             if (model.IsSaved) {
-                const deleteResult = await model.Delete();
-                if (!deleteResult) {
-                    throw new Error('Failed to delete model from database');
-                }
+                this.PendingRecords.push({
+                    entityObject: model,
+                    action: 'delete'
+                });
             }
             // Remove from local array
             this.promptModels.splice(index, 1);
-            MJNotificationService.Instance.CreateSimpleNotification('Model removed successfully', 'success', 3000);
+            this.hasUnsavedChanges = true;
+            // Update priorities after removal
+            this.updateModelPriorities();
+            // Trigger change detection
+            this.cdr.detectChanges();
+            MJNotificationService.Instance.CreateSimpleNotification('Model will be removed when you save the prompt', 'info', 3000);
         }
         catch (error) {
             console.error('Error removing model:', error);
@@ -2059,74 +2455,147 @@ let AIPromptFormComponentExtended = class AIPromptFormComponentExtended extends
         return type ? type.Name : typeId;
     }
     /**
-     * Override SaveRecord to auto-save template contents and prompt models
+     * Gets the display name for a configuration ID
      */
-    async SaveRecord(StopEditModeAfterSave = true) {
-        try {
-            // If this is a new prompt with a new template, we need to save the template first
-            if (!this.record.IsSaved && this.template && !this.template.IsSaved) {
-                const templateSaved = await this.template.Save();
-                if (!templateSaved) {
-                    MJNotificationService.Instance.CreateSimpleNotification('Failed to save template', 'error', 5000);
-                    return false;
-                }
-                // Set the template ID on the AI prompt before saving
-                this.record.TemplateID = this.template.ID;
-            }
-            // Save the AI prompt itself
-            const promptSaved = await super.SaveRecord(StopEditModeAfterSave);
-            if (promptSaved) {
-                // Save template contents if we have a template
-                if (this.template && this.templateEditor) {
-                    const templateContentsSaved = await this.templateEditor.saveTemplateContents();
-                    if (!templateContentsSaved) {
-                        MJNotificationService.Instance.CreateSimpleNotification('AI prompt saved, but template contents failed to save', 'warning', 5000);
-                    }
+    getConfigurationDisplayName(configurationId) {
+        if (!configurationId)
+            return 'Default';
+        const config = this.availableConfigurations.find(c => c.ID === configurationId);
+        return config ? config.Name : configurationId;
+    }
+    /**
+     * Override PopulatePendingRecords to add AI prompt model changes
+     */
+    PopulatePendingRecords() {
+        // IMPORTANT: The parent method clears the pending records array, so we need to preserve
+        // any records we've added (like templates) before calling the parent method
+        const currentPendingRecords = [...this.PendingRecords]; // Make a copy
+        // Call parent first to get child component pending records (this clears the array)
+        super.PopulatePendingRecords();
+        // Re-add our preserved records
+        for (const record of currentPendingRecords) {
+            this.PendingRecords.push(record);
+        }
+        // Add prompt model changes to pending records
+        this.addPromptModelsToPendingRecords();
+        // Handle template content changes through the template editor
+        this.addTemplateContentsToPendingRecords();
+    }
+    /**
+     * Override StartEditMode to capture original state for cancel functionality
+     */
+    StartEditMode() {
+        // Store original template ID for cancel functionality
+        this.originalTemplateID = this.record.TemplateID;
+        // Call parent implementation
+        super.StartEditMode();
+    }
+    /**
+     * Override CancelEdit to restore original state
+     */
+    CancelEdit() {
+        // Call parent implementation first
+        super.CancelEdit();
+        // Restore original template state
+        if (this.originalTemplateID !== this.record.TemplateID) {
+            this.record.TemplateID = this.originalTemplateID || '';
+            // Reload the template to reflect the reverted state
+            this.loadTemplate().then(() => {
+                this.cdr.detectChanges();
+            });
+        }
+        else if (this.templateEditor) {
+            // Even if template didn't change, refresh the template editor to discard any unsaved content changes
+            this.templateEditor.refreshAndDiscardChanges();
+        }
+        // Clear the stored original state
+        this.originalTemplateID = null;
+        this.hasUnsavedChanges = false;
+    }
+    /**
+     * Adds prompt model changes to the pending records
+     */
+    addPromptModelsToPendingRecords() {
+        // Add all prompt models that have been modified or are new
+        for (const model of this.promptModels) {
+            if (model.ModelID && (model.Dirty || !model.IsSaved)) {
+                // Set the PromptID if it's not already set
+                if (!model.PromptID) {
+                    model.PromptID = this.record.ID;
                 }
-                // Then save all prompt models
-                return await this.savePromptModels();
+                this.PendingRecords.push({
+                    entityObject: model,
+                    action: 'save'
+                });
             }
-            return false;
-        }
-        catch (error) {
-            console.error('Error in SaveRecord:', error);
-            MJNotificationService.Instance.CreateSimpleNotification('Error saving AI prompt', 'error', 5000);
-            return false;
         }
     }
     /**
-     * Saves all prompt models (creates, updates, deletes)
+     * Override InternalSaveRecord to handle template dependencies and related entity changes
+     * Templates must be saved before AI Prompts to avoid foreign key constraint errors
      */
-    async savePromptModels() {
+    async InternalSaveRecord() {
+        if (!this.record) {
+            return false;
+        }
         try {
-            let allSuccessful = true;
-            // Save each prompt model
-            for (const model of this.promptModels) {
-                if (model.ModelID) { // Only save if a model is selected
-                    // Set the PromptID if it's not already set
-                    if (!model.PromptID) {
-                        model.PromptID = this.record.ID;
-                    }
-                    const saved = await model.Save();
-                    if (!saved) {
-                        console.error('Failed to save prompt model:', model);
-                        allSuccessful = false;
+            const md = new Metadata();
+            const transactionGroup = await md.CreateTransactionGroup();
+            // First, save any templates that need to be saved (they must be saved before AI Prompts)
+            const templateRecords = this.PendingRecords.filter(p => p.entityObject.EntityInfo.Name === 'Templates');
+            for (const templateRecord of templateRecords) {
+                templateRecord.entityObject.TransactionGroup = transactionGroup;
+                if (templateRecord.action === 'save') {
+                    const saveResult = await templateRecord.entityObject.Save();
+                    if (!saveResult) {
+                        MJNotificationService.Instance.CreateSimpleNotification('Failed to save template. Please check the template data.', 'error', 4000);
+                        return false;
                     }
                 }
+                else {
+                    await templateRecord.entityObject.Delete();
+                }
+            }
+            // Now save the main AI Prompt record
+            this.record.TransactionGroup = transactionGroup;
+            const agentSaveResult = await this.record.Save();
+            if (!agentSaveResult) {
+                MJNotificationService.Instance.CreateSimpleNotification('Failed to save AI prompt details. Please check the form data.', 'error', 4000);
+                return false;
             }
-            if (allSuccessful) {
-                // Reload the prompt models to get the updated state
+            // Then save all other pending records (excluding templates which we already saved)
+            const otherRecords = this.PendingRecords.filter(p => p.entityObject.EntityInfo.Name !== 'Templates');
+            for (const record of otherRecords) {
+                record.entityObject.TransactionGroup = transactionGroup;
+                if (record.action === 'save') {
+                    await record.entityObject.Save();
+                }
+                else {
+                    await record.entityObject.Delete();
+                }
+            }
+            // Execute all operations atomically
+            const success = await transactionGroup.Submit();
+            if (success) {
+                // Clear our local state since save was successful
+                this.hasUnsavedChanges = false;
+                // Reload prompt models to reflect database state
                 await this.loadPromptModels();
-                MJNotificationService.Instance.CreateSimpleNotification('AI prompt and models saved successfully', 'success', 4000);
+                // Reload template to reflect any changes
+                if (this.record.TemplateID) {
+                    await this.loadTemplate();
+                }
+                MJNotificationService.Instance.CreateSimpleNotification('AI Prompt saved successfully', 'success', 3000);
+                return true;
             }
             else {
-                MJNotificationService.Instance.CreateSimpleNotification('AI prompt saved, but some models failed to save', 'warning', 5000);
+                MJNotificationService.Instance.CreateSimpleNotification('Save failed. Please try again.', 'error', 4000);
+                return false;
             }
-            return allSuccessful;
         }
         catch (error) {
-            console.error('Error saving prompt models:', error);
-            MJNotificationService.Instance.CreateSimpleNotification('Error saving prompt models', 'error', 5000);
+            console.error('Error in AI prompt save:', error);
+            MJNotificationService.Instance.CreateSimpleNotification(`Save failed: ${error instanceof Error ? error.message : 'Unknown error'}. Please try again.`, 'error', 5000);
             return false;
         }
     }
@@ -2273,6 +2742,7 @@ let AIPromptFormComponentExtended = class AIPromptFormComponentExtended extends
                 [newModels[index], newModels[index - 1]];
             // Replace the array and force full re-render
             this.promptModels = [...newModels];
+            this.hasUnsavedChanges = true;
             this.updateModelPriorities();
             // Force Angular to re-evaluate all bindings
             this.cdr.detectChanges();
@@ -2294,6 +2764,7 @@ let AIPromptFormComponentExtended = class AIPromptFormComponentExtended extends
                 [newModels[index + 1], newModels[index]];
             // Replace the array and force full re-render
             this.promptModels = [...newModels];
+            this.hasUnsavedChanges = true;
             this.updateModelPriorities();
             // Force Angular to re-evaluate all bindings
             this.cdr.detectChanges();
@@ -2348,6 +2819,7 @@ let AIPromptFormComponentExtended = class AIPromptFormComponentExtended extends
             newModels.splice(dropIndex, 0, draggedItem);
             // Replace the array and force full re-render
             this.promptModels = [...newModels];
+            this.hasUnsavedChanges = true;
             // Update priorities
             this.updateModelPriorities();
             // Force Angular to re-evaluate all bindings
@@ -2362,7 +2834,7 @@ let AIPromptFormComponentExtended = class AIPromptFormComponentExtended extends
     /**
      * Handles drag end event
      */
-    onDragEnd(event) {
+    onDragEnd(_event) {
         this.draggedIndex = -1;
     }
     /**
@@ -2550,13 +3022,13 @@ let AIPromptFormComponentExtended = class AIPromptFormComponentExtended extends
                 return 'Unknown type';
         }
     }
-    static { this.ɵfac = function AIPromptFormComponentExtended_Factory(t) { return new (t || AIPromptFormComponentExtended)(i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i1.SharedService), i0.ɵɵdirectiveInject(i2.Router), i0.ɵɵdirectiveInject(i2.ActivatedRoute), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(i3.AITestHarnessDialogService), i0.ɵɵdirectiveInject(i0.ViewContainerRef)); }; }
+    static { this.ɵfac = function AIPromptFormComponentExtended_Factory(t) { return new (t || AIPromptFormComponentExtended)(i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i1.SharedService), i0.ɵɵdirectiveInject(i2.Router), i0.ɵɵdirectiveInject(i2.ActivatedRoute), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(i3.AITestHarnessDialogService), i0.ɵɵdirectiveInject(i0.ViewContainerRef), i0.ɵɵdirectiveInject(i4.AIPromptManagementService)); }; }
     static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: AIPromptFormComponentExtended, selectors: [["mj-ai-prompt-form"]], viewQuery: function AIPromptFormComponentExtended_Query(rf, ctx) { if (rf & 1) {
             i0.ɵɵviewQuery(_c0, 5);
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.templateEditor = _t.first);
-        } }, features: [i0.ɵɵInheritDefinitionFeature], decls: 4, vars: 2, consts: [["form", "ngForm"], ["templateEditor", ""], [1, "record-form-container"], ["kendoDialogContainer", ""], ["class", "record-form", 4, "ngIf"], [3, "width", "height", "minWidth", "minHeight", "draggable", "resizable", "state", "title"], [1, "record-form"], [3, "form"], [1, "prompt-main-area", 2, "display", "flex", "flex-direction", "column", "height", "100%", "overflow-y", "auto"], [1, "prompt-header", 2, "flex-shrink", "0", "padding", "20px", "background", "#f8f9fa", "border-bottom", "2px solid #e9ecef"], [2, "display", "flex", "justify-content", "space-between", "align-items", "flex-start", "gap", "20px"], [2, "flex", "1", "min-width", "0"], [2, "display", "flex", "align-items", "center", "gap", "12px", "margin-bottom", "8px"], [1, "fa-solid", "fa-robot", 2, "color", "#6f42c1", "font-size", "1.4em"], ["name", "promptName", "placeholder", "Enter prompt name...", 2, "font-size", "1.2em", "font-weight", "600", "min-width", "300px", "flex", "1", 3, "ngModel"], [2, "display", "flex", "gap", "16px", "margin-bottom", "12px", "flex-wrap", "wrap"], ["name", "promptDescription", "placeholder", "Enter prompt description...", 2, "width", "100%", "max-width", "600px", "margin-bottom", "12px", 3, "ngModel", "rows"], [2, "margin", "0 0 12px 0", "color", "#6c757d", "font-size", "0.9em", "line-height", "1.4"], [1, "quick-config", 2, "display", "flex", "align-items", "center", "gap", "16px", "flex-wrap", "wrap"], [1, "config-item", 2, "display", "flex", "align-items", "center", "gap", "6px", "font-size", "0.85em"], [1, "fa-solid", "fa-layer-group", 2, "color", "#6c757d"], [2, "color", "#6c757d"], [2, "color", "#495057", "font-weight", "500"], [1, "fa-solid", "fa-code", 2, "color", "#6c757d"], [2, "font-weight", "500"], [1, "action-buttons", 2, "display", "flex", "flex-direction", "column", "gap", "8px", "align-items", "flex-end"], [2, "display", "flex", "gap", "8px"], ["kendoButton", "", "title", "Run AI Prompt Test Harness", 3, "themeColor", "size"], [2, "font-size", "0.75em", "color", "#dc3545", "text-align", "right", "max-width", "200px"], [1, "configuration-sections", 2, "flex", "1", "background", "white", "border-top", "2px solid #e9ecef", "padding", "16px", "min-height", "0"], [2, "margin-bottom", "12px", 3, "expanded"], ["kendoExpansionPanelTitleDirective", ""], [1, "template-section", 2, "display", "flex", "flex-direction", "column", "min-height", "400px", "padding", "8px"], [1, "loading-state", 2, "flex", "1", "display", "flex", "align-items", "center", "justify-content", "center", "color", "#6c757d"], [1, "no-template-state", 2, "flex", "1", "display", "flex", "flex-direction", "column", "align-items", "center", "justify-content", "center", "padding", "40px", "color", "#6c757d"], [1, "invalid-template-state", 2, "flex", "1", "display", "flex", "flex-direction", "column", "align-items", "center", "justify-content", "center", "padding", "40px", "color", "#dc3545"], [1, "template-editor-container", 2, "flex", "1", "display", "flex", "flex-direction", "column", "min-height", "350px"], [2, "padding", "16px 0"], [2, "display", "grid", "grid-template-columns", "1fr 1fr", "gap", "20px"], ["FieldName", "ParallelizationMode", "Type", "dropdownlist", 3, "record", "ShowLabel", "EditMode"], ["FieldName", "ParallelCount", "Type", "numerictextbox", 3, "record", "ShowLabel", "EditMode"], ["FieldName", "ParallelConfigParam", "Type", "textbox", 3, "record", "ShowLabel", "EditMode"], ["FieldName", "OutputType", "Type", "dropdownlist", 3, "record", "ShowLabel", "EditMode"], ["FieldName", "ValidationBehavior", "Type", "dropdownlist", 3, "record", "ShowLabel", "EditMode"], ["FieldName", "EnableCaching", "Type", "checkbox", 3, "record", "ShowLabel", "EditMode"], [2, "margin-bottom", "16px"], [2, "display", "block", "margin-bottom", "4px", "font-weight", "600", "color", "#495057", "font-size", "0.9em"], [2, "color", "#495057"], ["name", "promptName", "placeholder", "Enter prompt name...", 2, "font-size", "1.2em", "font-weight", "600", "min-width", "300px", "flex", "1", 3, "ngModelChange", "ngModel"], [2, "margin", "0", "color", "#495057", "font-weight", "600", "flex", "1"], [1, "status-badge", 2, "color", "white", "padding", "4px 10px", "border-radius", "12px", "font-size", "0.75em", "font-weight", "500"], ["name", "promptStatus", "textField", "text", "valueField", "value", 2, "width", "150px", 3, "ngModelChange", "ngModel", "data", "valuePrimitive"], [2, "color", "#dc3545"], [2, "padding", "8px", "color", "#6c757d", "font-style", "italic", "width", "200px"], ["name", "promptTypeID", "textField", "Name", "valueField", "ID", "placeholder", "Select prompt type...", 2, "width", "200px", 3, "ngModel", "data", "valuePrimitive", "filterable"], [1, "fa-solid", "fa-spinner", "fa-spin"], ["name", "promptTypeID", "textField", "Name", "valueField", "ID", "placeholder", "Select prompt type...", 2, "width", "200px", 3, "ngModelChange", "ngModel", "data", "valuePrimitive", "filterable"], ["name", "promptDescription", "placeholder", "Enter prompt description...", 2, "width", "100%", "max-width", "600px", "margin-bottom", "12px", 3, "ngModelChange", "ngModel", "rows"], [1, "fa-solid", "fa-tag", 2, "color", "#6c757d"], [1, "fa-solid", "fa-database", 2, "color", "#28a745"], [2, "color", "#28a745", "font-weight", "500"], ["kendoButton", "", "title", "Run AI Prompt Test Harness", 3, "click", "themeColor", "size"], [1, "fa-solid", "fa-play"], [2, "display", "flex", "align-items", "center", "gap", "8px", "font-weight", "600"], [2, "color", "#6c757d", "font-size", "0.9em", "font-weight", "normal"], [1, "fa-solid", "fa-spinner", "fa-spin", 2, "font-size", "24px", "margin-right", "12px"], [1, "fa-solid", "fa-code", 2, "font-size", "64px", "margin-bottom", "20px", "opacity", "0.3"], [2, "margin-bottom", "12px", "color", "#495057"], [2, "margin-bottom", "24px", "text-align", "center", "max-width", "400px"], [2, "display", "flex", "gap", "12px"], ["kendoButton", "", 3, "click", "themeColor"], [1, "fa-solid", "fa-plus"], ["kendoButton", "", 3, "click", "fillMode"], [1, "fa-solid", "fa-link"], [1, "fa-solid", "fa-exclamation-triangle", 2, "font-size", "64px", "margin-bottom", "20px", "opacity", "0.7"], [2, "margin-bottom", "12px"], [1, "fa-solid", "fa-refresh"], [2, "flex", "1", "background", "white", "border-radius", "6px", "border", "1px solid #e9ecef"], [2, "display", "block", "min-height", "300px", 3, "contentChange", "runTemplate", "template", "config"], [1, "loading-state", 2, "padding", "20px", "text-align", "center", "color", "#6c757d"], [1, "empty-state", 2, "padding", "20px", "text-align", "center", "color", "#6c757d"], [1, "fa-solid", "fa-sliders", 2, "color", "#6c757d"], [1, "badge", 2, "background", "#6f42c1", "color", "white", "padding", "2px 6px", "border-radius", "10px", "font-size", "0.7em"], [2, "color", "#6c757d", "font-size", "0.8em", "font-weight", "normal", "margin-left", "8px"], ["title", "These parameters are defined in the template and will be available when executing this prompt", 1, "fa-solid", "fa-info-circle"], [1, "fa-solid", "fa-info-circle"], [2, "display", "grid", "gap", "12px"], [1, "parameter-card", 2, "border", "1px solid #e9ecef", "border-radius", "8px", "padding", "16px", "background", "#f8f9fa", "transition", "all 0.2s", 3, "border-left"], [2, "margin-top", "16px", "padding", "12px", "background", "#e3f2fd", "border-radius", "6px", "border", "1px solid #bbdefb"], [2, "display", "flex", "align-items", "flex-start", "gap", "8px"], [1, "fa-solid", "fa-lightbulb", 2, "color", "#1976d2", "margin-top", "2px"], [2, "flex", "1", "font-size", "0.85em", "color", "#1565c0", "line-height", "1.5"], [1, "parameter-card", 2, "border", "1px solid #e9ecef", "border-radius", "8px", "padding", "16px", "background", "#f8f9fa", "transition", "all 0.2s"], [2, "display", "flex", "justify-content", "space-between", "align-items", "flex-start", "margin-bottom", "8px"], [2, "display", "flex", "align-items", "center", "gap", "8px"], [2, "font-size", "1.2em"], [2, "margin", "0", "color", "#495057", "font-weight", "600"], [2, "color", "#dc3545", "font-size", "0.9em", "margin-left", "4px"], [1, "type-badge", 2, "color", "white", "padding", "4px 8px", "border-radius", "12px", "font-size", "0.75em", "font-weight", "500"], [2, "color", "#dc3545", "font-size", "0.85em", "font-weight", "500"], [2, "color", "#6c757d", "font-size", "0.85em"], [2, "margin", "0 0 8px 0", "color", "#6c757d", "font-size", "0.9em", "line-height", "1.4"], [2, "font-size", "0.85em", "color", "#495057"], [2, "display", "flex", "align-items", "center", "gap", "4px", "margin-bottom", "4px"], [1, "fa-solid", "fa-info-circle", 2, "color", "#6c757d"], [2, "display", "grid", "grid-template-columns", "repeat(auto-fit, minmax(200px, 1fr))", "gap", "12px", "margin-top", "12px"], [2, "background", "white", "padding", "8px 12px", "border-radius", "4px", "border", "1px solid #dee2e6"], [2, "display", "block", "font-size", "0.8em", "color", "#6c757d", "margin-bottom", "2px"], [2, "font-size", "0.85em", "color", "#495057", "word-break", "break-all"], [2, "font-size", "0.8em", "color", "#495057", "word-break", "break-all"], [1, "model-management", 2, "border", "1px solid #dee2e6", "border-radius", "6px", "background", "#f8f9fa"], [1, "fa-solid", "fa-microchip", 2, "color", "#6c757d"], [1, "badge", 2, "background", "#17a2b8", "color", "white", "padding", "2px 6px", "border-radius", "10px", "font-size", "0.7em"], ["title", "Models are tried in order from top to bottom. The first available model will be used.", 1, "fa-solid", "fa-info-circle"], [2, "margin-top", "10px"], ["kendoButton", "", "fillMode", "outline", "themeColor", "primary", "size", "small", 3, "click"], [2, "padding", "12px 16px", "background", "#e3f2fd", "border-bottom", "1px solid #bbdefb", "color", "#1565c0", "font-size", "0.85em"], [1, "model-header", 2, "display", "grid", "grid-template-columns", "40px 2fr 1fr 1fr 60px", "gap", "12px", "padding", "12px 16px", "background", "#e9ecef", "font-weight", "600", "font-size", "0.85em", "color", "#495057", "border-bottom", "1px solid #dee2e6"], ["title", "Priority order - models are tried from top to bottom"], [1, "fa-solid", "fa-sort", 2, "color", "#6c757d"], [1, "add-model-row", 2, "padding", "12px 16px", "text-align", "center", "background", "#f8f9fa", "border-top", "1px solid #dee2e6"], [1, "fa-solid", "fa-info-circle", 2, "margin-right", "6px"], [1, "model-row", 2, "display", "grid", "grid-template-columns", "40px 2fr 1fr 1fr 60px", "gap", "12px", "padding", "12px 16px", "border-bottom", "1px solid #e9ecef", "align-items", "start", "transition", "background 0.2s, opacity 0.2s", 3, "dragstart", "dragover", "drop", "dragend", "draggable"], [1, "drag-handle", 2, "display", "flex", "flex-direction", "column", "align-items", "center", "justify-content", "center", "color", "#6c757d"], [2, "font-size", "0.9em", "font-weight", "600", 3, "title"], [1, "model-select"], ["textField", "Name", "valueField", "ID", "placeholder", "Select a model...", 2, "width", "100%", 3, "ngModel", "name", "data", "valuePrimitive", "filterable"], [1, "model-vendor"], [1, "model-created"], [2, "color", "#6c757d", "font-size", "0.8em"], [2, "color", "#28a745", "font-size", "0.8em", "font-style", "italic"], [1, "model-actions", 2, "display", "flex", "gap", "2px", "flex-direction", "column"], [2, "display", "grid", "grid-template-columns", "40px 1fr", "gap", "12px", "padding", "8px 16px", "border-bottom", "1px solid #e9ecef", "background", "#f8f9fa", "font-size", "0.85em", "color", "#6c757d"], [2, "display", "flex", "gap", "16px", "flex-wrap", "wrap", "align-items", "center", "margin-bottom", "8px"], [2, "padding", "8px", "background", "#fff", "border", "1px solid #dee2e6", "border-radius", "4px", "margin-top", "8px"], ["title", "Drag to reorder priority", 1, "fa-solid", "fa-grip-vertical", 2, "cursor", "move"], [2, "font-size", "0.7em", "margin-top", "2px"], ["textField", "Name", "valueField", "ID", "placeholder", "Select a model...", 2, "width", "100%", 3, "ngModelChange", "valueChange", "ngModel", "name", "data", "valuePrimitive", "filterable"], [2, "color", "#6c757d", "font-style", "italic", "font-size", "0.9em"], ["textField", "Name", "valueField", "ID", "placeholder", "Select vendor...", 2, "width", "100%", 3, "ngModel", "name", "data", "valuePrimitive", "filterable"], ["textField", "Name", "valueField", "ID", "placeholder", "Select vendor...", 2, "width", "100%", 3, "ngModelChange", "ngModel", "name", "data", "valuePrimitive", "filterable"], ["kendoDropDownListItemTemplate", ""], [2, "font-size", "0.8em", "margin-left", "4px"], [2, "font-size", "0.9em", "font-weight", "500", 3, "color"], [2, "font-size", "0.9em", "font-weight", "500"], [2, "font-size", "0.9em", 3, "color"], [2, "color", "#6c757d", "font-size", "0.9em"], [2, "font-size", "0.9em"], [2, "display", "flex", "gap", "2px", "margin-bottom", "4px"], ["kendoButton", "", "fillMode", "flat", "size", "small", "title", "Move up", 3, "click", "disabled"], [1, "fa-solid", "fa-chevron-up"], ["kendoButton", "", "fillMode", "flat", "size", "small", "title", "Move down", 3, "click", "disabled"], [1, "fa-solid", "fa-chevron-down"], ["kendoButton", "", "fillMode", "flat", "themeColor", "error", "size", "small", "title", "Remove model", 3, "click"], [1, "fa-solid", "fa-times"], [2, "margin-bottom", "6px", "font-weight", "600", "color", "#495057", "font-size", "0.9em"], [1, "fa-solid", "fa-layer-group"], [2, "display", "grid", "grid-template-columns", "1fr 1fr 1fr", "gap", "12px", "align-items", "center"], [2, "display", "flex", "gap", "16px", "flex-wrap", "wrap", "align-items", "center"], [2, "display", "block", "margin-bottom", "2px", "font-size", "0.8em", "font-weight", "600", "color", "#495057"], ["textField", "text", "valueField", "value", "placeholder", "Select mode...", 2, "width", "100%", "font-size", "0.85em", 3, "ngModelChange", "ngModel", "name", "data", "valuePrimitive"], ["placeholder", "Count...", 2, "width", "100%", "font-size", "0.85em", 3, "ngModelChange", "ngModel", "name", "min", "step", "format"], ["placeholder", "Parameter name...", 2, "width", "100%", "font-size", "0.85em", 3, "ngModelChange", "ngModel", "name"], ["kendoButton", "", "fillMode", "outline", "themeColor", "success", "size", "small", 3, "click"], [1, "fa-solid", "fa-cogs", 2, "color", "#6c757d"], [2, "padding", "8px", "color", "#6c757d", "font-style", "italic"], ["name", "resultSelectorPromptID", "textField", "text", "valueField", "value", "placeholder", "Select a result selector prompt...", 2, "width", "100%", 3, "ngModel", "data", "valuePrimitive", "filterable"], ["name", "resultSelectorPromptID", "textField", "text", "valueField", "value", "placeholder", "Select a result selector prompt...", 2, "width", "100%", 3, "ngModelChange", "valueChange", "ngModel", "data", "valuePrimitive", "filterable"], [2, "padding", "16px"], [2, "background", "#f8f9fa", "border", "1px solid #dee2e6", "border-radius", "4px", "padding", "12px", "font-family", "'Courier New', monospace", "font-size", "0.9em", "white-space", "pre-wrap", "overflow", "auto", "max-height", "250px"], [2, "background", "#fff3cd", "border", "1px solid #ffeaa7", "border-radius", "4px", "padding", "12px", "color", "#856404", "text-align", "center"], [2, "color", "#dc3545", "font-size", "0.8em", "font-weight", "normal"], ["name", "outputExample", "language", "json", "placeholder", "Enter JSON example structure...", 2, "width", "100%", "height", "200px", "border", "1px solid #dee2e6", "border-radius", "4px", 3, "ngModelChange", "ngModel"], [2, "margin-top", "8px", "color", "#6c757d", "font-size", "0.85em"], [1, "fa-solid", "fa-exclamation-triangle"], [2, "text-align", "center", "padding", "40px", "color", "#6c757d"], [1, "fa-solid", "fa-history", 2, "color", "#6c757d"], [2, "color", "#6c757d", "font-weight", "normal"], [1, "fa-solid", "fa-spinner", "fa-spin", 2, "font-size", "2em", "margin-bottom", "12px"], [1, "fa-solid", "fa-history", 2, "font-size", "3em", "margin-bottom", "12px", "opacity", "0.3"], [2, "display", "flex", "justify-content", "space-between", "align-items", "center", "margin-bottom", "16px"], [2, "display", "flex", "gap", "8px", "align-items", "center"], ["selection", "single"], ["kendoButton", "", "size", "small", 3, "click", "selected"], [2, "margin-left", "4px", "font-size", "0.8em", 3, "class"], [2, "border", "1px solid #e9ecef", "border-radius", "8px", "overflow", "hidden"], [2, "width", "100%", "border-collapse", "collapse"], [2, "background", "#f8f9fa", "border-bottom", "2px solid #e9ecef"], [2, "padding", "12px", "text-align", "left", "font-weight", "600", "color", "#495057"], [2, "padding", "12px", "text-align", "right", "font-weight", "600", "color", "#495057"], [2, "padding", "12px", "text-align", "center", "font-weight", "600", "color", "#495057"], [1, "history-row", 2, "border-bottom", "1px solid #f1f3f5", 3, "even-row"], [2, "margin-left", "4px", "font-size", "0.8em"], [1, "history-row", 2, "border-bottom", "1px solid #f1f3f5"], [2, "padding", "12px"], [2, "display", "flex", "align-items", "center", "gap", "6px"], [2, "padding", "12px", "color", "#495057"], [2, "padding", "12px", "text-align", "right", "color", "#495057"], [2, "padding", "12px", "text-align", "center"], [2, "padding", "4px 8px", "border-radius", "12px", "background", "#e9ecef", "color", "#495057", "font-size", "0.85em", "font-weight", "500"], ["kendoButton", "", "fillMode", "flat", "size", "small", "title", "View details", 3, "click"], [1, "fa-solid", "fa-external-link"], [2, "height", "300px", 3, "Params", "NewRecordValues", "AllowLoad", "EditMode"], [1, "fa-solid", "fa-database", 2, "color", "#6c757d"], [2, "margin", "0 0 12px 0", "color", "#495057"], [2, "height", "200px", 3, "Params", "NewRecordValues", "AllowLoad", "EditMode"], [1, "fa-solid", "fa-link", 2, "color", "#6c757d"], [3, "close", "width", "height", "minWidth", "minHeight", "draggable", "resizable", "state", "title"], [3, "visibilityChange", "entity", "mode", "isVisible"]], template: function AIPromptFormComponentExtended_Template(rf, ctx) { if (rf & 1) {
+        } }, features: [i0.ɵɵInheritDefinitionFeature], decls: 4, vars: 2, consts: [["form", "ngForm"], ["templateEditor", ""], [1, "record-form-container"], ["kendoDialogContainer", ""], ["class", "record-form", 4, "ngIf"], [3, "width", "height", "minWidth", "minHeight", "draggable", "resizable", "state", "title"], [1, "record-form"], [3, "form"], [1, "prompt-main-area", 2, "display", "flex", "flex-direction", "column", "height", "100%", "overflow-y", "auto"], [1, "prompt-header", 2, "flex-shrink", "0", "padding", "20px", "background", "#f8f9fa", "border-bottom", "2px solid #e9ecef"], [2, "display", "flex", "justify-content", "space-between", "align-items", "flex-start", "gap", "20px"], [2, "flex", "1", "min-width", "0"], [2, "display", "flex", "align-items", "center", "gap", "12px", "margin-bottom", "8px"], [1, "fa-solid", "fa-robot", 2, "color", "#6f42c1", "font-size", "1.4em"], ["name", "promptName", "placeholder", "Enter prompt name...", 2, "font-size", "1.2em", "font-weight", "600", "min-width", "300px", "flex", "1", 3, "ngModel"], [2, "display", "flex", "gap", "16px", "margin-bottom", "12px", "flex-wrap", "wrap"], ["name", "promptDescription", "placeholder", "Enter prompt description...", 2, "width", "100%", "max-width", "600px", "margin-bottom", "12px", 3, "ngModel", "rows"], [2, "margin", "0 0 12px 0", "color", "#6c757d", "font-size", "0.9em", "line-height", "1.4"], [1, "quick-config", 2, "display", "flex", "align-items", "center", "gap", "16px", "flex-wrap", "wrap"], [1, "config-item", 2, "display", "flex", "align-items", "center", "gap", "6px", "font-size", "0.85em"], [1, "fa-solid", "fa-layer-group", 2, "color", "#6c757d"], [2, "color", "#6c757d"], [2, "color", "#495057", "font-weight", "500"], [1, "fa-solid", "fa-code", 2, "color", "#6c757d"], [2, "font-weight", "500"], [1, "action-buttons", 2, "display", "flex", "flex-direction", "column", "gap", "8px", "align-items", "flex-end"], [2, "display", "flex", "gap", "8px"], ["kendoButton", "", "title", "Run AI Prompt Test Harness", 3, "themeColor", "size"], [2, "font-size", "0.75em", "color", "#dc3545", "text-align", "right", "max-width", "200px"], [1, "configuration-sections", 2, "flex", "1", "background", "white", "border-top", "2px solid #e9ecef", "padding", "16px", "min-height", "0"], [2, "margin-bottom", "12px", 3, "expanded"], ["kendoExpansionPanelTitleDirective", ""], [1, "template-section", 2, "display", "flex", "flex-direction", "column", "min-height", "400px", "padding", "8px"], [1, "loading-state", 2, "flex", "1", "display", "flex", "align-items", "center", "justify-content", "center", "color", "#6c757d"], [1, "no-template-state", 2, "flex", "1", "display", "flex", "flex-direction", "column", "align-items", "center", "justify-content", "center", "padding", "40px", "color", "#6c757d"], [1, "invalid-template-state", 2, "flex", "1", "display", "flex", "flex-direction", "column", "align-items", "center", "justify-content", "center", "padding", "40px", "color", "#dc3545"], [1, "template-editor-container", 2, "flex", "1", "display", "flex", "flex-direction", "column", "min-height", "350px"], [2, "padding", "16px 0"], [2, "display", "grid", "grid-template-columns", "1fr 1fr", "gap", "20px"], ["FieldName", "ParallelizationMode", "Type", "dropdownlist", 3, "record", "ShowLabel", "EditMode"], ["FieldName", "ParallelCount", "Type", "numerictextbox", 3, "record", "ShowLabel", "EditMode"], ["FieldName", "ParallelConfigParam", "Type", "textbox", 3, "record", "ShowLabel", "EditMode"], ["FieldName", "OutputType", "Type", "dropdownlist", 3, "record", "ShowLabel", "EditMode"], ["FieldName", "ValidationBehavior", "Type", "dropdownlist", 3, "record", "ShowLabel", "EditMode"], ["FieldName", "EnableCaching", "Type", "checkbox", 3, "record", "ShowLabel", "EditMode"], [2, "margin-bottom", "16px"], [2, "display", "block", "margin-bottom", "4px", "font-weight", "600", "color", "#495057", "font-size", "0.9em"], [2, "color", "#495057"], ["name", "promptName", "placeholder", "Enter prompt name...", 2, "font-size", "1.2em", "font-weight", "600", "min-width", "300px", "flex", "1", 3, "ngModelChange", "ngModel"], [2, "margin", "0", "color", "#495057", "font-weight", "600", "flex", "1"], [1, "status-badge", 2, "color", "white", "padding", "4px 10px", "border-radius", "12px", "font-size", "0.75em", "font-weight", "500"], ["name", "promptStatus", "textField", "text", "valueField", "value", 2, "width", "150px", 3, "ngModelChange", "ngModel", "data", "valuePrimitive"], [2, "color", "#dc3545"], [2, "padding", "8px", "color", "#6c757d", "font-style", "italic", "width", "200px"], ["name", "promptTypeID", "textField", "Name", "valueField", "ID", "placeholder", "Select prompt type...", 2, "width", "200px", 3, "ngModel", "data", "valuePrimitive", "filterable"], [1, "fa-solid", "fa-spinner", "fa-spin"], ["name", "promptTypeID", "textField", "Name", "valueField", "ID", "placeholder", "Select prompt type...", 2, "width", "200px", 3, "ngModelChange", "ngModel", "data", "valuePrimitive", "filterable"], ["name", "promptDescription", "placeholder", "Enter prompt description...", 2, "width", "100%", "max-width", "600px", "margin-bottom", "12px", 3, "ngModelChange", "ngModel", "rows"], [1, "fa-solid", "fa-tag", 2, "color", "#6c757d"], [1, "fa-solid", "fa-database", 2, "color", "#28a745"], [2, "color", "#28a745", "font-weight", "500"], ["kendoButton", "", "title", "Run AI Prompt Test Harness", 3, "click", "themeColor", "size"], [1, "fa-solid", "fa-play"], [2, "display", "flex", "align-items", "center", "gap", "8px", "font-weight", "600"], [2, "color", "#6c757d", "font-size", "0.9em", "font-weight", "normal"], [1, "fa-solid", "fa-spinner", "fa-spin", 2, "font-size", "24px", "margin-right", "12px"], [1, "fa-solid", "fa-code", 2, "font-size", "64px", "margin-bottom", "20px", "opacity", "0.3"], [2, "margin-bottom", "12px", "color", "#495057"], [2, "margin-bottom", "24px", "text-align", "center", "max-width", "400px"], [2, "display", "flex", "gap", "12px"], ["kendoButton", "", 3, "themeColor"], ["kendoButton", "", 3, "fillMode"], ["kendoButton", "", 3, "click", "themeColor"], [1, "fa-solid", "fa-plus"], ["kendoButton", "", 3, "click", "fillMode"], [1, "fa-solid", "fa-link"], [1, "fa-solid", "fa-exclamation-triangle", 2, "font-size", "64px", "margin-bottom", "20px", "opacity", "0.7"], [2, "margin-bottom", "12px"], [1, "fa-solid", "fa-refresh"], [1, "template-actions", 2, "display", "flex", "gap", "8px", "padding", "8px", "border-bottom", "1px solid #e9ecef", "background", "#f8f9fa"], [2, "flex", "1", "background", "white", "border-radius", "6px", "border", "1px solid #e9ecef"], [2, "display", "block", "min-height", "300px", 3, "contentChange", "runTemplate", "template", "config"], ["kendoButton", "", "title", "Change to a different template", 3, "fillMode", "size"], ["kendoButton", "", "title", "Open template in new window", 3, "fillMode", "size"], ["kendoButton", "", "title", "Change to a different template", 3, "click", "fillMode", "size"], [1, "fa-solid", "fa-exchange-alt"], ["kendoButton", "", "title", "Open template in new window", 3, "click", "fillMode", "size"], [1, "fa-solid", "fa-external-link-alt"], [1, "model-management", 2, "border", "1px solid #dee2e6", "border-radius", "6px", "background", "#f8f9fa"], [1, "loading-state", 2, "padding", "20px", "text-align", "center", "color", "#6c757d"], [1, "fa-solid", "fa-microchip", 2, "color", "#6c757d"], [1, "badge", 2, "background", "#17a2b8", "color", "white", "padding", "2px 6px", "border-radius", "10px", "font-size", "0.7em"], [2, "color", "#6c757d", "font-size", "0.8em", "font-weight", "normal", "margin-left", "8px"], ["title", "Models are tried in order from top to bottom. The first available model will be used.", 1, "fa-solid", "fa-info-circle"], [1, "empty-state", 2, "padding", "20px", "text-align", "center", "color", "#6c757d"], [1, "fa-solid", "fa-info-circle"], [2, "margin-top", "10px"], ["kendoButton", "", "fillMode", "outline", "themeColor", "primary", "size", "small", 3, "click"], [2, "padding", "12px 16px", "background", "#e3f2fd", "border-bottom", "1px solid #bbdefb", "color", "#1565c0", "font-size", "0.85em"], [1, "model-header", 2, "display", "grid", "grid-template-columns", "40px 2fr 1fr 1fr 1fr 60px", "gap", "12px", "padding", "12px 16px", "background", "#e9ecef", "font-weight", "600", "font-size", "0.85em", "color", "#495057", "border-bottom", "1px solid #dee2e6"], ["title", "Priority order - models are tried from top to bottom"], [1, "fa-solid", "fa-sort", 2, "color", "#6c757d"], [1, "add-model-row", 2, "padding", "12px 16px", "text-align", "center", "background", "#f8f9fa", "border-top", "1px solid #dee2e6"], [1, "fa-solid", "fa-info-circle", 2, "margin-right", "6px"], [1, "model-row", 2, "display", "grid", "grid-template-columns", "40px 2fr 1fr 1fr 1fr 60px", "gap", "12px", "padding", "12px 16px", "border-bottom", "1px solid #e9ecef", "align-items", "start", "transition", "background 0.2s, opacity 0.2s", 3, "dragstart", "dragover", "drop", "dragend", "draggable"], [1, "drag-handle", 2, "display", "flex", "flex-direction", "column", "align-items", "center", "justify-content", "center", "color", "#6c757d"], [2, "font-size", "0.9em", "font-weight", "600", 3, "title"], [1, "model-select"], ["textField", "Name", "valueField", "ID", "placeholder", "Select a model...", 2, "width", "100%", 3, "ngModel", "name", "data", "valuePrimitive", "filterable"], [1, "model-vendor"], [1, "model-configuration"], [2, "font-size", "0.9em"], [1, "model-created"], [2, "color", "#6c757d", "font-size", "0.8em"], [2, "color", "#28a745", "font-size", "0.8em", "font-style", "italic"], [1, "model-actions", 2, "display", "flex", "gap", "2px", "flex-direction", "column"], [2, "display", "grid", "grid-template-columns", "40px 1fr", "gap", "12px", "padding", "8px 16px", "border-bottom", "1px solid #e9ecef", "background", "#f8f9fa", "font-size", "0.85em", "color", "#6c757d"], [2, "display", "flex", "gap", "16px", "flex-wrap", "wrap", "align-items", "center", "margin-bottom", "8px"], [2, "padding", "8px", "background", "#fff", "border", "1px solid #dee2e6", "border-radius", "4px", "margin-top", "8px"], ["title", "Drag to reorder priority", 1, "fa-solid", "fa-grip-vertical", 2, "cursor", "move"], [2, "font-size", "0.7em", "margin-top", "2px"], ["textField", "Name", "valueField", "ID", "placeholder", "Select a model...", 2, "width", "100%", 3, "ngModelChange", "valueChange", "ngModel", "name", "data", "valuePrimitive", "filterable"], [2, "color", "#6c757d", "font-style", "italic", "font-size", "0.9em"], ["textField", "Name", "valueField", "ID", "placeholder", "Select vendor...", 2, "width", "100%", 3, "ngModel", "name", "data", "valuePrimitive", "filterable"], ["textField", "Name", "valueField", "ID", "placeholder", "Select vendor...", 2, "width", "100%", 3, "ngModelChange", "ngModel", "name", "data", "valuePrimitive", "filterable"], ["kendoDropDownListItemTemplate", ""], [2, "font-size", "0.8em", "margin-left", "4px"], [2, "font-size", "0.9em", "font-weight", "500", 3, "color"], [2, "font-size", "0.9em", "font-weight", "500"], [2, "font-size", "0.9em", 3, "color"], [2, "color", "#6c757d", "font-size", "0.9em"], [2, "padding", "4px", "color", "#6c757d", "font-style", "italic", "font-size", "0.85em"], ["textField", "Name", "valueField", "ID", "placeholder", "Default", 2, "width", "100%", 3, "ngModel", "name", "data", "valuePrimitive", "filterable"], ["textField", "Name", "valueField", "ID", "placeholder", "Default", 2, "width", "100%", 3, "ngModelChange", "valueChange", "ngModel", "name", "data", "valuePrimitive", "filterable"], ["kendoDropDownListNoDataTemplate", ""], [2, "padding", "8px", "text-align", "center", "color", "#6c757d"], [2, "display", "flex", "gap", "2px", "margin-bottom", "4px"], ["kendoButton", "", "fillMode", "flat", "themeColor", "error", "size", "small", "title", "Remove model"], ["kendoButton", "", "fillMode", "flat", "size", "small", "title", "Move up", 3, "click", "disabled"], [1, "fa-solid", "fa-chevron-up"], ["kendoButton", "", "fillMode", "flat", "size", "small", "title", "Move down", 3, "click", "disabled"], [1, "fa-solid", "fa-chevron-down"], ["kendoButton", "", "fillMode", "flat", "themeColor", "error", "size", "small", "title", "Remove model", 3, "click"], [1, "fa-solid", "fa-times"], [2, "margin-bottom", "6px", "font-weight", "600", "color", "#495057", "font-size", "0.9em"], [1, "fa-solid", "fa-layer-group"], [2, "display", "grid", "grid-template-columns", "1fr 1fr 1fr", "gap", "12px", "align-items", "center"], [2, "display", "flex", "gap", "16px", "flex-wrap", "wrap", "align-items", "center"], [2, "display", "block", "margin-bottom", "2px", "font-size", "0.8em", "font-weight", "600", "color", "#495057"], ["textField", "text", "valueField", "value", "placeholder", "Select mode...", 2, "width", "100%", "font-size", "0.85em", 3, "ngModelChange", "ngModel", "name", "data", "valuePrimitive"], ["placeholder", "Count...", 2, "width", "100%", "font-size", "0.85em", 3, "ngModelChange", "ngModel", "name", "min", "step", "format"], ["placeholder", "Parameter name...", 2, "width", "100%", "font-size", "0.85em", 3, "ngModelChange", "ngModel", "name"], ["kendoButton", "", "fillMode", "outline", "themeColor", "success", "size", "small", 3, "click"], [1, "fa-solid", "fa-cogs", 2, "color", "#6c757d"], [2, "padding", "8px", "color", "#6c757d", "font-style", "italic"], ["name", "resultSelectorPromptID", "textField", "text", "valueField", "value", "placeholder", "Select a result selector prompt...", 2, "width", "100%", 3, "ngModel", "data", "valuePrimitive", "filterable"], ["name", "resultSelectorPromptID", "textField", "text", "valueField", "value", "placeholder", "Select a result selector prompt...", 2, "width", "100%", 3, "ngModelChange", "valueChange", "ngModel", "data", "valuePrimitive", "filterable"], [1, "fa-solid", "fa-sliders", 2, "color", "#6c757d"], [1, "badge", 2, "background", "#6f42c1", "color", "white", "padding", "2px 6px", "border-radius", "10px", "font-size", "0.7em"], ["title", "These parameters are defined in the template and will be available when executing this prompt", 1, "fa-solid", "fa-info-circle"], [2, "display", "grid", "gap", "12px"], [1, "parameter-card", 2, "border", "1px solid #e9ecef", "border-radius", "8px", "padding", "16px", "background", "#f8f9fa", "transition", "all 0.2s", 3, "border-left"], [2, "margin-top", "16px", "padding", "12px", "background", "#e3f2fd", "border-radius", "6px", "border", "1px solid #bbdefb"], [2, "display", "flex", "align-items", "flex-start", "gap", "8px"], [1, "fa-solid", "fa-lightbulb", 2, "color", "#1976d2", "margin-top", "2px"], [2, "flex", "1", "font-size", "0.85em", "color", "#1565c0", "line-height", "1.5"], [1, "parameter-card", 2, "border", "1px solid #e9ecef", "border-radius", "8px", "padding", "16px", "background", "#f8f9fa", "transition", "all 0.2s"], [2, "display", "flex", "justify-content", "space-between", "align-items", "flex-start", "margin-bottom", "8px"], [2, "display", "flex", "align-items", "center", "gap", "8px"], [2, "font-size", "1.2em"], [2, "margin", "0", "color", "#495057", "font-weight", "600"], [2, "color", "#dc3545", "font-size", "0.9em", "margin-left", "4px"], [1, "type-badge", 2, "color", "white", "padding", "4px 8px", "border-radius", "12px", "font-size", "0.75em", "font-weight", "500"], [2, "color", "#dc3545", "font-size", "0.85em", "font-weight", "500"], [2, "color", "#6c757d", "font-size", "0.85em"], [2, "margin", "0 0 8px 0", "color", "#6c757d", "font-size", "0.9em", "line-height", "1.4"], [2, "font-size", "0.85em", "color", "#495057"], [2, "display", "flex", "align-items", "center", "gap", "4px", "margin-bottom", "4px"], [1, "fa-solid", "fa-info-circle", 2, "color", "#6c757d"], [2, "display", "grid", "grid-template-columns", "repeat(auto-fit, minmax(200px, 1fr))", "gap", "12px", "margin-top", "12px"], [2, "background", "white", "padding", "8px 12px", "border-radius", "4px", "border", "1px solid #dee2e6"], [2, "display", "block", "font-size", "0.8em", "color", "#6c757d", "margin-bottom", "2px"], [2, "font-size", "0.85em", "color", "#495057", "word-break", "break-all"], [2, "font-size", "0.8em", "color", "#495057", "word-break", "break-all"], [2, "padding", "16px"], [2, "background", "#f8f9fa", "border", "1px solid #dee2e6", "border-radius", "4px", "padding", "12px", "font-family", "'Courier New', monospace", "font-size", "0.9em", "white-space", "pre-wrap", "overflow", "auto", "max-height", "250px"], [2, "background", "#fff3cd", "border", "1px solid #ffeaa7", "border-radius", "4px", "padding", "12px", "color", "#856404", "text-align", "center"], [2, "color", "#dc3545", "font-size", "0.8em", "font-weight", "normal"], ["name", "outputExample", "language", "json", "placeholder", "Enter JSON example structure...", 2, "width", "100%", "height", "200px", "border", "1px solid #dee2e6", "border-radius", "4px", 3, "ngModelChange", "ngModel"], [2, "margin-top", "8px", "color", "#6c757d", "font-size", "0.85em"], [1, "fa-solid", "fa-exclamation-triangle"], [2, "text-align", "center", "padding", "40px", "color", "#6c757d"], [1, "fa-solid", "fa-history", 2, "color", "#6c757d"], [2, "color", "#6c757d", "font-weight", "normal"], [1, "fa-solid", "fa-spinner", "fa-spin", 2, "font-size", "2em", "margin-bottom", "12px"], [1, "fa-solid", "fa-history", 2, "font-size", "3em", "margin-bottom", "12px", "opacity", "0.3"], [2, "display", "flex", "justify-content", "space-between", "align-items", "center", "margin-bottom", "16px"], [2, "display", "flex", "gap", "8px", "align-items", "center"], ["selection", "single"], ["kendoButton", "", "size", "small", 3, "click", "selected"], [2, "margin-left", "4px", "font-size", "0.8em", 3, "class"], [2, "border", "1px solid #e9ecef", "border-radius", "8px", "overflow", "hidden"], [2, "width", "100%", "border-collapse", "collapse"], [2, "background", "#f8f9fa", "border-bottom", "2px solid #e9ecef"], [2, "padding", "12px", "text-align", "left", "font-weight", "600", "color", "#495057"], [2, "padding", "12px", "text-align", "right", "font-weight", "600", "color", "#495057"], [2, "padding", "12px", "text-align", "center", "font-weight", "600", "color", "#495057"], [1, "history-row", 2, "border-bottom", "1px solid #f1f3f5", 3, "even-row"], [2, "margin-left", "4px", "font-size", "0.8em"], [1, "history-row", 2, "border-bottom", "1px solid #f1f3f5"], [2, "padding", "12px"], [2, "display", "flex", "align-items", "center", "gap", "6px"], [2, "padding", "12px", "color", "#495057"], [2, "padding", "12px", "text-align", "right", "color", "#495057"], [2, "padding", "12px", "text-align", "center"], [2, "padding", "4px 8px", "border-radius", "12px", "background", "#e9ecef", "color", "#495057", "font-size", "0.85em", "font-weight", "500"], ["kendoButton", "", "fillMode", "flat", "size", "small", "title", "View details", 3, "click"], [1, "fa-solid", "fa-external-link"], [2, "height", "300px", 3, "Params", "NewRecordValues", "AllowLoad", "EditMode"], [1, "fa-solid", "fa-database", 2, "color", "#6c757d"], [2, "margin", "0 0 12px 0", "color", "#495057"], [2, "height", "200px", 3, "Params", "NewRecordValues", "AllowLoad", "EditMode"], [1, "fa-solid", "fa-link", 2, "color", "#6c757d"], [3, "close", "width", "height", "minWidth", "minHeight", "draggable", "resizable", "state", "title"], [3, "visibilityChange", "entity", "mode", "isVisible"]], template: function AIPromptFormComponentExtended_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 2);
             i0.ɵɵelement(1, "div", 3);
             i0.ɵɵtemplate(2, AIPromptFormComponentExtended_form_2_Template, 64, 36, "form", 4)(3, AIPromptFormComponentExtended_Conditional_3_Template, 2, 12, "kendo-window", 5);
@@ -2566,7 +3038,7 @@ let AIPromptFormComponentExtended = class AIPromptFormComponentExtended extends
             i0.ɵɵproperty("ngIf", ctx.record);
             i0.ɵɵadvance();
             i0.ɵɵconditional(ctx.showTestHarness ? 3 : -1);
-        } }, dependencies: [i4.NgIf, i5.ɵNgNoValidate, i5.NgControlStatus, i5.NgControlStatusGroup, i5.NgModel, i5.NgForm, i6.ExpansionPanelComponent, i6.ExpansionPanelTitleDirective, i7.DialogContainerDirective, i7.WindowComponent, i8.TextAreaComponent, i8.TextBoxComponent, i8.NumericTextBoxComponent, i9.ItemTemplateDirective, i9.DropDownListComponent, i9.DropDownTreeComponent, i10.ButtonGroupComponent, i10.ButtonComponent, i11.UserViewGridComponent, i12.MJFormField, i13.FormToolbarComponent, i14.CodeEditorComponent, i3.AITestHarnessComponent, i15.TemplateEditorComponent, i4.DatePipe], styles: [".record-form-container[_ngcontent-%COMP%] {\n    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n    padding: 10px;\n}\n\n.custom-toolbar-actions[_ngcontent-%COMP%] {\n    margin-left: auto;\n}\n\n.status-badge[_ngcontent-%COMP%] {\n    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n    font-weight: 500;\n    letter-spacing: 0.02em;\n}\n\n.config-summary[_ngcontent-%COMP%] {\n    position: sticky;\n    top: 0;\n    max-height: 600px;\n    overflow-y: auto;\n}\n\n.config-item[_ngcontent-%COMP%] {\n    padding: 8px 0;\n    border-bottom: 1px solid #e9ecef;\n}\n\n.config-item[_ngcontent-%COMP%]:last-child {\n    border-bottom: none;\n}\n\n.template-tab-content[_ngcontent-%COMP%] {\n    background: #fff;\n}\n\n.template-header[_ngcontent-%COMP%]   h5[_ngcontent-%COMP%] {\n    font-size: 1.1em;\n}\n\n.loading-state[_ngcontent-%COMP%], \n.no-template-state[_ngcontent-%COMP%], \n.invalid-template-state[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n}\n\n.no-template-state[_ngcontent-%COMP%]   i[_ngcontent-%COMP%], \n.invalid-template-state[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    opacity: 0.6;\n}\n\n.template-editor-container[_ngcontent-%COMP%] {\n    background: #fff;\n    border-radius: 6px;\n}\n\n\n\n@media (max-width: 1200px) {\n    .record-form-container[_ngcontent-%COMP%]   .mj-tab-body[_ngcontent-%COMP%]    > div[_ngcontent-%COMP%] {\n        grid-template-columns: 1fr !important;\n        gap: 20px;\n    }\n    \n    .config-summary[_ngcontent-%COMP%] {\n        order: -1;\n        position: static;\n        max-height: none;\n    }\n}\n\n\n\n@media (max-width: 768px) {\n    .custom-toolbar-actions[_ngcontent-%COMP%] {\n        flex-direction: column;\n        gap: 4px !important;\n    }\n    \n    .status-badge[_ngcontent-%COMP%] {\n        align-self: flex-start;\n    }\n}\n\n\n\n.record-form-container[_ngcontent-%COMP%]   mj-form-section[_ngcontent-%COMP%] {\n    padding: 16px;\n}\n\n\n\n.status-badge[_ngcontent-%COMP%], \n.config-item[_ngcontent-%COMP%], \n.template-header[_ngcontent-%COMP%] {\n    transition: all 0.2s ease;\n}\n\n.config-item[_ngcontent-%COMP%]:hover {\n    background-color: rgba(0,0,0,0.02);\n    border-radius: 4px;\n    margin: 0 -8px;\n    padding: 8px;\n}\n\n\n\n.history-row[_ngcontent-%COMP%] {\n    transition: background 0.2s;\n}\n\n.history-row[_ngcontent-%COMP%]:not(.even-row) {\n    background: #f8f9fa;\n}\n\n.history-row.even-row[_ngcontent-%COMP%] {\n    background: white;\n}\n\n.history-row[_ngcontent-%COMP%]:hover {\n    background: #e9ecef !important;\n}\n\n\n\n.parameter-card[_ngcontent-%COMP%] {\n    position: relative;\n    overflow: hidden;\n}\n\n.parameter-card[_ngcontent-%COMP%]::before {\n    content: '';\n    position: absolute;\n    top: 0;\n    left: 0;\n    bottom: 0;\n    width: 4px;\n    background: inherit;\n    transition: width 0.2s;\n}\n\n.parameter-card[_ngcontent-%COMP%]:hover {\n    transform: translateY(-2px);\n    box-shadow: 0 4px 12px rgba(0,0,0,0.1);\n}\n\n.parameter-card[_ngcontent-%COMP%]:hover::before {\n    width: 6px;\n}\n\n.type-badge[_ngcontent-%COMP%] {\n    font-weight: 600;\n    text-transform: uppercase;\n    letter-spacing: 0.03em;\n    transition: transform 0.2s;\n}\n\n.parameter-card[_ngcontent-%COMP%]:hover   .type-badge[_ngcontent-%COMP%] {\n    transform: scale(1.05);\n}\n\n\n\n.parameter-card[_ngcontent-%COMP%]   i.fa-solid[_ngcontent-%COMP%] {\n    transition: transform 0.3s;\n}\n\n.parameter-card[_ngcontent-%COMP%]:hover   i.fa-solid[_ngcontent-%COMP%] {\n    transform: rotate(360deg);\n}\n\n\n\n@media (max-width: 768px) {\n    .parameter-card[_ngcontent-%COMP%] {\n        margin-bottom: 8px;\n    }\n    \n    .parameter-card[_ngcontent-%COMP%]   h6[_ngcontent-%COMP%] {\n        font-size: 0.95em;\n    }\n    \n    .type-badge[_ngcontent-%COMP%] {\n        font-size: 0.7em !important;\n    }\n}"] }); }
+        } }, dependencies: [i5.NgIf, i6.ɵNgNoValidate, i6.NgControlStatus, i6.NgControlStatusGroup, i6.NgModel, i6.NgForm, i7.ExpansionPanelComponent, i7.ExpansionPanelTitleDirective, i8.DialogContainerDirective, i8.WindowComponent, i9.TextAreaComponent, i9.TextBoxComponent, i9.NumericTextBoxComponent, i10.ItemTemplateDirective, i10.NoDataTemplateDirective, i10.DropDownListComponent, i10.DropDownTreeComponent, i11.ButtonGroupComponent, i11.ButtonComponent, i12.UserViewGridComponent, i13.MJFormField, i14.FormToolbarComponent, i15.CodeEditorComponent, i3.AITestHarnessComponent, i16.TemplateEditorComponent, i5.DatePipe], styles: [".record-form-container[_ngcontent-%COMP%] {\n    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n    padding: 10px;\n}\n\n.custom-toolbar-actions[_ngcontent-%COMP%] {\n    margin-left: auto;\n}\n\n.status-badge[_ngcontent-%COMP%] {\n    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n    font-weight: 500;\n    letter-spacing: 0.02em;\n}\n\n.config-summary[_ngcontent-%COMP%] {\n    position: sticky;\n    top: 0;\n    max-height: 600px;\n    overflow-y: auto;\n}\n\n.config-item[_ngcontent-%COMP%] {\n    padding: 8px 0;\n    border-bottom: 1px solid #e9ecef;\n}\n\n.config-item[_ngcontent-%COMP%]:last-child {\n    border-bottom: none;\n}\n\n.template-tab-content[_ngcontent-%COMP%] {\n    background: #fff;\n}\n\n.template-header[_ngcontent-%COMP%]   h5[_ngcontent-%COMP%] {\n    font-size: 1.1em;\n}\n\n.loading-state[_ngcontent-%COMP%], \n.no-template-state[_ngcontent-%COMP%], \n.invalid-template-state[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n}\n\n.no-template-state[_ngcontent-%COMP%]   i[_ngcontent-%COMP%], \n.invalid-template-state[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    opacity: 0.6;\n}\n\n.template-editor-container[_ngcontent-%COMP%] {\n    background: #fff;\n    border-radius: 6px;\n}\n\n\n\n@media (max-width: 1200px) {\n    .record-form-container[_ngcontent-%COMP%]   .mj-tab-body[_ngcontent-%COMP%]    > div[_ngcontent-%COMP%] {\n        grid-template-columns: 1fr !important;\n        gap: 20px;\n    }\n    \n    .config-summary[_ngcontent-%COMP%] {\n        order: -1;\n        position: static;\n        max-height: none;\n    }\n}\n\n\n\n@media (max-width: 768px) {\n    .custom-toolbar-actions[_ngcontent-%COMP%] {\n        flex-direction: column;\n        gap: 4px !important;\n    }\n    \n    .status-badge[_ngcontent-%COMP%] {\n        align-self: flex-start;\n    }\n}\n\n\n\n.record-form-container[_ngcontent-%COMP%]   mj-form-section[_ngcontent-%COMP%] {\n    padding: 16px;\n}\n\n\n\n.status-badge[_ngcontent-%COMP%], \n.config-item[_ngcontent-%COMP%], \n.template-header[_ngcontent-%COMP%] {\n    transition: all 0.2s ease;\n}\n\n.config-item[_ngcontent-%COMP%]:hover {\n    background-color: rgba(0,0,0,0.02);\n    border-radius: 4px;\n    margin: 0 -8px;\n    padding: 8px;\n}\n\n\n\n.history-row[_ngcontent-%COMP%] {\n    transition: background 0.2s;\n}\n\n.history-row[_ngcontent-%COMP%]:not(.even-row) {\n    background: #f8f9fa;\n}\n\n.history-row.even-row[_ngcontent-%COMP%] {\n    background: white;\n}\n\n.history-row[_ngcontent-%COMP%]:hover {\n    background: #e9ecef !important;\n}\n\n\n\n.parameter-card[_ngcontent-%COMP%] {\n    position: relative;\n    overflow: hidden;\n}\n\n.parameter-card[_ngcontent-%COMP%]::before {\n    content: '';\n    position: absolute;\n    top: 0;\n    left: 0;\n    bottom: 0;\n    width: 4px;\n    background: inherit;\n    transition: width 0.2s;\n}\n\n.parameter-card[_ngcontent-%COMP%]:hover {\n    transform: translateY(-2px);\n    box-shadow: 0 4px 12px rgba(0,0,0,0.1);\n}\n\n.parameter-card[_ngcontent-%COMP%]:hover::before {\n    width: 6px;\n}\n\n.type-badge[_ngcontent-%COMP%] {\n    font-weight: 600;\n    text-transform: uppercase;\n    letter-spacing: 0.03em;\n    transition: transform 0.2s;\n}\n\n.parameter-card[_ngcontent-%COMP%]:hover   .type-badge[_ngcontent-%COMP%] {\n    transform: scale(1.05);\n}\n\n\n\n.parameter-card[_ngcontent-%COMP%]   i.fa-solid[_ngcontent-%COMP%] {\n    transition: transform 0.3s;\n}\n\n.parameter-card[_ngcontent-%COMP%]:hover   i.fa-solid[_ngcontent-%COMP%] {\n    transform: rotate(360deg);\n}\n\n\n\n@media (max-width: 768px) {\n    .parameter-card[_ngcontent-%COMP%] {\n        margin-bottom: 8px;\n    }\n    \n    .parameter-card[_ngcontent-%COMP%]   h6[_ngcontent-%COMP%] {\n        font-size: 0.95em;\n    }\n    \n    .type-badge[_ngcontent-%COMP%] {\n        font-size: 0.7em !important;\n    }\n}"] }); }
 };
 AIPromptFormComponentExtended = __decorate([
     RegisterClass(BaseFormComponent, 'AI Prompts')
@@ -2574,12 +3046,12 @@ AIPromptFormComponentExtended = __decorate([
 export { AIPromptFormComponentExtended };
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(AIPromptFormComponentExtended, [{
         type: Component,
-        args: [{ selector: 'mj-ai-prompt-form', template: "<div class=\"record-form-container\">\n    <!-- Dialog container for Kendo dialogs -->\n    <div kendoDialogContainer></div>\n    <form *ngIf=\"record\" class=\"record-form\" #form=\"ngForm\" >\n        <mj-form-toolbar [form]=\"this\"></mj-form-toolbar>\n\n        <!-- Main Content Area - Template Editor and Configuration -->\n        <div class=\"prompt-main-area\" style=\"display: flex; flex-direction: column; height: 100%; overflow-y: auto;\">\n            \n            <!-- Header Section -->\n            <div class=\"prompt-header\" style=\"flex-shrink: 0; padding: 20px; background: #f8f9fa; border-bottom: 2px solid #e9ecef;\">\n                <div style=\"display: flex; justify-content: space-between; align-items: flex-start; gap: 20px;\">\n                    \n                    <!-- Left: Prompt Info -->\n                    <div style=\"flex: 1; min-width: 0;\">\n                        <div style=\"display: flex; align-items: center; gap: 12px; margin-bottom: 8px;\">\n                            <i class=\"fa-solid fa-robot\" style=\"color: #6f42c1; font-size: 1.4em;\"></i>\n                            @if (EditMode) {\n                                <kendo-textbox [(ngModel)]=\"record.Name\" \n                                              name=\"promptName\"\n                                              placeholder=\"Enter prompt name...\"\n                                              style=\"font-size: 1.2em; font-weight: 600; min-width: 300px; flex: 1;\">\n                                </kendo-textbox>\n                            } @else {\n                                <h4 style=\"margin: 0; color: #495057; font-weight: 600; flex: 1;\">{{ record.Name || 'Untitled AI Prompt' }}</h4>\n                                <span class=\"status-badge\" [style.background-color]=\"getStatusBadgeColor()\" \n                                      style=\"color: white; padding: 4px 10px; border-radius: 12px; font-size: 0.75em; font-weight: 500;\">\n                                    {{ record.Status }}\n                                </span>\n                            }\n                        </div>\n                        \n                        <!-- Status and Type Editors when in edit mode -->\n                        @if (EditMode) {\n                            <div style=\"display: flex; gap: 16px; margin-bottom: 12px; flex-wrap: wrap;\">\n                                <div>\n                                    <label style=\"display: block; margin-bottom: 4px; font-weight: 600; color: #495057; font-size: 0.9em;\">Status</label>\n                                    <kendo-dropdownlist [(ngModel)]=\"record.Status\"\n                                                       name=\"promptStatus\"\n                                                       [data]=\"[{text: 'Active', value: 'Active'}, {text: 'Pending', value: 'Pending'}, {text: 'Disabled', value: 'Disabled'}]\"\n                                                       textField=\"text\"\n                                                       valueField=\"value\"\n                                                       [valuePrimitive]=\"true\"\n                                                       style=\"width: 150px;\">\n                                    </kendo-dropdownlist>\n                                </div>\n                                <div>\n                                    <label style=\"display: block; margin-bottom: 4px; font-weight: 600; color: #495057; font-size: 0.9em;\">\n                                        Type <span style=\"color: #dc3545;\">*</span>\n                                    </label>\n                                    @if (isLoadingPromptTypes) {\n                                        <div style=\"padding: 8px; color: #6c757d; font-style: italic; width: 200px;\">\n                                            <i class=\"fa-solid fa-spinner fa-spin\"></i> Loading types...\n                                        </div>\n                                    } @else {\n                                        <kendo-dropdownlist [(ngModel)]=\"record.TypeID\"\n                                                           name=\"promptTypeID\"\n                                                           [data]=\"availablePromptTypes\"\n                                                           textField=\"Name\"\n                                                           valueField=\"ID\"\n                                                           [valuePrimitive]=\"true\"\n                                                           [filterable]=\"true\"\n                                                           placeholder=\"Select prompt type...\"\n                                                           style=\"width: 200px;\">\n                                        </kendo-dropdownlist>\n                                    }\n                                </div>\n                            </div>\n                        }\n                        \n                        @if (EditMode) {\n                            <kendo-textarea [(ngModel)]=\"record.Description\" \n                                           name=\"promptDescription\"\n                                           [rows]=\"2\"\n                                           placeholder=\"Enter prompt description...\"\n                                           style=\"width: 100%; max-width: 600px; margin-bottom: 12px;\">\n                            </kendo-textarea>\n                        } @else if (record.Description) {\n                            <p style=\"margin: 0 0 12px 0; color: #6c757d; font-size: 0.9em; line-height: 1.4;\">{{ record.Description }}</p>\n                        }\n                        \n                        <!-- Quick Config Row -->\n                        <div class=\"quick-config\" style=\"display: flex; align-items: center; gap: 16px; flex-wrap: wrap;\">\n                            @if (record.TypeID) {\n                                <div class=\"config-item\" style=\"display: flex; align-items: center; gap: 6px; font-size: 0.85em;\">\n                                    <i class=\"fa-solid fa-tag\" style=\"color: #6c757d;\"></i>\n                                    <span style=\"color: #6c757d;\">Type:</span>\n                                    <span style=\"color: #495057; font-weight: 500;\">{{ getPromptTypeDisplayName(record.TypeID) }}</span>\n                                </div>\n                            }\n                            \n                            <div class=\"config-item\" style=\"display: flex; align-items: center; gap: 6px; font-size: 0.85em;\">\n                                <i class=\"fa-solid fa-layer-group\" style=\"color: #6c757d;\"></i>\n                                <span style=\"color: #6c757d;\">Parallelization:</span>\n                                <span style=\"color: #495057; font-weight: 500;\">{{ getParallelizationModeDisplay() }}</span>\n                            </div>\n                            \n                            <div class=\"config-item\" style=\"display: flex; align-items: center; gap: 6px; font-size: 0.85em;\">\n                                <i class=\"fa-solid fa-code\" style=\"color: #6c757d;\"></i>\n                                <span style=\"color: #6c757d;\">Output:</span>\n                                <span [style.color]=\"getValidationColor()\" style=\"font-weight: 500;\">{{ getOutputTypeDisplay() }}</span>\n                            </div>\n                            \n                            @if (record.EnableCaching) {\n                                <div class=\"config-item\" style=\"display: flex; align-items: center; gap: 6px; font-size: 0.85em;\">\n                                    <i class=\"fa-solid fa-database\" style=\"color: #28a745;\"></i>\n                                    <span style=\"color: #28a745; font-weight: 500;\">Caching Enabled</span>\n                                </div>\n                            }\n                        </div>\n                    </div>\n                    \n                    <!-- Right: Action Buttons -->\n                    <div class=\"action-buttons\" style=\"display: flex; flex-direction: column; gap: 8px; align-items: flex-end;\">\n                        <div style=\"display: flex; gap: 8px;\">\n                            @if (record.ID) {\n                                <button kendoButton [themeColor]=\"'primary'\" [size]=\"'large'\"\n                                        (click)=\"openTestHarness()\"\n                                        title=\"Run AI Prompt Test Harness\">\n                                    <i class=\"fa-solid fa-play\"></i> Run\n                                </button>\n                            }\n                        </div>\n                        \n                        @if (!canExecute && record.ID) {\n                            <div style=\"font-size: 0.75em; color: #dc3545; text-align: right; max-width: 200px;\">\n                                @if (record.Status !== 'Active') {\n                                    \u2022 Prompt must be Active<br>\n                                }\n                                @if (!record.TemplateID) {\n                                    \u2022 Template is required<br>\n                                }\n                                @if (!template && record.TemplateID) {\n                                    \u2022 Template not found<br>\n                                }\n                            </div>\n                        }\n                    </div>\n                </div>\n            </div>\n\n            <!-- Configuration Sections with Expansion Panels -->\n            <div class=\"configuration-sections\" style=\"flex: 1; background: white; border-top: 2px solid #e9ecef; padding: 16px; min-height: 0;\">\n                <!-- Template Editor Section -->\n                <kendo-expansionpanel \n                    [expanded]=\"true\"\n                    style=\"margin-bottom: 12px;\">\n                    <ng-template kendoExpansionPanelTitleDirective>\n                        <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n                            <i class=\"fa-solid fa-code\" style=\"color: #6c757d;\"></i>\n                            Template Editor\n                            @if (template) {\n                                <span style=\"color: #6c757d; font-size: 0.9em; font-weight: normal;\">\u2022 {{ template.Name }}</span>\n                            }\n                        </span>\n                    </ng-template>\n                    \n                    <!-- Direct Content Projection -->\n                    <div class=\"template-section\" style=\"display: flex; flex-direction: column; min-height: 400px; padding: 8px;\">\n                        @if (isLoadingTemplate) {\n                            <div class=\"loading-state\" style=\"flex: 1; display: flex; align-items: center; justify-content: center; color: #6c757d;\">\n                                <i class=\"fa-solid fa-spinner fa-spin\" style=\"font-size: 24px; margin-right: 12px;\"></i>\n                                Loading template...\n                            </div>\n                        } @else if (!record.TemplateID) {\n                            <div class=\"no-template-state\" style=\"flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 40px; color: #6c757d;\">\n                                <i class=\"fa-solid fa-code\" style=\"font-size: 64px; margin-bottom: 20px; opacity: 0.3;\"></i>\n                                <h5 style=\"margin-bottom: 12px; color: #495057;\">No Template Associated</h5>\n                                <p style=\"margin-bottom: 24px; text-align: center; max-width: 400px;\">\n                                    This AI prompt needs a template to define its structure and parameters. \n                                    Create a new template or link to an existing one.\n                                </p>\n                                <div style=\"display: flex; gap: 12px;\">\n                                    <button kendoButton [themeColor]=\"'primary'\" (click)=\"createNewTemplate()\">\n                                        <i class=\"fa-solid fa-plus\"></i> Create New Template\n                                    </button>\n                                    <button kendoButton [fillMode]=\"'outline'\" (click)=\"linkExistingTemplate()\">\n                                        <i class=\"fa-solid fa-link\"></i> Link Existing Template\n                                    </button>\n                                </div>\n                            </div>\n                        } @else if (templateNotFoundInDatabase) {\n                            <div class=\"invalid-template-state\" style=\"flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 40px; color: #dc3545;\">\n                                <i class=\"fa-solid fa-exclamation-triangle\" style=\"font-size: 64px; margin-bottom: 20px; opacity: 0.7;\"></i>\n                                <h5 style=\"margin-bottom: 12px;\">Template Not Found</h5>\n                                <p style=\"margin-bottom: 24px; text-align: center; max-width: 400px;\">\n                                    The referenced template could not be loaded. It may have been deleted or moved.\n                                </p>\n                                <div style=\"display: flex; gap: 12px;\">\n                                    <button kendoButton [fillMode]=\"'outline'\" (click)=\"loadTemplate()\">\n                                        <i class=\"fa-solid fa-refresh\"></i> Retry Loading\n                                    </button>\n                                    <button kendoButton [themeColor]=\"'primary'\" (click)=\"createNewTemplate()\">\n                                        <i class=\"fa-solid fa-plus\"></i> Create New Template\n                                    </button>\n                                </div>\n                            </div>\n                        } @else {\n                            <!-- Active Template Editor -->\n                            <div class=\"template-editor-container\" style=\"flex: 1; display: flex; flex-direction: column; min-height: 350px;\">\n                                <!-- Template Editor -->\n                                <div style=\"flex: 1; background: white; border-radius: 6px; border: 1px solid #e9ecef;\">\n                                    <mj-template-editor \n                                        #templateEditor\n                                        [template]=\"template\"\n                                        [config]=\"templateEditorConfig\"\n                                        (contentChange)=\"onTemplateContentChange($event)\"\n                                        (runTemplate)=\"onTemplateRun($event)\"\n                                        style=\"display: block; min-height: 300px;\">\n                                    </mj-template-editor>\n                                </div>\n                            </div>\n                        }\n                    </div>\n                </kendo-expansionpanel>                \n\n                <!-- Template Parameters Expansion Panel -->\n                @if (template && templateParams.length > 0) {\n                    <kendo-expansionpanel \n                        [expanded]=\"true\"\n                        style=\"margin-bottom: 12px;\">\n                        <ng-template kendoExpansionPanelTitleDirective>\n                            <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n                                <i class=\"fa-solid fa-sliders\" style=\"color: #6c757d;\"></i>\n                                Template Parameters\n                                <span class=\"badge\" style=\"background: #6f42c1; color: white; padding: 2px 6px; border-radius: 10px; font-size: 0.7em;\">\n                                    {{ templateParams.length }}\n                                </span>\n                                <span style=\"color: #6c757d; font-size: 0.8em; font-weight: normal; margin-left: 8px;\">\n                                    <i class=\"fa-solid fa-info-circle\" title=\"These parameters are defined in the template and will be available when executing this prompt\"></i>\n                                    Parameters defined in the template\n                                </span>\n                            </span>\n                        </ng-template>\n                        \n                        <!-- Template Parameters Display -->\n                        <div style=\"padding: 16px 0;\">\n                            @if (isLoadingTemplateParams) {\n                                <div class=\"loading-state\" style=\"padding: 20px; text-align: center; color: #6c757d;\">\n                                    <i class=\"fa-solid fa-spinner fa-spin\"></i> Loading template parameters...\n                                </div>\n                            } @else if (templateParams.length === 0) {\n                                <div class=\"empty-state\" style=\"padding: 20px; text-align: center; color: #6c757d;\">\n                                    <i class=\"fa-solid fa-info-circle\"></i> This template has no parameters defined\n                                </div>\n                            } @else {\n                                <!-- Parameters Grid -->\n                                <div style=\"display: grid; gap: 12px;\">\n                                    @for (param of templateParams; track param.ID) {\n                                        <div class=\"parameter-card\" \n                                             style=\"border: 1px solid #e9ecef; border-radius: 8px; padding: 16px; background: #f8f9fa; transition: all 0.2s;\"\n                                             [style.border-left]=\"'4px solid ' + getParamTypeColor(param.Type)\">\n                                            \n                                            <!-- Parameter Header -->\n                                            <div style=\"display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 8px;\">\n                                                <div style=\"display: flex; align-items: center; gap: 8px;\">\n                                                    <i [class]=\"'fa-solid ' + getParamTypeIcon(param.Type)\" \n                                                       [style.color]=\"getParamTypeColor(param.Type)\"\n                                                       style=\"font-size: 1.2em;\"></i>\n                                                    <h6 style=\"margin: 0; color: #495057; font-weight: 600;\">\n                                                        {{ param.Name }}\n                                                        @if (param.IsRequired) {\n                                                            <span style=\"color: #dc3545; font-size: 0.9em; margin-left: 4px;\">*</span>\n                                                        }\n                                                    </h6>\n                                                </div>\n                                                <div style=\"display: flex; align-items: center; gap: 8px;\">\n                                                    <span class=\"type-badge\" \n                                                          [style.background-color]=\"getParamTypeColor(param.Type)\"\n                                                          style=\"color: white; padding: 4px 8px; border-radius: 12px; font-size: 0.75em; font-weight: 500;\">\n                                                        {{ param.Type }}\n                                                    </span>\n                                                    @if (param.IsRequired) {\n                                                        <span style=\"color: #dc3545; font-size: 0.85em; font-weight: 500;\">Required</span>\n                                                    } @else {\n                                                        <span style=\"color: #6c757d; font-size: 0.85em;\">Optional</span>\n                                                    }\n                                                </div>\n                                            </div>\n                                            \n                                            <!-- Parameter Description -->\n                                            @if (param.Description) {\n                                                <p style=\"margin: 0 0 8px 0; color: #6c757d; font-size: 0.9em; line-height: 1.4;\">\n                                                    {{ param.Description }}\n                                                </p>\n                                            }\n                                            \n                                            <!-- Type-specific Information -->\n                                            <div style=\"font-size: 0.85em; color: #495057;\">\n                                                <span style=\"display: flex; align-items: center; gap: 4px; margin-bottom: 4px;\">\n                                                    <i class=\"fa-solid fa-info-circle\" style=\"color: #6c757d;\"></i>\n                                                    {{ getParamTypeDescription(param) }}\n                                                </span>\n                                            </div>\n                                            \n                                            <!-- Additional Parameter Details -->\n                                            <div style=\"display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; margin-top: 12px;\">\n                                                @if (param.DefaultValue) {\n                                                    <div style=\"background: white; padding: 8px 12px; border-radius: 4px; border: 1px solid #dee2e6;\">\n                                                        <label style=\"display: block; font-size: 0.8em; color: #6c757d; margin-bottom: 2px;\">Default Value</label>\n                                                        <code style=\"font-size: 0.85em; color: #495057; word-break: break-all;\">{{ param.DefaultValue }}</code>\n                                                    </div>\n                                                }\n                                                \n                                                @if (param.EntityID) {\n                                                    <div style=\"background: white; padding: 8px 12px; border-radius: 4px; border: 1px solid #dee2e6;\">\n                                                        <label style=\"display: block; font-size: 0.8em; color: #6c757d; margin-bottom: 2px;\">Entity</label>\n                                                        <span style=\"font-size: 0.85em; color: #495057;\">{{ param.Entity || 'Entity ID: ' + param.EntityID }}</span>\n                                                    </div>\n                                                }\n                                                \n                                                @if (param.LinkedParameterName) {\n                                                    <div style=\"background: white; padding: 8px 12px; border-radius: 4px; border: 1px solid #dee2e6;\">\n                                                        <label style=\"display: block; font-size: 0.8em; color: #6c757d; margin-bottom: 2px;\">Linked To</label>\n                                                        <span style=\"font-size: 0.85em; color: #495057;\">\n                                                            {{ param.LinkedParameterName }}\n                                                            @if (param.LinkedParameterField) {\n                                                                ({{ param.LinkedParameterField }})\n                                                            }\n                                                        </span>\n                                                    </div>\n                                                }\n                                                \n                                                @if (param.ExtraFilter) {\n                                                    <div style=\"background: white; padding: 8px 12px; border-radius: 4px; border: 1px solid #dee2e6;\">\n                                                        <label style=\"display: block; font-size: 0.8em; color: #6c757d; margin-bottom: 2px;\">Filter</label>\n                                                        <code style=\"font-size: 0.8em; color: #495057; word-break: break-all;\">{{ param.ExtraFilter }}</code>\n                                                    </div>\n                                                }\n                                                \n                                                @if (param.RecordID) {\n                                                    <div style=\"background: white; padding: 8px 12px; border-radius: 4px; border: 1px solid #dee2e6;\">\n                                                        <label style=\"display: block; font-size: 0.8em; color: #6c757d; margin-bottom: 2px;\">Record ID</label>\n                                                        <code style=\"font-size: 0.85em; color: #495057;\">{{ param.RecordID }}</code>\n                                                    </div>\n                                                }\n                                            </div>\n                                        </div>\n                                    }\n                                </div>\n                                \n                                <!-- Help Text -->\n                                <div style=\"margin-top: 16px; padding: 12px; background: #e3f2fd; border-radius: 6px; border: 1px solid #bbdefb;\">\n                                    <div style=\"display: flex; align-items: flex-start; gap: 8px;\">\n                                        <i class=\"fa-solid fa-lightbulb\" style=\"color: #1976d2; margin-top: 2px;\"></i>\n                                        <div style=\"flex: 1; font-size: 0.85em; color: #1565c0; line-height: 1.5;\">\n                                            <strong>Using Template Parameters:</strong> When executing this prompt, you'll be prompted to provide values for all required parameters. \n                                            Parameters can be simple values (text, numbers) or complex data structures (JSON objects, database records, or entire entity collections).\n                                            The template will use these parameters to generate dynamic content based on the values provided at execution time.\n                                        </div>\n                                    </div>\n                                </div>\n                            }\n                        </div>\n                    </kendo-expansionpanel>\n                }\n\n                <!-- Model Configuration Expansion Panel -->\n                @if (record.IsSaved) {\n                    <kendo-expansionpanel \n                        [expanded]=\"false\"\n                        style=\"margin-bottom: 12px;\">\n                        <ng-template kendoExpansionPanelTitleDirective>\n                            <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n                                <i class=\"fa-solid fa-microchip\" style=\"color: #6c757d;\"></i>\n                                Models\n                                @if (promptModels.length > 0) {\n                                    <span class=\"badge\" style=\"background: #17a2b8; color: white; padding: 2px 6px; border-radius: 10px; font-size: 0.7em;\">\n                                        {{ promptModels.length }}\n                                    </span>\n                                }\n                                <span style=\"color: #6c757d; font-size: 0.8em; font-weight: normal; margin-left: 8px;\">\n                                    <i class=\"fa-solid fa-info-circle\" title=\"Models are tried in order from top to bottom. The first available model will be used.\"></i>\n                                    Priority order (first available model will be used)\n                                </span>\n                            </span>\n                        </ng-template>\n                        \n                        <!-- Direct Content Projection -->\n                        <div style=\"padding: 16px 0;\">\n                            <!-- Model Management Interface -->\n                            <div class=\"model-management\" style=\"border: 1px solid #dee2e6; border-radius: 6px; background: #f8f9fa;\">\n                                @if (isLoadingModels) {\n                                    <div class=\"loading-state\" style=\"padding: 20px; text-align: center; color: #6c757d;\">\n                                        <i class=\"fa-solid fa-spinner fa-spin\"></i> Loading models...\n                                    </div>\n                                } @else {\n                                    @if (promptModels.length === 0) {\n                                        <div class=\"empty-state\" style=\"padding: 20px; text-align: center; color: #6c757d;\">\n                                            <i class=\"fa-solid fa-info-circle\"></i> No models configured\n                                            @if (EditMode) {\n                                                <div style=\"margin-top: 10px;\">\n                                                    <button kendoButton fillMode=\"outline\" themeColor=\"primary\" size=\"small\"\n                                                                (click)=\"addNewModel()\">\n                                                        <i class=\"fa-solid fa-plus\"></i> Add Model\n                                                    </button>\n                                                </div>\n                                            }\n                                        </div>\n                                    } @else {\n                                        <!-- Priority explanation for multiple models -->\n                                        @if (promptModels.length > 1) {\n                                            <div style=\"padding: 12px 16px; background: #e3f2fd; border-bottom: 1px solid #bbdefb; color: #1565c0; font-size: 0.85em;\">\n                                                <i class=\"fa-solid fa-info-circle\" style=\"margin-right: 6px;\"></i>\n                                                Models are tried in priority order (highest priority first). The first available model that meets requirements will be used for execution.\n                                            </div>\n                                        }\n                                        <!-- Column Headers -->\n                                        <div class=\"model-header\" style=\"display: grid; grid-template-columns: 40px 2fr 1fr 1fr 60px; gap: 12px; padding: 12px 16px; background: #e9ecef; font-weight: 600; font-size: 0.85em; color: #495057; border-bottom: 1px solid #dee2e6;\">\n                                            <div title=\"Priority order - models are tried from top to bottom\">\n                                                <i class=\"fa-solid fa-sort\" style=\"color: #6c757d;\"></i>\n                                            </div>\n                                            <div>AI Model <span style=\"color: #dc3545;\">*</span></div>\n                                            <div>Vendor</div>\n                                            <div>Created</div>\n                                            <div>Actions</div>\n                                        </div>\n                                        \n                                        @for (model of promptModels; track getModelTrackId(model) || $index; let i = $index) {\n                                            <div class=\"model-row\" \n                                                 [draggable]=\"EditMode\"\n                                                 (dragstart)=\"onDragStart($event, i)\"\n                                                 (dragover)=\"onDragOver($event)\"\n                                                 (drop)=\"onDrop($event, i)\"\n                                                 (dragend)=\"onDragEnd($event)\"\n                                                 [style.background]=\"!model.ModelID ? '#fff3cd' : (draggedIndex === i ? '#e3f2fd' : 'white')\"\n                                                 [style.border-left]=\"!model.ModelID ? '3px solid #ffc107' : 'none'\"\n                                                 [style.opacity]=\"draggedIndex === i ? '0.5' : '1'\"\n                                                 style=\"display: grid; grid-template-columns: 40px 2fr 1fr 1fr 60px; gap: 12px; padding: 12px 16px; border-bottom: 1px solid #e9ecef; align-items: start; transition: background 0.2s, opacity 0.2s;\">\n                                                \n                                                <!-- Drag Handle / Priority -->\n                                                <div class=\"drag-handle\" style=\"display: flex; flex-direction: column; align-items: center; justify-content: center; color: #6c757d;\">\n                                                    @if (EditMode) {\n                                                        <i class=\"fa-solid fa-grip-vertical\" title=\"Drag to reorder priority\" style=\"cursor: move;\"></i>\n                                                        <span style=\"font-size: 0.7em; margin-top: 2px;\">#{{ i + 1 }}</span>\n                                                    } @else {\n                                                        <span style=\"font-size: 0.9em; font-weight: 600;\" title=\"Priority {{ model.Priority }} - Higher priority numbers are tried first\">#{{ i + 1 }}</span>\n                                                    }\n                                                </div>\n                                                \n                                                <!-- Model Selection -->\n                                                <div class=\"model-select\">\n                                                    @if (EditMode) {\n                                                        <kendo-dropdownlist [(ngModel)]=\"model.ModelID\"\n                                                                           [name]=\"'modelId_' + getModelTrackId(model)\"\n                                                                           [data]=\"availableModels\"\n                                                                           textField=\"Name\"\n                                                                           valueField=\"ID\"\n                                                                           [valuePrimitive]=\"true\"\n                                                                           [filterable]=\"true\"\n                                                                           placeholder=\"Select a model...\"\n                                                                           (valueChange)=\"onModelChange($event, i)\"\n                                                                           style=\"width: 100%;\">\n                                                        </kendo-dropdownlist>\n                                                    } @else {\n                                                        <span style=\"font-weight: 500;\">{{ getModelDisplayName(model.ModelID) }}</span>\n                                                    }\n                                                </div>\n                                                \n                                                <!-- Vendor -->\n                                                <div class=\"model-vendor\">\n                                                    @if (EditMode) {\n                                                        @if (model.ModelID) {\n                                                            @if (shouldShowVendorDropdown(model.ModelID)) {\n                                                                <kendo-dropdownlist [(ngModel)]=\"model.VendorID\"\n                                                                                   [name]=\"'vendorId_' + getModelTrackId(model)\"\n                                                                                   [data]=\"getVendorsForModelSync(model.ModelID)\"\n                                                                                   textField=\"Name\"\n                                                                                   valueField=\"ID\"\n                                                                                   [valuePrimitive]=\"true\"\n                                                                                   [filterable]=\"true\"\n                                                                                   placeholder=\"Select vendor...\"\n                                                                                   style=\"width: 100%;\">\n                                                                    <ng-template kendoDropDownListItemTemplate let-dataItem>\n                                                                        <span [style.color]=\"getVendorStatusColor(model.ModelID, dataItem.ID)\">\n                                                                            {{ dataItem.Name }}\n                                                                            @if (getModelVendorStatus(model.ModelID, dataItem.ID) !== 'Active') {\n                                                                                <span style=\"font-size: 0.8em; margin-left: 4px;\">({{ getModelVendorStatus(model.ModelID, dataItem.ID) }})</span>\n                                                                            }\n                                                                        </span>\n                                                                    </ng-template>\n                                                                </kendo-dropdownlist>\n                                                            } @else {\n                                                                <!-- Single vendor - just show the name -->\n                                                                @if (getVendorsForModelSync(model.ModelID).length === 1) {\n                                                                    <span [style.color]=\"getVendorStatusColor(model.ModelID, getVendorsForModelSync(model.ModelID)[0].ID)\" style=\"font-size: 0.9em; font-weight: 500;\">\n                                                                        {{ getVendorsForModelSync(model.ModelID)[0].Name }}\n                                                                        @if (getModelVendorStatus(model.ModelID, getVendorsForModelSync(model.ModelID)[0].ID) !== 'Active') {\n                                                                            <span style=\"font-size: 0.8em; margin-left: 4px;\">({{ getModelVendorStatus(model.ModelID, getVendorsForModelSync(model.ModelID)[0].ID) }})</span>\n                                                                        }\n                                                                    </span>\n                                                                } @else {\n                                                                    <span style=\"color: #6c757d; font-style: italic; font-size: 0.9em;\">No vendors available</span>\n                                                                }\n                                                            }\n                                                        } @else {\n                                                            <span style=\"color: #6c757d; font-style: italic; font-size: 0.9em;\">Select model first</span>\n                                                        }\n                                                    } @else {\n                                                        @if (model.VendorID && model.ModelID) {\n                                                            <span [style.color]=\"getVendorStatusColor(model.ModelID, model.VendorID)\" style=\"font-size: 0.9em;\">\n                                                                {{ getVendorDisplayName(model.VendorID) }}\n                                                                @if (getModelVendorStatus(model.ModelID, model.VendorID) !== 'Active') {\n                                                                    <span style=\"font-size: 0.8em; margin-left: 4px;\">({{ getModelVendorStatus(model.ModelID, model.VendorID) }})</span>\n                                                                }\n                                                            </span>\n                                                        } @else {\n                                                            <span style=\"color: #6c757d; font-size: 0.9em;\">-</span>\n                                                        }\n                                                    }\n                                                </div>\n                                                \n                                                \n                                                <!-- Created Date -->\n                                                <div class=\"model-created\">\n                                                    @if (model.ID) {\n                                                        <span style=\"color: #6c757d; font-size: 0.8em;\">{{ model.__mj_CreatedAt | date:'short' }}</span>\n                                                    } @else {\n                                                        <span style=\"color: #28a745; font-size: 0.8em; font-style: italic;\">New</span>\n                                                    }\n                                                </div>\n                                                \n                                                <!-- Actions -->\n                                                <div class=\"model-actions\" style=\"display: flex; gap: 2px; flex-direction: column;\">\n                                                    @if (EditMode) {\n                                                        <div style=\"display: flex; gap: 2px; margin-bottom: 4px;\">\n                                                            <button kendoButton fillMode=\"flat\" size=\"small\"\n                                                                        (click)=\"moveModelUp(i)\"\n                                                                        [disabled]=\"i === 0\"\n                                                                        title=\"Move up\">\n                                                                <i class=\"fa-solid fa-chevron-up\"></i>\n                                                            </button>\n                                                            <button kendoButton fillMode=\"flat\" size=\"small\"\n                                                                        (click)=\"moveModelDown(i)\"\n                                                                        [disabled]=\"i === promptModels.length - 1\"\n                                                                        title=\"Move down\">\n                                                                <i class=\"fa-solid fa-chevron-down\"></i>\n                                                            </button>\n                                                        </div>\n                                                        <button kendoButton fillMode=\"flat\" themeColor=\"error\" size=\"small\"\n                                                                    (click)=\"removePromptModel(i)\"\n                                                                    title=\"Remove model\">\n                                                            <i class=\"fa-solid fa-times\"></i>\n                                                        </button>\n                                                    }\n                                                </div>\n                                            </div>\n                                            \n                                            <!-- Second row with additional details -->\n                                            <div style=\"display: grid; grid-template-columns: 40px 1fr; gap: 12px; padding: 8px 16px; border-bottom: 1px solid #e9ecef; background: #f8f9fa; font-size: 0.85em; color: #6c757d;\">\n                                                <div></div>\n                                                <div>\n                                                    <!-- Basic model details -->\n                                                    <div style=\"display: flex; gap: 16px; flex-wrap: wrap; align-items: center; margin-bottom: 8px;\">\n                                                        @if (model.Status) {\n                                                            <span><strong>Status:</strong> {{ model.Status }}</span>\n                                                        }\n                                                        @if (model.ConfigurationID) {\n                                                            <span><strong>Configuration:</strong> {{ model.ConfigurationID }}</span>\n                                                        }\n                                                    </div>\n                                                    \n                                                    <!-- Parallel execution fields when prompt is ModelSpecific -->\n                                                    @if (record.ParallelizationMode === 'ModelSpecific') {\n                                                        <div style=\"padding: 8px; background: #fff; border: 1px solid #dee2e6; border-radius: 4px; margin-top: 8px;\">\n                                                            <div style=\"margin-bottom: 6px; font-weight: 600; color: #495057; font-size: 0.9em;\">\n                                                                <i class=\"fa-solid fa-layer-group\"></i> Model-Specific Parallel Execution\n                                                            </div>\n                                                            \n                                                            @if (EditMode) {\n                                                                <div style=\"display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 12px; align-items: center;\">\n                                                                    <!-- Parallel Mode -->\n                                                                    <div>\n                                                                        <label style=\"display: block; margin-bottom: 2px; font-size: 0.8em; font-weight: 600; color: #495057;\">Parallel Mode</label>\n                                                                        <kendo-dropdownlist [(ngModel)]=\"model.ParallelizationMode\"\n                                                                                           [name]=\"'parallelMode_' + i\"\n                                                                                           [data]=\"[{text: 'None', value: 'None'}, {text: 'Static Count', value: 'StaticCount'}, {text: 'Config Param', value: 'ConfigParam'}]\"\n                                                                                           textField=\"text\"\n                                                                                           valueField=\"value\"\n                                                                                           [valuePrimitive]=\"true\"\n                                                                                           placeholder=\"Select mode...\"\n                                                                                           style=\"width: 100%; font-size: 0.85em;\">\n                                                                        </kendo-dropdownlist>\n                                                                    </div>\n                                                                    \n                                                                    <!-- Parallel Count (when StaticCount) -->\n                                                                    @if (model.ParallelizationMode === 'StaticCount') {\n                                                                        <div>\n                                                                            <label style=\"display: block; margin-bottom: 2px; font-size: 0.8em; font-weight: 600; color: #495057;\">Parallel Count</label>\n                                                                            <kendo-numerictextbox [(ngModel)]=\"model.ParallelCount\"\n                                                                                                 [name]=\"'parallelCount_' + i\"\n                                                                                                 [min]=\"1\"\n                                                                                                 [step]=\"1\"\n                                                                                                 [format]=\"'n0'\"\n                                                                                                 placeholder=\"Count...\"\n                                                                                                 style=\"width: 100%; font-size: 0.85em;\">\n                                                                            </kendo-numerictextbox>\n                                                                        </div>\n                                                                    }\n                                                                    \n                                                                    <!-- Config Param (when ConfigParam) -->\n                                                                    @if (model.ParallelizationMode === 'ConfigParam') {\n                                                                        <div>\n                                                                            <label style=\"display: block; margin-bottom: 2px; font-size: 0.8em; font-weight: 600; color: #495057;\">Config Parameter</label>\n                                                                            <kendo-textbox [(ngModel)]=\"model.ParallelConfigParam\"\n                                                                                          [name]=\"'parallelConfigParam_' + i\"\n                                                                                          placeholder=\"Parameter name...\"\n                                                                                          style=\"width: 100%; font-size: 0.85em;\">\n                                                                            </kendo-textbox>\n                                                                        </div>\n                                                                    }\n                                                                </div>\n                                                            } @else {\n                                                                <!-- Read-only display -->\n                                                                <div style=\"display: flex; gap: 16px; flex-wrap: wrap; align-items: center;\">\n                                                                    @if (model.ParallelizationMode) {\n                                                                        <span><strong>Parallel Mode:</strong> {{ model.ParallelizationMode }}</span>\n                                                                    }\n                                                                    @if (model.ParallelCount) {\n                                                                        <span><strong>Parallel Count:</strong> {{ model.ParallelCount }}</span>\n                                                                    }\n                                                                    @if (model.ParallelConfigParam) {\n                                                                        <span><strong>Config Param:</strong> {{ model.ParallelConfigParam }}</span>\n                                                                    }\n                                                                </div>\n                                                            }\n                                                        </div>\n                                                    }\n                                                </div>\n                                            </div>\n                                        }\n                                        \n                                        @if (EditMode) {\n                                            <div class=\"add-model-row\" style=\"padding: 12px 16px; text-align: center; background: #f8f9fa; border-top: 1px solid #dee2e6;\">\n                                                <button kendoButton fillMode=\"outline\" themeColor=\"success\" size=\"small\"\n                                                            (click)=\"addNewModel()\">\n                                                    <i class=\"fa-solid fa-plus\"></i> Add Model\n                                                </button>\n                                            </div>\n                                        }\n                                    }\n                                }\n                            </div>\n                        </div>\n                    </kendo-expansionpanel>\n                }\n\n                <!-- Advanced Configuration Expansion Panel -->\n                <kendo-expansionpanel \n                    [expanded]=\"false\"\n                    style=\"margin-bottom: 12px;\">\n                    <ng-template kendoExpansionPanelTitleDirective>\n                        <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n                            <i class=\"fa-solid fa-cogs\" style=\"color: #6c757d;\"></i>\n                            Advanced Configuration\n                        </span>\n                    </ng-template>\n                    \n                    <!-- Direct Content Projection -->\n                    <div style=\"padding: 16px 0;\">\n                        <div style=\"display: grid; grid-template-columns: 1fr 1fr; gap: 20px;\">\n                            \n                            <!-- Left Column -->\n                            <div>\n                                <mj-form-field \n                                    [record]=\"record\"\n                                    [ShowLabel]=\"true\"\n                                    FieldName=\"ParallelizationMode\"\n                                    Type=\"dropdownlist\"\n                                    [EditMode]=\"EditMode\">\n                                </mj-form-field>\n                                \n                                @if (showParallelCount) {\n                                    <mj-form-field \n                                        [record]=\"record\"\n                                        [ShowLabel]=\"true\"\n                                        FieldName=\"ParallelCount\"\n                                        Type=\"numerictextbox\"\n                                        [EditMode]=\"EditMode\">\n                                    </mj-form-field>\n                                }\n                                \n                                @if (showParallelConfigParam) {\n                                    <mj-form-field \n                                        [record]=\"record\"\n                                        [ShowLabel]=\"true\"\n                                        FieldName=\"ParallelConfigParam\"\n                                        Type=\"textbox\"\n                                        [EditMode]=\"EditMode\">\n                                    </mj-form-field>\n                                }\n                                \n                                <mj-form-field \n                                    [record]=\"record\"\n                                    [ShowLabel]=\"true\"\n                                    FieldName=\"OutputType\"\n                                    Type=\"dropdownlist\"\n                                    [EditMode]=\"EditMode\">\n                                </mj-form-field>\n                                \n                            </div>\n                            \n                            <!-- Right Column -->\n                            <div>\n                                <mj-form-field \n                                    [record]=\"record\"\n                                    [ShowLabel]=\"true\"\n                                    FieldName=\"ValidationBehavior\"\n                                    Type=\"dropdownlist\"\n                                    [EditMode]=\"EditMode\">\n                                </mj-form-field>\n                                \n                                <mj-form-field \n                                    [record]=\"record\"\n                                    [ShowLabel]=\"true\"\n                                    FieldName=\"EnableCaching\"\n                                    Type=\"checkbox\"\n                                    [EditMode]=\"EditMode\">\n                                </mj-form-field>\n                                \n                                <!-- Result Selector Prompt with Tree Selector -->\n                                <div style=\"margin-bottom: 16px;\">\n                                    <label style=\"display: block; margin-bottom: 4px; font-weight: 600; color: #495057; font-size: 0.9em;\">\n                                        Result Selector Prompt\n                                    </label>\n                                    @if (EditMode) {\n                                        @if (isLoadingResultSelectorData) {\n                                            <div style=\"padding: 8px; color: #6c757d; font-style: italic;\">\n                                                <i class=\"fa-solid fa-spinner fa-spin\"></i> Loading prompts...\n                                            </div>\n                                        } @else {\n                                            <kendo-dropdowntree \n                                                [(ngModel)]=\"record.ResultSelectorPromptID\"\n                                                name=\"resultSelectorPromptID\"\n                                                [data]=\"resultSelectorTreeData\"\n                                                textField=\"text\"\n                                                valueField=\"value\"\n                                                [valuePrimitive]=\"true\"\n                                                [filterable]=\"true\"\n                                                placeholder=\"Select a result selector prompt...\"\n                                                style=\"width: 100%;\"\n                                                (valueChange)=\"onResultSelectorChange($event)\">\n                                            </kendo-dropdowntree>\n                                        }\n                                    } @else {\n                                        <span style=\"color: #495057;\">{{ getPromptDisplayName(record.ResultSelectorPromptID || '') || 'None selected' }}</span>\n                                    }\n                                </div>\n                            </div>\n                        </div>\n                    </div>\n                </kendo-expansionpanel>\n\n                <!-- Output Example Expansion Panel (when OutputType = object) -->\n                @if (showOutputExample) {\n                    <kendo-expansionpanel \n                        [expanded]=\"true\"\n                        style=\"margin-bottom: 12px;\">\n                        <ng-template kendoExpansionPanelTitleDirective>\n                            <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n                                <i class=\"fa-solid fa-code\" style=\"color: #6c757d;\"></i>\n                                Output Example (JSON)\n                                <span style=\"color: #dc3545; font-size: 0.8em; font-weight: normal;\">\u2022 Required for object output type</span>\n                            </span>\n                        </ng-template>\n                        \n                        <!-- Direct Content Projection -->\n                        <div style=\"padding: 16px;\">\n                            @if (EditMode) {\n                                <mj-code-editor \n                                    [(ngModel)]=\"record.OutputExample\"\n                                    name=\"outputExample\"\n                                    language=\"json\"\n                                    placeholder=\"Enter JSON example structure...\"\n                                    style=\"width: 100%; height: 200px; border: 1px solid #dee2e6; border-radius: 4px;\">\n                                </mj-code-editor>\n                                <div style=\"margin-top: 8px; color: #6c757d; font-size: 0.85em;\">\n                                    <i class=\"fa-solid fa-info-circle\"></i> Provide a JSON example that defines the expected structure for object output validation.\n                                </div>\n                            } @else if (record.OutputExample) {\n                                <div style=\"background: #f8f9fa; border: 1px solid #dee2e6; border-radius: 4px; padding: 12px; font-family: 'Courier New', monospace; font-size: 0.9em; white-space: pre-wrap; overflow: auto; max-height: 250px;\">{{ record.OutputExample }}</div>\n                            } @else {\n                                <div style=\"background: #fff3cd; border: 1px solid #ffeaa7; border-radius: 4px; padding: 12px; color: #856404; text-align: center;\">\n                                    <i class=\"fa-solid fa-exclamation-triangle\"></i> Output example is required when output type is 'object'\n                                </div>\n                            }\n                        </div>\n                    </kendo-expansionpanel>\n                }\n\n                <!-- Execution History Expansion Panel -->\n                @if (record.IsSaved) {\n                    <kendo-expansionpanel \n                        [expanded]=\"false\"\n                        style=\"margin-bottom: 12px;\">\n                        <ng-template kendoExpansionPanelTitleDirective>\n                            <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n                                <i class=\"fa-solid fa-history\" style=\"color: #6c757d;\"></i>\n                                Execution History\n                                @if (executionHistory.length > 0) {\n                                    <span style=\"color: #6c757d; font-weight: normal;\">({{ executionHistory.length }})</span>\n                                }\n                            </span>\n                        </ng-template>\n                        \n                        <!-- Custom Execution History Viewer -->\n                        <div style=\"padding: 16px;\">\n                            @if (isLoadingHistory) {\n                                <div style=\"text-align: center; padding: 40px; color: #6c757d;\">\n                                    <i class=\"fa-solid fa-spinner fa-spin\" style=\"font-size: 2em; margin-bottom: 12px;\"></i>\n                                    <p>Loading execution history...</p>\n                                </div>\n                            } @else if (executionHistory.length === 0) {\n                                <div style=\"text-align: center; padding: 40px; color: #6c757d;\">\n                                    <i class=\"fa-solid fa-history\" style=\"font-size: 3em; margin-bottom: 12px; opacity: 0.3;\"></i>\n                                    <p>No execution history yet</p>\n                                    <p style=\"font-size: 0.9em;\">Run this prompt to see execution history here</p>\n                                </div>\n                            } @else {\n                                <!-- Sort Controls -->\n                                <div style=\"display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px;\">\n                                    <div style=\"color: #6c757d; font-size: 0.9em;\">\n                                        Showing {{ executionHistory.length }} executions\n                                    </div>\n                                    <div style=\"display: flex; gap: 8px; align-items: center;\">\n                                        <span style=\"color: #6c757d; font-size: 0.85em;\">Sort by:</span>\n                                        <kendo-buttongroup selection=\"single\">\n                                            <button kendoButton \n                                                    [selected]=\"historySortField === 'runAt'\"\n                                                    (click)=\"changeHistorySort('runAt')\"\n                                                    size=\"small\">\n                                                Date\n                                                @if (historySortField === 'runAt') {\n                                                    <i [class]=\"'fa-solid fa-sort-' + (historySortDirection === 'asc' ? 'up' : 'down')\" \n                                                       style=\"margin-left: 4px; font-size: 0.8em;\"></i>\n                                                }\n                                            </button>\n                                            <button kendoButton \n                                                    [selected]=\"historySortField === 'executionTime'\"\n                                                    (click)=\"changeHistorySort('executionTime')\"\n                                                    size=\"small\">\n                                                Duration\n                                                @if (historySortField === 'executionTime') {\n                                                    <i [class]=\"'fa-solid fa-sort-' + (historySortDirection === 'asc' ? 'up' : 'down')\" \n                                                       style=\"margin-left: 4px; font-size: 0.8em;\"></i>\n                                                }\n                                            </button>\n                                            <button kendoButton \n                                                    [selected]=\"historySortField === 'tokens'\"\n                                                    (click)=\"changeHistorySort('tokens')\"\n                                                    size=\"small\">\n                                                Tokens\n                                                @if (historySortField === 'tokens') {\n                                                    <i [class]=\"'fa-solid fa-sort-' + (historySortDirection === 'asc' ? 'up' : 'down')\" \n                                                       style=\"margin-left: 4px; font-size: 0.8em;\"></i>\n                                                }\n                                            </button>\n                                            <button kendoButton \n                                                    [selected]=\"historySortField === 'cost'\"\n                                                    (click)=\"changeHistorySort('cost')\"\n                                                    size=\"small\">\n                                                Cost\n                                                @if (historySortField === 'cost') {\n                                                    <i [class]=\"'fa-solid fa-sort-' + (historySortDirection === 'asc' ? 'up' : 'down')\" \n                                                       style=\"margin-left: 4px; font-size: 0.8em;\"></i>\n                                                }\n                                            </button>\n                                        </kendo-buttongroup>\n                                    </div>\n                                </div>\n                                \n                                <!-- Execution History Table -->\n                                <div style=\"border: 1px solid #e9ecef; border-radius: 8px; overflow: hidden;\">\n                                    <table style=\"width: 100%; border-collapse: collapse;\">\n                                        <thead>\n                                            <tr style=\"background: #f8f9fa; border-bottom: 2px solid #e9ecef;\">\n                                                <th style=\"padding: 12px; text-align: left; font-weight: 600; color: #495057;\">Status</th>\n                                                <th style=\"padding: 12px; text-align: left; font-weight: 600; color: #495057;\">Date & Time</th>\n                                                <th style=\"padding: 12px; text-align: left; font-weight: 600; color: #495057;\">Model</th>\n                                                <th style=\"padding: 12px; text-align: left; font-weight: 600; color: #495057;\">Duration</th>\n                                                <th style=\"padding: 12px; text-align: right; font-weight: 600; color: #495057;\">Tokens</th>\n                                                <th style=\"padding: 12px; text-align: right; font-weight: 600; color: #495057;\">Cost</th>\n                                                <th style=\"padding: 12px; text-align: center; font-weight: 600; color: #495057;\">Type</th>\n                                                <th style=\"padding: 12px; text-align: center; font-weight: 600; color: #495057;\">Actions</th>\n                                            </tr>\n                                        </thead>\n                                        <tbody>\n                                            @for (run of executionHistory; track run.ID; let i = $index) {\n                                                <tr class=\"history-row\"\n                                                    [class.even-row]=\"i % 2 === 0\"\n                                                    style=\"border-bottom: 1px solid #f1f3f5;\">\n                                                    <td style=\"padding: 12px;\">\n                                                        <span style=\"display: flex; align-items: center; gap: 6px;\">\n                                                            <i [class]=\"'fa-solid ' + getExecutionStatusIcon(run.Success)\" \n                                                               [style.color]=\"getExecutionStatusColor(run.Success)\"></i>\n                                                            <span [style.color]=\"getExecutionStatusColor(run.Success)\" style=\"font-weight: 500;\">\n                                                                {{ run.Success === true ? 'Success' : run.Success === false ? 'Failed' : 'Running' }}\n                                                            </span>\n                                                        </span>\n                                                    </td>\n                                                    <td style=\"padding: 12px; color: #495057;\">\n                                                        {{ run.RunAt | date:'short' }}\n                                                    </td>\n                                                    <td style=\"padding: 12px; color: #495057;\">\n                                                        <span style=\"display: flex; align-items: center; gap: 6px;\">\n                                                            <i class=\"fa-solid fa-microchip\" style=\"color: #6c757d;\"></i>\n                                                            {{ run.Model || 'Unknown' }}\n                                                        </span>\n                                                    </td>\n                                                    <td style=\"padding: 12px; color: #495057;\">\n                                                        {{ formatDuration(run.ExecutionTimeMS) }}\n                                                    </td>\n                                                    <td style=\"padding: 12px; text-align: right; color: #495057;\">\n                                                        {{ formatTokens(run.TokensUsed) }}\n                                                    </td>\n                                                    <td style=\"padding: 12px; text-align: right; color: #495057;\">\n                                                        {{ formatCost(run.TotalCost || run.Cost) }}\n                                                    </td>\n                                                    <td style=\"padding: 12px; text-align: center;\">\n                                                        @if (run.RunType) {\n                                                            <span style=\"padding: 4px 8px; border-radius: 12px; background: #e9ecef; \n                                                                       color: #495057; font-size: 0.85em; font-weight: 500;\">\n                                                                {{ run.RunType }}\n                                                            </span>\n                                                        }\n                                                    </td>\n                                                    <td style=\"padding: 12px; text-align: center;\">\n                                                        <button kendoButton \n                                                            fillMode=\"flat\"\n                                                            size=\"small\"\n                                                            (click)=\"navigateToPromptRun(run.ID)\"\n                                                            title=\"View details\">\n                                                            <i class=\"fa-solid fa-external-link\"></i>\n                                                        </button>\n                                                    </td>\n                                                </tr>\n                                            }\n                                        </tbody>\n                                    </table>\n                                </div>\n                            }\n                        </div>\n                    </kendo-expansionpanel>\n                }\n\n                <!-- Cache Expansion Panel -->\n                @if (record.IsSaved && record.EnableCaching) {\n                    <kendo-expansionpanel \n                        [expanded]=\"false\"\n                        style=\"margin-bottom: 12px;\">\n                        <ng-template kendoExpansionPanelTitleDirective>\n                            <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n                                <i class=\"fa-solid fa-database\" style=\"color: #6c757d;\"></i>\n                                Result Cache\n                            </span>\n                        </ng-template>\n                        \n                        <!-- Direct Content Projection -->\n                        <div style=\"padding: 16px 0;\">\n                            <mj-user-view-grid \n                                [Params]=\"BuildRelationshipViewParamsByEntityName('AI Result Cache','AIPromptID')\"  \n                                [NewRecordValues]=\"NewRecordValues('AI Result Cache')\"\n                                [AllowLoad]=\"true\"\n                                [EditMode]=\"GridEditMode()\"  \n                                style=\"height: 300px;\">\n                            </mj-user-view-grid>\n                        </div>\n                    </kendo-expansionpanel>\n                }\n\n                <!-- Related Items Expansion Panel -->\n                @if (record.IsSaved) {\n                    <kendo-expansionpanel \n                        [expanded]=\"false\"\n                        style=\"margin-bottom: 12px;\">\n                        <ng-template kendoExpansionPanelTitleDirective>\n                            <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n                                <i class=\"fa-solid fa-link\" style=\"color: #6c757d;\"></i>\n                                Related Items\n                            </span>\n                        </ng-template>\n                        \n                        <!-- Direct Content Projection -->\n                        <div style=\"padding: 16px 0;\">\n                            <div style=\"display: grid; grid-template-columns: 1fr 1fr; gap: 20px;\">\n                                <!-- AI Agents -->\n                                <div>\n                                    <h6 style=\"margin: 0 0 12px 0; color: #495057;\">AI Agents Using This Prompt</h6>\n                                    <mj-user-view-grid \n                                        [Params]=\"BuildRelationshipViewParamsByEntityName('MJ: AI Agent Prompts','PromptID')\"  \n                                        [NewRecordValues]=\"NewRecordValues('MJ: AI Agent Prompts')\"\n                                        [AllowLoad]=\"true\"\n                                        [EditMode]=\"GridEditMode()\"  \n                                        style=\"height: 200px;\">\n                                    </mj-user-view-grid>\n                                </div>\n                                \n                                <!-- Result Selector References -->\n                                <div>\n                                    <h6 style=\"margin: 0 0 12px 0; color: #495057;\">Prompts Using This as Result Selector</h6>\n                                    <mj-user-view-grid \n                                        [Params]=\"BuildRelationshipViewParamsByEntityName('AI Prompts','ResultSelectorPromptID')\"  \n                                        [NewRecordValues]=\"NewRecordValues('AI Prompts')\"\n                                        [AllowLoad]=\"true\"\n                                        [EditMode]=\"GridEditMode()\"  \n                                        style=\"height: 200px;\">\n                                    </mj-user-view-grid>\n                                </div>\n                            </div>\n                        </div>\n                    </kendo-expansionpanel>\n                }\n            </div>\n        </div>\n    </form>\n\n    \n    <!-- AI Prompt Test Harness -->\n    @if (showTestHarness) {\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)=\"onTestHarnessVisibilityChanged(false)\"\n            title=\"Run AI Prompt - {{ record.Name || 'Untitled' }}\">\n            <mj-ai-test-harness\n                [entity]=\"record\"\n                [mode]=\"'prompt'\"\n                [isVisible]=\"showTestHarness\"\n                (visibilityChange)=\"onTestHarnessVisibilityChanged($event)\">\n            </mj-ai-test-harness>\n        </kendo-window>\n    }\n</div>", styles: [".record-form-container {\n    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n    padding: 10px;\n}\n\n.custom-toolbar-actions {\n    margin-left: auto;\n}\n\n.status-badge {\n    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n    font-weight: 500;\n    letter-spacing: 0.02em;\n}\n\n.config-summary {\n    position: sticky;\n    top: 0;\n    max-height: 600px;\n    overflow-y: auto;\n}\n\n.config-item {\n    padding: 8px 0;\n    border-bottom: 1px solid #e9ecef;\n}\n\n.config-item:last-child {\n    border-bottom: none;\n}\n\n.template-tab-content {\n    background: #fff;\n}\n\n.template-header h5 {\n    font-size: 1.1em;\n}\n\n.loading-state,\n.no-template-state,\n.invalid-template-state {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n}\n\n.no-template-state i,\n.invalid-template-state i {\n    opacity: 0.6;\n}\n\n.template-editor-container {\n    background: #fff;\n    border-radius: 6px;\n}\n\n/* Grid layout adjustments */\n@media (max-width: 1200px) {\n    .record-form-container .mj-tab-body > div {\n        grid-template-columns: 1fr !important;\n        gap: 20px;\n    }\n    \n    .config-summary {\n        order: -1;\n        position: static;\n        max-height: none;\n    }\n}\n\n/* Responsive toolbar */\n@media (max-width: 768px) {\n    .custom-toolbar-actions {\n        flex-direction: column;\n        gap: 4px !important;\n    }\n    \n    .status-badge {\n        align-self: flex-start;\n    }\n}\n\n/* Ensure proper spacing in form sections */\n.record-form-container mj-form-section {\n    padding: 16px;\n}\n\n/* Smooth transitions for better UX */\n.status-badge,\n.config-item,\n.template-header {\n    transition: all 0.2s ease;\n}\n\n.config-item:hover {\n    background-color: rgba(0,0,0,0.02);\n    border-radius: 4px;\n    margin: 0 -8px;\n    padding: 8px;\n}\n\n/* Execution History Table Styles */\n.history-row {\n    transition: background 0.2s;\n}\n\n.history-row:not(.even-row) {\n    background: #f8f9fa;\n}\n\n.history-row.even-row {\n    background: white;\n}\n\n.history-row:hover {\n    background: #e9ecef !important;\n}\n\n/* Template Parameters Styles */\n.parameter-card {\n    position: relative;\n    overflow: hidden;\n}\n\n.parameter-card::before {\n    content: '';\n    position: absolute;\n    top: 0;\n    left: 0;\n    bottom: 0;\n    width: 4px;\n    background: inherit;\n    transition: width 0.2s;\n}\n\n.parameter-card:hover {\n    transform: translateY(-2px);\n    box-shadow: 0 4px 12px rgba(0,0,0,0.1);\n}\n\n.parameter-card:hover::before {\n    width: 6px;\n}\n\n.type-badge {\n    font-weight: 600;\n    text-transform: uppercase;\n    letter-spacing: 0.03em;\n    transition: transform 0.2s;\n}\n\n.parameter-card:hover .type-badge {\n    transform: scale(1.05);\n}\n\n/* Parameter type icons animation */\n.parameter-card i.fa-solid {\n    transition: transform 0.3s;\n}\n\n.parameter-card:hover i.fa-solid {\n    transform: rotate(360deg);\n}\n\n/* Grid responsive behavior */\n@media (max-width: 768px) {\n    .parameter-card {\n        margin-bottom: 8px;\n    }\n    \n    .parameter-card h6 {\n        font-size: 0.95em;\n    }\n    \n    .type-badge {\n        font-size: 0.7em !important;\n    }\n}"] }]
-    }], () => [{ type: i0.ElementRef }, { type: i1.SharedService }, { type: i2.Router }, { type: i2.ActivatedRoute }, { type: i0.ChangeDetectorRef }, { type: i3.AITestHarnessDialogService }, { type: i0.ViewContainerRef }], { templateEditor: [{
+        args: [{ selector: 'mj-ai-prompt-form', template: "<div class=\"record-form-container\">\n    <!-- Dialog container for Kendo dialogs -->\n    <div kendoDialogContainer></div>\n    <form *ngIf=\"record\" class=\"record-form\" #form=\"ngForm\" >\n        <mj-form-toolbar [form]=\"this\"></mj-form-toolbar>\n\n        <!-- Main Content Area - Template Editor and Configuration -->\n        <div class=\"prompt-main-area\" style=\"display: flex; flex-direction: column; height: 100%; overflow-y: auto;\">\n            \n            <!-- Header Section -->\n            <div class=\"prompt-header\" style=\"flex-shrink: 0; padding: 20px; background: #f8f9fa; border-bottom: 2px solid #e9ecef;\">\n                <div style=\"display: flex; justify-content: space-between; align-items: flex-start; gap: 20px;\">\n                    \n                    <!-- Left: Prompt Info -->\n                    <div style=\"flex: 1; min-width: 0;\">\n                        <div style=\"display: flex; align-items: center; gap: 12px; margin-bottom: 8px;\">\n                            <i class=\"fa-solid fa-robot\" style=\"color: #6f42c1; font-size: 1.4em;\"></i>\n                            @if (EditMode) {\n                                <kendo-textbox [(ngModel)]=\"record.Name\" \n                                              name=\"promptName\"\n                                              placeholder=\"Enter prompt name...\"\n                                              style=\"font-size: 1.2em; font-weight: 600; min-width: 300px; flex: 1;\">\n                                </kendo-textbox>\n                            } @else {\n                                <h4 style=\"margin: 0; color: #495057; font-weight: 600; flex: 1;\">{{ record.Name || 'Untitled AI Prompt' }}</h4>\n                                <span class=\"status-badge\" [style.background-color]=\"getStatusBadgeColor()\" \n                                      style=\"color: white; padding: 4px 10px; border-radius: 12px; font-size: 0.75em; font-weight: 500;\">\n                                    {{ record.Status }}\n                                </span>\n                            }\n                        </div>\n                        \n                        <!-- Status and Type Editors when in edit mode -->\n                        @if (EditMode) {\n                            <div style=\"display: flex; gap: 16px; margin-bottom: 12px; flex-wrap: wrap;\">\n                                <div>\n                                    <label style=\"display: block; margin-bottom: 4px; font-weight: 600; color: #495057; font-size: 0.9em;\">Status</label>\n                                    <kendo-dropdownlist [(ngModel)]=\"record.Status\"\n                                                       name=\"promptStatus\"\n                                                       [data]=\"[{text: 'Active', value: 'Active'}, {text: 'Pending', value: 'Pending'}, {text: 'Disabled', value: 'Disabled'}]\"\n                                                       textField=\"text\"\n                                                       valueField=\"value\"\n                                                       [valuePrimitive]=\"true\"\n                                                       style=\"width: 150px;\">\n                                    </kendo-dropdownlist>\n                                </div>\n                                <div>\n                                    <label style=\"display: block; margin-bottom: 4px; font-weight: 600; color: #495057; font-size: 0.9em;\">\n                                        Type <span style=\"color: #dc3545;\">*</span>\n                                    </label>\n                                    @if (isLoadingPromptTypes) {\n                                        <div style=\"padding: 8px; color: #6c757d; font-style: italic; width: 200px;\">\n                                            <i class=\"fa-solid fa-spinner fa-spin\"></i> Loading types...\n                                        </div>\n                                    } @else {\n                                        <kendo-dropdownlist [(ngModel)]=\"record.TypeID\"\n                                                           name=\"promptTypeID\"\n                                                           [data]=\"availablePromptTypes\"\n                                                           textField=\"Name\"\n                                                           valueField=\"ID\"\n                                                           [valuePrimitive]=\"true\"\n                                                           [filterable]=\"true\"\n                                                           placeholder=\"Select prompt type...\"\n                                                           style=\"width: 200px;\">\n                                        </kendo-dropdownlist>\n                                    }\n                                </div>\n                            </div>\n                        }\n                        \n                        @if (EditMode) {\n                            <kendo-textarea [(ngModel)]=\"record.Description\" \n                                           name=\"promptDescription\"\n                                           [rows]=\"2\"\n                                           placeholder=\"Enter prompt description...\"\n                                           style=\"width: 100%; max-width: 600px; margin-bottom: 12px;\">\n                            </kendo-textarea>\n                        } @else if (record.Description) {\n                            <p style=\"margin: 0 0 12px 0; color: #6c757d; font-size: 0.9em; line-height: 1.4;\">{{ record.Description }}</p>\n                        }\n                        \n                        <!-- Quick Config Row -->\n                        <div class=\"quick-config\" style=\"display: flex; align-items: center; gap: 16px; flex-wrap: wrap;\">\n                            @if (record.TypeID) {\n                                <div class=\"config-item\" style=\"display: flex; align-items: center; gap: 6px; font-size: 0.85em;\">\n                                    <i class=\"fa-solid fa-tag\" style=\"color: #6c757d;\"></i>\n                                    <span style=\"color: #6c757d;\">Type:</span>\n                                    <span style=\"color: #495057; font-weight: 500;\">{{ getPromptTypeDisplayName(record.TypeID) }}</span>\n                                </div>\n                            }\n                            \n                            <div class=\"config-item\" style=\"display: flex; align-items: center; gap: 6px; font-size: 0.85em;\">\n                                <i class=\"fa-solid fa-layer-group\" style=\"color: #6c757d;\"></i>\n                                <span style=\"color: #6c757d;\">Parallelization:</span>\n                                <span style=\"color: #495057; font-weight: 500;\">{{ getParallelizationModeDisplay() }}</span>\n                            </div>\n                            \n                            <div class=\"config-item\" style=\"display: flex; align-items: center; gap: 6px; font-size: 0.85em;\">\n                                <i class=\"fa-solid fa-code\" style=\"color: #6c757d;\"></i>\n                                <span style=\"color: #6c757d;\">Output:</span>\n                                <span [style.color]=\"getValidationColor()\" style=\"font-weight: 500;\">{{ getOutputTypeDisplay() }}</span>\n                            </div>\n                            \n                            @if (record.EnableCaching) {\n                                <div class=\"config-item\" style=\"display: flex; align-items: center; gap: 6px; font-size: 0.85em;\">\n                                    <i class=\"fa-solid fa-database\" style=\"color: #28a745;\"></i>\n                                    <span style=\"color: #28a745; font-weight: 500;\">Caching Enabled</span>\n                                </div>\n                            }\n                        </div>\n                    </div>\n                    \n                    <!-- Right: Action Buttons -->\n                    <div class=\"action-buttons\" style=\"display: flex; flex-direction: column; gap: 8px; align-items: flex-end;\">\n                        <div style=\"display: flex; gap: 8px;\">\n                            @if (record.ID) {\n                                <button kendoButton [themeColor]=\"'primary'\" [size]=\"'large'\"\n                                        (click)=\"openTestHarness()\"\n                                        title=\"Run AI Prompt Test Harness\">\n                                    <i class=\"fa-solid fa-play\"></i> Run\n                                </button>\n                            }\n                        </div>\n                        \n                        @if (!canExecute && record.ID) {\n                            <div style=\"font-size: 0.75em; color: #dc3545; text-align: right; max-width: 200px;\">\n                                @if (record.Status !== 'Active') {\n                                    \u2022 Prompt must be Active<br>\n                                }\n                                @if (!record.TemplateID) {\n                                    \u2022 Template is required<br>\n                                }\n                                @if (!template && record.TemplateID) {\n                                    \u2022 Template not found<br>\n                                }\n                            </div>\n                        }\n                    </div>\n                </div>\n            </div>\n\n            <!-- Configuration Sections with Expansion Panels -->\n            <div class=\"configuration-sections\" style=\"flex: 1; background: white; border-top: 2px solid #e9ecef; padding: 16px; min-height: 0;\">\n                <!-- Template Editor Section -->\n                <kendo-expansionpanel \n                    [expanded]=\"true\"\n                    style=\"margin-bottom: 12px;\">\n                    <ng-template kendoExpansionPanelTitleDirective>\n                        <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n                            <i class=\"fa-solid fa-code\" style=\"color: #6c757d;\"></i>\n                            Template Editor\n                            @if (template) {\n                                <span style=\"color: #6c757d; font-size: 0.9em; font-weight: normal;\">\u2022 {{ template.Name }}</span>\n                            }\n                        </span>\n                    </ng-template>\n                    \n                    <!-- Direct Content Projection -->\n                    <div class=\"template-section\" style=\"display: flex; flex-direction: column; min-height: 400px; padding: 8px;\">\n                        @if (isLoadingTemplate) {\n                            <div class=\"loading-state\" style=\"flex: 1; display: flex; align-items: center; justify-content: center; color: #6c757d;\">\n                                <i class=\"fa-solid fa-spinner fa-spin\" style=\"font-size: 24px; margin-right: 12px;\"></i>\n                                Loading template...\n                            </div>\n                        } @else if (!record.TemplateID) {\n                            <div class=\"no-template-state\" style=\"flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 40px; color: #6c757d;\">\n                                <i class=\"fa-solid fa-code\" style=\"font-size: 64px; margin-bottom: 20px; opacity: 0.3;\"></i>\n                                <h5 style=\"margin-bottom: 12px; color: #495057;\">No Template Associated</h5>\n                                <p style=\"margin-bottom: 24px; text-align: center; max-width: 400px;\">\n                                    This AI prompt needs a template to define its structure and parameters. \n                                    Create a new template or link to an existing one.\n                                </p>\n                                <div style=\"display: flex; gap: 12px;\">\n                                    @if (UserCanCreateTemplates) {\n                                        <button kendoButton [themeColor]=\"'primary'\" (click)=\"createNewTemplate()\">\n                                            <i class=\"fa-solid fa-plus\"></i> Create New Template\n                                        </button>\n                                    }\n                                    @if (UserCanReadTemplates) {\n                                        <button kendoButton [fillMode]=\"'outline'\" (click)=\"linkExistingTemplate()\">\n                                            <i class=\"fa-solid fa-link\"></i> Link Existing Template\n                                        </button>\n                                    }\n                                </div>\n                            </div>\n                        } @else if (templateNotFoundInDatabase) {\n                            <div class=\"invalid-template-state\" style=\"flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 40px; color: #dc3545;\">\n                                <i class=\"fa-solid fa-exclamation-triangle\" style=\"font-size: 64px; margin-bottom: 20px; opacity: 0.7;\"></i>\n                                <h5 style=\"margin-bottom: 12px;\">Template Not Found</h5>\n                                <p style=\"margin-bottom: 24px; text-align: center; max-width: 400px;\">\n                                    The referenced template could not be loaded. It may have been deleted or moved.\n                                </p>\n                                <div style=\"display: flex; gap: 12px;\">\n                                    <button kendoButton [fillMode]=\"'outline'\" (click)=\"loadTemplate()\">\n                                        <i class=\"fa-solid fa-refresh\"></i> Retry Loading\n                                    </button>\n                                    @if (UserCanCreateTemplates) {\n                                        <button kendoButton [themeColor]=\"'primary'\" (click)=\"createNewTemplate()\">\n                                            <i class=\"fa-solid fa-plus\"></i> Create New Template\n                                        </button>\n                                    }\n                                </div>\n                            </div>\n                        } @else {\n                            <!-- Active Template Editor -->\n                            <div class=\"template-editor-container\" style=\"flex: 1; display: flex; flex-direction: column; min-height: 350px;\">\n                                <!-- Template Actions Bar -->\n                                @if (template && EditMode) {\n                                    <div class=\"template-actions\" style=\"display: flex; gap: 8px; padding: 8px; border-bottom: 1px solid #e9ecef; background: #f8f9fa;\">\n                                        @if (UserCanUpdateTemplates) {\n                                            <button kendoButton \n                                                    [fillMode]=\"'outline'\" \n                                                    [size]=\"'small'\"\n                                                    (click)=\"linkExistingTemplate()\"\n                                                    title=\"Change to a different template\">\n                                                <i class=\"fa-solid fa-exchange-alt\"></i> Change Template\n                                            </button>\n                                        }\n                                        @if (UserCanReadTemplates) {\n                                            <button kendoButton \n                                                    [fillMode]=\"'outline'\" \n                                                    [size]=\"'small'\"\n                                                    (click)=\"openTemplateInNewWindow()\"\n                                                    title=\"Open template in new window\">\n                                                <i class=\"fa-solid fa-external-link-alt\"></i> Open in New Window\n                                            </button>\n                                        }\n                                    </div>\n                                }\n                                \n                                <!-- Template Editor -->\n                                <div style=\"flex: 1; background: white; border-radius: 6px; border: 1px solid #e9ecef;\">\n                                    <mj-template-editor \n                                        #templateEditor\n                                        [template]=\"template\"\n                                        [config]=\"templateEditorConfig\"\n                                        (contentChange)=\"onTemplateContentChange($event)\"\n                                        (runTemplate)=\"onTemplateRun($event)\"\n                                        style=\"display: block; min-height: 300px;\">\n                                    </mj-template-editor>\n                                </div>\n                            </div>\n                        }\n                    </div>\n                </kendo-expansionpanel>                \n\n                <!-- Model Configuration Expansion Panel -->\n                @if (record.IsSaved) {\n                    <kendo-expansionpanel \n                        [expanded]=\"true\"\n                        style=\"margin-bottom: 12px;\">\n                        <ng-template kendoExpansionPanelTitleDirective>\n                            <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n                                <i class=\"fa-solid fa-microchip\" style=\"color: #6c757d;\"></i>\n                                Models\n                                @if (promptModels.length > 0) {\n                                    <span class=\"badge\" style=\"background: #17a2b8; color: white; padding: 2px 6px; border-radius: 10px; font-size: 0.7em;\">\n                                        {{ promptModels.length }}\n                                    </span>\n                                }\n                                <span style=\"color: #6c757d; font-size: 0.8em; font-weight: normal; margin-left: 8px;\">\n                                    <i class=\"fa-solid fa-info-circle\" title=\"Models are tried in order from top to bottom. The first available model will be used.\"></i>\n                                    Priority order (first available model will be used)\n                                </span>\n                            </span>\n                        </ng-template>\n                        \n                        <!-- Direct Content Projection -->\n                        <div style=\"padding: 16px 0;\">\n                            <!-- Model Management Interface -->\n                            <div class=\"model-management\" style=\"border: 1px solid #dee2e6; border-radius: 6px; background: #f8f9fa;\">\n                                @if (isLoadingModels) {\n                                    <div class=\"loading-state\" style=\"padding: 20px; text-align: center; color: #6c757d;\">\n                                        <i class=\"fa-solid fa-spinner fa-spin\"></i> Loading models...\n                                    </div>\n                                } @else {\n                                    @if (promptModels.length === 0) {\n                                        <div class=\"empty-state\" style=\"padding: 20px; text-align: center; color: #6c757d;\">\n                                            <i class=\"fa-solid fa-info-circle\"></i> No models configured\n                                            @if (EditMode && UserCanCreatePromptModels) {\n                                                <div style=\"margin-top: 10px;\">\n                                                    <button kendoButton fillMode=\"outline\" themeColor=\"primary\" size=\"small\"\n                                                                (click)=\"addNewModel()\">\n                                                        <i class=\"fa-solid fa-plus\"></i> Add Model\n                                                    </button>\n                                                </div>\n                                            }\n                                        </div>\n                                    } @else {\n                                        <!-- Priority explanation for multiple models -->\n                                        @if (promptModels.length > 1) {\n                                            <div style=\"padding: 12px 16px; background: #e3f2fd; border-bottom: 1px solid #bbdefb; color: #1565c0; font-size: 0.85em;\">\n                                                <i class=\"fa-solid fa-info-circle\" style=\"margin-right: 6px;\"></i>\n                                                Models are tried in priority order (highest priority first). The first available model that meets requirements will be used for execution.\n                                            </div>\n                                        }\n                                        <!-- Column Headers -->\n                                        <div class=\"model-header\" style=\"display: grid; grid-template-columns: 40px 2fr 1fr 1fr 1fr 60px; gap: 12px; padding: 12px 16px; background: #e9ecef; font-weight: 600; font-size: 0.85em; color: #495057; border-bottom: 1px solid #dee2e6;\">\n                                            <div title=\"Priority order - models are tried from top to bottom\">\n                                                <i class=\"fa-solid fa-sort\" style=\"color: #6c757d;\"></i>\n                                            </div>\n                                            <div>AI Model <span style=\"color: #dc3545;\">*</span></div>\n                                            <div>Vendor</div>\n                                            <div>Configuration</div>\n                                            <div>Created</div>\n                                            <div>Actions</div>\n                                        </div>\n                                        \n                                        @for (model of promptModels; track getModelTrackId(model) || $index; let i = $index) {\n                                            <div class=\"model-row\" \n                                                 [draggable]=\"EditMode\"\n                                                 (dragstart)=\"onDragStart($event, i)\"\n                                                 (dragover)=\"onDragOver($event)\"\n                                                 (drop)=\"onDrop($event, i)\"\n                                                 (dragend)=\"onDragEnd($event)\"\n                                                 [style.background]=\"!model.ModelID ? '#fff3cd' : (draggedIndex === i ? '#e3f2fd' : 'white')\"\n                                                 [style.border-left]=\"!model.ModelID ? '3px solid #ffc107' : 'none'\"\n                                                 [style.opacity]=\"draggedIndex === i ? '0.5' : '1'\"\n                                                 style=\"display: grid; grid-template-columns: 40px 2fr 1fr 1fr 1fr 60px; gap: 12px; padding: 12px 16px; border-bottom: 1px solid #e9ecef; align-items: start; transition: background 0.2s, opacity 0.2s;\">\n                                                \n                                                <!-- Drag Handle / Priority -->\n                                                <div class=\"drag-handle\" style=\"display: flex; flex-direction: column; align-items: center; justify-content: center; color: #6c757d;\">\n                                                    @if (EditMode) {\n                                                        <i class=\"fa-solid fa-grip-vertical\" title=\"Drag to reorder priority\" style=\"cursor: move;\"></i>\n                                                        <span style=\"font-size: 0.7em; margin-top: 2px;\">#{{ i + 1 }}</span>\n                                                    } @else {\n                                                        <span style=\"font-size: 0.9em; font-weight: 600;\" title=\"Priority {{ model.Priority }} - Higher priority numbers are tried first\">#{{ i + 1 }}</span>\n                                                    }\n                                                </div>\n                                                \n                                                <!-- Model Selection -->\n                                                <div class=\"model-select\">\n                                                    @if (EditMode) {\n                                                        <kendo-dropdownlist [(ngModel)]=\"model.ModelID\"\n                                                                           [name]=\"'modelId_' + getModelTrackId(model)\"\n                                                                           [data]=\"availableModels\"\n                                                                           textField=\"Name\"\n                                                                           valueField=\"ID\"\n                                                                           [valuePrimitive]=\"true\"\n                                                                           [filterable]=\"true\"\n                                                                           placeholder=\"Select a model...\"\n                                                                           (valueChange)=\"onModelChange($event, i)\"\n                                                                           style=\"width: 100%;\">\n                                                        </kendo-dropdownlist>\n                                                    } @else {\n                                                        <span style=\"font-weight: 500;\">{{ getModelDisplayName(model.ModelID) }}</span>\n                                                    }\n                                                </div>\n                                                \n                                                <!-- Vendor -->\n                                                <div class=\"model-vendor\">\n                                                    @if (EditMode) {\n                                                        @if (model.ModelID) {\n                                                            @if (shouldShowVendorDropdown(model.ModelID)) {\n                                                                <kendo-dropdownlist [(ngModel)]=\"model.VendorID\"\n                                                                                   [name]=\"'vendorId_' + getModelTrackId(model)\"\n                                                                                   [data]=\"getVendorsForModelSync(model.ModelID)\"\n                                                                                   textField=\"Name\"\n                                                                                   valueField=\"ID\"\n                                                                                   [valuePrimitive]=\"true\"\n                                                                                   [filterable]=\"true\"\n                                                                                   placeholder=\"Select vendor...\"\n                                                                                   style=\"width: 100%;\">\n                                                                    <ng-template kendoDropDownListItemTemplate let-dataItem>\n                                                                        <span [style.color]=\"getVendorStatusColor(model.ModelID, dataItem.ID)\">\n                                                                            {{ dataItem.Name }}\n                                                                            @if (getModelVendorStatus(model.ModelID, dataItem.ID) !== 'Active') {\n                                                                                <span style=\"font-size: 0.8em; margin-left: 4px;\">({{ getModelVendorStatus(model.ModelID, dataItem.ID) }})</span>\n                                                                            }\n                                                                        </span>\n                                                                    </ng-template>\n                                                                </kendo-dropdownlist>\n                                                            } @else {\n                                                                <!-- Single vendor - just show the name -->\n                                                                @if (getVendorsForModelSync(model.ModelID).length === 1) {\n                                                                    <span [style.color]=\"getVendorStatusColor(model.ModelID, getVendorsForModelSync(model.ModelID)[0].ID)\" style=\"font-size: 0.9em; font-weight: 500;\">\n                                                                        {{ getVendorsForModelSync(model.ModelID)[0].Name }}\n                                                                        @if (getModelVendorStatus(model.ModelID, getVendorsForModelSync(model.ModelID)[0].ID) !== 'Active') {\n                                                                            <span style=\"font-size: 0.8em; margin-left: 4px;\">({{ getModelVendorStatus(model.ModelID, getVendorsForModelSync(model.ModelID)[0].ID) }})</span>\n                                                                        }\n                                                                    </span>\n                                                                } @else {\n                                                                    <span style=\"color: #6c757d; font-style: italic; font-size: 0.9em;\">No vendors available</span>\n                                                                }\n                                                            }\n                                                        } @else {\n                                                            <span style=\"color: #6c757d; font-style: italic; font-size: 0.9em;\">Select model first</span>\n                                                        }\n                                                    } @else {\n                                                        @if (model.VendorID && model.ModelID) {\n                                                            <span [style.color]=\"getVendorStatusColor(model.ModelID, model.VendorID)\" style=\"font-size: 0.9em;\">\n                                                                {{ getVendorDisplayName(model.VendorID) }}\n                                                                @if (getModelVendorStatus(model.ModelID, model.VendorID) !== 'Active') {\n                                                                    <span style=\"font-size: 0.8em; margin-left: 4px;\">({{ getModelVendorStatus(model.ModelID, model.VendorID) }})</span>\n                                                                }\n                                                            </span>\n                                                        } @else {\n                                                            <span style=\"color: #6c757d; font-size: 0.9em;\">-</span>\n                                                        }\n                                                    }\n                                                </div>\n                                                \n                                                <!-- Configuration -->\n                                                <div class=\"model-configuration\">\n                                                    @if (EditMode) {\n                                                        @if (isLoadingConfigurations) {\n                                                            <div style=\"padding: 4px; color: #6c757d; font-style: italic; font-size: 0.85em;\">\n                                                                <i class=\"fa-solid fa-spinner fa-spin\"></i> Loading...\n                                                            </div>\n                                                        } @else {\n                                                            <kendo-dropdownlist [(ngModel)]=\"model.ConfigurationID\"\n                                                                               [name]=\"'configurationId_' + getModelTrackId(model)\"\n                                                                               [data]=\"availableConfigurations\"\n                                                                               textField=\"Name\"\n                                                                               valueField=\"ID\"\n                                                                               [valuePrimitive]=\"true\"\n                                                                               [filterable]=\"true\"\n                                                                               placeholder=\"Default\"\n                                                                               (valueChange)=\"onConfigurationChange($event, i)\"\n                                                                               style=\"width: 100%;\">\n                                                                <ng-template kendoDropDownListNoDataTemplate>\n                                                                    <div style=\"padding: 8px; text-align: center; color: #6c757d;\">\n                                                                        No configurations available\n                                                                    </div>\n                                                                </ng-template>\n                                                            </kendo-dropdownlist>\n                                                        }\n                                                    } @else {\n                                                        <span style=\"font-size: 0.9em;\">{{ getConfigurationDisplayName(model.ConfigurationID) }}</span>\n                                                    }\n                                                </div>\n                                                \n                                                <!-- Created Date -->\n                                                <div class=\"model-created\">\n                                                    @if (model.ID) {\n                                                        <span style=\"color: #6c757d; font-size: 0.8em;\">{{ model.__mj_CreatedAt | date:'short' }}</span>\n                                                    } @else {\n                                                        <span style=\"color: #28a745; font-size: 0.8em; font-style: italic;\">New</span>\n                                                    }\n                                                </div>\n                                                \n                                                <!-- Actions -->\n                                                <div class=\"model-actions\" style=\"display: flex; gap: 2px; flex-direction: column;\">\n                                                    @if (EditMode) {\n                                                        <div style=\"display: flex; gap: 2px; margin-bottom: 4px;\">\n                                                            @if (UserCanUpdatePromptModels) {\n                                                                <button kendoButton fillMode=\"flat\" size=\"small\"\n                                                                            (click)=\"moveModelUp(i)\"\n                                                                            [disabled]=\"i === 0\"\n                                                                            title=\"Move up\">\n                                                                    <i class=\"fa-solid fa-chevron-up\"></i>\n                                                                </button>\n                                                                <button kendoButton fillMode=\"flat\" size=\"small\"\n                                                                            (click)=\"moveModelDown(i)\"\n                                                                            [disabled]=\"i === promptModels.length - 1\"\n                                                                            title=\"Move down\">\n                                                                    <i class=\"fa-solid fa-chevron-down\"></i>\n                                                                </button>\n                                                            }\n                                                        </div>\n                                                        @if (UserCanDeletePromptModels) {\n                                                            <button kendoButton fillMode=\"flat\" themeColor=\"error\" size=\"small\"\n                                                                        (click)=\"removePromptModel(i)\"\n                                                                        title=\"Remove model\">\n                                                                <i class=\"fa-solid fa-times\"></i>\n                                                            </button>\n                                                        }\n                                                    }\n                                                </div>\n                                            </div>\n                                            \n                                            <!-- Second row with additional details -->\n                                            <div style=\"display: grid; grid-template-columns: 40px 1fr; gap: 12px; padding: 8px 16px; border-bottom: 1px solid #e9ecef; background: #f8f9fa; font-size: 0.85em; color: #6c757d;\">\n                                                <div></div>\n                                                <div>\n                                                    <!-- Basic model details -->\n                                                    <div style=\"display: flex; gap: 16px; flex-wrap: wrap; align-items: center; margin-bottom: 8px;\">\n                                                        @if (model.Status) {\n                                                            <span><strong>Status:</strong> {{ model.Status }}</span>\n                                                        }\n                                                    </div>\n                                                    \n                                                    <!-- Parallel execution fields when prompt is ModelSpecific -->\n                                                    @if (record.ParallelizationMode === 'ModelSpecific') {\n                                                        <div style=\"padding: 8px; background: #fff; border: 1px solid #dee2e6; border-radius: 4px; margin-top: 8px;\">\n                                                            <div style=\"margin-bottom: 6px; font-weight: 600; color: #495057; font-size: 0.9em;\">\n                                                                <i class=\"fa-solid fa-layer-group\"></i> Model-Specific Parallel Execution\n                                                            </div>\n                                                            \n                                                            @if (EditMode) {\n                                                                <div style=\"display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 12px; align-items: center;\">\n                                                                    <!-- Parallel Mode -->\n                                                                    <div>\n                                                                        <label style=\"display: block; margin-bottom: 2px; font-size: 0.8em; font-weight: 600; color: #495057;\">Parallel Mode</label>\n                                                                        <kendo-dropdownlist [(ngModel)]=\"model.ParallelizationMode\"\n                                                                                           [name]=\"'parallelMode_' + i\"\n                                                                                           [data]=\"[{text: 'None', value: 'None'}, {text: 'Static Count', value: 'StaticCount'}, {text: 'Config Param', value: 'ConfigParam'}]\"\n                                                                                           textField=\"text\"\n                                                                                           valueField=\"value\"\n                                                                                           [valuePrimitive]=\"true\"\n                                                                                           placeholder=\"Select mode...\"\n                                                                                           style=\"width: 100%; font-size: 0.85em;\">\n                                                                        </kendo-dropdownlist>\n                                                                    </div>\n                                                                    \n                                                                    <!-- Parallel Count (when StaticCount) -->\n                                                                    @if (model.ParallelizationMode === 'StaticCount') {\n                                                                        <div>\n                                                                            <label style=\"display: block; margin-bottom: 2px; font-size: 0.8em; font-weight: 600; color: #495057;\">Parallel Count</label>\n                                                                            <kendo-numerictextbox [(ngModel)]=\"model.ParallelCount\"\n                                                                                                 [name]=\"'parallelCount_' + i\"\n                                                                                                 [min]=\"1\"\n                                                                                                 [step]=\"1\"\n                                                                                                 [format]=\"'n0'\"\n                                                                                                 placeholder=\"Count...\"\n                                                                                                 style=\"width: 100%; font-size: 0.85em;\">\n                                                                            </kendo-numerictextbox>\n                                                                        </div>\n                                                                    }\n                                                                    \n                                                                    <!-- Config Param (when ConfigParam) -->\n                                                                    @if (model.ParallelizationMode === 'ConfigParam') {\n                                                                        <div>\n                                                                            <label style=\"display: block; margin-bottom: 2px; font-size: 0.8em; font-weight: 600; color: #495057;\">Config Parameter</label>\n                                                                            <kendo-textbox [(ngModel)]=\"model.ParallelConfigParam\"\n                                                                                          [name]=\"'parallelConfigParam_' + i\"\n                                                                                          placeholder=\"Parameter name...\"\n                                                                                          style=\"width: 100%; font-size: 0.85em;\">\n                                                                            </kendo-textbox>\n                                                                        </div>\n                                                                    }\n                                                                </div>\n                                                            } @else {\n                                                                <!-- Read-only display -->\n                                                                <div style=\"display: flex; gap: 16px; flex-wrap: wrap; align-items: center;\">\n                                                                    @if (model.ParallelizationMode) {\n                                                                        <span><strong>Parallel Mode:</strong> {{ model.ParallelizationMode }}</span>\n                                                                    }\n                                                                    @if (model.ParallelCount) {\n                                                                        <span><strong>Parallel Count:</strong> {{ model.ParallelCount }}</span>\n                                                                    }\n                                                                    @if (model.ParallelConfigParam) {\n                                                                        <span><strong>Config Param:</strong> {{ model.ParallelConfigParam }}</span>\n                                                                    }\n                                                                </div>\n                                                            }\n                                                        </div>\n                                                    }\n                                                </div>\n                                            </div>\n                                        }\n                                        \n                                        @if (EditMode && UserCanCreatePromptModels) {\n                                            <div class=\"add-model-row\" style=\"padding: 12px 16px; text-align: center; background: #f8f9fa; border-top: 1px solid #dee2e6;\">\n                                                <button kendoButton fillMode=\"outline\" themeColor=\"success\" size=\"small\"\n                                                            (click)=\"addNewModel()\">\n                                                    <i class=\"fa-solid fa-plus\"></i> Add Model\n                                                </button>\n                                            </div>\n                                        }\n                                    }\n                                }\n                            </div>\n                        </div>\n                    </kendo-expansionpanel>\n                }\n\n                <!-- Advanced Configuration Expansion Panel -->\n                <kendo-expansionpanel \n                    [expanded]=\"false\"\n                    style=\"margin-bottom: 12px;\">\n                    <ng-template kendoExpansionPanelTitleDirective>\n                        <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n                            <i class=\"fa-solid fa-cogs\" style=\"color: #6c757d;\"></i>\n                            Advanced Configuration\n                        </span>\n                    </ng-template>\n                    \n                    <!-- Direct Content Projection -->\n                    <div style=\"padding: 16px 0;\">\n                        <div style=\"display: grid; grid-template-columns: 1fr 1fr; gap: 20px;\">\n                            \n                            <!-- Left Column -->\n                            <div>\n                                <mj-form-field \n                                    [record]=\"record\"\n                                    [ShowLabel]=\"true\"\n                                    FieldName=\"ParallelizationMode\"\n                                    Type=\"dropdownlist\"\n                                    [EditMode]=\"EditMode\">\n                                </mj-form-field>\n                                \n                                @if (showParallelCount) {\n                                    <mj-form-field \n                                        [record]=\"record\"\n                                        [ShowLabel]=\"true\"\n                                        FieldName=\"ParallelCount\"\n                                        Type=\"numerictextbox\"\n                                        [EditMode]=\"EditMode\">\n                                    </mj-form-field>\n                                }\n                                \n                                @if (showParallelConfigParam) {\n                                    <mj-form-field \n                                        [record]=\"record\"\n                                        [ShowLabel]=\"true\"\n                                        FieldName=\"ParallelConfigParam\"\n                                        Type=\"textbox\"\n                                        [EditMode]=\"EditMode\">\n                                    </mj-form-field>\n                                }\n                                \n                                <mj-form-field \n                                    [record]=\"record\"\n                                    [ShowLabel]=\"true\"\n                                    FieldName=\"OutputType\"\n                                    Type=\"dropdownlist\"\n                                    [EditMode]=\"EditMode\">\n                                </mj-form-field>\n                                \n                            </div>\n                            \n                            <!-- Right Column -->\n                            <div>\n                                <mj-form-field \n                                    [record]=\"record\"\n                                    [ShowLabel]=\"true\"\n                                    FieldName=\"ValidationBehavior\"\n                                    Type=\"dropdownlist\"\n                                    [EditMode]=\"EditMode\">\n                                </mj-form-field>\n                                \n                                <mj-form-field \n                                    [record]=\"record\"\n                                    [ShowLabel]=\"true\"\n                                    FieldName=\"EnableCaching\"\n                                    Type=\"checkbox\"\n                                    [EditMode]=\"EditMode\">\n                                </mj-form-field>\n                                \n                                <!-- Result Selector Prompt with Tree Selector -->\n                                <div style=\"margin-bottom: 16px;\">\n                                    <label style=\"display: block; margin-bottom: 4px; font-weight: 600; color: #495057; font-size: 0.9em;\">\n                                        Result Selector Prompt\n                                    </label>\n                                    @if (EditMode) {\n                                        @if (isLoadingResultSelectorData) {\n                                            <div style=\"padding: 8px; color: #6c757d; font-style: italic;\">\n                                                <i class=\"fa-solid fa-spinner fa-spin\"></i> Loading prompts...\n                                            </div>\n                                        } @else {\n                                            <kendo-dropdowntree \n                                                [(ngModel)]=\"record.ResultSelectorPromptID\"\n                                                name=\"resultSelectorPromptID\"\n                                                [data]=\"resultSelectorTreeData\"\n                                                textField=\"text\"\n                                                valueField=\"value\"\n                                                [valuePrimitive]=\"true\"\n                                                [filterable]=\"true\"\n                                                placeholder=\"Select a result selector prompt...\"\n                                                style=\"width: 100%;\"\n                                                (valueChange)=\"onResultSelectorChange($event)\">\n                                            </kendo-dropdowntree>\n                                        }\n                                    } @else {\n                                        <span style=\"color: #495057;\">{{ getPromptDisplayName(record.ResultSelectorPromptID || '') || 'None selected' }}</span>\n                                    }\n                                </div>\n                            </div>\n                        </div>\n                    </div>\n                </kendo-expansionpanel>\n\n                <!-- Template Parameters Expansion Panel -->\n                @if (template && templateParams.length > 0) {\n                    <kendo-expansionpanel \n                        [expanded]=\"false\"\n                        style=\"margin-bottom: 12px;\">\n                        <ng-template kendoExpansionPanelTitleDirective>\n                            <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n                                <i class=\"fa-solid fa-sliders\" style=\"color: #6c757d;\"></i>\n                                Template Parameters\n                                <span class=\"badge\" style=\"background: #6f42c1; color: white; padding: 2px 6px; border-radius: 10px; font-size: 0.7em;\">\n                                    {{ templateParams.length }}\n                                </span>\n                                <span style=\"color: #6c757d; font-size: 0.8em; font-weight: normal; margin-left: 8px;\">\n                                    <i class=\"fa-solid fa-info-circle\" title=\"These parameters are defined in the template and will be available when executing this prompt\"></i>\n                                    Parameters defined in the template\n                                </span>\n                            </span>\n                        </ng-template>\n                        \n                        <!-- Template Parameters Display -->\n                        <div style=\"padding: 16px 0;\">\n                            @if (isLoadingTemplateParams) {\n                                <div class=\"loading-state\" style=\"padding: 20px; text-align: center; color: #6c757d;\">\n                                    <i class=\"fa-solid fa-spinner fa-spin\"></i> Loading template parameters...\n                                </div>\n                            } @else if (templateParams.length === 0) {\n                                <div class=\"empty-state\" style=\"padding: 20px; text-align: center; color: #6c757d;\">\n                                    <i class=\"fa-solid fa-info-circle\"></i> This template has no parameters defined\n                                </div>\n                            } @else {\n                                <!-- Parameters Grid -->\n                                <div style=\"display: grid; gap: 12px;\">\n                                    @for (param of templateParams; track param.ID) {\n                                        <div class=\"parameter-card\" \n                                             style=\"border: 1px solid #e9ecef; border-radius: 8px; padding: 16px; background: #f8f9fa; transition: all 0.2s;\"\n                                             [style.border-left]=\"'4px solid ' + getParamTypeColor(param.Type)\">\n                                            \n                                            <!-- Parameter Header -->\n                                            <div style=\"display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 8px;\">\n                                                <div style=\"display: flex; align-items: center; gap: 8px;\">\n                                                    <i [class]=\"'fa-solid ' + getParamTypeIcon(param.Type)\" \n                                                       [style.color]=\"getParamTypeColor(param.Type)\"\n                                                       style=\"font-size: 1.2em;\"></i>\n                                                    <h6 style=\"margin: 0; color: #495057; font-weight: 600;\">\n                                                        {{ param.Name }}\n                                                        @if (param.IsRequired) {\n                                                            <span style=\"color: #dc3545; font-size: 0.9em; margin-left: 4px;\">*</span>\n                                                        }\n                                                    </h6>\n                                                </div>\n                                                <div style=\"display: flex; align-items: center; gap: 8px;\">\n                                                    <span class=\"type-badge\" \n                                                          [style.background-color]=\"getParamTypeColor(param.Type)\"\n                                                          style=\"color: white; padding: 4px 8px; border-radius: 12px; font-size: 0.75em; font-weight: 500;\">\n                                                        {{ param.Type }}\n                                                    </span>\n                                                    @if (param.IsRequired) {\n                                                        <span style=\"color: #dc3545; font-size: 0.85em; font-weight: 500;\">Required</span>\n                                                    } @else {\n                                                        <span style=\"color: #6c757d; font-size: 0.85em;\">Optional</span>\n                                                    }\n                                                </div>\n                                            </div>\n                                            \n                                            <!-- Parameter Description -->\n                                            @if (param.Description) {\n                                                <p style=\"margin: 0 0 8px 0; color: #6c757d; font-size: 0.9em; line-height: 1.4;\">\n                                                    {{ param.Description }}\n                                                </p>\n                                            }\n                                            \n                                            <!-- Type-specific Information -->\n                                            <div style=\"font-size: 0.85em; color: #495057;\">\n                                                <span style=\"display: flex; align-items: center; gap: 4px; margin-bottom: 4px;\">\n                                                    <i class=\"fa-solid fa-info-circle\" style=\"color: #6c757d;\"></i>\n                                                    {{ getParamTypeDescription(param) }}\n                                                </span>\n                                            </div>\n                                            \n                                            <!-- Additional Parameter Details -->\n                                            <div style=\"display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; margin-top: 12px;\">\n                                                @if (param.DefaultValue) {\n                                                    <div style=\"background: white; padding: 8px 12px; border-radius: 4px; border: 1px solid #dee2e6;\">\n                                                        <label style=\"display: block; font-size: 0.8em; color: #6c757d; margin-bottom: 2px;\">Default Value</label>\n                                                        <code style=\"font-size: 0.85em; color: #495057; word-break: break-all;\">{{ param.DefaultValue }}</code>\n                                                    </div>\n                                                }\n                                                \n                                                @if (param.EntityID) {\n                                                    <div style=\"background: white; padding: 8px 12px; border-radius: 4px; border: 1px solid #dee2e6;\">\n                                                        <label style=\"display: block; font-size: 0.8em; color: #6c757d; margin-bottom: 2px;\">Entity</label>\n                                                        <span style=\"font-size: 0.85em; color: #495057;\">{{ param.Entity || 'Entity ID: ' + param.EntityID }}</span>\n                                                    </div>\n                                                }\n                                                \n                                                @if (param.LinkedParameterName) {\n                                                    <div style=\"background: white; padding: 8px 12px; border-radius: 4px; border: 1px solid #dee2e6;\">\n                                                        <label style=\"display: block; font-size: 0.8em; color: #6c757d; margin-bottom: 2px;\">Linked To</label>\n                                                        <span style=\"font-size: 0.85em; color: #495057;\">\n                                                            {{ param.LinkedParameterName }}\n                                                            @if (param.LinkedParameterField) {\n                                                                ({{ param.LinkedParameterField }})\n                                                            }\n                                                        </span>\n                                                    </div>\n                                                }\n                                                \n                                                @if (param.ExtraFilter) {\n                                                    <div style=\"background: white; padding: 8px 12px; border-radius: 4px; border: 1px solid #dee2e6;\">\n                                                        <label style=\"display: block; font-size: 0.8em; color: #6c757d; margin-bottom: 2px;\">Filter</label>\n                                                        <code style=\"font-size: 0.8em; color: #495057; word-break: break-all;\">{{ param.ExtraFilter }}</code>\n                                                    </div>\n                                                }\n                                                \n                                                @if (param.RecordID) {\n                                                    <div style=\"background: white; padding: 8px 12px; border-radius: 4px; border: 1px solid #dee2e6;\">\n                                                        <label style=\"display: block; font-size: 0.8em; color: #6c757d; margin-bottom: 2px;\">Record ID</label>\n                                                        <code style=\"font-size: 0.85em; color: #495057;\">{{ param.RecordID }}</code>\n                                                    </div>\n                                                }\n                                            </div>\n                                        </div>\n                                    }\n                                </div>\n                                \n                                <!-- Help Text -->\n                                <div style=\"margin-top: 16px; padding: 12px; background: #e3f2fd; border-radius: 6px; border: 1px solid #bbdefb;\">\n                                    <div style=\"display: flex; align-items: flex-start; gap: 8px;\">\n                                        <i class=\"fa-solid fa-lightbulb\" style=\"color: #1976d2; margin-top: 2px;\"></i>\n                                        <div style=\"flex: 1; font-size: 0.85em; color: #1565c0; line-height: 1.5;\">\n                                            <strong>Using Template Parameters:</strong> When executing this prompt, you'll be prompted to provide values for all required parameters. \n                                            Parameters can be simple values (text, numbers) or complex data structures (JSON objects, database records, or entire entity collections).\n                                            The template will use these parameters to generate dynamic content based on the values provided at execution time.\n                                        </div>\n                                    </div>\n                                </div>\n                            }\n                        </div>\n                    </kendo-expansionpanel>\n                }\n\n                <!-- Output Example Expansion Panel (when OutputType = object) -->\n                @if (showOutputExample) {\n                    <kendo-expansionpanel \n                        [expanded]=\"true\"\n                        style=\"margin-bottom: 12px;\">\n                        <ng-template kendoExpansionPanelTitleDirective>\n                            <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n                                <i class=\"fa-solid fa-code\" style=\"color: #6c757d;\"></i>\n                                Output Example (JSON)\n                                <span style=\"color: #dc3545; font-size: 0.8em; font-weight: normal;\">\u2022 Required for object output type</span>\n                            </span>\n                        </ng-template>\n                        \n                        <!-- Direct Content Projection -->\n                        <div style=\"padding: 16px;\">\n                            @if (EditMode) {\n                                <mj-code-editor \n                                    [(ngModel)]=\"record.OutputExample\"\n                                    name=\"outputExample\"\n                                    language=\"json\"\n                                    placeholder=\"Enter JSON example structure...\"\n                                    style=\"width: 100%; height: 200px; border: 1px solid #dee2e6; border-radius: 4px;\">\n                                </mj-code-editor>\n                                <div style=\"margin-top: 8px; color: #6c757d; font-size: 0.85em;\">\n                                    <i class=\"fa-solid fa-info-circle\"></i> Provide a JSON example that defines the expected structure for object output validation.\n                                </div>\n                            } @else if (record.OutputExample) {\n                                <div style=\"background: #f8f9fa; border: 1px solid #dee2e6; border-radius: 4px; padding: 12px; font-family: 'Courier New', monospace; font-size: 0.9em; white-space: pre-wrap; overflow: auto; max-height: 250px;\">{{ record.OutputExample }}</div>\n                            } @else {\n                                <div style=\"background: #fff3cd; border: 1px solid #ffeaa7; border-radius: 4px; padding: 12px; color: #856404; text-align: center;\">\n                                    <i class=\"fa-solid fa-exclamation-triangle\"></i> Output example is required when output type is 'object'\n                                </div>\n                            }\n                        </div>\n                    </kendo-expansionpanel>\n                }\n\n                <!-- Execution History Expansion Panel -->\n                @if (record.IsSaved) {\n                    <kendo-expansionpanel \n                        [expanded]=\"false\"\n                        style=\"margin-bottom: 12px;\">\n                        <ng-template kendoExpansionPanelTitleDirective>\n                            <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n                                <i class=\"fa-solid fa-history\" style=\"color: #6c757d;\"></i>\n                                Execution History\n                                @if (executionHistory.length > 0) {\n                                    <span style=\"color: #6c757d; font-weight: normal;\">({{ executionHistory.length }})</span>\n                                }\n                            </span>\n                        </ng-template>\n                        \n                        <!-- Custom Execution History Viewer -->\n                        <div style=\"padding: 16px;\">\n                            @if (isLoadingHistory) {\n                                <div style=\"text-align: center; padding: 40px; color: #6c757d;\">\n                                    <i class=\"fa-solid fa-spinner fa-spin\" style=\"font-size: 2em; margin-bottom: 12px;\"></i>\n                                    <p>Loading execution history...</p>\n                                </div>\n                            } @else if (executionHistory.length === 0) {\n                                <div style=\"text-align: center; padding: 40px; color: #6c757d;\">\n                                    <i class=\"fa-solid fa-history\" style=\"font-size: 3em; margin-bottom: 12px; opacity: 0.3;\"></i>\n                                    <p>No execution history yet</p>\n                                    <p style=\"font-size: 0.9em;\">Run this prompt to see execution history here</p>\n                                </div>\n                            } @else {\n                                <!-- Sort Controls -->\n                                <div style=\"display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px;\">\n                                    <div style=\"color: #6c757d; font-size: 0.9em;\">\n                                        Showing {{ executionHistory.length }} executions\n                                    </div>\n                                    <div style=\"display: flex; gap: 8px; align-items: center;\">\n                                        <span style=\"color: #6c757d; font-size: 0.85em;\">Sort by:</span>\n                                        <kendo-buttongroup selection=\"single\">\n                                            <button kendoButton \n                                                    [selected]=\"historySortField === 'runAt'\"\n                                                    (click)=\"changeHistorySort('runAt')\"\n                                                    size=\"small\">\n                                                Date\n                                                @if (historySortField === 'runAt') {\n                                                    <i [class]=\"'fa-solid fa-sort-' + (historySortDirection === 'asc' ? 'up' : 'down')\" \n                                                       style=\"margin-left: 4px; font-size: 0.8em;\"></i>\n                                                }\n                                            </button>\n                                            <button kendoButton \n                                                    [selected]=\"historySortField === 'executionTime'\"\n                                                    (click)=\"changeHistorySort('executionTime')\"\n                                                    size=\"small\">\n                                                Duration\n                                                @if (historySortField === 'executionTime') {\n                                                    <i [class]=\"'fa-solid fa-sort-' + (historySortDirection === 'asc' ? 'up' : 'down')\" \n                                                       style=\"margin-left: 4px; font-size: 0.8em;\"></i>\n                                                }\n                                            </button>\n                                            <button kendoButton \n                                                    [selected]=\"historySortField === 'tokens'\"\n                                                    (click)=\"changeHistorySort('tokens')\"\n                                                    size=\"small\">\n                                                Tokens\n                                                @if (historySortField === 'tokens') {\n                                                    <i [class]=\"'fa-solid fa-sort-' + (historySortDirection === 'asc' ? 'up' : 'down')\" \n                                                       style=\"margin-left: 4px; font-size: 0.8em;\"></i>\n                                                }\n                                            </button>\n                                            <button kendoButton \n                                                    [selected]=\"historySortField === 'cost'\"\n                                                    (click)=\"changeHistorySort('cost')\"\n                                                    size=\"small\">\n                                                Cost\n                                                @if (historySortField === 'cost') {\n                                                    <i [class]=\"'fa-solid fa-sort-' + (historySortDirection === 'asc' ? 'up' : 'down')\" \n                                                       style=\"margin-left: 4px; font-size: 0.8em;\"></i>\n                                                }\n                                            </button>\n                                        </kendo-buttongroup>\n                                    </div>\n                                </div>\n                                \n                                <!-- Execution History Table -->\n                                <div style=\"border: 1px solid #e9ecef; border-radius: 8px; overflow: hidden;\">\n                                    <table style=\"width: 100%; border-collapse: collapse;\">\n                                        <thead>\n                                            <tr style=\"background: #f8f9fa; border-bottom: 2px solid #e9ecef;\">\n                                                <th style=\"padding: 12px; text-align: left; font-weight: 600; color: #495057;\">Status</th>\n                                                <th style=\"padding: 12px; text-align: left; font-weight: 600; color: #495057;\">Date & Time</th>\n                                                <th style=\"padding: 12px; text-align: left; font-weight: 600; color: #495057;\">Model</th>\n                                                <th style=\"padding: 12px; text-align: left; font-weight: 600; color: #495057;\">Duration</th>\n                                                <th style=\"padding: 12px; text-align: right; font-weight: 600; color: #495057;\">Tokens</th>\n                                                <th style=\"padding: 12px; text-align: right; font-weight: 600; color: #495057;\">Cost</th>\n                                                <th style=\"padding: 12px; text-align: center; font-weight: 600; color: #495057;\">Type</th>\n                                                <th style=\"padding: 12px; text-align: center; font-weight: 600; color: #495057;\">Actions</th>\n                                            </tr>\n                                        </thead>\n                                        <tbody>\n                                            @for (run of executionHistory; track run.ID; let i = $index) {\n                                                <tr class=\"history-row\"\n                                                    [class.even-row]=\"i % 2 === 0\"\n                                                    style=\"border-bottom: 1px solid #f1f3f5;\">\n                                                    <td style=\"padding: 12px;\">\n                                                        <span style=\"display: flex; align-items: center; gap: 6px;\">\n                                                            <i [class]=\"'fa-solid ' + getExecutionStatusIcon(run.Success)\" \n                                                               [style.color]=\"getExecutionStatusColor(run.Success)\"></i>\n                                                            <span [style.color]=\"getExecutionStatusColor(run.Success)\" style=\"font-weight: 500;\">\n                                                                {{ run.Success === true ? 'Success' : run.Success === false ? 'Failed' : 'Running' }}\n                                                            </span>\n                                                        </span>\n                                                    </td>\n                                                    <td style=\"padding: 12px; color: #495057;\">\n                                                        {{ run.RunAt | date:'short' }}\n                                                    </td>\n                                                    <td style=\"padding: 12px; color: #495057;\">\n                                                        <span style=\"display: flex; align-items: center; gap: 6px;\">\n                                                            <i class=\"fa-solid fa-microchip\" style=\"color: #6c757d;\"></i>\n                                                            {{ run.Model || 'Unknown' }}\n                                                        </span>\n                                                    </td>\n                                                    <td style=\"padding: 12px; color: #495057;\">\n                                                        {{ formatDuration(run.ExecutionTimeMS) }}\n                                                    </td>\n                                                    <td style=\"padding: 12px; text-align: right; color: #495057;\">\n                                                        {{ formatTokens(run.TokensUsed) }}\n                                                    </td>\n                                                    <td style=\"padding: 12px; text-align: right; color: #495057;\">\n                                                        {{ formatCost(run.TotalCost || run.Cost) }}\n                                                    </td>\n                                                    <td style=\"padding: 12px; text-align: center;\">\n                                                        @if (run.RunType) {\n                                                            <span style=\"padding: 4px 8px; border-radius: 12px; background: #e9ecef; \n                                                                       color: #495057; font-size: 0.85em; font-weight: 500;\">\n                                                                {{ run.RunType }}\n                                                            </span>\n                                                        }\n                                                    </td>\n                                                    <td style=\"padding: 12px; text-align: center;\">\n                                                        <button kendoButton \n                                                            fillMode=\"flat\"\n                                                            size=\"small\"\n                                                            (click)=\"navigateToPromptRun(run.ID)\"\n                                                            title=\"View details\">\n                                                            <i class=\"fa-solid fa-external-link\"></i>\n                                                        </button>\n                                                    </td>\n                                                </tr>\n                                            }\n                                        </tbody>\n                                    </table>\n                                </div>\n                            }\n                        </div>\n                    </kendo-expansionpanel>\n                }\n\n                <!-- Cache Expansion Panel -->\n                @if (record.IsSaved && record.EnableCaching) {\n                    <kendo-expansionpanel \n                        [expanded]=\"false\"\n                        style=\"margin-bottom: 12px;\">\n                        <ng-template kendoExpansionPanelTitleDirective>\n                            <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n                                <i class=\"fa-solid fa-database\" style=\"color: #6c757d;\"></i>\n                                Result Cache\n                            </span>\n                        </ng-template>\n                        \n                        <!-- Direct Content Projection -->\n                        <div style=\"padding: 16px 0;\">\n                            <mj-user-view-grid \n                                [Params]=\"BuildRelationshipViewParamsByEntityName('AI Result Cache','AIPromptID')\"  \n                                [NewRecordValues]=\"NewRecordValues('AI Result Cache')\"\n                                [AllowLoad]=\"true\"\n                                [EditMode]=\"GridEditMode()\"  \n                                style=\"height: 300px;\">\n                            </mj-user-view-grid>\n                        </div>\n                    </kendo-expansionpanel>\n                }\n\n                <!-- Related Items Expansion Panel -->\n                @if (record.IsSaved) {\n                    <kendo-expansionpanel \n                        [expanded]=\"false\"\n                        style=\"margin-bottom: 12px;\">\n                        <ng-template kendoExpansionPanelTitleDirective>\n                            <span style=\"display: flex; align-items: center; gap: 8px; font-weight: 600;\">\n                                <i class=\"fa-solid fa-link\" style=\"color: #6c757d;\"></i>\n                                Related Items\n                            </span>\n                        </ng-template>\n                        \n                        <!-- Direct Content Projection -->\n                        <div style=\"padding: 16px 0;\">\n                            <div style=\"display: grid; grid-template-columns: 1fr 1fr; gap: 20px;\">\n                                <!-- AI Agents -->\n                                <div>\n                                    <h6 style=\"margin: 0 0 12px 0; color: #495057;\">AI Agents Using This Prompt</h6>\n                                    <mj-user-view-grid \n                                        [Params]=\"BuildRelationshipViewParamsByEntityName('MJ: AI Agent Prompts','PromptID')\"  \n                                        [NewRecordValues]=\"NewRecordValues('MJ: AI Agent Prompts')\"\n                                        [AllowLoad]=\"true\"\n                                        [EditMode]=\"GridEditMode()\"  \n                                        style=\"height: 200px;\">\n                                    </mj-user-view-grid>\n                                </div>\n                                \n                                <!-- Result Selector References -->\n                                <div>\n                                    <h6 style=\"margin: 0 0 12px 0; color: #495057;\">Prompts Using This as Result Selector</h6>\n                                    <mj-user-view-grid \n                                        [Params]=\"BuildRelationshipViewParamsByEntityName('AI Prompts','ResultSelectorPromptID')\"  \n                                        [NewRecordValues]=\"NewRecordValues('AI Prompts')\"\n                                        [AllowLoad]=\"true\"\n                                        [EditMode]=\"GridEditMode()\"  \n                                        style=\"height: 200px;\">\n                                    </mj-user-view-grid>\n                                </div>\n                            </div>\n                        </div>\n                    </kendo-expansionpanel>\n                }\n            </div>\n        </div>\n    </form>\n\n    \n    <!-- AI Prompt Test Harness -->\n    @if (showTestHarness) {\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)=\"onTestHarnessVisibilityChanged(false)\"\n            title=\"Run AI Prompt - {{ record.Name || 'Untitled' }}\">\n            <mj-ai-test-harness\n                [entity]=\"record\"\n                [mode]=\"'prompt'\"\n                [isVisible]=\"showTestHarness\"\n                (visibilityChange)=\"onTestHarnessVisibilityChanged($event)\">\n            </mj-ai-test-harness>\n        </kendo-window>\n    }\n</div>", styles: [".record-form-container {\n    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n    padding: 10px;\n}\n\n.custom-toolbar-actions {\n    margin-left: auto;\n}\n\n.status-badge {\n    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n    font-weight: 500;\n    letter-spacing: 0.02em;\n}\n\n.config-summary {\n    position: sticky;\n    top: 0;\n    max-height: 600px;\n    overflow-y: auto;\n}\n\n.config-item {\n    padding: 8px 0;\n    border-bottom: 1px solid #e9ecef;\n}\n\n.config-item:last-child {\n    border-bottom: none;\n}\n\n.template-tab-content {\n    background: #fff;\n}\n\n.template-header h5 {\n    font-size: 1.1em;\n}\n\n.loading-state,\n.no-template-state,\n.invalid-template-state {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n}\n\n.no-template-state i,\n.invalid-template-state i {\n    opacity: 0.6;\n}\n\n.template-editor-container {\n    background: #fff;\n    border-radius: 6px;\n}\n\n/* Grid layout adjustments */\n@media (max-width: 1200px) {\n    .record-form-container .mj-tab-body > div {\n        grid-template-columns: 1fr !important;\n        gap: 20px;\n    }\n    \n    .config-summary {\n        order: -1;\n        position: static;\n        max-height: none;\n    }\n}\n\n/* Responsive toolbar */\n@media (max-width: 768px) {\n    .custom-toolbar-actions {\n        flex-direction: column;\n        gap: 4px !important;\n    }\n    \n    .status-badge {\n        align-self: flex-start;\n    }\n}\n\n/* Ensure proper spacing in form sections */\n.record-form-container mj-form-section {\n    padding: 16px;\n}\n\n/* Smooth transitions for better UX */\n.status-badge,\n.config-item,\n.template-header {\n    transition: all 0.2s ease;\n}\n\n.config-item:hover {\n    background-color: rgba(0,0,0,0.02);\n    border-radius: 4px;\n    margin: 0 -8px;\n    padding: 8px;\n}\n\n/* Execution History Table Styles */\n.history-row {\n    transition: background 0.2s;\n}\n\n.history-row:not(.even-row) {\n    background: #f8f9fa;\n}\n\n.history-row.even-row {\n    background: white;\n}\n\n.history-row:hover {\n    background: #e9ecef !important;\n}\n\n/* Template Parameters Styles */\n.parameter-card {\n    position: relative;\n    overflow: hidden;\n}\n\n.parameter-card::before {\n    content: '';\n    position: absolute;\n    top: 0;\n    left: 0;\n    bottom: 0;\n    width: 4px;\n    background: inherit;\n    transition: width 0.2s;\n}\n\n.parameter-card:hover {\n    transform: translateY(-2px);\n    box-shadow: 0 4px 12px rgba(0,0,0,0.1);\n}\n\n.parameter-card:hover::before {\n    width: 6px;\n}\n\n.type-badge {\n    font-weight: 600;\n    text-transform: uppercase;\n    letter-spacing: 0.03em;\n    transition: transform 0.2s;\n}\n\n.parameter-card:hover .type-badge {\n    transform: scale(1.05);\n}\n\n/* Parameter type icons animation */\n.parameter-card i.fa-solid {\n    transition: transform 0.3s;\n}\n\n.parameter-card:hover i.fa-solid {\n    transform: rotate(360deg);\n}\n\n/* Grid responsive behavior */\n@media (max-width: 768px) {\n    .parameter-card {\n        margin-bottom: 8px;\n    }\n    \n    .parameter-card h6 {\n        font-size: 0.95em;\n    }\n    \n    .type-badge {\n        font-size: 0.7em !important;\n    }\n}"] }]
+    }], () => [{ type: i0.ElementRef }, { type: i1.SharedService }, { type: i2.Router }, { type: i2.ActivatedRoute }, { type: i0.ChangeDetectorRef }, { type: i3.AITestHarnessDialogService }, { type: i0.ViewContainerRef }, { type: i4.AIPromptManagementService }], { templateEditor: [{
             type: ViewChild,
             args: ['templateEditor']
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(AIPromptFormComponentExtended, { className: "AIPromptFormComponentExtended", filePath: "src/lib/custom/AIPrompts/ai-prompt-form.component.ts", lineNumber: 20 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(AIPromptFormComponentExtended, { className: "AIPromptFormComponentExtended", filePath: "src/lib/custom/AIPrompts/ai-prompt-form.component.ts", lineNumber: 21 }); })();
 export function LoadAIPromptFormComponentExtended() {
     // This function ensures the class isn't tree-shaken and registers it with MemberJunction
 }