@memberjunction/ng-dashboards 2.117.0 → 2.119.0

package/dist/Testing/components/testing-execution.component.js

@@ -0,0 +1,647 @@
+import { Component, Input, Output, EventEmitter, ChangeDetectionStrategy } from '@angular/core';
+import { Subject, combineLatest } from 'rxjs';
+import { takeUntil, map } from 'rxjs/operators';
+import { CompositeKey } from '@memberjunction/core';
+import { SharedService } from '@memberjunction/ng-shared';
+import { TestRunDialogComponent } from '@memberjunction/ng-testing';
+import * as i0 from "@angular/core";
+import * as i1 from "../services/testing-instrumentation.service";
+import * as i2 from "@progress/kendo-angular-dialog";
+import * as i3 from "@angular/common";
+import * as i4 from "@angular/forms";
+import * as i5 from "@memberjunction/ng-testing";
+const _forTrack0 = ($index, $item) => $item.id;
+const _c0 = () => [];
+function TestingExecutionComponent_div_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 51);
+    i0.ɵɵelement(1, "span", 52);
+    i0.ɵɵelementStart(2, "span", 53);
+    i0.ɵɵtext(3, "Live");
+    i0.ɵɵelementEnd()();
+} }
+function TestingExecutionComponent_button_48_Template(rf, ctx) { if (rf & 1) {
+    const _r1 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 54);
+    i0.ɵɵlistener("click", function TestingExecutionComponent_button_48_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.clearSearch()); });
+    i0.ɵɵelement(1, "i", 55);
+    i0.ɵɵelementEnd();
+} }
+function TestingExecutionComponent_Conditional_103_Template(rf, ctx) { if (rf & 1) {
+    const _r3 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 49);
+    i0.ɵɵelement(1, "i", 56);
+    i0.ɵɵelementStart(2, "p");
+    i0.ɵɵtext(3, "No test executions found");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "button", 8);
+    i0.ɵɵlistener("click", function TestingExecutionComponent_Conditional_103_Template_button_click_4_listener() { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.startNewTest()); });
+    i0.ɵɵelement(5, "i", 9);
+    i0.ɵɵtext(6, " Run Your First Test ");
+    i0.ɵɵelementEnd()();
+} }
+function TestingExecutionComponent_For_106_Conditional_9_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 64);
+    i0.ɵɵelement(1, "div", 76);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const execution_r5 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵadvance();
+    i0.ɵɵstyleProp("width", execution_r5.progress, "%");
+} }
+function TestingExecutionComponent_For_106_Conditional_22_Template(rf, ctx) { if (rf & 1) {
+    const _r6 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 77);
+    i0.ɵɵlistener("click", function TestingExecutionComponent_For_106_Conditional_22_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r6); const execution_r5 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.cancelExecution(execution_r5)); });
+    i0.ɵɵelement(1, "i", 78);
+    i0.ɵɵelementEnd();
+} }
+function TestingExecutionComponent_For_106_Conditional_23_Template(rf, ctx) { if (rf & 1) {
+    const _r7 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 79);
+    i0.ɵɵlistener("click", function TestingExecutionComponent_For_106_Conditional_23_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r7); const execution_r5 = i0.ɵɵnextContext().$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.rerunTest(execution_r5)); });
+    i0.ɵɵelement(1, "i", 80);
+    i0.ɵɵelementEnd();
+} }
+function TestingExecutionComponent_For_106_Template(rf, ctx) { if (rf & 1) {
+    const _r4 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 57)(1, "div", 58)(2, "div", 59)(3, "div", 60);
+    i0.ɵɵtext(4);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(5, "div", 61);
+    i0.ɵɵtext(6);
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(7, "div", 62);
+    i0.ɵɵelement(8, "app-test-status-badge", 63);
+    i0.ɵɵtemplate(9, TestingExecutionComponent_For_106_Conditional_9_Template, 2, 2, "div", 64);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(10, "div", 65);
+    i0.ɵɵelement(11, "app-score-indicator", 66);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(12, "div", 67);
+    i0.ɵɵtext(13);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(14, "div", 68);
+    i0.ɵɵelement(15, "app-cost-display", 69);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(16, "div", 70);
+    i0.ɵɵtext(17);
+    i0.ɵɵpipe(18, "date");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(19, "div", 71)(20, "button", 72);
+    i0.ɵɵlistener("click", function TestingExecutionComponent_For_106_Template_button_click_20_listener() { const execution_r5 = i0.ɵɵrestoreView(_r4).$implicit; const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.viewDetails(execution_r5)); });
+    i0.ɵɵelement(21, "i", 73);
+    i0.ɵɵelementEnd();
+    i0.ɵɵtemplate(22, TestingExecutionComponent_For_106_Conditional_22_Template, 2, 0, "button", 74)(23, TestingExecutionComponent_For_106_Conditional_23_Template, 2, 0, "button", 75);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const execution_r5 = ctx.$implicit;
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵclassProp("running", execution_r5.status === "Running");
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate(execution_r5.testName);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(execution_r5.suiteName);
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("status", execution_r5.status);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(execution_r5.status === "Running" ? 9 : -1);
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("score", execution_r5.score)("showBar", false)("showIcon", false);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate1(" ", ctx_r1.formatDuration(execution_r5.duration), " ");
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("cost", execution_r5.cost)("showIcon", false);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind2(18, 14, execution_r5.startedAt, "short"), " ");
+    i0.ɵɵadvance(5);
+    i0.ɵɵconditional(execution_r5.status === "Running" ? 22 : 23);
+} }
+export class TestingExecutionComponent {
+    instrumentationService;
+    dialogService;
+    cdr;
+    initialState;
+    stateChange = new EventEmitter();
+    destroy$ = new Subject();
+    isRefreshing = false;
+    filters = {
+        status: 'all',
+        suite: 'all',
+        timeRange: 'today',
+        searchText: ''
+    };
+    executions$;
+    filteredExecutions$;
+    runningCount$;
+    completedTodayCount$;
+    failedTodayCount$;
+    avgDurationToday$;
+    hasRunningTests$;
+    constructor(instrumentationService, dialogService, cdr) {
+        this.instrumentationService = instrumentationService;
+        this.dialogService = dialogService;
+        this.cdr = cdr;
+    }
+    ngOnInit() {
+        this.setupObservables();
+        if (this.initialState) {
+            this.filters = { ...this.filters, ...this.initialState.filters };
+        }
+    }
+    ngOnDestroy() {
+        this.destroy$.next();
+        this.destroy$.complete();
+    }
+    setupObservables() {
+        this.executions$ = this.instrumentationService.testRuns$.pipe(map(runs => runs.map(run => this.mapToExecutionItem(run))), takeUntil(this.destroy$));
+        this.filteredExecutions$ = combineLatest([
+            this.executions$
+        ]).pipe(map(([executions]) => this.applyFilters(executions)), takeUntil(this.destroy$));
+        this.runningCount$ = this.executions$.pipe(map(execs => execs.filter(e => e.status === 'Running').length));
+        this.completedTodayCount$ = this.executions$.pipe(map(execs => {
+            const today = new Date();
+            today.setHours(0, 0, 0, 0);
+            return execs.filter(e => e.status === 'Passed' &&
+                e.startedAt >= today).length;
+        }));
+        this.failedTodayCount$ = this.executions$.pipe(map(execs => {
+            const today = new Date();
+            today.setHours(0, 0, 0, 0);
+            return execs.filter(e => e.status === 'Failed' &&
+                e.startedAt >= today).length;
+        }));
+        this.avgDurationToday$ = this.executions$.pipe(map(execs => {
+            const today = new Date();
+            today.setHours(0, 0, 0, 0);
+            const todayExecs = execs.filter(e => e.startedAt >= today && e.completedAt);
+            if (todayExecs.length === 0)
+                return 0;
+            const totalDuration = todayExecs.reduce((sum, e) => sum + e.duration, 0);
+            return totalDuration / todayExecs.length;
+        }));
+        this.hasRunningTests$ = this.runningCount$.pipe(map(count => count > 0));
+    }
+    mapToExecutionItem(run) {
+        const startedAt = run.runDateTime;
+        const completedAt = null;
+        const duration = run.duration;
+        const progress = run.status === 'Running' ? Math.random() * 100 : 100;
+        return {
+            id: run.id,
+            testName: run.testName,
+            suiteName: run.suiteName,
+            status: run.status,
+            score: run.score,
+            duration,
+            cost: run.cost,
+            startedAt,
+            completedAt,
+            progress
+        };
+    }
+    applyFilters(executions) {
+        let filtered = [...executions];
+        if (this.filters.status !== 'all') {
+            if (this.filters.status === 'running') {
+                filtered = filtered.filter(e => e.status === 'Running');
+            }
+            else if (this.filters.status === 'completed') {
+                filtered = filtered.filter(e => e.status === 'Passed' || e.status === 'Skipped');
+            }
+            else if (this.filters.status === 'failed') {
+                filtered = filtered.filter(e => e.status === 'Failed' || e.status === 'Error');
+            }
+            else if (this.filters.status === 'passed') {
+                filtered = filtered.filter(e => e.status === 'Passed');
+            }
+        }
+        if (this.filters.timeRange !== 'all') {
+            const now = new Date();
+            let startDate = new Date();
+            if (this.filters.timeRange === 'today') {
+                startDate.setHours(0, 0, 0, 0);
+            }
+            else if (this.filters.timeRange === 'week') {
+                startDate = new Date(now.getTime() - 7 * 24 * 60 * 60 * 1000);
+            }
+            else if (this.filters.timeRange === 'month') {
+                startDate = new Date(now.getTime() - 30 * 24 * 60 * 60 * 1000);
+            }
+            filtered = filtered.filter(e => e.startedAt >= startDate);
+        }
+        if (this.filters.searchText) {
+            const searchLower = this.filters.searchText.toLowerCase();
+            filtered = filtered.filter(e => e.testName.toLowerCase().includes(searchLower) ||
+                e.suiteName.toLowerCase().includes(searchLower));
+        }
+        filtered.sort((a, b) => b.startedAt.getTime() - a.startedAt.getTime());
+        return filtered;
+    }
+    onFilterChange() {
+        this.emitStateChange();
+        this.cdr.markForCheck();
+    }
+    clearSearch() {
+        this.filters.searchText = '';
+        this.onFilterChange();
+    }
+    refresh() {
+        this.isRefreshing = true;
+        this.instrumentationService.refresh();
+        setTimeout(() => {
+            this.isRefreshing = false;
+            this.cdr.markForCheck();
+        }, 1000);
+    }
+    startNewTest() {
+        const dialogRef = this.dialogService.open({
+            content: TestRunDialogComponent,
+            width: 1000,
+            height: 750,
+            title: 'Run Test',
+            actions: []
+        });
+        dialogRef.result.subscribe((result) => {
+            if (result && typeof result === 'object' && 'testExecuted' in result && result.testExecuted) {
+                this.refresh();
+            }
+        });
+    }
+    viewDetails(execution) {
+        SharedService.Instance.OpenEntityRecord('MJ: Test Runs', CompositeKey.FromID(execution.id));
+    }
+    cancelExecution(execution) {
+        console.log('Cancel execution:', execution);
+    }
+    rerunTest(execution) {
+        console.log('Re-run test:', execution);
+    }
+    formatDuration(milliseconds) {
+        if (milliseconds < 1000)
+            return `${milliseconds}ms`;
+        const seconds = Math.floor(milliseconds / 1000);
+        const minutes = Math.floor(seconds / 60);
+        if (minutes > 0)
+            return `${minutes}m ${seconds % 60}s`;
+        return `${seconds}s`;
+    }
+    emitStateChange() {
+        this.stateChange.emit({
+            filters: this.filters
+        });
+    }
+    static ɵfac = function TestingExecutionComponent_Factory(t) { return new (t || TestingExecutionComponent)(i0.ɵɵdirectiveInject(i1.TestingInstrumentationService), i0.ɵɵdirectiveInject(i2.DialogService), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TestingExecutionComponent, selectors: [["app-testing-execution"]], inputs: { initialState: "initialState" }, outputs: { stateChange: "stateChange" }, decls: 108, vars: 28, consts: [[1, "testing-execution"], [1, "execution-header"], [1, "header-left"], [1, "fa-solid", "fa-play-circle"], ["class", "live-indicator", 4, "ngIf"], [1, "header-actions"], [1, "action-btn", "refresh", 3, "click", "disabled"], [1, "fa-solid", "fa-refresh"], [1, "action-btn", "primary", 3, "click"], [1, "fa-solid", "fa-play"], [1, "execution-filters"], [1, "filter-group"], [3, "ngModelChange", "change", "ngModel"], ["value", "all"], ["value", "running"], ["value", "completed"], ["value", "failed"], ["value", "passed"], ["value", "today"], ["value", "week"], ["value", "month"], [1, "filter-group", "search"], [1, "search-input-wrapper"], [1, "fa-solid", "fa-search"], ["type", "text", "placeholder", "Search tests...", 3, "ngModelChange", "input", "ngModel"], ["class", "clear-btn", 3, "click", 4, "ngIf"], [1, "execution-summary"], [1, "summary-card"], [1, "summary-icon", "running"], [1, "fa-solid", "fa-spinner", "fa-spin"], [1, "summary-content"], [1, "summary-value"], [1, "summary-label"], [1, "summary-icon", "completed"], [1, "fa-solid", "fa-check-circle"], [1, "summary-icon", "failed"], [1, "fa-solid", "fa-exclamation-circle"], [1, "summary-icon", "duration"], [1, "fa-solid", "fa-clock"], [1, "execution-content"], [1, "execution-list"], [1, "list-header"], [1, "header-cell", "test-name"], [1, "header-cell", "status"], [1, "header-cell", "score"], [1, "header-cell", "duration"], [1, "header-cell", "cost"], [1, "header-cell", "timestamp"], [1, "header-cell", "actions"], [1, "no-data"], [1, "execution-row", 3, "running"], [1, "live-indicator"], [1, "pulse"], [1, "text"], [1, "clear-btn", 3, "click"], [1, "fa-solid", "fa-times"], [1, "fa-solid", "fa-inbox"], [1, "execution-row"], [1, "cell", "test-name"], [1, "test-info"], [1, "name"], [1, "suite"], [1, "cell", "status"], [3, "status"], [1, "progress-bar"], [1, "cell", "score"], [3, "score", "showBar", "showIcon"], [1, "cell", "duration"], [1, "cell", "cost"], [3, "cost", "showIcon"], [1, "cell", "timestamp"], [1, "cell", "actions"], ["title", "View Details", 1, "icon-btn", 3, "click"], [1, "fa-solid", "fa-eye"], ["title", "Cancel", 1, "icon-btn", "danger"], ["title", "Re-run", 1, "icon-btn"], [1, "progress-fill"], ["title", "Cancel", 1, "icon-btn", "danger", 3, "click"], [1, "fa-solid", "fa-stop"], ["title", "Re-run", 1, "icon-btn", 3, "click"], [1, "fa-solid", "fa-redo"]], template: function TestingExecutionComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "div", 0)(1, "div", 1)(2, "div", 2)(3, "h2");
+            i0.ɵɵelement(4, "i", 3);
+            i0.ɵɵtext(5, " Test Execution Monitor ");
+            i0.ɵɵelementEnd();
+            i0.ɵɵtemplate(6, TestingExecutionComponent_div_6_Template, 4, 0, "div", 4);
+            i0.ɵɵpipe(7, "async");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(8, "div", 5)(9, "button", 6);
+            i0.ɵɵlistener("click", function TestingExecutionComponent_Template_button_click_9_listener() { return ctx.refresh(); });
+            i0.ɵɵelement(10, "i", 7);
+            i0.ɵɵtext(11, " Refresh ");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(12, "button", 8);
+            i0.ɵɵlistener("click", function TestingExecutionComponent_Template_button_click_12_listener() { return ctx.startNewTest(); });
+            i0.ɵɵelement(13, "i", 9);
+            i0.ɵɵtext(14, " Run Test ");
+            i0.ɵɵelementEnd()()();
+            i0.ɵɵelementStart(15, "div", 10)(16, "div", 11)(17, "label");
+            i0.ɵɵtext(18, "Status");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(19, "select", 12);
+            i0.ɵɵtwoWayListener("ngModelChange", function TestingExecutionComponent_Template_select_ngModelChange_19_listener($event) { i0.ɵɵtwoWayBindingSet(ctx.filters.status, $event) || (ctx.filters.status = $event); return $event; });
+            i0.ɵɵlistener("change", function TestingExecutionComponent_Template_select_change_19_listener() { return ctx.onFilterChange(); });
+            i0.ɵɵelementStart(20, "option", 13);
+            i0.ɵɵtext(21, "All Statuses");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(22, "option", 14);
+            i0.ɵɵtext(23, "Running");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(24, "option", 15);
+            i0.ɵɵtext(25, "Completed");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(26, "option", 16);
+            i0.ɵɵtext(27, "Failed");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(28, "option", 17);
+            i0.ɵɵtext(29, "Passed");
+            i0.ɵɵelementEnd()()();
+            i0.ɵɵelementStart(30, "div", 11)(31, "label");
+            i0.ɵɵtext(32, "Time Range");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(33, "select", 12);
+            i0.ɵɵtwoWayListener("ngModelChange", function TestingExecutionComponent_Template_select_ngModelChange_33_listener($event) { i0.ɵɵtwoWayBindingSet(ctx.filters.timeRange, $event) || (ctx.filters.timeRange = $event); return $event; });
+            i0.ɵɵlistener("change", function TestingExecutionComponent_Template_select_change_33_listener() { return ctx.onFilterChange(); });
+            i0.ɵɵelementStart(34, "option", 18);
+            i0.ɵɵtext(35, "Today");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(36, "option", 19);
+            i0.ɵɵtext(37, "This Week");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(38, "option", 20);
+            i0.ɵɵtext(39, "This Month");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(40, "option", 13);
+            i0.ɵɵtext(41, "All Time");
+            i0.ɵɵelementEnd()()();
+            i0.ɵɵelementStart(42, "div", 21)(43, "label");
+            i0.ɵɵtext(44, "Search");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(45, "div", 22);
+            i0.ɵɵelement(46, "i", 23);
+            i0.ɵɵelementStart(47, "input", 24);
+            i0.ɵɵtwoWayListener("ngModelChange", function TestingExecutionComponent_Template_input_ngModelChange_47_listener($event) { i0.ɵɵtwoWayBindingSet(ctx.filters.searchText, $event) || (ctx.filters.searchText = $event); return $event; });
+            i0.ɵɵlistener("input", function TestingExecutionComponent_Template_input_input_47_listener() { return ctx.onFilterChange(); });
+            i0.ɵɵelementEnd();
+            i0.ɵɵtemplate(48, TestingExecutionComponent_button_48_Template, 2, 0, "button", 25);
+            i0.ɵɵelementEnd()()();
+            i0.ɵɵelementStart(49, "div", 26)(50, "div", 27)(51, "div", 28);
+            i0.ɵɵelement(52, "i", 29);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(53, "div", 30)(54, "div", 31);
+            i0.ɵɵtext(55);
+            i0.ɵɵpipe(56, "async");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(57, "div", 32);
+            i0.ɵɵtext(58, "Running Now");
+            i0.ɵɵelementEnd()()();
+            i0.ɵɵelementStart(59, "div", 27)(60, "div", 33);
+            i0.ɵɵelement(61, "i", 34);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(62, "div", 30)(63, "div", 31);
+            i0.ɵɵtext(64);
+            i0.ɵɵpipe(65, "async");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(66, "div", 32);
+            i0.ɵɵtext(67, "Completed Today");
+            i0.ɵɵelementEnd()()();
+            i0.ɵɵelementStart(68, "div", 27)(69, "div", 35);
+            i0.ɵɵelement(70, "i", 36);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(71, "div", 30)(72, "div", 31);
+            i0.ɵɵtext(73);
+            i0.ɵɵpipe(74, "async");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(75, "div", 32);
+            i0.ɵɵtext(76, "Failed Today");
+            i0.ɵɵelementEnd()()();
+            i0.ɵɵelementStart(77, "div", 27)(78, "div", 37);
+            i0.ɵɵelement(79, "i", 38);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(80, "div", 30)(81, "div", 31);
+            i0.ɵɵtext(82);
+            i0.ɵɵpipe(83, "async");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(84, "div", 32);
+            i0.ɵɵtext(85, "Avg Duration Today");
+            i0.ɵɵelementEnd()()()();
+            i0.ɵɵelementStart(86, "div", 39)(87, "div", 40)(88, "div", 41)(89, "div", 42);
+            i0.ɵɵtext(90, "Test Name");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(91, "div", 43);
+            i0.ɵɵtext(92, "Status");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(93, "div", 44);
+            i0.ɵɵtext(94, "Score");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(95, "div", 45);
+            i0.ɵɵtext(96, "Duration");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(97, "div", 46);
+            i0.ɵɵtext(98, "Cost");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(99, "div", 47);
+            i0.ɵɵtext(100, "Started At");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(101, "div", 48);
+            i0.ɵɵtext(102, "Actions");
+            i0.ɵɵelementEnd()();
+            i0.ɵɵtemplate(103, TestingExecutionComponent_Conditional_103_Template, 7, 0, "div", 49);
+            i0.ɵɵpipe(104, "async");
+            i0.ɵɵrepeaterCreate(105, TestingExecutionComponent_For_106_Template, 24, 17, "div", 50, _forTrack0);
+            i0.ɵɵpipe(107, "async");
+            i0.ɵɵelementEnd()()();
+        } if (rf & 2) {
+            let tmp_11_0;
+            let tmp_12_0;
+            i0.ɵɵadvance(6);
+            i0.ɵɵproperty("ngIf", i0.ɵɵpipeBind1(7, 13, ctx.hasRunningTests$));
+            i0.ɵɵadvance(3);
+            i0.ɵɵproperty("disabled", ctx.isRefreshing);
+            i0.ɵɵadvance();
+            i0.ɵɵclassProp("spinning", ctx.isRefreshing);
+            i0.ɵɵadvance(9);
+            i0.ɵɵtwoWayProperty("ngModel", ctx.filters.status);
+            i0.ɵɵadvance(14);
+            i0.ɵɵtwoWayProperty("ngModel", ctx.filters.timeRange);
+            i0.ɵɵadvance(14);
+            i0.ɵɵtwoWayProperty("ngModel", ctx.filters.searchText);
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("ngIf", ctx.filters.searchText);
+            i0.ɵɵadvance(7);
+            i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(56, 15, ctx.runningCount$) || 0);
+            i0.ɵɵadvance(9);
+            i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(65, 17, ctx.completedTodayCount$) || 0);
+            i0.ɵɵadvance(9);
+            i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(74, 19, ctx.failedTodayCount$) || 0);
+            i0.ɵɵadvance(9);
+            i0.ɵɵtextInterpolate(ctx.formatDuration(i0.ɵɵpipeBind1(83, 21, ctx.avgDurationToday$) || 0));
+            i0.ɵɵadvance(21);
+            i0.ɵɵconditional(((tmp_11_0 = i0.ɵɵpipeBind1(104, 23, ctx.filteredExecutions$)) == null ? null : tmp_11_0.length) === 0 ? 103 : -1);
+            i0.ɵɵadvance(2);
+            i0.ɵɵrepeater((tmp_12_0 = i0.ɵɵpipeBind1(107, 25, ctx.filteredExecutions$)) !== null && tmp_12_0 !== undefined ? tmp_12_0 : i0.ɵɵpureFunction0(27, _c0));
+        } }, dependencies: [i3.NgIf, i4.NgSelectOption, i4.ɵNgSelectMultipleOption, i4.DefaultValueAccessor, i4.SelectControlValueAccessor, i4.NgControlStatus, i4.NgModel, i5.TestStatusBadgeComponent, i5.ScoreIndicatorComponent, i5.CostDisplayComponent, i3.AsyncPipe, i3.DatePipe], styles: [".testing-execution[_ngcontent-%COMP%] {\n      padding: 20px;\n      height: 100%;\n      overflow-y: auto;\n      background: #f8f9fa;\n    }\n\n    .execution-header[_ngcontent-%COMP%] {\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      margin-bottom: 20px;\n      background: white;\n      padding: 20px;\n      border-radius: 8px;\n      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);\n    }\n\n    .header-left[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 16px;\n    }\n\n    .header-left[_ngcontent-%COMP%]   h2[_ngcontent-%COMP%] {\n      margin: 0;\n      font-size: 20px;\n      font-weight: 600;\n      color: #333;\n      display: flex;\n      align-items: center;\n      gap: 12px;\n    }\n\n    .header-left[_ngcontent-%COMP%]   h2[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      color: #2196f3;\n    }\n\n    .live-indicator[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      padding: 4px 12px;\n      background: #e3f2fd;\n      border-radius: 12px;\n      font-size: 11px;\n      font-weight: 600;\n      color: #2196f3;\n    }\n\n    .pulse[_ngcontent-%COMP%] {\n      width: 8px;\n      height: 8px;\n      background: #2196f3;\n      border-radius: 50%;\n      animation: _ngcontent-%COMP%_pulse 2s infinite;\n    }\n\n    @keyframes _ngcontent-%COMP%_pulse {\n      0%, 100% { opacity: 1; transform: scale(1); }\n      50% { opacity: 0.5; transform: scale(1.2); }\n    }\n\n    .header-actions[_ngcontent-%COMP%] {\n      display: flex;\n      gap: 12px;\n    }\n\n    .action-btn[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      padding: 8px 16px;\n      border: none;\n      border-radius: 4px;\n      font-size: 12px;\n      font-weight: 500;\n      cursor: pointer;\n      transition: all 0.2s ease;\n    }\n\n    .action-btn.refresh[_ngcontent-%COMP%] {\n      background: white;\n      border: 1px solid #ddd;\n      color: #666;\n    }\n\n    .action-btn.refresh[_ngcontent-%COMP%]:hover:not(:disabled) {\n      background: #f5f5f5;\n    }\n\n    .action-btn.primary[_ngcontent-%COMP%] {\n      background: #2196f3;\n      color: white;\n    }\n\n    .action-btn.primary[_ngcontent-%COMP%]:hover {\n      background: #1976d2;\n    }\n\n    .action-btn[_ngcontent-%COMP%]:disabled {\n      opacity: 0.6;\n      cursor: not-allowed;\n    }\n\n    .action-btn[_ngcontent-%COMP%]   i.spinning[_ngcontent-%COMP%] {\n      animation: _ngcontent-%COMP%_spin 1s linear infinite;\n    }\n\n    @keyframes _ngcontent-%COMP%_spin {\n      from { transform: rotate(0deg); }\n      to { transform: rotate(360deg); }\n    }\n\n    .execution-filters[_ngcontent-%COMP%] {\n      display: flex;\n      gap: 16px;\n      margin-bottom: 20px;\n      background: white;\n      padding: 16px;\n      border-radius: 8px;\n      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);\n    }\n\n    .filter-group[_ngcontent-%COMP%] {\n      display: flex;\n      flex-direction: column;\n      gap: 6px;\n      min-width: 150px;\n    }\n\n    .filter-group.search[_ngcontent-%COMP%] {\n      flex: 1;\n    }\n\n    .filter-group[_ngcontent-%COMP%]   label[_ngcontent-%COMP%] {\n      font-size: 11px;\n      font-weight: 600;\n      color: #666;\n      text-transform: uppercase;\n    }\n\n    .filter-group[_ngcontent-%COMP%]   select[_ngcontent-%COMP%] {\n      padding: 8px 12px;\n      border: 1px solid #ddd;\n      border-radius: 4px;\n      font-size: 13px;\n      color: #333;\n      background: white;\n    }\n\n    .search-input-wrapper[_ngcontent-%COMP%] {\n      position: relative;\n      display: flex;\n      align-items: center;\n    }\n\n    .search-input-wrapper[_ngcontent-%COMP%]   i.fa-search[_ngcontent-%COMP%] {\n      position: absolute;\n      left: 12px;\n      color: #999;\n      font-size: 12px;\n    }\n\n    .search-input-wrapper[_ngcontent-%COMP%]   input[_ngcontent-%COMP%] {\n      flex: 1;\n      padding: 8px 40px 8px 36px;\n      border: 1px solid #ddd;\n      border-radius: 4px;\n      font-size: 13px;\n    }\n\n    .clear-btn[_ngcontent-%COMP%] {\n      position: absolute;\n      right: 8px;\n      background: none;\n      border: none;\n      color: #999;\n      cursor: pointer;\n      padding: 4px;\n    }\n\n    .clear-btn[_ngcontent-%COMP%]:hover {\n      color: #333;\n    }\n\n    .execution-summary[_ngcontent-%COMP%] {\n      display: grid;\n      grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n      gap: 16px;\n      margin-bottom: 20px;\n    }\n\n    .summary-card[_ngcontent-%COMP%] {\n      background: white;\n      padding: 16px;\n      border-radius: 8px;\n      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);\n      display: flex;\n      align-items: center;\n      gap: 16px;\n    }\n\n    .summary-icon[_ngcontent-%COMP%] {\n      width: 48px;\n      height: 48px;\n      border-radius: 8px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      font-size: 20px;\n    }\n\n    .summary-icon.running[_ngcontent-%COMP%] {\n      background: #e3f2fd;\n      color: #2196f3;\n    }\n\n    .summary-icon.completed[_ngcontent-%COMP%] {\n      background: #e8f5e9;\n      color: #4caf50;\n    }\n\n    .summary-icon.failed[_ngcontent-%COMP%] {\n      background: #ffebee;\n      color: #f44336;\n    }\n\n    .summary-icon.duration[_ngcontent-%COMP%] {\n      background: #fff3e0;\n      color: #ff9800;\n    }\n\n    .summary-content[_ngcontent-%COMP%] {\n      flex: 1;\n    }\n\n    .summary-value[_ngcontent-%COMP%] {\n      font-size: 24px;\n      font-weight: 700;\n      color: #333;\n      line-height: 1;\n      margin-bottom: 4px;\n    }\n\n    .summary-label[_ngcontent-%COMP%] {\n      font-size: 11px;\n      color: #666;\n      text-transform: uppercase;\n      font-weight: 600;\n    }\n\n    .execution-content[_ngcontent-%COMP%] {\n      background: white;\n      border-radius: 8px;\n      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);\n      overflow: hidden;\n    }\n\n    .execution-list[_ngcontent-%COMP%] {\n      display: flex;\n      flex-direction: column;\n    }\n\n    .list-header[_ngcontent-%COMP%] {\n      display: grid;\n      grid-template-columns: 2fr 140px 100px 100px 100px 150px 100px;\n      gap: 16px;\n      padding: 16px;\n      background: #f8f9fa;\n      border-bottom: 2px solid #e0e0e0;\n      font-size: 11px;\n      font-weight: 600;\n      color: #666;\n      text-transform: uppercase;\n    }\n\n    .execution-row[_ngcontent-%COMP%] {\n      display: grid;\n      grid-template-columns: 2fr 140px 100px 100px 100px 150px 100px;\n      gap: 16px;\n      padding: 16px;\n      border-bottom: 1px solid #f0f0f0;\n      transition: background 0.2s ease;\n    }\n\n    .execution-row[_ngcontent-%COMP%]:hover {\n      background: #f8f9fa;\n    }\n\n    .execution-row.running[_ngcontent-%COMP%] {\n      background: #e3f2fd;\n    }\n\n    .execution-row.running[_ngcontent-%COMP%]:hover {\n      background: #bbdefb;\n    }\n\n    .cell[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      font-size: 13px;\n      color: #333;\n    }\n\n    .cell.test-name[_ngcontent-%COMP%] {\n      flex-direction: column;\n      align-items: flex-start;\n      gap: 4px;\n    }\n\n    .test-info[_ngcontent-%COMP%]   .name[_ngcontent-%COMP%] {\n      font-weight: 500;\n      color: #333;\n    }\n\n    .test-info[_ngcontent-%COMP%]   .suite[_ngcontent-%COMP%] {\n      font-size: 11px;\n      color: #666;\n    }\n\n    .cell.status[_ngcontent-%COMP%] {\n      flex-direction: column;\n      gap: 6px;\n      align-items: flex-start;\n    }\n\n    .progress-bar[_ngcontent-%COMP%] {\n      width: 100%;\n      height: 4px;\n      background: #e0e0e0;\n      border-radius: 2px;\n      overflow: hidden;\n    }\n\n    .progress-fill[_ngcontent-%COMP%] {\n      height: 100%;\n      background: #2196f3;\n      transition: width 0.3s ease;\n    }\n\n    .cell.actions[_ngcontent-%COMP%] {\n      gap: 8px;\n    }\n\n    .icon-btn[_ngcontent-%COMP%] {\n      background: none;\n      border: none;\n      color: #666;\n      cursor: pointer;\n      padding: 6px;\n      border-radius: 4px;\n      transition: all 0.2s ease;\n      font-size: 14px;\n    }\n\n    .icon-btn[_ngcontent-%COMP%]:hover {\n      background: #f0f0f0;\n      color: #2196f3;\n    }\n\n    .icon-btn.danger[_ngcontent-%COMP%]:hover {\n      background: #ffebee;\n      color: #f44336;\n    }\n\n    .no-data[_ngcontent-%COMP%] {\n      padding: 60px 20px;\n      text-align: center;\n      color: #999;\n    }\n\n    .no-data[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 48px;\n      margin-bottom: 16px;\n      opacity: 0.5;\n    }\n\n    .no-data[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\n      font-size: 14px;\n      margin-bottom: 20px;\n    }\n\n    @media (max-width: 1200px) {\n      .execution-filters[_ngcontent-%COMP%] {\n        flex-wrap: wrap;\n      }\n\n      .filter-group[_ngcontent-%COMP%] {\n        min-width: 120px;\n      }\n    }"], changeDetection: 0 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TestingExecutionComponent, [{
+        type: Component,
+        args: [{ selector: 'app-testing-execution', changeDetection: ChangeDetectionStrategy.OnPush, template: `
+    <div class="testing-execution">
+      <div class="execution-header">
+        <div class="header-left">
+          <h2>
+            <i class="fa-solid fa-play-circle"></i>
+            Test Execution Monitor
+          </h2>
+          <div class="live-indicator" *ngIf="hasRunningTests$ | async">
+            <span class="pulse"></span>
+            <span class="text">Live</span>
+          </div>
+        </div>
+        <div class="header-actions">
+          <button class="action-btn refresh" (click)="refresh()" [disabled]="isRefreshing">
+            <i class="fa-solid fa-refresh" [class.spinning]="isRefreshing"></i>
+            Refresh
+          </button>
+          <button class="action-btn primary" (click)="startNewTest()">
+            <i class="fa-solid fa-play"></i>
+            Run Test
+          </button>
+        </div>
+      </div>
+
+      <div class="execution-filters">
+        <div class="filter-group">
+          <label>Status</label>
+          <select [(ngModel)]="filters.status" (change)="onFilterChange()">
+            <option value="all">All Statuses</option>
+            <option value="running">Running</option>
+            <option value="completed">Completed</option>
+            <option value="failed">Failed</option>
+            <option value="passed">Passed</option>
+          </select>
+        </div>
+        <div class="filter-group">
+          <label>Time Range</label>
+          <select [(ngModel)]="filters.timeRange" (change)="onFilterChange()">
+            <option value="today">Today</option>
+            <option value="week">This Week</option>
+            <option value="month">This Month</option>
+            <option value="all">All Time</option>
+          </select>
+        </div>
+        <div class="filter-group search">
+          <label>Search</label>
+          <div class="search-input-wrapper">
+            <i class="fa-solid fa-search"></i>
+            <input
+              type="text"
+              [(ngModel)]="filters.searchText"
+              (input)="onFilterChange()"
+              placeholder="Search tests..."
+            />
+            <button
+              class="clear-btn"
+              *ngIf="filters.searchText"
+              (click)="clearSearch()"
+            >
+              <i class="fa-solid fa-times"></i>
+            </button>
+          </div>
+        </div>
+      </div>
+
+      <div class="execution-summary">
+        <div class="summary-card">
+          <div class="summary-icon running">
+            <i class="fa-solid fa-spinner fa-spin"></i>
+          </div>
+          <div class="summary-content">
+            <div class="summary-value">{{ (runningCount$ | async) || 0 }}</div>
+            <div class="summary-label">Running Now</div>
+          </div>
+        </div>
+        <div class="summary-card">
+          <div class="summary-icon completed">
+            <i class="fa-solid fa-check-circle"></i>
+          </div>
+          <div class="summary-content">
+            <div class="summary-value">{{ (completedTodayCount$ | async) || 0 }}</div>
+            <div class="summary-label">Completed Today</div>
+          </div>
+        </div>
+        <div class="summary-card">
+          <div class="summary-icon failed">
+            <i class="fa-solid fa-exclamation-circle"></i>
+          </div>
+          <div class="summary-content">
+            <div class="summary-value">{{ (failedTodayCount$ | async) || 0 }}</div>
+            <div class="summary-label">Failed Today</div>
+          </div>
+        </div>
+        <div class="summary-card">
+          <div class="summary-icon duration">
+            <i class="fa-solid fa-clock"></i>
+          </div>
+          <div class="summary-content">
+            <div class="summary-value">{{ formatDuration((avgDurationToday$ | async) || 0) }}</div>
+            <div class="summary-label">Avg Duration Today</div>
+          </div>
+        </div>
+      </div>
+
+      <div class="execution-content">
+        <div class="execution-list">
+          <div class="list-header">
+            <div class="header-cell test-name">Test Name</div>
+            <div class="header-cell status">Status</div>
+            <div class="header-cell score">Score</div>
+            <div class="header-cell duration">Duration</div>
+            <div class="header-cell cost">Cost</div>
+            <div class="header-cell timestamp">Started At</div>
+            <div class="header-cell actions">Actions</div>
+          </div>
+
+          @if ((filteredExecutions$ | async)?.length === 0) {
+            <div class="no-data">
+              <i class="fa-solid fa-inbox"></i>
+              <p>No test executions found</p>
+              <button class="action-btn primary" (click)="startNewTest()">
+                <i class="fa-solid fa-play"></i>
+                Run Your First Test
+              </button>
+            </div>
+          }
+
+          @for (execution of (filteredExecutions$ | async) ?? []; track execution.id) {
+            <div class="execution-row" [class.running]="execution.status === 'Running'">
+              <div class="cell test-name">
+                <div class="test-info">
+                  <div class="name">{{ execution.testName }}</div>
+                  <div class="suite">{{ execution.suiteName }}</div>
+                </div>
+              </div>
+              <div class="cell status">
+                <app-test-status-badge [status]="execution.status"></app-test-status-badge>
+                @if (execution.status === 'Running') {
+                  <div class="progress-bar">
+                    <div class="progress-fill" [style.width.%]="execution.progress"></div>
+                  </div>
+                }
+              </div>
+              <div class="cell score">
+                <app-score-indicator
+                  [score]="execution.score"
+                  [showBar]="false"
+                  [showIcon]="false"
+                ></app-score-indicator>
+              </div>
+              <div class="cell duration">
+                {{ formatDuration(execution.duration) }}
+              </div>
+              <div class="cell cost">
+                <app-cost-display [cost]="execution.cost" [showIcon]="false"></app-cost-display>
+              </div>
+              <div class="cell timestamp">
+                {{ execution.startedAt | date:'short' }}
+              </div>
+              <div class="cell actions">
+                <button class="icon-btn" (click)="viewDetails(execution)" title="View Details">
+                  <i class="fa-solid fa-eye"></i>
+                </button>
+                @if (execution.status === 'Running') {
+                  <button class="icon-btn danger" (click)="cancelExecution(execution)" title="Cancel">
+                    <i class="fa-solid fa-stop"></i>
+                  </button>
+                } @else {
+                  <button class="icon-btn" (click)="rerunTest(execution)" title="Re-run">
+                    <i class="fa-solid fa-redo"></i>
+                  </button>
+                }
+              </div>
+            </div>
+          }
+        </div>
+      </div>
+    </div>
+  `, styles: ["\n    .testing-execution {\n      padding: 20px;\n      height: 100%;\n      overflow-y: auto;\n      background: #f8f9fa;\n    }\n\n    .execution-header {\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      margin-bottom: 20px;\n      background: white;\n      padding: 20px;\n      border-radius: 8px;\n      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);\n    }\n\n    .header-left {\n      display: flex;\n      align-items: center;\n      gap: 16px;\n    }\n\n    .header-left h2 {\n      margin: 0;\n      font-size: 20px;\n      font-weight: 600;\n      color: #333;\n      display: flex;\n      align-items: center;\n      gap: 12px;\n    }\n\n    .header-left h2 i {\n      color: #2196f3;\n    }\n\n    .live-indicator {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      padding: 4px 12px;\n      background: #e3f2fd;\n      border-radius: 12px;\n      font-size: 11px;\n      font-weight: 600;\n      color: #2196f3;\n    }\n\n    .pulse {\n      width: 8px;\n      height: 8px;\n      background: #2196f3;\n      border-radius: 50%;\n      animation: pulse 2s infinite;\n    }\n\n    @keyframes pulse {\n      0%, 100% { opacity: 1; transform: scale(1); }\n      50% { opacity: 0.5; transform: scale(1.2); }\n    }\n\n    .header-actions {\n      display: flex;\n      gap: 12px;\n    }\n\n    .action-btn {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      padding: 8px 16px;\n      border: none;\n      border-radius: 4px;\n      font-size: 12px;\n      font-weight: 500;\n      cursor: pointer;\n      transition: all 0.2s ease;\n    }\n\n    .action-btn.refresh {\n      background: white;\n      border: 1px solid #ddd;\n      color: #666;\n    }\n\n    .action-btn.refresh:hover:not(:disabled) {\n      background: #f5f5f5;\n    }\n\n    .action-btn.primary {\n      background: #2196f3;\n      color: white;\n    }\n\n    .action-btn.primary:hover {\n      background: #1976d2;\n    }\n\n    .action-btn:disabled {\n      opacity: 0.6;\n      cursor: not-allowed;\n    }\n\n    .action-btn i.spinning {\n      animation: spin 1s linear infinite;\n    }\n\n    @keyframes spin {\n      from { transform: rotate(0deg); }\n      to { transform: rotate(360deg); }\n    }\n\n    .execution-filters {\n      display: flex;\n      gap: 16px;\n      margin-bottom: 20px;\n      background: white;\n      padding: 16px;\n      border-radius: 8px;\n      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);\n    }\n\n    .filter-group {\n      display: flex;\n      flex-direction: column;\n      gap: 6px;\n      min-width: 150px;\n    }\n\n    .filter-group.search {\n      flex: 1;\n    }\n\n    .filter-group label {\n      font-size: 11px;\n      font-weight: 600;\n      color: #666;\n      text-transform: uppercase;\n    }\n\n    .filter-group select {\n      padding: 8px 12px;\n      border: 1px solid #ddd;\n      border-radius: 4px;\n      font-size: 13px;\n      color: #333;\n      background: white;\n    }\n\n    .search-input-wrapper {\n      position: relative;\n      display: flex;\n      align-items: center;\n    }\n\n    .search-input-wrapper i.fa-search {\n      position: absolute;\n      left: 12px;\n      color: #999;\n      font-size: 12px;\n    }\n\n    .search-input-wrapper input {\n      flex: 1;\n      padding: 8px 40px 8px 36px;\n      border: 1px solid #ddd;\n      border-radius: 4px;\n      font-size: 13px;\n    }\n\n    .clear-btn {\n      position: absolute;\n      right: 8px;\n      background: none;\n      border: none;\n      color: #999;\n      cursor: pointer;\n      padding: 4px;\n    }\n\n    .clear-btn:hover {\n      color: #333;\n    }\n\n    .execution-summary {\n      display: grid;\n      grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n      gap: 16px;\n      margin-bottom: 20px;\n    }\n\n    .summary-card {\n      background: white;\n      padding: 16px;\n      border-radius: 8px;\n      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);\n      display: flex;\n      align-items: center;\n      gap: 16px;\n    }\n\n    .summary-icon {\n      width: 48px;\n      height: 48px;\n      border-radius: 8px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      font-size: 20px;\n    }\n\n    .summary-icon.running {\n      background: #e3f2fd;\n      color: #2196f3;\n    }\n\n    .summary-icon.completed {\n      background: #e8f5e9;\n      color: #4caf50;\n    }\n\n    .summary-icon.failed {\n      background: #ffebee;\n      color: #f44336;\n    }\n\n    .summary-icon.duration {\n      background: #fff3e0;\n      color: #ff9800;\n    }\n\n    .summary-content {\n      flex: 1;\n    }\n\n    .summary-value {\n      font-size: 24px;\n      font-weight: 700;\n      color: #333;\n      line-height: 1;\n      margin-bottom: 4px;\n    }\n\n    .summary-label {\n      font-size: 11px;\n      color: #666;\n      text-transform: uppercase;\n      font-weight: 600;\n    }\n\n    .execution-content {\n      background: white;\n      border-radius: 8px;\n      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);\n      overflow: hidden;\n    }\n\n    .execution-list {\n      display: flex;\n      flex-direction: column;\n    }\n\n    .list-header {\n      display: grid;\n      grid-template-columns: 2fr 140px 100px 100px 100px 150px 100px;\n      gap: 16px;\n      padding: 16px;\n      background: #f8f9fa;\n      border-bottom: 2px solid #e0e0e0;\n      font-size: 11px;\n      font-weight: 600;\n      color: #666;\n      text-transform: uppercase;\n    }\n\n    .execution-row {\n      display: grid;\n      grid-template-columns: 2fr 140px 100px 100px 100px 150px 100px;\n      gap: 16px;\n      padding: 16px;\n      border-bottom: 1px solid #f0f0f0;\n      transition: background 0.2s ease;\n    }\n\n    .execution-row:hover {\n      background: #f8f9fa;\n    }\n\n    .execution-row.running {\n      background: #e3f2fd;\n    }\n\n    .execution-row.running:hover {\n      background: #bbdefb;\n    }\n\n    .cell {\n      display: flex;\n      align-items: center;\n      font-size: 13px;\n      color: #333;\n    }\n\n    .cell.test-name {\n      flex-direction: column;\n      align-items: flex-start;\n      gap: 4px;\n    }\n\n    .test-info .name {\n      font-weight: 500;\n      color: #333;\n    }\n\n    .test-info .suite {\n      font-size: 11px;\n      color: #666;\n    }\n\n    .cell.status {\n      flex-direction: column;\n      gap: 6px;\n      align-items: flex-start;\n    }\n\n    .progress-bar {\n      width: 100%;\n      height: 4px;\n      background: #e0e0e0;\n      border-radius: 2px;\n      overflow: hidden;\n    }\n\n    .progress-fill {\n      height: 100%;\n      background: #2196f3;\n      transition: width 0.3s ease;\n    }\n\n    .cell.actions {\n      gap: 8px;\n    }\n\n    .icon-btn {\n      background: none;\n      border: none;\n      color: #666;\n      cursor: pointer;\n      padding: 6px;\n      border-radius: 4px;\n      transition: all 0.2s ease;\n      font-size: 14px;\n    }\n\n    .icon-btn:hover {\n      background: #f0f0f0;\n      color: #2196f3;\n    }\n\n    .icon-btn.danger:hover {\n      background: #ffebee;\n      color: #f44336;\n    }\n\n    .no-data {\n      padding: 60px 20px;\n      text-align: center;\n      color: #999;\n    }\n\n    .no-data i {\n      font-size: 48px;\n      margin-bottom: 16px;\n      opacity: 0.5;\n    }\n\n    .no-data p {\n      font-size: 14px;\n      margin-bottom: 20px;\n    }\n\n    @media (max-width: 1200px) {\n      .execution-filters {\n        flex-wrap: wrap;\n      }\n\n      .filter-group {\n        min-width: 120px;\n      }\n    }\n  "] }]
+    }], () => [{ type: i1.TestingInstrumentationService }, { type: i2.DialogService }, { type: i0.ChangeDetectorRef }], { initialState: [{
+            type: Input
+        }], stateChange: [{
+            type: Output
+        }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TestingExecutionComponent, { className: "TestingExecutionComponent", filePath: "src/Testing/components/testing-execution.component.ts", lineNumber: 608 }); })();
+//# sourceMappingURL=testing-execution.component.js.map