@memberjunction/ng-explorer-settings 2.50.0 → 2.51.0

package/dist/lib/sql-logging/sql-logging.component.js

@@ -0,0 +1,946 @@
+import { Component } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+import { Subject, interval } from 'rxjs';
+import { takeUntil } from 'rxjs/operators';
+import { Metadata } from '@memberjunction/core';
+import { SharedService } from '@memberjunction/ng-shared';
+import { MJNotificationService } from '@memberjunction/ng-notifications';
+import { SharedSettingsModule } from '../shared/shared-settings.module';
+import { CodeEditorModule } from '@memberjunction/ng-code-editor';
+import * as i0 from "@angular/core";
+import * as i1 from "@memberjunction/ng-shared";
+import * as i2 from "@angular/forms";
+import * as i3 from "@memberjunction/ng-code-editor";
+const _forTrack0 = ($index, $item) => $item.id;
+const _forTrack1 = ($index, $item) => $item.value;
+function SqlLoggingComponent_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    const _r1 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 9);
+    i0.ɵɵlistener("click", function SqlLoggingComponent_Conditional_5_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.openStartSessionDialog()); });
+    i0.ɵɵelement(1, "i", 10);
+    i0.ɵɵtext(2, " Start New Session ");
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("disabled", ctx_r1.loading || ctx_r1.activeSessions.length >= ((ctx_r1.sqlLoggingConfig == null ? null : ctx_r1.sqlLoggingConfig.maxActiveSessions) || 5));
+} }
+function SqlLoggingComponent_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 5)(1, "div", 11)(2, "div", 12);
+    i0.ɵɵelement(3, "i", 13);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "div", 14)(5, "div", 15);
+    i0.ɵɵtext(6);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(7, "div", 16);
+    i0.ɵɵtext(8, "Status");
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(9, "div", 11)(10, "div", 17);
+    i0.ɵɵelement(11, "i", 18);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(12, "div", 14)(13, "div", 15);
+    i0.ɵɵtext(14);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(15, "div", 16);
+    i0.ɵɵtext(16, "Active Sessions");
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(17, "div", 11)(18, "div", 19);
+    i0.ɵɵelement(19, "i", 20);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(20, "div", 14)(21, "div", 15);
+    i0.ɵɵtext(22);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(23, "div", 16);
+    i0.ɵɵtext(24, "Max Sessions");
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(25, "div", 11)(26, "div", 21);
+    i0.ɵɵelement(27, "i", 22);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(28, "div", 14)(29, "div", 15);
+    i0.ɵɵtext(30);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(31, "div", 16);
+    i0.ɵɵtext(32, "Total Statements");
+    i0.ɵɵelementEnd()()()();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(6);
+    i0.ɵɵtextInterpolate(ctx_r1.configEnabled ? "Enabled" : "Disabled");
+    i0.ɵɵadvance(8);
+    i0.ɵɵtextInterpolate(ctx_r1.activeSessions.length);
+    i0.ɵɵadvance(8);
+    i0.ɵɵtextInterpolate((ctx_r1.sqlLoggingConfig == null ? null : ctx_r1.sqlLoggingConfig.maxActiveSessions) || 5);
+    i0.ɵɵadvance(8);
+    i0.ɵɵtextInterpolate(ctx_r1.getTotalStatementCount());
+} }
+function SqlLoggingComponent_Conditional_7_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 6)(1, "div", 23);
+    i0.ɵɵelement(2, "div", 24)(3, "div", 24)(4, "div", 24);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(5, "div", 25);
+    i0.ɵɵtext(6, "Loading SQL logging configuration...");
+    i0.ɵɵelementEnd()();
+} }
+function SqlLoggingComponent_Conditional_8_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    const _r3 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 26);
+    i0.ɵɵelement(1, "i", 28);
+    i0.ɵɵelementStart(2, "p", 29);
+    i0.ɵɵtext(3, "Access Denied");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "p", 30);
+    i0.ɵɵtext(5, "SQL logging requires Owner privileges. Please contact your system administrator for access.");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(6, "button", 31);
+    i0.ɵɵlistener("click", function SqlLoggingComponent_Conditional_8_Conditional_1_Template_button_click_6_listener() { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.refreshUserPermissions()); });
+    i0.ɵɵelement(7, "i", 32);
+    i0.ɵɵtext(8, " Refresh Permissions ");
+    i0.ɵɵelementEnd()();
+} }
+function SqlLoggingComponent_Conditional_8_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 26);
+    i0.ɵɵelement(1, "i", 33);
+    i0.ɵɵelementStart(2, "p", 29);
+    i0.ɵɵtext(3, "SQL Logging Disabled");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "p", 30);
+    i0.ɵɵtext(5, "SQL logging is not enabled in the server configuration.");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(6, "div", 34)(7, "h4");
+    i0.ɵɵtext(8, "To enable SQL logging:");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(9, "ol")(10, "li");
+    i0.ɵɵtext(11, "Set ");
+    i0.ɵɵelementStart(12, "code");
+    i0.ɵɵtext(13, "sqlLogging.enabled = true");
+    i0.ɵɵelementEnd();
+    i0.ɵɵtext(14, " in mj.config.cjs");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(15, "li");
+    i0.ɵɵtext(16, "Restart the MJ API server");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(17, "li");
+    i0.ɵɵtext(18, "Refresh this page");
+    i0.ɵɵelementEnd()()()();
+} }
+function SqlLoggingComponent_Conditional_8_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    const _r4 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 26);
+    i0.ɵɵelement(1, "i", 35);
+    i0.ɵɵelementStart(2, "p", 29);
+    i0.ɵɵtext(3, "No Active Sessions");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "p", 30);
+    i0.ɵɵtext(5, "Start a new SQL logging session to begin capturing SQL statements.");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(6, "button", 36);
+    i0.ɵɵlistener("click", function SqlLoggingComponent_Conditional_8_Conditional_3_Template_button_click_6_listener() { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.openStartSessionDialog()); });
+    i0.ɵɵelement(7, "i", 10);
+    i0.ɵɵtext(8, " Start New Session ");
+    i0.ɵɵelementEnd()();
+} }
+function SqlLoggingComponent_Conditional_8_Conditional_4_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    const _r5 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 44);
+    i0.ɵɵlistener("click", function SqlLoggingComponent_Conditional_8_Conditional_4_Conditional_5_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r5); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.stopAllSessions()); });
+    i0.ɵɵelement(1, "i", 45);
+    i0.ɵɵtext(2, " Stop All ");
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵproperty("disabled", ctx_r1.loading);
+} }
+function SqlLoggingComponent_Conditional_8_Conditional_4_For_8_Conditional_15_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 55);
+    i0.ɵɵelement(1, "i", 58);
+    i0.ɵɵtext(2, " User Filtered ");
+    i0.ɵɵelementEnd();
+} }
+function SqlLoggingComponent_Conditional_8_Conditional_4_For_8_Conditional_16_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 56);
+    i0.ɵɵelement(1, "i", 59);
+    i0.ɵɵtext(2, " Migration ");
+    i0.ɵɵelementEnd();
+} }
+function SqlLoggingComponent_Conditional_8_Conditional_4_For_8_Template(rf, ctx) { if (rf & 1) {
+    const _r6 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 46);
+    i0.ɵɵlistener("click", function SqlLoggingComponent_Conditional_8_Conditional_4_For_8_Template_div_click_0_listener() { const session_r7 = i0.ɵɵrestoreView(_r6).$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.selectSession(session_r7)); });
+    i0.ɵɵelementStart(1, "div", 47)(2, "div", 48)(3, "h4", 49);
+    i0.ɵɵtext(4);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(5, "div", 50)(6, "span", 51);
+    i0.ɵɵelement(7, "i", 52);
+    i0.ɵɵtext(8);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(9, "span", 51);
+    i0.ɵɵelement(10, "i", 22);
+    i0.ɵɵtext(11);
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(12, "button", 53);
+    i0.ɵɵlistener("click", function SqlLoggingComponent_Conditional_8_Conditional_4_For_8_Template_button_click_12_listener($event) { const session_r7 = i0.ɵɵrestoreView(_r6).$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.stopSession(session_r7, $event)); });
+    i0.ɵɵelement(13, "i", 45);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(14, "div", 54);
+    i0.ɵɵtemplate(15, SqlLoggingComponent_Conditional_8_Conditional_4_For_8_Conditional_15_Template, 3, 0, "span", 55)(16, SqlLoggingComponent_Conditional_8_Conditional_4_For_8_Conditional_16_Template, 3, 0, "span", 56);
+    i0.ɵɵelementStart(17, "span", 57);
+    i0.ɵɵtext(18);
+    i0.ɵɵelementEnd()()();
+} if (rf & 2) {
+    const session_r7 = ctx.$implicit;
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵclassProp("selected", (ctx_r1.selectedSession == null ? null : ctx_r1.selectedSession.id) === session_r7.id);
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate(session_r7.sessionName);
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate1(" ", ctx_r1.getSessionDuration(session_r7.startTime), " ");
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate1(" ", session_r7.statementCount, " statements ");
+    i0.ɵɵadvance(4);
+    i0.ɵɵconditional(session_r7.filterByUserId ? 15 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional((session_r7.options == null ? null : session_r7.options.formatAsMigration) ? 16 : -1);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate1(" ", (session_r7.options == null ? null : session_r7.options.statementTypes) || "both", " ");
+} }
+function SqlLoggingComponent_Conditional_8_Conditional_4_Conditional_10_Template(rf, ctx) { if (rf & 1) {
+    const _r8 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 38)(1, "h3", 39);
+    i0.ɵɵtext(2);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(3, "div", 60)(4, "label", 61)(5, "input", 62);
+    i0.ɵɵtwoWayListener("ngModelChange", function SqlLoggingComponent_Conditional_8_Conditional_4_Conditional_10_Template_input_ngModelChange_5_listener($event) { i0.ɵɵrestoreView(_r8); const ctx_r1 = i0.ɵɵnextContext(3); i0.ɵɵtwoWayBindingSet(ctx_r1.autoRefresh, $event) || (ctx_r1.autoRefresh = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵelementEnd();
+    i0.ɵɵtext(6, " Auto-refresh ");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(7, "button", 63);
+    i0.ɵɵlistener("click", function SqlLoggingComponent_Conditional_8_Conditional_4_Conditional_10_Template_button_click_7_listener() { i0.ɵɵrestoreView(_r8); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.loadSessionLog(ctx_r1.selectedSession)); });
+    i0.ɵɵelement(8, "i", 32);
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(9, "div", 64);
+    i0.ɵɵelement(10, "mj-code-editor", 65);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(ctx_r1.selectedSession.sessionName);
+    i0.ɵɵadvance(3);
+    i0.ɵɵtwoWayProperty("ngModel", ctx_r1.autoRefresh);
+    i0.ɵɵadvance(3);
+    i0.ɵɵclassProp("fa-spin", ctx_r1.loading);
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("value", ctx_r1.logContent)("readonly", true)("disabled", true)("language", "sql")("setup", "basic")("lineWrapping", true)("highlightWhitespace", false);
+} }
+function SqlLoggingComponent_Conditional_8_Conditional_4_Conditional_11_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 26);
+    i0.ɵɵelement(1, "i", 66);
+    i0.ɵɵelementStart(2, "p", 29);
+    i0.ɵɵtext(3, "Select a Session");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "p", 30);
+    i0.ɵɵtext(5, "Choose a session from the list to view its SQL log.");
+    i0.ɵɵelementEnd()();
+} }
+function SqlLoggingComponent_Conditional_8_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 27)(1, "div", 37)(2, "div", 38)(3, "h3", 39);
+    i0.ɵɵtext(4, "Active Sessions");
+    i0.ɵɵelementEnd();
+    i0.ɵɵtemplate(5, SqlLoggingComponent_Conditional_8_Conditional_4_Conditional_5_Template, 3, 1, "button", 40);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(6, "div", 41);
+    i0.ɵɵrepeaterCreate(7, SqlLoggingComponent_Conditional_8_Conditional_4_For_8_Template, 19, 8, "div", 42, _forTrack0);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(9, "div", 43);
+    i0.ɵɵtemplate(10, SqlLoggingComponent_Conditional_8_Conditional_4_Conditional_10_Template, 11, 11)(11, SqlLoggingComponent_Conditional_8_Conditional_4_Conditional_11_Template, 6, 0, "div", 26);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance(5);
+    i0.ɵɵconditional(ctx_r1.activeSessions.length > 0 ? 5 : -1);
+    i0.ɵɵadvance(2);
+    i0.ɵɵrepeater(ctx_r1.activeSessions);
+    i0.ɵɵadvance(3);
+    i0.ɵɵconditional(ctx_r1.selectedSession ? 10 : 11);
+} }
+function SqlLoggingComponent_Conditional_8_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 7);
+    i0.ɵɵtemplate(1, SqlLoggingComponent_Conditional_8_Conditional_1_Template, 9, 0, "div", 26)(2, SqlLoggingComponent_Conditional_8_Conditional_2_Template, 19, 0, "div", 26)(3, SqlLoggingComponent_Conditional_8_Conditional_3_Template, 9, 0, "div", 26)(4, SqlLoggingComponent_Conditional_8_Conditional_4_Template, 12, 2, "div", 27);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(!ctx_r1.isOwner ? 1 : !ctx_r1.configEnabled ? 2 : ctx_r1.activeSessions.length === 0 ? 3 : 4);
+} }
+function SqlLoggingComponent_Conditional_9_For_24_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "option", 80);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const option_r10 = ctx.$implicit;
+    i0.ɵɵproperty("value", option_r10.value);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(option_r10.text);
+} }
+function SqlLoggingComponent_Conditional_9_Template(rf, ctx) { if (rf & 1) {
+    const _r9 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 67);
+    i0.ɵɵlistener("click", function SqlLoggingComponent_Conditional_9_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.showStartSessionDialog = false); });
+    i0.ɵɵelementStart(1, "div", 68);
+    i0.ɵɵlistener("click", function SqlLoggingComponent_Conditional_9_Template_div_click_1_listener($event) { i0.ɵɵrestoreView(_r9); return i0.ɵɵresetView($event.stopPropagation()); });
+    i0.ɵɵelementStart(2, "div", 69)(3, "h3", 70);
+    i0.ɵɵelement(4, "i", 10);
+    i0.ɵɵtext(5, " Start SQL Logging Session ");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(6, "button", 71);
+    i0.ɵɵlistener("click", function SqlLoggingComponent_Conditional_9_Template_button_click_6_listener() { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.showStartSessionDialog = false); });
+    i0.ɵɵelement(7, "i", 72);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(8, "div", 73)(9, "div", 74)(10, "label", 75);
+    i0.ɵɵtext(11, "Session Name");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(12, "input", 76);
+    i0.ɵɵtwoWayListener("ngModelChange", function SqlLoggingComponent_Conditional_9_Template_input_ngModelChange_12_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.newSessionOptions.sessionName, $event) || (ctx_r1.newSessionOptions.sessionName = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(13, "div", 74)(14, "label", 75);
+    i0.ɵɵtext(15, "File Name");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(16, "input", 77);
+    i0.ɵɵtwoWayListener("ngModelChange", function SqlLoggingComponent_Conditional_9_Template_input_ngModelChange_16_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.newSessionOptions.fileName, $event) || (ctx_r1.newSessionOptions.fileName = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(17, "div", 78);
+    i0.ɵɵtext(18, "The SQL log will be saved to this file");
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(19, "div", 74)(20, "label", 75);
+    i0.ɵɵtext(21, "Statement Types");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(22, "select", 79);
+    i0.ɵɵtwoWayListener("ngModelChange", function SqlLoggingComponent_Conditional_9_Template_select_ngModelChange_22_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.newSessionOptions.statementTypes, $event) || (ctx_r1.newSessionOptions.statementTypes = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵrepeaterCreate(23, SqlLoggingComponent_Conditional_9_For_24_Template, 2, 2, "option", 80, _forTrack1);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(25, "div", 81)(26, "label", 61)(27, "input", 62);
+    i0.ɵɵtwoWayListener("ngModelChange", function SqlLoggingComponent_Conditional_9_Template_input_ngModelChange_27_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.newSessionOptions.filterToCurrentUser, $event) || (ctx_r1.newSessionOptions.filterToCurrentUser = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵelementEnd();
+    i0.ɵɵtext(28, " Filter to my SQL statements only ");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(29, "label", 61)(30, "input", 62);
+    i0.ɵɵtwoWayListener("ngModelChange", function SqlLoggingComponent_Conditional_9_Template_input_ngModelChange_30_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.newSessionOptions.formatAsMigration, $event) || (ctx_r1.newSessionOptions.formatAsMigration = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵelementEnd();
+    i0.ɵɵtext(31, " Format as migration file ");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(32, "label", 61)(33, "input", 62);
+    i0.ɵɵtwoWayListener("ngModelChange", function SqlLoggingComponent_Conditional_9_Template_input_ngModelChange_33_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.newSessionOptions.prettyPrint, $event) || (ctx_r1.newSessionOptions.prettyPrint = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵelementEnd();
+    i0.ɵɵtext(34, " Pretty print SQL statements ");
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(35, "div", 82)(36, "button", 83);
+    i0.ɵɵlistener("click", function SqlLoggingComponent_Conditional_9_Template_button_click_36_listener() { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.showStartSessionDialog = false); });
+    i0.ɵɵtext(37, " Cancel ");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(38, "button", 84);
+    i0.ɵɵlistener("click", function SqlLoggingComponent_Conditional_9_Template_button_click_38_listener() { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.startNewSession()); });
+    i0.ɵɵelement(39, "i", 10);
+    i0.ɵɵtext(40, " Start Session ");
+    i0.ɵɵelementEnd()()()();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(12);
+    i0.ɵɵtwoWayProperty("ngModel", ctx_r1.newSessionOptions.sessionName);
+    i0.ɵɵadvance(4);
+    i0.ɵɵtwoWayProperty("ngModel", ctx_r1.newSessionOptions.fileName);
+    i0.ɵɵadvance(6);
+    i0.ɵɵtwoWayProperty("ngModel", ctx_r1.newSessionOptions.statementTypes);
+    i0.ɵɵadvance();
+    i0.ɵɵrepeater(ctx_r1.statementTypeOptions);
+    i0.ɵɵadvance(4);
+    i0.ɵɵtwoWayProperty("ngModel", ctx_r1.newSessionOptions.filterToCurrentUser);
+    i0.ɵɵadvance(3);
+    i0.ɵɵtwoWayProperty("ngModel", ctx_r1.newSessionOptions.formatAsMigration);
+    i0.ɵɵadvance(3);
+    i0.ɵɵtwoWayProperty("ngModel", ctx_r1.newSessionOptions.prettyPrint);
+    i0.ɵɵadvance(5);
+    i0.ɵɵproperty("disabled", ctx_r1.loading);
+} }
+/**
+ * Angular component for managing SQL logging sessions in MemberJunction.
+ *
+ * This component provides a user interface for:
+ * - Viewing SQL logging configuration and status
+ * - Starting and stopping SQL logging sessions
+ * - Managing session options (filtering, formatting, etc.)
+ * - Real-time monitoring of active sessions
+ *
+ * **Security**: Only users with 'Owner' type can access SQL logging features.
+ *
+ * @example
+ * ```html
+ * <mj-sql-logging></mj-sql-logging>
+ * ```
+ *
+ * @requires Owner-level user privileges
+ * @requires SQL logging enabled in server configuration
+ */
+export class SqlLoggingComponent {
+    sharedService;
+    destroy$ = new Subject();
+    /** Whether the component is currently performing an async operation */
+    loading = false;
+    /** Current error message to display to the user, if any */
+    error = null;
+    /** Whether the current user has Owner privileges to access SQL logging */
+    isOwner = false;
+    /** Whether SQL logging is enabled in the server configuration */
+    configEnabled = false;
+    /** Current SQL logging configuration from the server */
+    sqlLoggingConfig = null;
+    /** List of currently active SQL logging sessions */
+    activeSessions = [];
+    /** Currently selected session for viewing logs */
+    selectedSession = null;
+    /** Content of the currently viewed log file */
+    logContent = '';
+    /** Whether to automatically refresh session data */
+    autoRefresh = false;
+    /** Interval in milliseconds for auto-refresh functionality */
+    refreshInterval = 5000; // 5 seconds
+    /** Whether the start session dialog is currently visible */
+    showStartSessionDialog = false;
+    /** Options for creating a new SQL logging session */
+    newSessionOptions = {
+        /** Custom filename for the log file */
+        fileName: '',
+        /** Whether to filter SQL statements to current user only */
+        filterToCurrentUser: true,
+        /** Whether to format output as migration file */
+        formatAsMigration: false,
+        /** Types of SQL statements to capture */
+        statementTypes: 'both',
+        /** Whether to format SQL with proper indentation */
+        prettyPrint: true,
+        /** Human-readable name for the session */
+        sessionName: ''
+    };
+    /** Available options for SQL statement type filtering */
+    statementTypeOptions = [
+        { text: 'Both Queries and Mutations', value: 'both' },
+        { text: 'Queries Only', value: 'queries' },
+        { text: 'Mutations Only', value: 'mutations' }
+    ];
+    constructor(sharedService) {
+        this.sharedService = sharedService;
+    }
+    /**
+     * Component initialization.
+     * Checks user permissions and loads initial data if authorized.
+     */
+    async ngOnInit() {
+        await this.checkUserPermissions();
+        if (this.isOwner) {
+            await this.loadSqlLoggingConfig();
+            await this.loadActiveSessions();
+            this.startAutoRefresh();
+        }
+    }
+    /**
+     * Component cleanup.
+     * Stops auto-refresh and cleans up subscriptions.
+     */
+    ngOnDestroy() {
+        this.destroy$.next();
+        this.destroy$.complete();
+    }
+    /**
+     * Starts the auto-refresh timer for session data.
+     * Only refreshes when autoRefresh is enabled and user is Owner.
+     *
+     * @private
+     */
+    startAutoRefresh() {
+        interval(this.refreshInterval)
+            .pipe(takeUntil(this.destroy$))
+            .subscribe(() => {
+            if (this.autoRefresh && this.isOwner) {
+                this.loadActiveSessions();
+                if (this.selectedSession) {
+                    this.loadSessionLog(this.selectedSession);
+                }
+            }
+        });
+    }
+    /**
+     * Checks if the current user has Owner privileges required for SQL logging.
+     * Updates the isOwner flag and handles error states.
+     *
+     * @private
+     */
+    async checkUserPermissions() {
+        try {
+            // Try multiple ways to get the current user
+            const md = new Metadata();
+            const currentUser = md.CurrentUser;
+            console.log('Method 1 - Metadata.CurrentUser:', {
+                email: currentUser?.Email,
+                type: currentUser?.Type,
+                name: currentUser?.Name,
+                id: currentUser?.ID
+            });
+            // Use the current user from Metadata
+            const userToCheck = currentUser;
+            if (userToCheck && userToCheck.Type?.trim().toLowerCase() === 'owner') {
+                this.isOwner = true;
+                console.log('User is an Owner - SQL logging features enabled');
+            }
+            else {
+                this.isOwner = false;
+                this.error = 'SQL logging requires Owner privileges';
+                console.log('User is NOT an Owner. Type:', userToCheck?.Type);
+                // Also check if it's a string comparison issue
+                if (userToCheck) {
+                    console.log('Type value (raw):', JSON.stringify(userToCheck.Type));
+                    console.log('Type trimmed:', JSON.stringify(userToCheck.Type?.trim()));
+                    console.log('Type comparison:', userToCheck.Type?.trim().toLowerCase(), '===', 'owner', ':', userToCheck.Type?.trim().toLowerCase() === 'owner');
+                }
+            }
+        }
+        catch (error) {
+            console.error('Error checking user permissions:', error);
+            this.isOwner = false;
+            this.error = 'Error checking permissions';
+        }
+    }
+    /**
+     * Opens the dialog for creating a new SQL logging session.
+     * Sets default values for session name and filename.
+     */
+    openStartSessionDialog() {
+        // Set default session name
+        const currentUser = new Metadata().CurrentUser;
+        this.newSessionOptions.sessionName = `SQL Logging - ${currentUser?.Name || currentUser?.Email || 'Unknown'} - ${new Date().toLocaleString()}`;
+        this.newSessionOptions.fileName = `sql-log-${new Date().toISOString().replace(/[:.]/g, '-')}.sql`;
+        this.showStartSessionDialog = true;
+    }
+    /**
+     * Creates and starts a new SQL logging session with the configured options.
+     * Shows success/error notifications and refreshes the sessions list.
+     */
+    async startNewSession() {
+        try {
+            this.loading = true;
+            const dataProvider = Metadata.Provider;
+            const mutation = `
+        mutation StartSqlLogging($input: StartSqlLoggingInput!) {
+          startSqlLogging(input: $input) {
+            id
+            filePath
+            startTime
+            statementCount
+            sessionName
+            filterByUserId
+            options {
+              formatAsMigration
+              statementTypes
+              prettyPrint
+            }
+          }
+        }
+      `;
+            const variables = {
+                input: {
+                    fileName: this.newSessionOptions.fileName,
+                    filterToCurrentUser: this.newSessionOptions.filterToCurrentUser,
+                    options: {
+                        formatAsMigration: this.newSessionOptions.formatAsMigration,
+                        statementTypes: this.newSessionOptions.statementTypes,
+                        prettyPrint: this.newSessionOptions.prettyPrint,
+                        sessionName: this.newSessionOptions.sessionName
+                    }
+                }
+            };
+            const result = await dataProvider.ExecuteGQL(mutation, variables);
+            if (result.errors) {
+                throw new Error(result.errors[0].message);
+            }
+            const newSession = result?.startSqlLogging;
+            if (!newSession) {
+                throw new Error('Failed to start SQL logging session - no session data returned');
+            }
+            MJNotificationService.Instance.CreateSimpleNotification(`SQL logging session started: ${newSession.sessionName}`, 'success', 5000);
+            this.showStartSessionDialog = false;
+            await this.loadActiveSessions();
+            this.selectSession(newSession);
+        }
+        catch (error) {
+            console.error('Error starting SQL logging session:', error);
+            MJNotificationService.Instance.CreateSimpleNotification(`Error: ${error.message || 'Failed to start SQL logging session'}`, 'error', 5000);
+        }
+        finally {
+            this.loading = false;
+        }
+    }
+    /**
+     * Stops a specific SQL logging session.
+     *
+     * @param session - The session object to stop
+     * @param event - Optional event to stop propagation
+     */
+    async stopSession(session, event) {
+        if (event) {
+            event.stopPropagation();
+        }
+        if (!confirm(`Stop SQL logging session "${session.sessionName}"?`)) {
+            return;
+        }
+        try {
+            this.loading = true;
+            const dataProvider = Metadata.Provider;
+            const mutation = `
+        mutation StopSqlLogging($sessionId: String!) {
+          stopSqlLogging(sessionId: $sessionId)
+        }
+      `;
+            const result = await dataProvider.ExecuteGQL(mutation, { sessionId: session.id });
+            if (result.errors) {
+                throw new Error(result.errors[0].message);
+            }
+            MJNotificationService.Instance.CreateSimpleNotification('SQL logging session stopped', 'success', 3000);
+            if (this.selectedSession?.id === session.id) {
+                this.selectedSession = null;
+                this.logContent = '';
+            }
+            await this.loadActiveSessions();
+        }
+        catch (error) {
+            console.error('Error stopping SQL logging session:', error);
+            MJNotificationService.Instance.CreateSimpleNotification(`Error: ${error.message || 'Failed to stop SQL logging session'}`, 'error', 5000);
+        }
+        finally {
+            this.loading = false;
+        }
+    }
+    /**
+     * Stops all currently active SQL logging sessions.
+     * Prompts for confirmation before proceeding.
+     */
+    async stopAllSessions() {
+        if (!confirm('Stop ALL active SQL logging sessions?')) {
+            return;
+        }
+        try {
+            this.loading = true;
+            const dataProvider = Metadata.Provider;
+            const mutation = `
+        mutation StopAllSqlLogging {
+          stopAllSqlLogging
+        }
+      `;
+            const result = await dataProvider.ExecuteGQL(mutation, {});
+            if (result.errors) {
+                throw new Error(result.errors[0].message);
+            }
+            MJNotificationService.Instance.CreateSimpleNotification('All SQL logging sessions stopped', 'success', 3000);
+            this.selectedSession = null;
+            this.logContent = '';
+            await this.loadActiveSessions();
+        }
+        catch (error) {
+            console.error('Error stopping all SQL logging sessions:', error);
+            MJNotificationService.Instance.CreateSimpleNotification(`Error: ${error.message || 'Failed to stop all SQL logging sessions'}`, 'error', 5000);
+        }
+        finally {
+            this.loading = false;
+        }
+    }
+    /**
+     * Selects a session for viewing and loads its log content.
+     *
+     * @param session - The session to select
+     */
+    selectSession(session) {
+        this.selectedSession = session;
+        this.loadSessionLog(session);
+    }
+    /**
+     * Loads the log file content for a specific session using real-time GraphQL query.
+     * Reads actual SQL statements from the log file on the server.
+     *
+     * @param session - The session whose log to load
+     */
+    async loadSessionLog(session) {
+        try {
+            const dataProvider = Metadata.Provider;
+            const query = `
+        query ReadSqlLogFile($sessionId: String!, $maxLines: Int) {
+          readSqlLogFile(sessionId: $sessionId, maxLines: $maxLines)
+        }
+      `;
+            const variables = {
+                sessionId: session.id,
+                maxLines: 1000 // Limit to last 1000 lines for performance
+            };
+            const result = await dataProvider.ExecuteGQL(query, variables);
+            if (result.errors) {
+                throw new Error(result.errors[0].message);
+            }
+            const logContent = result?.readSqlLogFile || '';
+            // Add session header information (show only filename for security)
+            const fileName = session.filePath ? session.filePath.split(/[\\\/]/).pop() : 'unknown';
+            const header = `-- =====================================================\n` +
+                `-- SQL Log File: ${fileName}\n` +
+                `-- Session: ${session.sessionName}\n` +
+                `-- Started: ${new Date(session.startTime).toLocaleString()}\n` +
+                `-- Statements Captured: ${session.statementCount}\n` +
+                `-- User Filter: ${session.filterByUserId || 'All Users'}\n` +
+                `-- Statement Types: ${session.options?.statementTypes || 'both'}\n` +
+                `-- Pretty Print: ${session.options?.prettyPrint ? 'Yes' : 'No'}\n` +
+                `-- Migration Format: ${session.options?.formatAsMigration ? 'Yes' : 'No'}\n` +
+                `-- =====================================================\n\n`;
+            this.logContent = header + (logContent || '-- No SQL statements captured yet --');
+        }
+        catch (error) {
+            console.error('Error loading session log:', error);
+            this.logContent = `-- Error loading log file --\n-- ${error.message || 'Unknown error occurred'} --\n\n` +
+                `-- Session Info --\n` +
+                `-- File: ${session.filePath}\n` +
+                `-- Session: ${session.sessionName}\n` +
+                `-- Started: ${new Date(session.startTime).toLocaleString()}\n`;
+        }
+    }
+    /**
+     * Loads the SQL logging configuration from the server.
+     * Updates component state with current settings and capabilities.
+     *
+     * @private
+     */
+    async loadSqlLoggingConfig() {
+        try {
+            const dataProvider = Metadata.Provider;
+            const query = `
+        query SqlLoggingConfig {
+          sqlLoggingConfig {
+            enabled
+            allowedLogDirectory
+            maxActiveSessions
+            autoCleanupEmptyFiles
+            sessionTimeout
+            activeSessionCount
+            defaultOptions {
+              formatAsMigration
+              statementTypes
+              batchSeparator
+              prettyPrint
+              logRecordChangeMetadata
+              retainEmptyLogFiles
+            }
+          }
+        }
+      `;
+            const result = await dataProvider.ExecuteGQL(query, {});
+            if (result.errors) {
+                throw new Error(result.errors[0].message);
+            }
+            // Debug logging to understand the response structure
+            console.log('SQL Logging Config Result:', result);
+            console.log('Result keys:', Object.keys(result || {}));
+            console.log('Direct result.sqlLoggingConfig:', result?.sqlLoggingConfig);
+            // Access the data directly from the result, matching AI prompt pattern
+            const configData = result?.sqlLoggingConfig;
+            console.log('Extracted config data:', configData);
+            this.sqlLoggingConfig = configData || null;
+            this.configEnabled = this.sqlLoggingConfig?.enabled || false;
+            console.log('Component state after update:');
+            console.log('  this.sqlLoggingConfig:', this.sqlLoggingConfig);
+            console.log('  this.configEnabled:', this.configEnabled);
+            console.log('  this.isOwner:', this.isOwner);
+        }
+        catch (error) {
+            console.error('Error loading SQL logging config:', error);
+            this.error = error.message || 'Failed to load SQL logging configuration';
+        }
+    }
+    /**
+     * Loads the list of currently active SQL logging sessions.
+     * Updates the activeSessions array and handles session selection state.
+     *
+     * @private
+     */
+    async loadActiveSessions() {
+        try {
+            const dataProvider = Metadata.Provider;
+            const query = `
+        query ActiveSqlLoggingSessions {
+          activeSqlLoggingSessions {
+            id
+            filePath
+            startTime
+            statementCount
+            sessionName
+            filterByUserId
+            options {
+              formatAsMigration
+              statementTypes
+              prettyPrint
+            }
+          }
+        }
+      `;
+            const result = await dataProvider.ExecuteGQL(query, {});
+            if (result.errors) {
+                throw new Error(result.errors[0].message);
+            }
+            // Debug logging to understand the response structure
+            console.log('Active Sessions Result:', result);
+            console.log('Result keys:', Object.keys(result || {}));
+            // Access the data directly from the result, matching AI prompt pattern
+            const sessionsData = result?.activeSqlLoggingSessions;
+            console.log('Extracted sessions data:', sessionsData);
+            this.activeSessions = sessionsData || [];
+            // Update selected session if it still exists
+            if (this.selectedSession) {
+                const stillExists = this.activeSessions.find(s => s.id === this.selectedSession.id);
+                if (stillExists) {
+                    this.selectedSession = stillExists;
+                }
+                else {
+                    this.selectedSession = null;
+                    this.logContent = '';
+                }
+            }
+        }
+        catch (error) {
+            console.error('Error loading active sessions:', error);
+        }
+    }
+    /**
+     * Calculates and formats the duration of a logging session.
+     *
+     * @param startTime - ISO string of when the session started
+     * @returns Formatted duration string (e.g., "2h 30m", "45m 23s", "12s")
+     */
+    getSessionDuration(startTime) {
+        const start = new Date(startTime);
+        const now = new Date();
+        const diff = now.getTime() - start.getTime();
+        const hours = Math.floor(diff / (1000 * 60 * 60));
+        const minutes = Math.floor((diff % (1000 * 60 * 60)) / (1000 * 60));
+        const seconds = Math.floor((diff % (1000 * 60)) / 1000);
+        if (hours > 0) {
+            return `${hours}h ${minutes}m`;
+        }
+        else if (minutes > 0) {
+            return `${minutes}m ${seconds}s`;
+        }
+        else {
+            return `${seconds}s`;
+        }
+    }
+    /**
+     * Refreshes user data and re-checks permissions.
+     * Useful when user privileges have been updated.
+     */
+    async refreshUserPermissions() {
+        console.log('Refreshing user permissions...');
+        this.loading = true;
+        try {
+            // Try to refresh SharedService data
+            await SharedService.RefreshData(false);
+            // Wait a moment for data to propagate
+            await new Promise(resolve => setTimeout(resolve, 1000));
+            // Re-check permissions
+            await this.checkUserPermissions();
+            console.log('Permissions refreshed');
+        }
+        catch (error) {
+            console.error('Error refreshing permissions:', error);
+        }
+        finally {
+            this.loading = false;
+        }
+    }
+    /**
+     * Extracts the filename from a full file path for security purposes.
+     * Only shows the filename, not the full server path.
+     *
+     * @param filePath - Full file path from server
+     * @returns Just the filename portion
+     */
+    getFileName(filePath) {
+        if (!filePath)
+            return 'unknown';
+        return filePath.split(/[\\\/]/).pop() || 'unknown';
+    }
+    /**
+     * Calculates the total number of SQL statements across all active sessions.
+     *
+     * @returns Total statement count
+     */
+    getTotalStatementCount() {
+        return this.activeSessions.reduce((sum, session) => sum + (session.statementCount || 0), 0);
+    }
+    /**
+     * Debug method to test contextUser flow for SQL filtering.
+     * This shows how the new architecture handles user context without storing email in provider.
+     */
+    async debugUserEmail() {
+        try {
+            this.loading = true;
+            const dataProvider = Metadata.Provider;
+            const query = `
+        query DebugCurrentUserEmail {
+          debugCurrentUserEmail
+        }
+      `;
+            const result = await dataProvider.ExecuteGQL(query, {});
+            if (result.errors) {
+                throw new Error(result.errors[0].message);
+            }
+            const debugInfo = result?.debugCurrentUserEmail || 'No debug info returned';
+            alert(`Context User Info:\n\n${debugInfo}\n\nThe system now passes user context through method calls instead of storing it in the provider.`);
+        }
+        catch (error) {
+            console.error('Error getting context user info:', error);
+            alert(`Error: ${error.message || 'Failed to get debug info'}`);
+        }
+        finally {
+            this.loading = false;
+        }
+    }
+    static ɵfac = function SqlLoggingComponent_Factory(t) { return new (t || SqlLoggingComponent)(i0.ɵɵdirectiveInject(i1.SharedService)); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SqlLoggingComponent, selectors: [["mj-sql-logging"]], standalone: true, features: [i0.ɵɵStandaloneFeature], decls: 10, vars: 8, consts: [[1, "sql-logging-container"], [1, "action-buttons"], [1, "btn-secondary", 3, "click", "disabled"], [1, "fa-solid", "fa-refresh"], ["title", "Start SQL logging session", 1, "btn-primary", 3, "disabled"], [1, "stats-grid", 2, "display", "flex"], [1, "loading-container"], [1, "content-area"], [1, "modal-backdrop"], ["title", "Start SQL logging session", 1, "btn-primary", 3, "click", "disabled"], [1, "fa-solid", "fa-play"], [1, "stat-card"], [1, "stat-icon", "stat-icon-status"], [1, "fa-solid", "fa-power-off"], [1, "stat-content"], [1, "stat-value"], [1, "stat-label"], [1, "stat-icon", "stat-icon-active"], [1, "fa-solid", "fa-play-circle"], [1, "stat-icon", "stat-icon-limit"], [1, "fa-solid", "fa-gauge-high"], [1, "stat-icon", "stat-icon-total"], [1, "fa-solid", "fa-database"], [1, "loading-spinner"], [1, "spinner-ring"], [1, "loading-text"], [1, "empty-state"], [1, "sessions-layout"], [1, "fa-solid", "fa-lock", "empty-icon"], [1, "empty-text"], [1, "empty-subtext"], [1, "btn-secondary", 2, "margin-top", "1rem", 3, "click"], [1, "fa-solid", "fa-sync"], [1, "fa-solid", "fa-exclamation-triangle", "empty-icon", "warning"], [1, "info-box"], [1, "fa-solid", "fa-file-code", "empty-icon"], [1, "btn-primary", 2, "margin-top", "1rem", 3, "click"], [1, "sessions-panel"], [1, "panel-header"], [1, "panel-title"], ["title", "Stop all sessions", 1, "btn-danger", "btn-small", 3, "disabled"], [1, "sessions-list"], [1, "session-card", 3, "selected"], [1, "log-viewer-panel"], ["title", "Stop all sessions", 1, "btn-danger", "btn-small", 3, "click", "disabled"], [1, "fa-solid", "fa-stop"], [1, "session-card", 3, "click"], [1, "session-header"], [1, "session-info"], [1, "session-title"], [1, "session-meta"], [1, "meta-item"], [1, "fa-solid", "fa-clock"], ["title", "Stop session", 1, "action-btn", "action-btn-danger", 3, "click"], [1, "session-badges"], [1, "badge", "badge-user"], [1, "badge", "badge-migration"], [1, "badge", "badge-type"], [1, "fa-solid", "fa-user"], [1, "fa-solid", "fa-code-branch"], [1, "panel-actions"], [1, "checkbox-label"], ["type", "checkbox", 3, "ngModelChange", "ngModel"], ["title", "Refresh log", 1, "action-btn", 3, "click"], [1, "log-content"], [2, "height", "100%", 3, "value", "readonly", "disabled", "language", "setup", "lineWrapping", "highlightWhitespace"], [1, "fa-solid", "fa-arrow-left", "empty-icon"], [1, "modal-backdrop", 3, "click"], [1, "modal-dialog", "modal-large", 3, "click"], [1, "modal-header"], [1, "modal-title"], [1, "modal-close", 3, "click"], [1, "fa-solid", "fa-times"], [1, "modal-body"], [1, "form-group"], [1, "form-label"], ["type", "text", "placeholder", "Enter a descriptive name for this session", 1, "form-input", 3, "ngModelChange", "ngModel"], ["type", "text", "placeholder", "sql-log-2024-01-01.sql", 1, "form-input", 3, "ngModelChange", "ngModel"], [1, "form-hint"], [1, "form-select", 3, "ngModelChange", "ngModel"], [3, "value"], [1, "form-checkboxes"], [1, "modal-footer"], [1, "btn-secondary", 3, "click"], [1, "btn-primary", 3, "click", "disabled"]], template: function SqlLoggingComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "div", 0)(1, "div", 1)(2, "button", 2);
+            i0.ɵɵlistener("click", function SqlLoggingComponent_Template_button_click_2_listener() { return ctx.loadActiveSessions(); });
+            i0.ɵɵelement(3, "i", 3);
+            i0.ɵɵtext(4, " Refresh ");
+            i0.ɵɵelementEnd();
+            i0.ɵɵtemplate(5, SqlLoggingComponent_Conditional_5_Template, 3, 1, "button", 4);
+            i0.ɵɵelementEnd();
+            i0.ɵɵtemplate(6, SqlLoggingComponent_Conditional_6_Template, 33, 4, "div", 5)(7, SqlLoggingComponent_Conditional_7_Template, 7, 0, "div", 6)(8, SqlLoggingComponent_Conditional_8_Template, 5, 1, "div", 7)(9, SqlLoggingComponent_Conditional_9_Template, 41, 7, "div", 8);
+            i0.ɵɵelementEnd();
+        } if (rf & 2) {
+            i0.ɵɵadvance(2);
+            i0.ɵɵproperty("disabled", ctx.loading);
+            i0.ɵɵadvance();
+            i0.ɵɵclassProp("fa-spin", ctx.loading);
+            i0.ɵɵadvance(2);
+            i0.ɵɵconditional(ctx.isOwner && ctx.configEnabled ? 5 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.isOwner && ctx.configEnabled ? 6 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.loading && !ctx.activeSessions.length ? 7 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(!ctx.loading || ctx.activeSessions.length > 0 ? 8 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.showStartSessionDialog ? 9 : -1);
+        } }, dependencies: [CommonModule,
+            FormsModule, i2.NgSelectOption, i2.ɵNgSelectMultipleOption, i2.DefaultValueAccessor, i2.CheckboxControlValueAccessor, i2.SelectControlValueAccessor, i2.NgControlStatus, i2.NgModel, SharedSettingsModule,
+            CodeEditorModule, i3.CodeEditorComponent], styles: ["@import '../shared/styles/variables';\n@import '../shared/styles/mixins';\n\n.sql-logging-container[_ngcontent-%COMP%] {\n  @include scrollable-container;\n  max-width: 1400px;\n  margin: 0 auto;\n  padding: 2rem;\n}\n\n//[_ngcontent-%COMP%]   Action[_ngcontent-%COMP%]   Buttons\n.action-buttons[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 0.75rem;\n  justify-content: flex-end;\n  margin-bottom: 1.5rem;\n\n  @media (max-width: 768px) {\n    justify-content: center;\n    flex-wrap: wrap;\n  }\n}\n\n//[_ngcontent-%COMP%]   Buttons\n.btn-primary[_ngcontent-%COMP%] {\n  @include button-base;\n  background-color: #2196f3;\n  color: white;\n  \n  &:hover {\n    background-color: #1976d2;\n    transform: translateY(-1px);\n    box-shadow: 0 4px 12px rgba(33, 150, 243, 0.3);\n  }\n}\n\n.btn-secondary[_ngcontent-%COMP%] {\n  @include button-base;\n  background-color: #ffffff;\n  color: #374151;\n  border: 1px solid #e5e7eb;\n  \n  &:hover {\n    background-color: #f9fafb;\n    border-color: #2196f3;\n    color: #2196f3;\n  }\n}\n\n.btn-danger[_ngcontent-%COMP%] {\n  @include button-base;\n  background-color: #f44336;\n  color: white;\n  \n  &:hover {\n    background-color: #d32f2f;\n  }\n  \n  &.btn-small {\n    padding: 0.375rem 0.75rem;\n    font-size: 0.875rem;\n  }\n}\n\n//[_ngcontent-%COMP%]   Stats[_ngcontent-%COMP%]   Grid\n.stats-grid[_ngcontent-%COMP%] {\n  display: grid !important;\n  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));\n  gap: 1.5rem;\n  margin-bottom: 2rem;\n  width: 100%;\n\n  @media (max-width: 768px) {\n    grid-template-columns: repeat(2, 1fr);\n    gap: 1rem;\n  }\n}\n\n.stat-card[_ngcontent-%COMP%] {\n  background: white;\n  border-radius: 12px;\n  padding: 1.5rem;\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);\n  display: flex;\n  margin-right: 10px;\n  align-items: center;\n  gap: 1rem;\n  transition: all 0.3s ease;\n  min-width: 0; // Prevent grid blowout\n\n  &:hover {\n    transform: translateY(-2px);\n    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);\n  }\n}\n\n.stat-icon[_ngcontent-%COMP%] {\n  width: 60px;\n  height: 60px;\n  border-radius: 12px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 1.5rem;\n\n  &-status {\n    background: rgba(76, 175, 80, 0.1);\n    color: #4caf50;\n  }\n\n  &-active {\n    background: rgba(33, 150, 243, 0.1);\n    color: #2196f3;\n  }\n\n  &-limit {\n    background: rgba(255, 152, 0, 0.1);\n    color: #ff9800;\n  }\n\n  &-total {\n    background: rgba(156, 39, 176, 0.1);\n    color: #9c27b0;\n  }\n}\n\n.stat-content[_ngcontent-%COMP%] {\n  flex: 1;\n\n  .stat-value {\n    font-size: 2rem;\n    font-weight: 700;\n    color: #1f2937;\n    line-height: 1;\n  }\n\n  .stat-label {\n    color: #6b7280;\n    font-size: 0.875rem;\n    margin-top: 0.25rem;\n  }\n}\n\n//[_ngcontent-%COMP%]   Content[_ngcontent-%COMP%]   Area\n.content-area[_ngcontent-%COMP%] {\n  @include scrollable-content;\n  background: white;\n  border-radius: 12px;\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);\n  padding: 1.5rem;\n  min-height: 400px;\n}\n\n//[_ngcontent-%COMP%]   Sessions[_ngcontent-%COMP%]   Layout\n.sessions-layout[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 1.5rem;\n  height: calc(100vh - 450px); // Dynamic height based on viewport\n  min-height: 400px;\n  max-height: 600px;\n\n  @media (max-width: 1024px) {\n    flex-direction: column;\n    height: auto;\n    max-height: none;\n  }\n}\n\n.sessions-panel[_ngcontent-%COMP%] {\n  flex: 0 0 400px;\n  display: flex;\n  flex-direction: column;\n  border: 1px solid #e5e7eb;\n  border-radius: 8px;\n  overflow: hidden;\n\n  @media (max-width: 1024px) {\n    flex: 1;\n    max-height: 400px;\n  }\n}\n\n.panel-header[_ngcontent-%COMP%] {\n  padding: 1rem;\n  background: #f9fafb;\n  border-bottom: 1px solid #e5e7eb;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n\n  .panel-title {\n    margin: 0;\n    font-size: 1.125rem;\n    font-weight: 600;\n    color: #1f2937;\n  }\n}\n\n.panel-actions[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 1rem;\n}\n\n.sessions-list[_ngcontent-%COMP%] {\n  @include scrollable-content;\n  padding: 0.75rem;\n}\n\n.session-card[_ngcontent-%COMP%] {\n  background: white;\n  border: 1px solid #e5e7eb;\n  border-radius: 8px;\n  padding: 1rem;\n  margin-bottom: 0.75rem;\n  cursor: pointer;\n  transition: all 0.2s;\n\n  &:hover {\n    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);\n  }\n\n  &.selected {\n    border-color: #2196f3;\n    box-shadow: 0 0 0 3px rgba(33, 150, 243, 0.1);\n  }\n}\n\n.session-header[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-start;\n  margin-bottom: 0.75rem;\n}\n\n.session-info[_ngcontent-%COMP%] {\n  flex: 1;\n  \n  .session-title {\n    margin: 0 0 0.5rem 0;\n    font-size: 0.95rem;\n    font-weight: 600;\n    color: #1f2937;\n  }\n}\n\n.session-meta[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 1rem;\n  font-size: 0.75rem;\n  color: #6b7280;\n\n  .meta-item {\n    display: flex;\n    align-items: center;\n    gap: 0.25rem;\n  }\n}\n\n.session-badges[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 0.5rem;\n  flex-wrap: wrap;\n}\n\n.badge[_ngcontent-%COMP%] {\n  padding: 0.25rem 0.5rem;\n  border-radius: 12px;\n  font-size: 0.625rem;\n  font-weight: 600;\n  display: flex;\n  align-items: center;\n  gap: 0.25rem;\n\n  &-user {\n    background: rgba(33, 150, 243, 0.1);\n    color: #2196f3;\n  }\n\n  &-migration {\n    background: rgba(156, 39, 176, 0.1);\n    color: #9c27b0;\n  }\n\n  &-type {\n    background: rgba(255, 152, 0, 0.1);\n    color: #ff9800;\n  }\n}\n\n.action-btn[_ngcontent-%COMP%] {\n  padding: 0.375rem;\n  border: none;\n  background: transparent;\n  color: #6b7280;\n  font-size: 0.875rem;\n  border-radius: 4px;\n  cursor: pointer;\n  transition: all 0.2s;\n\n  &:hover {\n    background: #f3f4f6;\n    color: #374151;\n  }\n\n  &-danger:hover {\n    color: #f44336;\n  }\n}\n\n//[_ngcontent-%COMP%]   Log[_ngcontent-%COMP%]   Viewer[_ngcontent-%COMP%]   Panel\n.log-viewer-panel[_ngcontent-%COMP%] {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  border: 1px solid #e5e7eb;\n  border-radius: 8px;\n  overflow: hidden;\n}\n\n.log-content[_ngcontent-%COMP%] {\n  @include scrollable-content;\n  background: #1e1e1e;\n  color: #d4d4d4;\n  padding: 0; // Remove padding for code editor\n  min-height: 300px;\n  height: 100%;\n  position: relative;\n  \n  // Code editor styles\n  ::ng-deep {\n    .cm-editor {\n      height: 100%;\n      font-family: 'Consolas', 'Monaco', 'Courier New', monospace;\n      font-size: 0.875rem;\n    }\n    \n    .cm-scroller {\n      font-family: inherit;\n    }\n    \n    // Dark theme adjustments to match previous style\n    .cm-content {\n      background: #1e1e1e;\n      color: #d4d4d4;\n    }\n    \n    .cm-gutters {\n      background: #252526;\n      color: #858585;\n      border-right: 1px solid #464647;\n    }\n    \n    .cm-activeLineGutter {\n      background: #2a2a2a;\n    }\n    \n    .cm-activeLine {\n      background: rgba(255, 255, 255, 0.04);\n    }\n  }\n}\n\n\n//[_ngcontent-%COMP%]   Empty[_ngcontent-%COMP%]   State\n.empty-state[_ngcontent-%COMP%] {\n  text-align: center;\n  padding: 4rem 2rem;\n\n  .empty-icon {\n    font-size: 4rem;\n    color: #e5e7eb;\n    margin-bottom: 1rem;\n\n    &.warning {\n      color: #ffc107;\n    }\n  }\n\n  .empty-text {\n    font-size: 1.25rem;\n    font-weight: 600;\n    color: #374151;\n    margin: 0 0 0.5rem 0;\n  }\n\n  .empty-subtext {\n    color: #6b7280;\n    margin: 0;\n  }\n}\n\n.info-box[_ngcontent-%COMP%] {\n  background: #f3f4f6;\n  border-radius: 8px;\n  padding: 1.5rem;\n  margin-top: 2rem;\n  text-align: left;\n  max-width: 500px;\n  margin-left: auto;\n  margin-right: auto;\n\n  h4 {\n    margin: 0 0 1rem 0;\n    color: #1f2937;\n  }\n\n  ol {\n    margin: 0;\n    padding-left: 1.25rem;\n    color: #374151;\n    \n    li {\n      margin-bottom: 0.5rem;\n    }\n  }\n\n  code {\n    background: #e5e7eb;\n    padding: 0.125rem 0.375rem;\n    border-radius: 4px;\n    font-size: 0.875rem;\n  }\n}\n\n//[_ngcontent-%COMP%]   Loading[_ngcontent-%COMP%]   State\n.loading-container[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 4rem 2rem;\n  min-height: 400px;\n}\n\n.loading-spinner[_ngcontent-%COMP%] {\n  position: relative;\n  width: 60px;\n  height: 60px;\n  margin-bottom: 1rem;\n\n  .spinner-ring {\n    position: absolute;\n    width: 100%;\n    height: 100%;\n    border: 3px solid transparent;\n    border-radius: 50%;\n    animation: _ngcontent-%COMP%_spin 1.5s cubic-bezier(0.5, 0, 0.5, 1) infinite;\n\n    &:nth-child(1) {\n      border-color: #2196f3 transparent transparent transparent;\n      animation-delay: -0.45s;\n    }\n\n    &:nth-child(2) {\n      border-color: transparent #9c27b0 transparent transparent;\n      animation-delay: -0.3s;\n    }\n\n    &:nth-child(3) {\n      border-color: transparent transparent #4caf50 transparent;\n      animation-delay: -0.15s;\n    }\n  }\n}\n\n@keyframes _ngcontent-%COMP%_spin {\n  0% { transform: rotate(0deg); }\n  100% { transform: rotate(360deg); }\n}\n\n.loading-text[_ngcontent-%COMP%] {\n  color: #6b7280;\n  font-size: 0.95rem;\n}\n\n//[_ngcontent-%COMP%]   Modal[_ngcontent-%COMP%]   Styles\n.modal-backdrop[_ngcontent-%COMP%] {\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: rgba(0, 0, 0, 0.5);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 1000;\n  animation: fadeIn 0.2s ease;\n}\n\n.modal-dialog[_ngcontent-%COMP%] {\n  background: white;\n  border-radius: 12px;\n  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);\n  max-width: 500px;\n  width: 90%;\n  max-height: 90vh;\n  overflow: hidden;\n  animation: _ngcontent-%COMP%_slideUp 0.3s ease;\n\n  &.modal-large {\n    max-width: 700px;\n  }\n}\n\n.modal-header[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 1.5rem;\n  border-bottom: 1px solid #e5e7eb;\n\n  .modal-title {\n    display: flex;\n    align-items: center;\n    gap: 0.75rem;\n    font-size: 1.25rem;\n    font-weight: 600;\n    color: #1f2937;\n    margin: 0;\n  }\n\n  .modal-close {\n    padding: 0.5rem;\n    border: none;\n    background: transparent;\n    color: #6b7280;\n    font-size: 1.25rem;\n    cursor: pointer;\n    border-radius: 6px;\n    transition: all 0.2s;\n\n    &:hover {\n      background: #f3f4f6;\n      color: #374151;\n    }\n  }\n}\n\n.modal-body[_ngcontent-%COMP%] {\n  padding: 1.5rem;\n  max-height: 60vh;\n  overflow-y: auto;\n}\n\n.modal-footer[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: flex-end;\n  gap: 0.75rem;\n  padding: 1.5rem;\n  border-top: 1px solid #e5e7eb;\n  background: #f9fafb;\n}\n\n//[_ngcontent-%COMP%]   Form[_ngcontent-%COMP%]   Styles\n.form-group[_ngcontent-%COMP%] {\n  margin-bottom: 1.5rem;\n}\n\n.form-label[_ngcontent-%COMP%] {\n  display: block;\n  font-size: 0.875rem;\n  font-weight: 500;\n  color: #374151;\n  margin-bottom: 0.5rem;\n}\n\n.form-input[_ngcontent-%COMP%] {\n  width: 100%;\n  padding: 0.75rem 1rem;\n  border: 1px solid #e5e7eb;\n  border-radius: 8px;\n  font-size: 0.95rem;\n  transition: all 0.2s;\n\n  &:focus {\n    outline: none;\n    border-color: #2196f3;\n    box-shadow: 0 0 0 3px rgba(33, 150, 243, 0.1);\n  }\n}\n\n.form-select[_ngcontent-%COMP%] {\n  width: 100%;\n  padding: 0.75rem 1rem;\n  border: 1px solid #e5e7eb;\n  border-radius: 8px;\n  font-size: 0.95rem;\n  background: white;\n  cursor: pointer;\n  transition: all 0.2s;\n\n  &:focus {\n    outline: none;\n    border-color: #2196f3;\n    box-shadow: 0 0 0 3px rgba(33, 150, 243, 0.1);\n  }\n}\n\n.form-hint[_ngcontent-%COMP%] {\n  font-size: 0.75rem;\n  color: #6b7280;\n  margin-top: 0.25rem;\n}\n\n.form-checkboxes[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 0.75rem;\n}\n\n.checkbox-label[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n  color: #374151;\n  font-size: 0.95rem;\n  cursor: pointer;\n\n  input[type=\"checkbox\"] {\n    cursor: pointer;\n  }\n}\n\n//[_ngcontent-%COMP%]   Animations\n@keyframes[_ngcontent-%COMP%]   fadeIn[_ngcontent-%COMP%] {\n  from { opacity: 0; }\n  to { opacity: 1; }\n}\n\n@keyframes _ngcontent-%COMP%_slideUp {\n  from {\n    transform: translateY(20px);\n    opacity: 0;\n  }\n  to {\n    transform: translateY(0);\n    opacity: 1;\n  }\n}"] });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SqlLoggingComponent, [{
+        type: Component,
+        args: [{ selector: 'mj-sql-logging', standalone: true, imports: [
+                    CommonModule,
+                    FormsModule,
+                    SharedSettingsModule,
+                    CodeEditorModule
+                ], template: "<div class=\"sql-logging-container\">\n  <!-- Action Buttons -->\n  <div class=\"action-buttons\">\n    <button class=\"btn-secondary\" (click)=\"loadActiveSessions()\" [disabled]=\"loading\">\n      <i class=\"fa-solid fa-refresh\" [class.fa-spin]=\"loading\"></i>\n      Refresh\n    </button>\n    @if (isOwner && configEnabled) {\n      <button \n        class=\"btn-primary\"\n        [disabled]=\"loading || activeSessions.length >= (sqlLoggingConfig?.maxActiveSessions || 5)\"\n        (click)=\"openStartSessionDialog()\"\n        title=\"Start SQL logging session\"\n      >\n        <i class=\"fa-solid fa-play\"></i>\n        Start New Session\n      </button>\n    }\n  </div>\n\n  <!-- Stats Cards -->\n  @if (isOwner && configEnabled) {\n    <div class=\"stats-grid\" style=\"display: flex\">\n      <div class=\"stat-card\">\n        <div class=\"stat-icon stat-icon-status\">\n          <i class=\"fa-solid fa-power-off\"></i>\n        </div>\n        <div class=\"stat-content\">\n          <div class=\"stat-value\">{{ configEnabled ? 'Enabled' : 'Disabled' }}</div>\n          <div class=\"stat-label\">Status</div>\n        </div>\n      </div>\n      \n      <div class=\"stat-card\">\n        <div class=\"stat-icon stat-icon-active\">\n          <i class=\"fa-solid fa-play-circle\"></i>\n        </div>\n        <div class=\"stat-content\">\n          <div class=\"stat-value\">{{ activeSessions.length }}</div>\n          <div class=\"stat-label\">Active Sessions</div>\n        </div>\n      </div>\n      \n      <div class=\"stat-card\">\n        <div class=\"stat-icon stat-icon-limit\">\n          <i class=\"fa-solid fa-gauge-high\"></i>\n        </div>\n        <div class=\"stat-content\">\n          <div class=\"stat-value\">{{ sqlLoggingConfig?.maxActiveSessions || 5 }}</div>\n          <div class=\"stat-label\">Max Sessions</div>\n        </div>\n      </div>\n      \n      <div class=\"stat-card\">\n        <div class=\"stat-icon stat-icon-total\">\n          <i class=\"fa-solid fa-database\"></i>\n        </div>\n        <div class=\"stat-content\">\n          <div class=\"stat-value\">{{ getTotalStatementCount() }}</div>\n          <div class=\"stat-label\">Total Statements</div>\n        </div>\n      </div>\n    </div>\n  }\n\n  <!-- Loading State -->\n  @if (loading && !activeSessions.length) {\n    <div class=\"loading-container\">\n      <div class=\"loading-spinner\">\n        <div class=\"spinner-ring\"></div>\n        <div class=\"spinner-ring\"></div>\n        <div class=\"spinner-ring\"></div>\n      </div>\n      <div class=\"loading-text\">Loading SQL logging configuration...</div>\n    </div>\n  }\n\n  <!-- Content Area -->\n  @if (!loading || activeSessions.length > 0) {\n    <div class=\"content-area\">\n      @if (!isOwner) {\n        <!-- Not authorized -->\n        <div class=\"empty-state\">\n          <i class=\"fa-solid fa-lock empty-icon\"></i>\n          <p class=\"empty-text\">Access Denied</p>\n          <p class=\"empty-subtext\">SQL logging requires Owner privileges. Please contact your system administrator for access.</p>\n          <button \n            class=\"btn-secondary\"\n            (click)=\"refreshUserPermissions()\"\n            style=\"margin-top: 1rem\"\n          >\n            <i class=\"fa-solid fa-sync\"></i>\n            Refresh Permissions\n          </button>\n        </div>\n      } @else if (!configEnabled) {\n        <!-- Not enabled in config -->\n        <div class=\"empty-state\">\n          <i class=\"fa-solid fa-exclamation-triangle empty-icon warning\"></i>\n          <p class=\"empty-text\">SQL Logging Disabled</p>\n          <p class=\"empty-subtext\">SQL logging is not enabled in the server configuration.</p>\n          <div class=\"info-box\">\n            <h4>To enable SQL logging:</h4>\n            <ol>\n              <li>Set <code>sqlLogging.enabled = true</code> in mj.config.cjs</li>\n              <li>Restart the MJ API server</li>\n              <li>Refresh this page</li>\n            </ol>\n          </div>\n        </div>\n      } @else if (activeSessions.length === 0) {\n        <!-- No active sessions -->\n        <div class=\"empty-state\">\n          <i class=\"fa-solid fa-file-code empty-icon\"></i>\n          <p class=\"empty-text\">No Active Sessions</p>\n          <p class=\"empty-subtext\">Start a new SQL logging session to begin capturing SQL statements.</p>\n          <button \n            class=\"btn-primary\"\n            (click)=\"openStartSessionDialog()\"\n            style=\"margin-top: 1rem\"\n          >\n            <i class=\"fa-solid fa-play\"></i>\n            Start New Session\n          </button>\n        </div>\n      } @else {\n        <!-- Sessions layout -->\n        <div class=\"sessions-layout\">\n          <!-- Sessions panel -->\n          <div class=\"sessions-panel\">\n            <div class=\"panel-header\">\n              <h3 class=\"panel-title\">Active Sessions</h3>\n              @if (activeSessions.length > 0) {\n                <button \n                  class=\"btn-danger btn-small\"\n                  (click)=\"stopAllSessions()\"\n                  [disabled]=\"loading\"\n                  title=\"Stop all sessions\"\n                >\n                  <i class=\"fa-solid fa-stop\"></i>\n                  Stop All\n                </button>\n              }\n            </div>\n            <div class=\"sessions-list\">\n              @for (session of activeSessions; track session.id) {\n                <div \n                  class=\"session-card\" \n                  [class.selected]=\"selectedSession?.id === session.id\"\n                  (click)=\"selectSession(session)\"\n                >\n                  <div class=\"session-header\">\n                    <div class=\"session-info\">\n                      <h4 class=\"session-title\">{{ session.sessionName }}</h4>\n                      <div class=\"session-meta\">\n                        <span class=\"meta-item\">\n                          <i class=\"fa-solid fa-clock\"></i>\n                          {{ getSessionDuration(session.startTime) }}\n                        </span>\n                        <span class=\"meta-item\">\n                          <i class=\"fa-solid fa-database\"></i>\n                          {{ session.statementCount }} statements\n                        </span>\n                      </div>\n                    </div>\n                    <button \n                      class=\"action-btn action-btn-danger\"\n                      (click)=\"stopSession(session, $event)\"\n                      title=\"Stop session\"\n                    >\n                      <i class=\"fa-solid fa-stop\"></i>\n                    </button>\n                  </div>\n                  <div class=\"session-badges\">\n                    @if (session.filterByUserId) {\n                      <span class=\"badge badge-user\">\n                        <i class=\"fa-solid fa-user\"></i>\n                        User Filtered\n                      </span>\n                    }\n                    @if (session.options?.formatAsMigration) {\n                      <span class=\"badge badge-migration\">\n                        <i class=\"fa-solid fa-code-branch\"></i>\n                        Migration\n                      </span>\n                    }\n                    <span class=\"badge badge-type\">\n                      {{ session.options?.statementTypes || 'both' }}\n                    </span>\n                  </div>\n                </div>\n              }\n            </div>\n          </div>\n          \n          <!-- Log viewer panel -->\n          <div class=\"log-viewer-panel\">\n            @if (selectedSession) {\n              <div class=\"panel-header\">\n                <h3 class=\"panel-title\">{{ selectedSession.sessionName }}</h3>\n                <div class=\"panel-actions\">\n                  <label class=\"checkbox-label\">\n                    <input \n                      type=\"checkbox\" \n                      [(ngModel)]=\"autoRefresh\"\n                    />\n                    Auto-refresh\n                  </label>\n                  <button \n                    class=\"action-btn\"\n                    (click)=\"loadSessionLog(selectedSession)\"\n                    title=\"Refresh log\"\n                  >\n                    <i class=\"fa-solid fa-sync\" [class.fa-spin]=\"loading\"></i>\n                  </button>\n                </div>\n              </div>\n              <div class=\"log-content\">\n                <mj-code-editor\n                  [value]=\"logContent\"\n                  [readonly]=\"true\"\n                  [disabled]=\"true\"\n                  [language]=\"'sql'\"\n                  [setup]=\"'basic'\"\n                  [lineWrapping]=\"true\"\n                  [highlightWhitespace]=\"false\"\n                  style=\"height: 100%;\"\n                ></mj-code-editor>\n              </div>\n            } @else {\n              <div class=\"empty-state\">\n                <i class=\"fa-solid fa-arrow-left empty-icon\"></i>\n                <p class=\"empty-text\">Select a Session</p>\n                <p class=\"empty-subtext\">Choose a session from the list to view its SQL log.</p>\n              </div>\n            }\n          </div>\n        </div>\n      }\n    </div>\n  }\n\n  <!-- Start Session Dialog -->\n  @if (showStartSessionDialog) {\n    <div class=\"modal-backdrop\" (click)=\"showStartSessionDialog = false\">\n      <div class=\"modal-dialog modal-large\" (click)=\"$event.stopPropagation()\">\n        <div class=\"modal-header\">\n          <h3 class=\"modal-title\">\n            <i class=\"fa-solid fa-play\"></i>\n            Start SQL Logging Session\n          </h3>\n          <button class=\"modal-close\" (click)=\"showStartSessionDialog = false\">\n            <i class=\"fa-solid fa-times\"></i>\n          </button>\n        </div>\n        <div class=\"modal-body\">\n          <div class=\"form-group\">\n            <label class=\"form-label\">Session Name</label>\n            <input \n              type=\"text\"\n              class=\"form-input\" \n              [(ngModel)]=\"newSessionOptions.sessionName\"\n              placeholder=\"Enter a descriptive name for this session\"\n            />\n          </div>\n          \n          <div class=\"form-group\">\n            <label class=\"form-label\">File Name</label>\n            <input \n              type=\"text\"\n              class=\"form-input\" \n              [(ngModel)]=\"newSessionOptions.fileName\"\n              placeholder=\"sql-log-2024-01-01.sql\"\n            />\n            <div class=\"form-hint\">The SQL log will be saved to this file</div>\n          </div>\n          \n          <div class=\"form-group\">\n            <label class=\"form-label\">Statement Types</label>\n            <select\n              class=\"form-select\"\n              [(ngModel)]=\"newSessionOptions.statementTypes\"\n            >\n              @for (option of statementTypeOptions; track option.value) {\n                <option [value]=\"option.value\">{{ option.text }}</option>\n              }\n            </select>\n          </div>\n          \n          <div class=\"form-checkboxes\">\n            <label class=\"checkbox-label\">\n              <input \n                type=\"checkbox\" \n                [(ngModel)]=\"newSessionOptions.filterToCurrentUser\"\n              />\n              Filter to my SQL statements only\n            </label>\n            \n            <label class=\"checkbox-label\">\n              <input \n                type=\"checkbox\" \n                [(ngModel)]=\"newSessionOptions.formatAsMigration\"\n              />\n              Format as migration file\n            </label>\n            \n            <label class=\"checkbox-label\">\n              <input \n                type=\"checkbox\" \n                [(ngModel)]=\"newSessionOptions.prettyPrint\"\n              />\n              Pretty print SQL statements\n            </label>\n          </div>\n        </div>\n        <div class=\"modal-footer\">\n          <button class=\"btn-secondary\" (click)=\"showStartSessionDialog = false\">\n            Cancel\n          </button>\n          <button class=\"btn-primary\" (click)=\"startNewSession()\" [disabled]=\"loading\">\n            <i class=\"fa-solid fa-play\"></i>\n            Start Session\n          </button>\n        </div>\n      </div>\n    </div>\n  }\n</div>", styles: ["@import '../shared/styles/variables';\n@import '../shared/styles/mixins';\n\n.sql-logging-container {\n  @include scrollable-container;\n  max-width: 1400px;\n  margin: 0 auto;\n  padding: 2rem;\n}\n\n// Action Buttons\n.action-buttons {\n  display: flex;\n  gap: 0.75rem;\n  justify-content: flex-end;\n  margin-bottom: 1.5rem;\n\n  @media (max-width: 768px) {\n    justify-content: center;\n    flex-wrap: wrap;\n  }\n}\n\n// Buttons\n.btn-primary {\n  @include button-base;\n  background-color: #2196f3;\n  color: white;\n  \n  &:hover {\n    background-color: #1976d2;\n    transform: translateY(-1px);\n    box-shadow: 0 4px 12px rgba(33, 150, 243, 0.3);\n  }\n}\n\n.btn-secondary {\n  @include button-base;\n  background-color: #ffffff;\n  color: #374151;\n  border: 1px solid #e5e7eb;\n  \n  &:hover {\n    background-color: #f9fafb;\n    border-color: #2196f3;\n    color: #2196f3;\n  }\n}\n\n.btn-danger {\n  @include button-base;\n  background-color: #f44336;\n  color: white;\n  \n  &:hover {\n    background-color: #d32f2f;\n  }\n  \n  &.btn-small {\n    padding: 0.375rem 0.75rem;\n    font-size: 0.875rem;\n  }\n}\n\n// Stats Grid\n.stats-grid {\n  display: grid !important;\n  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));\n  gap: 1.5rem;\n  margin-bottom: 2rem;\n  width: 100%;\n\n  @media (max-width: 768px) {\n    grid-template-columns: repeat(2, 1fr);\n    gap: 1rem;\n  }\n}\n\n.stat-card {\n  background: white;\n  border-radius: 12px;\n  padding: 1.5rem;\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);\n  display: flex;\n  margin-right: 10px;\n  align-items: center;\n  gap: 1rem;\n  transition: all 0.3s ease;\n  min-width: 0; // Prevent grid blowout\n\n  &:hover {\n    transform: translateY(-2px);\n    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);\n  }\n}\n\n.stat-icon {\n  width: 60px;\n  height: 60px;\n  border-radius: 12px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 1.5rem;\n\n  &-status {\n    background: rgba(76, 175, 80, 0.1);\n    color: #4caf50;\n  }\n\n  &-active {\n    background: rgba(33, 150, 243, 0.1);\n    color: #2196f3;\n  }\n\n  &-limit {\n    background: rgba(255, 152, 0, 0.1);\n    color: #ff9800;\n  }\n\n  &-total {\n    background: rgba(156, 39, 176, 0.1);\n    color: #9c27b0;\n  }\n}\n\n.stat-content {\n  flex: 1;\n\n  .stat-value {\n    font-size: 2rem;\n    font-weight: 700;\n    color: #1f2937;\n    line-height: 1;\n  }\n\n  .stat-label {\n    color: #6b7280;\n    font-size: 0.875rem;\n    margin-top: 0.25rem;\n  }\n}\n\n// Content Area\n.content-area {\n  @include scrollable-content;\n  background: white;\n  border-radius: 12px;\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);\n  padding: 1.5rem;\n  min-height: 400px;\n}\n\n// Sessions Layout\n.sessions-layout {\n  display: flex;\n  gap: 1.5rem;\n  height: calc(100vh - 450px); // Dynamic height based on viewport\n  min-height: 400px;\n  max-height: 600px;\n\n  @media (max-width: 1024px) {\n    flex-direction: column;\n    height: auto;\n    max-height: none;\n  }\n}\n\n.sessions-panel {\n  flex: 0 0 400px;\n  display: flex;\n  flex-direction: column;\n  border: 1px solid #e5e7eb;\n  border-radius: 8px;\n  overflow: hidden;\n\n  @media (max-width: 1024px) {\n    flex: 1;\n    max-height: 400px;\n  }\n}\n\n.panel-header {\n  padding: 1rem;\n  background: #f9fafb;\n  border-bottom: 1px solid #e5e7eb;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n\n  .panel-title {\n    margin: 0;\n    font-size: 1.125rem;\n    font-weight: 600;\n    color: #1f2937;\n  }\n}\n\n.panel-actions {\n  display: flex;\n  align-items: center;\n  gap: 1rem;\n}\n\n.sessions-list {\n  @include scrollable-content;\n  padding: 0.75rem;\n}\n\n.session-card {\n  background: white;\n  border: 1px solid #e5e7eb;\n  border-radius: 8px;\n  padding: 1rem;\n  margin-bottom: 0.75rem;\n  cursor: pointer;\n  transition: all 0.2s;\n\n  &:hover {\n    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);\n  }\n\n  &.selected {\n    border-color: #2196f3;\n    box-shadow: 0 0 0 3px rgba(33, 150, 243, 0.1);\n  }\n}\n\n.session-header {\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-start;\n  margin-bottom: 0.75rem;\n}\n\n.session-info {\n  flex: 1;\n  \n  .session-title {\n    margin: 0 0 0.5rem 0;\n    font-size: 0.95rem;\n    font-weight: 600;\n    color: #1f2937;\n  }\n}\n\n.session-meta {\n  display: flex;\n  gap: 1rem;\n  font-size: 0.75rem;\n  color: #6b7280;\n\n  .meta-item {\n    display: flex;\n    align-items: center;\n    gap: 0.25rem;\n  }\n}\n\n.session-badges {\n  display: flex;\n  gap: 0.5rem;\n  flex-wrap: wrap;\n}\n\n.badge {\n  padding: 0.25rem 0.5rem;\n  border-radius: 12px;\n  font-size: 0.625rem;\n  font-weight: 600;\n  display: flex;\n  align-items: center;\n  gap: 0.25rem;\n\n  &-user {\n    background: rgba(33, 150, 243, 0.1);\n    color: #2196f3;\n  }\n\n  &-migration {\n    background: rgba(156, 39, 176, 0.1);\n    color: #9c27b0;\n  }\n\n  &-type {\n    background: rgba(255, 152, 0, 0.1);\n    color: #ff9800;\n  }\n}\n\n.action-btn {\n  padding: 0.375rem;\n  border: none;\n  background: transparent;\n  color: #6b7280;\n  font-size: 0.875rem;\n  border-radius: 4px;\n  cursor: pointer;\n  transition: all 0.2s;\n\n  &:hover {\n    background: #f3f4f6;\n    color: #374151;\n  }\n\n  &-danger:hover {\n    color: #f44336;\n  }\n}\n\n// Log Viewer Panel\n.log-viewer-panel {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  border: 1px solid #e5e7eb;\n  border-radius: 8px;\n  overflow: hidden;\n}\n\n.log-content {\n  @include scrollable-content;\n  background: #1e1e1e;\n  color: #d4d4d4;\n  padding: 0; // Remove padding for code editor\n  min-height: 300px;\n  height: 100%;\n  position: relative;\n  \n  // Code editor styles\n  ::ng-deep {\n    .cm-editor {\n      height: 100%;\n      font-family: 'Consolas', 'Monaco', 'Courier New', monospace;\n      font-size: 0.875rem;\n    }\n    \n    .cm-scroller {\n      font-family: inherit;\n    }\n    \n    // Dark theme adjustments to match previous style\n    .cm-content {\n      background: #1e1e1e;\n      color: #d4d4d4;\n    }\n    \n    .cm-gutters {\n      background: #252526;\n      color: #858585;\n      border-right: 1px solid #464647;\n    }\n    \n    .cm-activeLineGutter {\n      background: #2a2a2a;\n    }\n    \n    .cm-activeLine {\n      background: rgba(255, 255, 255, 0.04);\n    }\n  }\n}\n\n\n// Empty State\n.empty-state {\n  text-align: center;\n  padding: 4rem 2rem;\n\n  .empty-icon {\n    font-size: 4rem;\n    color: #e5e7eb;\n    margin-bottom: 1rem;\n\n    &.warning {\n      color: #ffc107;\n    }\n  }\n\n  .empty-text {\n    font-size: 1.25rem;\n    font-weight: 600;\n    color: #374151;\n    margin: 0 0 0.5rem 0;\n  }\n\n  .empty-subtext {\n    color: #6b7280;\n    margin: 0;\n  }\n}\n\n.info-box {\n  background: #f3f4f6;\n  border-radius: 8px;\n  padding: 1.5rem;\n  margin-top: 2rem;\n  text-align: left;\n  max-width: 500px;\n  margin-left: auto;\n  margin-right: auto;\n\n  h4 {\n    margin: 0 0 1rem 0;\n    color: #1f2937;\n  }\n\n  ol {\n    margin: 0;\n    padding-left: 1.25rem;\n    color: #374151;\n    \n    li {\n      margin-bottom: 0.5rem;\n    }\n  }\n\n  code {\n    background: #e5e7eb;\n    padding: 0.125rem 0.375rem;\n    border-radius: 4px;\n    font-size: 0.875rem;\n  }\n}\n\n// Loading State\n.loading-container {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 4rem 2rem;\n  min-height: 400px;\n}\n\n.loading-spinner {\n  position: relative;\n  width: 60px;\n  height: 60px;\n  margin-bottom: 1rem;\n\n  .spinner-ring {\n    position: absolute;\n    width: 100%;\n    height: 100%;\n    border: 3px solid transparent;\n    border-radius: 50%;\n    animation: spin 1.5s cubic-bezier(0.5, 0, 0.5, 1) infinite;\n\n    &:nth-child(1) {\n      border-color: #2196f3 transparent transparent transparent;\n      animation-delay: -0.45s;\n    }\n\n    &:nth-child(2) {\n      border-color: transparent #9c27b0 transparent transparent;\n      animation-delay: -0.3s;\n    }\n\n    &:nth-child(3) {\n      border-color: transparent transparent #4caf50 transparent;\n      animation-delay: -0.15s;\n    }\n  }\n}\n\n@keyframes spin {\n  0% { transform: rotate(0deg); }\n  100% { transform: rotate(360deg); }\n}\n\n.loading-text {\n  color: #6b7280;\n  font-size: 0.95rem;\n}\n\n// Modal Styles\n.modal-backdrop {\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: rgba(0, 0, 0, 0.5);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 1000;\n  animation: fadeIn 0.2s ease;\n}\n\n.modal-dialog {\n  background: white;\n  border-radius: 12px;\n  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);\n  max-width: 500px;\n  width: 90%;\n  max-height: 90vh;\n  overflow: hidden;\n  animation: slideUp 0.3s ease;\n\n  &.modal-large {\n    max-width: 700px;\n  }\n}\n\n.modal-header {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 1.5rem;\n  border-bottom: 1px solid #e5e7eb;\n\n  .modal-title {\n    display: flex;\n    align-items: center;\n    gap: 0.75rem;\n    font-size: 1.25rem;\n    font-weight: 600;\n    color: #1f2937;\n    margin: 0;\n  }\n\n  .modal-close {\n    padding: 0.5rem;\n    border: none;\n    background: transparent;\n    color: #6b7280;\n    font-size: 1.25rem;\n    cursor: pointer;\n    border-radius: 6px;\n    transition: all 0.2s;\n\n    &:hover {\n      background: #f3f4f6;\n      color: #374151;\n    }\n  }\n}\n\n.modal-body {\n  padding: 1.5rem;\n  max-height: 60vh;\n  overflow-y: auto;\n}\n\n.modal-footer {\n  display: flex;\n  justify-content: flex-end;\n  gap: 0.75rem;\n  padding: 1.5rem;\n  border-top: 1px solid #e5e7eb;\n  background: #f9fafb;\n}\n\n// Form Styles\n.form-group {\n  margin-bottom: 1.5rem;\n}\n\n.form-label {\n  display: block;\n  font-size: 0.875rem;\n  font-weight: 500;\n  color: #374151;\n  margin-bottom: 0.5rem;\n}\n\n.form-input {\n  width: 100%;\n  padding: 0.75rem 1rem;\n  border: 1px solid #e5e7eb;\n  border-radius: 8px;\n  font-size: 0.95rem;\n  transition: all 0.2s;\n\n  &:focus {\n    outline: none;\n    border-color: #2196f3;\n    box-shadow: 0 0 0 3px rgba(33, 150, 243, 0.1);\n  }\n}\n\n.form-select {\n  width: 100%;\n  padding: 0.75rem 1rem;\n  border: 1px solid #e5e7eb;\n  border-radius: 8px;\n  font-size: 0.95rem;\n  background: white;\n  cursor: pointer;\n  transition: all 0.2s;\n\n  &:focus {\n    outline: none;\n    border-color: #2196f3;\n    box-shadow: 0 0 0 3px rgba(33, 150, 243, 0.1);\n  }\n}\n\n.form-hint {\n  font-size: 0.75rem;\n  color: #6b7280;\n  margin-top: 0.25rem;\n}\n\n.form-checkboxes {\n  display: flex;\n  flex-direction: column;\n  gap: 0.75rem;\n}\n\n.checkbox-label {\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n  color: #374151;\n  font-size: 0.95rem;\n  cursor: pointer;\n\n  input[type=\"checkbox\"] {\n    cursor: pointer;\n  }\n}\n\n// Animations\n@keyframes fadeIn {\n  from { opacity: 0; }\n  to { opacity: 1; }\n}\n\n@keyframes slideUp {\n  from {\n    transform: translateY(20px);\n    opacity: 0;\n  }\n  to {\n    transform: translateY(0);\n    opacity: 1;\n  }\n}"] }]
+    }], () => [{ type: i1.SharedService }], null); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SqlLoggingComponent, { className: "SqlLoggingComponent", filePath: "src/lib/sql-logging/sql-logging.component.ts", lineNumber: 44 }); })();
+//# sourceMappingURL=sql-logging.component.js.map