gamma-app-controller 1.2.18 → 1.2.20

package/fesm2020/gamma-app-controller.mjs

@@ -7096,7 +7096,6 @@ class GammaTodayPreviousComponent {
                 }
                 this.currentDateData = sortedData[0];
                 const timeValue = parseInt(value.kpiConfig?.dataConfig?.timeValue) || 1;
-                console.log(timeValue);
                 this.prevousDaysData = this.isPreviousDay ? sortedData[timeValue] || null : null;
                 if (this.isPreviousDay && this.prevousDaysData) {
                     let calValue = Math.abs((parseInt(this.getDynamicValue(this.currentDateData)) - parseInt(this.getDynamicValue(this.prevousDaysData))) /
@@ -7148,7 +7147,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
                 args: ['chartDataSource']
             }] } });
 
-const TOKEN_KEY$3 = 'x-auth-token';
+const TOKEN_KEY$4 = 'x-auth-token';
 class AppLocalStorage {
     constructor(environment) {
         this.environment = environment;
@@ -7163,7 +7162,7 @@ class AppLocalStorage {
         return window.localStorage.removeItem[this.getAppVariableName(type)];
     }
     destroy() {
-        window.localStorage.removeItem(TOKEN_KEY$3);
+        window.localStorage.removeItem(TOKEN_KEY$4);
     }
     getAppVariableName(attributeName) {
         return this.environment.appName + '__' + attributeName;
@@ -8147,10 +8146,12 @@ class AppAdvanceHeaderComponent {
         };
         this.srvTypeDataSource = [];
         this.srvTypeDisplayValue = [];
+        this.selectedDetesforView = '';
         this.selectedDateRangeOrServtype = new EventEmitter();
         this.getFilterPageConfig = new EventEmitter();
         this.getOperatorName = new EventEmitter();
         this.getContextFilterData = new EventEmitter();
+        this.selectedDatesMap = {};
     }
     set filterItems(value) {
         if (value === undefined || value.length === 0) {
@@ -8230,6 +8231,12 @@ class AppAdvanceHeaderComponent {
             });
         }
     }
+    ngOnChanges(changes) {
+        if (changes['filterObjects'] && this.filterObjects?.widgetId) {
+            const widgetId = this.filterObjects.widgetId;
+            this.selectedDatesMap[widgetId] = this.selectedDetesforView;
+        }
+    }
     getContextMenuChange(event) {
         if (event.event) {
             const foundObject = this.contextFilterItemsForFilter.find(item => item.defaultFilterValue === event.value);
@@ -8315,18 +8322,21 @@ class AppAdvanceHeaderComponent {
                 }
             }
         });
+        let selectedText = '';
         if (displayStartDate && displayEndDate) {
-            this.selectedDetesforView = `${displayStartDate} - ${displayEndDate}`;
+            selectedText = `${displayStartDate} - ${displayEndDate}`;
         }
         else if (displayStartDate) {
-            this.selectedDetesforView = displayStartDate;
+            selectedText = displayStartDate;
         }
         else if (displayEndDate) {
-            this.selectedDetesforView = displayEndDate;
+            selectedText = displayEndDate;
         }
-        else {
-            this.selectedDetesforView = '';
+        const element = document.getElementById(this.filterObjects.widgetId);
+        if (element) {
+            element.innerText = selectedText;
         }
+        filter['filterObjects'] = (this.filterObjects) ? this.filterObjects : null;
         this.getFilterPageConfig.emit(filter);
     }
     getOperatorDataSource(event) {
@@ -8378,10 +8388,10 @@ class AppAdvanceHeaderComponent {
     }
 }
 AppAdvanceHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AppAdvanceHeaderComponent, deps: [{ token: i2.ActivatedRoute }, { token: i2.Router }, { token: CommonService }, { token: AppLocalStorage }], target: i0.ɵɵFactoryTarget.Component });
-AppAdvanceHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: AppAdvanceHeaderComponent, selector: "app-advance-header", inputs: { pageTitle: "pageTitle", bread_crumbs_container: "bread_crumbs_container", isEditButton: "isEditButton", isAdvanceButton: "isAdvanceButton", selectedDates: "selectedDates", filterItems: "filterItems", contextFilterItems: "contextFilterItems" }, outputs: { toggleEvent: "toggleEvent", selectedDateRangeOrServtype: "selectedDateRangeOrServtype", getFilterPageConfig: "getFilterPageConfig", getOperatorName: "getOperatorName", getContextFilterData: "getContextFilterData" }, ngImport: i0, template: "<div class=\"flex flex-col mb-2\">\n    <div class=\"flex justify-between border-b dark:bg-transparent\">\n        <div class=\"flex flex-col ml-1\">\n            <div class=\"flex items-center float-start\">\n                <div class=\"flex items-center overflow-hidden\">\n                    <mat-icon class=\"icon-size-2\" [svgIcon]=\"'heroicons_solid:template'\"></mat-icon>\n                </div>\n                <h2\n                    class=\"text-2xl md:text-2xl py-3 font-extrabold items-center ml-2 tracking-tight leading-5 truncate capitalize\">\n                    {{ getPageTitle(pageTitle) }}\n                </h2>\n            </div>\n            <div class=\"\">\n                <!-- INCOMING -->\n                <gamma-bread-crumbs [kpi_data_container]=\"bread_crumbs_container\"></gamma-bread-crumbs>\n            </div>\n        </div>\n        <div class=\"flex justify-between items-center border-l-2 p-0 m-0\">\n\n            <div class=\"mx-2\" *ngIf=\"isEditButton\">\n                <div (click)=\"editKpi()\"\n                    class=\"bg-blue-700 cursor-pointer dark:bg-blue-600 dark:focus:ring-blue-800 dark:hover:bg-blue-700 focus:outline-none focus:ring-4 focus:ring-blue-300 font-medium hover:bg-blue-800 mr-2 px-2.5 py-2 rounded text-sm text-white ng-star-inserted\">\n                    Edit\n                </div>\n            </div>\n            <ng-container *ngIf=\"contextFilterItemsForFilter && contextFilterItemsForFilter.length !== 0 \">\n                <div class=\"w-1 h-full border-l-2\"></div>\n                <div class=\"mx-2\" >\n                    <dx-select-box [items]=\"contextFilterItemsForFilter\" (onValueChanged)=\"getContextMenuChange($event)\" displayExpr=\"label\" valueExpr=\"defaultFilterValue\"\n                    [(ngModel)]=\"defaultFilterValue\"></dx-select-box>\n                </div>\n            </ng-container>\n         \n            <div class=\"w-1 h-full border-l-2\" *ngIf=\"isEditButton\"></div>\n\n            <div class=\"mx-2\">\n                <div class=\"cursor-pointer\" (click)=\"advanceFilterKpi()\"> {{selectedDetesforView}}</div>\n            </div>\n            <div class=\"w-1 h-full border-l-2\"></div>\n            <div class=\"mx-2\" *ngIf=\"isAdvanceButton\">\n                <button class=\"mat-focus-indicator mat-menu-trigger mat-icon-button mat-button-base\"\n                    aria-haspopup=\"menu\" (click)=\"advanceFilterKpi()\">\n                    <span class=\"mat-button-wrapper\">\n                        <span class=\"relative\">\n                            <mat-icon title=\"Filters\" [svgIcon]=\"'heroicons_outline:adjustments'\">\n                            </mat-icon>\n                        </span>\n                    </span>\n                </button>\n            </div>\n\n\n            <div class=\"w-1 h-full border-l-2\"></div>\n            <!-- <div class=\"mx-2\">\n                <button class=\"mat-focus-indicator mat-menu-trigger mat-icon-button mat-button-base\"\n                    aria-haspopup=\"menu\">\n                    <span class=\"mat-button-wrapper\">\n                        <span class=\"relative\">\n                            <mat-icon (click)=\"callPageDocumentation()\" title=\"Add Filters\" [svgIcon]=\"\n                                    'heroicons_outline:question-mark-circle'\n                                \">\n                            </mat-icon>\n                        </span>\n                    </span>\n                    <span class=\"mat-button-focus-overlay\"></span>\n                </button>\n            </div> -->\n\n        </div>\n    </div>\n</div>\n\n<dx-popup [(visible)]=\"isAdvanceFilter\" [closeOnOutsideClick]=\"false\" [dragEnabled]=\"false\" [width]=\"600\"\n    [height]=\"'auto'\" [showTitle]=\"true\" class=\"popup\" title=\"Filter\">\n    <div *dxTemplate=\"let data of 'content'\">\n        <app-gamma-advance-filter [kpiId]=\"'231212'\" [filterOperatorData]=\"filterItemsForFilter\"\n            [isButtonDesiable]=\"isAdvanceFilter\" [filterStartDate]=\"filterStartDate\" [filterEndDate]=\"filterEndDate\"\n            (filterDataObject)=\"getSerchFilter($event)\"></app-gamma-advance-filter>\n    </div>\n</dx-popup>", dependencies: [{ kind: "directive", type: i4$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.DxTemplateDirective, selector: "[dxTemplate]", inputs: ["dxTemplateOf"] }, { kind: "component", type: i9$1.DxPopupComponent, selector: "dx-popup", inputs: ["accessKey", "animation", "closeOnOutsideClick", "container", "contentTemplate", "copyRootClassesToWrapper", "deferRendering", "disabled", "dragAndResizeArea", "dragEnabled", "dragOutsideBoundary", "elementAttr", "focusStateEnabled", "fullScreen", "height", "hideOnOutsideClick", "hideOnParentScroll", "hint", "hoverStateEnabled", "maxHeight", "maxWidth", "minHeight", "minWidth", "position", "resizeEnabled", "restorePosition", "rtlEnabled", "shading", "shadingColor", "showCloseButton", "showTitle", "tabIndex", "title", "titleTemplate", "toolbarItems", "visible", "width", "wrapperAttr"], outputs: ["onContentReady", "onDisposing", "onHidden", "onHiding", "onInitialized", "onOptionChanged", "onResize", "onResizeEnd", "onResizeStart", "onShowing", "onShown", "onTitleRendered", "accessKeyChange", "animationChange", "closeOnOutsideClickChange", "containerChange", "contentTemplateChange", "copyRootClassesToWrapperChange", "deferRenderingChange", "disabledChange", "dragAndResizeAreaChange", "dragEnabledChange", "dragOutsideBoundaryChange", "elementAttrChange", "focusStateEnabledChange", "fullScreenChange", "heightChange", "hideOnOutsideClickChange", "hideOnParentScrollChange", "hintChange", "hoverStateEnabledChange", "maxHeightChange", "maxWidthChange", "minHeightChange", "minWidthChange", "positionChange", "resizeEnabledChange", "restorePositionChange", "rtlEnabledChange", "shadingChange", "shadingColorChange", "showCloseButtonChange", "showTitleChange", "tabIndexChange", "titleChange", "titleTemplateChange", "toolbarItemsChange", "visibleChange", "widthChange", "wrapperAttrChange"] }, { kind: "component", type: i6$1.DxSelectBoxComponent, selector: "dx-select-box", inputs: ["acceptCustomValue", "accessKey", "activeStateEnabled", "buttons", "dataSource", "deferRendering", "disabled", "displayExpr", "displayValue", "dropDownButtonTemplate", "dropDownOptions", "elementAttr", "fieldTemplate", "focusStateEnabled", "grouped", "groupTemplate", "height", "hint", "hoverStateEnabled", "inputAttr", "isValid", "items", "itemTemplate", "label", "labelMode", "maxLength", "minSearchLength", "name", "noDataText", "opened", "openOnFieldClick", "placeholder", "readOnly", "rtlEnabled", "searchEnabled", "searchExpr", "searchMode", "searchTimeout", "selectedItem", "showClearButton", "showDataBeforeSearch", "showDropDownButton", "showSelectionControls", "spellcheck", "stylingMode", "tabIndex", "text", "useItemTextAsTitle", "validationError", "validationErrors", "validationMessageMode", "validationStatus", "value", "valueChangeEvent", "valueExpr", "visible", "width", "wrapItemText"], outputs: ["onChange", "onClosed", "onContentReady", "onCopy", "onCustomItemCreating", "onCut", "onDisposing", "onEnterKey", "onFocusIn", "onFocusOut", "onInitialized", "onInput", "onItemClick", "onKeyDown", "onKeyUp", "onOpened", "onOptionChanged", "onPaste", "onSelectionChanged", "onValueChanged", "acceptCustomValueChange", "accessKeyChange", "activeStateEnabledChange", "buttonsChange", "dataSourceChange", "deferRenderingChange", "disabledChange", "displayExprChange", "displayValueChange", "dropDownButtonTemplateChange", "dropDownOptionsChange", "elementAttrChange", "fieldTemplateChange", "focusStateEnabledChange", "groupedChange", "groupTemplateChange", "heightChange", "hintChange", "hoverStateEnabledChange", "inputAttrChange", "isValidChange", "itemsChange", "itemTemplateChange", "labelChange", "labelModeChange", "maxLengthChange", "minSearchLengthChange", "nameChange", "noDataTextChange", "openedChange", "openOnFieldClickChange", "placeholderChange", "readOnlyChange", "rtlEnabledChange", "searchEnabledChange", "searchExprChange", "searchModeChange", "searchTimeoutChange", "selectedItemChange", "showClearButtonChange", "showDataBeforeSearchChange", "showDropDownButtonChange", "showSelectionControlsChange", "spellcheckChange", "stylingModeChange", "tabIndexChange", "textChange", "useItemTextAsTitleChange", "validationErrorChange", "validationErrorsChange", "validationMessageModeChange", "validationStatusChange", "valueChange", "valueChangeEventChange", "valueExprChange", "visibleChange", "widthChange", "wrapItemTextChange", "onBlur"] }, { kind: "directive", type: i8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i8.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: GammaAdvanceFilterComponent, selector: "app-gamma-advance-filter", inputs: ["kpiId", "filterStartDate", "filterEndDate", "browser_api_config", "isButtonDesiable", "filterOperatorData"], outputs: ["filterDataObject"] }, { kind: "component", type: BreadCrumbsComponent, selector: "gamma-bread-crumbs", inputs: ["kpi_data_container"] }] });
+AppAdvanceHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: AppAdvanceHeaderComponent, selector: "app-advance-header", inputs: { pageTitle: "pageTitle", bread_crumbs_container: "bread_crumbs_container", isEditButton: "isEditButton", isAdvanceButton: "isAdvanceButton", selectedDates: "selectedDates", filterObjects: "filterObjects", filterItems: "filterItems", contextFilterItems: "contextFilterItems" }, outputs: { toggleEvent: "toggleEvent", selectedDateRangeOrServtype: "selectedDateRangeOrServtype", getFilterPageConfig: "getFilterPageConfig", getOperatorName: "getOperatorName", getContextFilterData: "getContextFilterData" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"flex flex-col mb-2\">\n    <div class=\"flex justify-between border-b dark:bg-transparent\">\n        <div class=\"flex flex-col ml-1\">\n            <div class=\"flex items-center float-start\">\n                <div class=\"flex items-center overflow-hidden\">\n                    <mat-icon class=\"icon-size-2\" [svgIcon]=\"'heroicons_solid:template'\"></mat-icon>\n                </div>\n                <h2\n                    class=\"text-2xl md:text-2xl py-3 font-extrabold items-center ml-2 tracking-tight leading-5 truncate capitalize\">\n                    {{ getPageTitle(pageTitle) }}\n                </h2>\n            </div>\n            <div class=\"\">\n                <!-- INCOMING -->\n                <gamma-bread-crumbs [kpi_data_container]=\"bread_crumbs_container\"></gamma-bread-crumbs>\n            </div>\n        </div>\n        <div class=\"flex justify-between items-center border-l-2 p-0 m-0\">\n\n            <div class=\"mx-2\" *ngIf=\"isEditButton\">\n                <div (click)=\"editKpi()\"\n                    class=\"bg-blue-700 cursor-pointer dark:bg-blue-600 dark:focus:ring-blue-800 dark:hover:bg-blue-700 focus:outline-none focus:ring-4 focus:ring-blue-300 font-medium hover:bg-blue-800 mr-2 px-2.5 py-2 rounded text-sm text-white ng-star-inserted\">\n                    Edit\n                </div>\n            </div>\n            <ng-container *ngIf=\"contextFilterItemsForFilter && contextFilterItemsForFilter.length !== 0 \">\n                <div class=\"w-1 h-full border-l-2\"></div>\n                <div class=\"mx-2\">\n                    <dx-select-box [items]=\"contextFilterItemsForFilter\" (onValueChanged)=\"getContextMenuChange($event)\"\n                        displayExpr=\"label\" valueExpr=\"defaultFilterValue\"\n                        [(ngModel)]=\"defaultFilterValue\"></dx-select-box>\n                </div>\n            </ng-container>\n\n            <div class=\"w-1 h-full border-l-2\" *ngIf=\"isEditButton\"></div>\n\n            <div class=\"mx-2\">\n                <!-- <div class=\"cursor-pointer\" (click)=\"advanceFilterKpi()\" id=\"{{filterObjects.widgetId}}\"> {{selectedDetesforView}}</div> -->\n<!-- [id]=\"filterObjects.widgetId\" -->\n                <div class=\"mx-2\">\n                    <div class=\"cursor-pointer\" (click)=\"advanceFilterKpi()\" >\n                       {{selectedDetesforView}}\n                    </div>\n                </div>\n\n            </div>\n            <div class=\"w-1 h-full border-l-2\"></div>\n            <div class=\"mx-2\" *ngIf=\"isAdvanceButton\">\n                <button class=\"mat-focus-indicator mat-menu-trigger mat-icon-button mat-button-base\"\n                    aria-haspopup=\"menu\" (click)=\"advanceFilterKpi()\">\n                    <span class=\"mat-button-wrapper\">\n                        <span class=\"relative\">\n                            <mat-icon title=\"Filters\" [svgIcon]=\"'heroicons_outline:adjustments'\">\n                            </mat-icon>\n                        </span>\n                    </span>\n                </button>\n            </div>\n\n\n            <div class=\"w-1 h-full border-l-2\"></div>\n            <!-- <div class=\"mx-2\">\n                <button class=\"mat-focus-indicator mat-menu-trigger mat-icon-button mat-button-base\"\n                    aria-haspopup=\"menu\">\n                    <span class=\"mat-button-wrapper\">\n                        <span class=\"relative\">\n                            <mat-icon (click)=\"callPageDocumentation()\" title=\"Add Filters\" [svgIcon]=\"\n                                    'heroicons_outline:question-mark-circle'\n                                \">\n                            </mat-icon>\n                        </span>\n                    </span>\n                    <span class=\"mat-button-focus-overlay\"></span>\n                </button>\n            </div> -->\n\n        </div>\n    </div>\n</div>\n\n<dx-popup [(visible)]=\"isAdvanceFilter\" [closeOnOutsideClick]=\"false\" [dragEnabled]=\"false\" [width]=\"600\"\n    [height]=\"'auto'\" [showTitle]=\"true\" class=\"popup\" title=\"Filter\">\n    <div *dxTemplate=\"let data of 'content'\">\n        <app-gamma-advance-filter [kpiId]=\"'231212'\" [filterOperatorData]=\"filterItemsForFilter\"\n            [isButtonDesiable]=\"isAdvanceFilter\" [filterStartDate]=\"filterStartDate\" [filterEndDate]=\"filterEndDate\"\n            (filterDataObject)=\"getSerchFilter($event)\"></app-gamma-advance-filter>\n    </div>\n</dx-popup>", dependencies: [{ kind: "directive", type: i4$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.DxTemplateDirective, selector: "[dxTemplate]", inputs: ["dxTemplateOf"] }, { kind: "component", type: i9$1.DxPopupComponent, selector: "dx-popup", inputs: ["accessKey", "animation", "closeOnOutsideClick", "container", "contentTemplate", "copyRootClassesToWrapper", "deferRendering", "disabled", "dragAndResizeArea", "dragEnabled", "dragOutsideBoundary", "elementAttr", "focusStateEnabled", "fullScreen", "height", "hideOnOutsideClick", "hideOnParentScroll", "hint", "hoverStateEnabled", "maxHeight", "maxWidth", "minHeight", "minWidth", "position", "resizeEnabled", "restorePosition", "rtlEnabled", "shading", "shadingColor", "showCloseButton", "showTitle", "tabIndex", "title", "titleTemplate", "toolbarItems", "visible", "width", "wrapperAttr"], outputs: ["onContentReady", "onDisposing", "onHidden", "onHiding", "onInitialized", "onOptionChanged", "onResize", "onResizeEnd", "onResizeStart", "onShowing", "onShown", "onTitleRendered", "accessKeyChange", "animationChange", "closeOnOutsideClickChange", "containerChange", "contentTemplateChange", "copyRootClassesToWrapperChange", "deferRenderingChange", "disabledChange", "dragAndResizeAreaChange", "dragEnabledChange", "dragOutsideBoundaryChange", "elementAttrChange", "focusStateEnabledChange", "fullScreenChange", "heightChange", "hideOnOutsideClickChange", "hideOnParentScrollChange", "hintChange", "hoverStateEnabledChange", "maxHeightChange", "maxWidthChange", "minHeightChange", "minWidthChange", "positionChange", "resizeEnabledChange", "restorePositionChange", "rtlEnabledChange", "shadingChange", "shadingColorChange", "showCloseButtonChange", "showTitleChange", "tabIndexChange", "titleChange", "titleTemplateChange", "toolbarItemsChange", "visibleChange", "widthChange", "wrapperAttrChange"] }, { kind: "component", type: i6$1.DxSelectBoxComponent, selector: "dx-select-box", inputs: ["acceptCustomValue", "accessKey", "activeStateEnabled", "buttons", "dataSource", "deferRendering", "disabled", "displayExpr", "displayValue", "dropDownButtonTemplate", "dropDownOptions", "elementAttr", "fieldTemplate", "focusStateEnabled", "grouped", "groupTemplate", "height", "hint", "hoverStateEnabled", "inputAttr", "isValid", "items", "itemTemplate", "label", "labelMode", "maxLength", "minSearchLength", "name", "noDataText", "opened", "openOnFieldClick", "placeholder", "readOnly", "rtlEnabled", "searchEnabled", "searchExpr", "searchMode", "searchTimeout", "selectedItem", "showClearButton", "showDataBeforeSearch", "showDropDownButton", "showSelectionControls", "spellcheck", "stylingMode", "tabIndex", "text", "useItemTextAsTitle", "validationError", "validationErrors", "validationMessageMode", "validationStatus", "value", "valueChangeEvent", "valueExpr", "visible", "width", "wrapItemText"], outputs: ["onChange", "onClosed", "onContentReady", "onCopy", "onCustomItemCreating", "onCut", "onDisposing", "onEnterKey", "onFocusIn", "onFocusOut", "onInitialized", "onInput", "onItemClick", "onKeyDown", "onKeyUp", "onOpened", "onOptionChanged", "onPaste", "onSelectionChanged", "onValueChanged", "acceptCustomValueChange", "accessKeyChange", "activeStateEnabledChange", "buttonsChange", "dataSourceChange", "deferRenderingChange", "disabledChange", "displayExprChange", "displayValueChange", "dropDownButtonTemplateChange", "dropDownOptionsChange", "elementAttrChange", "fieldTemplateChange", "focusStateEnabledChange", "groupedChange", "groupTemplateChange", "heightChange", "hintChange", "hoverStateEnabledChange", "inputAttrChange", "isValidChange", "itemsChange", "itemTemplateChange", "labelChange", "labelModeChange", "maxLengthChange", "minSearchLengthChange", "nameChange", "noDataTextChange", "openedChange", "openOnFieldClickChange", "placeholderChange", "readOnlyChange", "rtlEnabledChange", "searchEnabledChange", "searchExprChange", "searchModeChange", "searchTimeoutChange", "selectedItemChange", "showClearButtonChange", "showDataBeforeSearchChange", "showDropDownButtonChange", "showSelectionControlsChange", "spellcheckChange", "stylingModeChange", "tabIndexChange", "textChange", "useItemTextAsTitleChange", "validationErrorChange", "validationErrorsChange", "validationMessageModeChange", "validationStatusChange", "valueChange", "valueChangeEventChange", "valueExprChange", "visibleChange", "widthChange", "wrapItemTextChange", "onBlur"] }, { kind: "directive", type: i8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i8.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: GammaAdvanceFilterComponent, selector: "app-gamma-advance-filter", inputs: ["kpiId", "filterStartDate", "filterEndDate", "browser_api_config", "isButtonDesiable", "filterOperatorData"], outputs: ["filterDataObject"] }, { kind: "component", type: BreadCrumbsComponent, selector: "gamma-bread-crumbs", inputs: ["kpi_data_container"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AppAdvanceHeaderComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-advance-header', template: "<div class=\"flex flex-col mb-2\">\n    <div class=\"flex justify-between border-b dark:bg-transparent\">\n        <div class=\"flex flex-col ml-1\">\n            <div class=\"flex items-center float-start\">\n                <div class=\"flex items-center overflow-hidden\">\n                    <mat-icon class=\"icon-size-2\" [svgIcon]=\"'heroicons_solid:template'\"></mat-icon>\n                </div>\n                <h2\n                    class=\"text-2xl md:text-2xl py-3 font-extrabold items-center ml-2 tracking-tight leading-5 truncate capitalize\">\n                    {{ getPageTitle(pageTitle) }}\n                </h2>\n            </div>\n            <div class=\"\">\n                <!-- INCOMING -->\n                <gamma-bread-crumbs [kpi_data_container]=\"bread_crumbs_container\"></gamma-bread-crumbs>\n            </div>\n        </div>\n        <div class=\"flex justify-between items-center border-l-2 p-0 m-0\">\n\n            <div class=\"mx-2\" *ngIf=\"isEditButton\">\n                <div (click)=\"editKpi()\"\n                    class=\"bg-blue-700 cursor-pointer dark:bg-blue-600 dark:focus:ring-blue-800 dark:hover:bg-blue-700 focus:outline-none focus:ring-4 focus:ring-blue-300 font-medium hover:bg-blue-800 mr-2 px-2.5 py-2 rounded text-sm text-white ng-star-inserted\">\n                    Edit\n                </div>\n            </div>\n            <ng-container *ngIf=\"contextFilterItemsForFilter && contextFilterItemsForFilter.length !== 0 \">\n                <div class=\"w-1 h-full border-l-2\"></div>\n                <div class=\"mx-2\" >\n                    <dx-select-box [items]=\"contextFilterItemsForFilter\" (onValueChanged)=\"getContextMenuChange($event)\" displayExpr=\"label\" valueExpr=\"defaultFilterValue\"\n                    [(ngModel)]=\"defaultFilterValue\"></dx-select-box>\n                </div>\n            </ng-container>\n         \n            <div class=\"w-1 h-full border-l-2\" *ngIf=\"isEditButton\"></div>\n\n            <div class=\"mx-2\">\n                <div class=\"cursor-pointer\" (click)=\"advanceFilterKpi()\"> {{selectedDetesforView}}</div>\n            </div>\n            <div class=\"w-1 h-full border-l-2\"></div>\n            <div class=\"mx-2\" *ngIf=\"isAdvanceButton\">\n                <button class=\"mat-focus-indicator mat-menu-trigger mat-icon-button mat-button-base\"\n                    aria-haspopup=\"menu\" (click)=\"advanceFilterKpi()\">\n                    <span class=\"mat-button-wrapper\">\n                        <span class=\"relative\">\n                            <mat-icon title=\"Filters\" [svgIcon]=\"'heroicons_outline:adjustments'\">\n                            </mat-icon>\n                        </span>\n                    </span>\n                </button>\n            </div>\n\n\n            <div class=\"w-1 h-full border-l-2\"></div>\n            <!-- <div class=\"mx-2\">\n                <button class=\"mat-focus-indicator mat-menu-trigger mat-icon-button mat-button-base\"\n                    aria-haspopup=\"menu\">\n                    <span class=\"mat-button-wrapper\">\n                        <span class=\"relative\">\n                            <mat-icon (click)=\"callPageDocumentation()\" title=\"Add Filters\" [svgIcon]=\"\n                                    'heroicons_outline:question-mark-circle'\n                                \">\n                            </mat-icon>\n                        </span>\n                    </span>\n                    <span class=\"mat-button-focus-overlay\"></span>\n                </button>\n            </div> -->\n\n        </div>\n    </div>\n</div>\n\n<dx-popup [(visible)]=\"isAdvanceFilter\" [closeOnOutsideClick]=\"false\" [dragEnabled]=\"false\" [width]=\"600\"\n    [height]=\"'auto'\" [showTitle]=\"true\" class=\"popup\" title=\"Filter\">\n    <div *dxTemplate=\"let data of 'content'\">\n        <app-gamma-advance-filter [kpiId]=\"'231212'\" [filterOperatorData]=\"filterItemsForFilter\"\n            [isButtonDesiable]=\"isAdvanceFilter\" [filterStartDate]=\"filterStartDate\" [filterEndDate]=\"filterEndDate\"\n            (filterDataObject)=\"getSerchFilter($event)\"></app-gamma-advance-filter>\n    </div>\n</dx-popup>" }]
+            args: [{ selector: 'app-advance-header', template: "<div class=\"flex flex-col mb-2\">\n    <div class=\"flex justify-between border-b dark:bg-transparent\">\n        <div class=\"flex flex-col ml-1\">\n            <div class=\"flex items-center float-start\">\n                <div class=\"flex items-center overflow-hidden\">\n                    <mat-icon class=\"icon-size-2\" [svgIcon]=\"'heroicons_solid:template'\"></mat-icon>\n                </div>\n                <h2\n                    class=\"text-2xl md:text-2xl py-3 font-extrabold items-center ml-2 tracking-tight leading-5 truncate capitalize\">\n                    {{ getPageTitle(pageTitle) }}\n                </h2>\n            </div>\n            <div class=\"\">\n                <!-- INCOMING -->\n                <gamma-bread-crumbs [kpi_data_container]=\"bread_crumbs_container\"></gamma-bread-crumbs>\n            </div>\n        </div>\n        <div class=\"flex justify-between items-center border-l-2 p-0 m-0\">\n\n            <div class=\"mx-2\" *ngIf=\"isEditButton\">\n                <div (click)=\"editKpi()\"\n                    class=\"bg-blue-700 cursor-pointer dark:bg-blue-600 dark:focus:ring-blue-800 dark:hover:bg-blue-700 focus:outline-none focus:ring-4 focus:ring-blue-300 font-medium hover:bg-blue-800 mr-2 px-2.5 py-2 rounded text-sm text-white ng-star-inserted\">\n                    Edit\n                </div>\n            </div>\n            <ng-container *ngIf=\"contextFilterItemsForFilter && contextFilterItemsForFilter.length !== 0 \">\n                <div class=\"w-1 h-full border-l-2\"></div>\n                <div class=\"mx-2\">\n                    <dx-select-box [items]=\"contextFilterItemsForFilter\" (onValueChanged)=\"getContextMenuChange($event)\"\n                        displayExpr=\"label\" valueExpr=\"defaultFilterValue\"\n                        [(ngModel)]=\"defaultFilterValue\"></dx-select-box>\n                </div>\n            </ng-container>\n\n            <div class=\"w-1 h-full border-l-2\" *ngIf=\"isEditButton\"></div>\n\n            <div class=\"mx-2\">\n                <!-- <div class=\"cursor-pointer\" (click)=\"advanceFilterKpi()\" id=\"{{filterObjects.widgetId}}\"> {{selectedDetesforView}}</div> -->\n<!-- [id]=\"filterObjects.widgetId\" -->\n                <div class=\"mx-2\">\n                    <div class=\"cursor-pointer\" (click)=\"advanceFilterKpi()\" >\n                       {{selectedDetesforView}}\n                    </div>\n                </div>\n\n            </div>\n            <div class=\"w-1 h-full border-l-2\"></div>\n            <div class=\"mx-2\" *ngIf=\"isAdvanceButton\">\n                <button class=\"mat-focus-indicator mat-menu-trigger mat-icon-button mat-button-base\"\n                    aria-haspopup=\"menu\" (click)=\"advanceFilterKpi()\">\n                    <span class=\"mat-button-wrapper\">\n                        <span class=\"relative\">\n                            <mat-icon title=\"Filters\" [svgIcon]=\"'heroicons_outline:adjustments'\">\n                            </mat-icon>\n                        </span>\n                    </span>\n                </button>\n            </div>\n\n\n            <div class=\"w-1 h-full border-l-2\"></div>\n            <!-- <div class=\"mx-2\">\n                <button class=\"mat-focus-indicator mat-menu-trigger mat-icon-button mat-button-base\"\n                    aria-haspopup=\"menu\">\n                    <span class=\"mat-button-wrapper\">\n                        <span class=\"relative\">\n                            <mat-icon (click)=\"callPageDocumentation()\" title=\"Add Filters\" [svgIcon]=\"\n                                    'heroicons_outline:question-mark-circle'\n                                \">\n                            </mat-icon>\n                        </span>\n                    </span>\n                    <span class=\"mat-button-focus-overlay\"></span>\n                </button>\n            </div> -->\n\n        </div>\n    </div>\n</div>\n\n<dx-popup [(visible)]=\"isAdvanceFilter\" [closeOnOutsideClick]=\"false\" [dragEnabled]=\"false\" [width]=\"600\"\n    [height]=\"'auto'\" [showTitle]=\"true\" class=\"popup\" title=\"Filter\">\n    <div *dxTemplate=\"let data of 'content'\">\n        <app-gamma-advance-filter [kpiId]=\"'231212'\" [filterOperatorData]=\"filterItemsForFilter\"\n            [isButtonDesiable]=\"isAdvanceFilter\" [filterStartDate]=\"filterStartDate\" [filterEndDate]=\"filterEndDate\"\n            (filterDataObject)=\"getSerchFilter($event)\"></app-gamma-advance-filter>\n    </div>\n</dx-popup>" }]
         }], ctorParameters: function () { return [{ type: i2.ActivatedRoute }, { type: i2.Router }, { type: CommonService }, { type: AppLocalStorage }]; }, propDecorators: { pageTitle: [{
                 type: Input
             }], bread_crumbs_container: [{
@@ -8402,6 +8412,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
                 type: Output
             }], getContextFilterData: [{
                 type: Output
+            }], filterObjects: [{
+                type: Input
             }], filterItems: [{
                 type: Input,
                 args: ['filterItems']
@@ -12770,6 +12782,7 @@ class PageControlerComponent {
             { "compName": "KpiWithDataSetTestComponent", "item": "Default KPI Layout" },
             { "compName": "KpiWithMultilayoutSetTestComponent", "item": "Multiple Layout KPI" },
             { "compName": "LandingComponentComponent", "item": "Default Page" },
+            { "compName": "MultiLayoutLandingComponentComponent", "item": "Multiple Layout Page" },
             { "compName": "CdrConfigComponent", "item": "CDR Config" },
             { "compName": "CreateKpiTreeComponent", "item": "Create KPI Config" },
             { "compName": "CreateMetricsComponent", "item": "Create Metrics" },
@@ -18199,7 +18212,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
                     args: [APP_ENVIRONMENT]
                 }] }]; } });
 
-const TOKEN_KEY$2 = 'x-auth-token';
+const TOKEN_KEY$3 = 'x-auth-token';
 class AppSingleLayoutLocalStorage {
     constructor(environment) {
         this.environment = environment;
@@ -18214,7 +18227,7 @@ class AppSingleLayoutLocalStorage {
         return window.localStorage.removeItem[this.getAppVariableName(type)];
     }
     destroy() {
-        window.localStorage.removeItem(TOKEN_KEY$2);
+        window.localStorage.removeItem(TOKEN_KEY$3);
     }
     getAppVariableName(attributeName) {
         return this.environment.appName + '__' + attributeName;
@@ -20378,7 +20391,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
                     args: [APP_ENVIRONMENT]
                 }] }]; } });
 
-const TOKEN_KEY$1 = 'x-auth-token';
+const TOKEN_KEY$2 = 'x-auth-token';
 class AppMultiLayoutLocalStorage {
     constructor(environment) {
         this.environment = environment;
@@ -20393,7 +20406,7 @@ class AppMultiLayoutLocalStorage {
         return window.localStorage.removeItem[this.getAppVariableName(type)];
     }
     destroy() {
-        window.localStorage.removeItem(TOKEN_KEY$1);
+        window.localStorage.removeItem(TOKEN_KEY$2);
     }
     getAppVariableName(attributeName) {
         return this.environment.appName + '__' + attributeName;
@@ -21990,7 +22003,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
                     args: [APP_ENVIRONMENT]
                 }] }]; } });
 
-const TOKEN_KEY = 'x-auth-token';
+const TOKEN_KEY$1 = 'x-auth-token';
 class AppLandingLayoutLocalStorage {
     constructor(environment) {
         this.environment = environment;
@@ -22005,7 +22018,7 @@ class AppLandingLayoutLocalStorage {
         return window.localStorage.removeItem[this.getAppVariableName(type)];
     }
     destroy() {
-        window.localStorage.removeItem(TOKEN_KEY);
+        window.localStorage.removeItem(TOKEN_KEY$1);
     }
     getAppVariableName(attributeName) {
         return this.environment.appName + '__' + attributeName;
@@ -22349,6 +22362,7 @@ class LandingComponentComponent {
             const innerDiv = document.createElement('div');
             innerDiv.classList.add('rounded', 'justify-center', 'items-center', 'border', 'p-1', 'm-1', 'flex', 'flex-row');
             item.compConfig.viewConfig.forEach(element => {
+                console.log(element);
                 element.kpiConfig['dataSource'] = datasetById[element.datasetId];
                 element.kpiConfig['contextMenu'] = this.contextMenuDataSource;
                 element['titleParams'] = item.nodeProperties.widgetParams || "";
@@ -22696,7 +22710,6 @@ class LandingComponentComponent {
                                         const queryString = new URLSearchParams(params).toString();
                                         const fullUrl = this.router.serializeUrl(this.router.createUrlTree([data.pageUrl], { queryParams: params }));
                                         this.router.navigate([data.pageUrl], { queryParams });
-                                        console.log(data);
                                     }
                                 }
                             });
@@ -22845,7 +22858,6 @@ class LandingComponentComponent {
             queryParamsHandling: "merge"
         };
         this.router.navigate([], navigation);
-        console.log(this.stateDataSource);
         setTimeout(() => {
             this.scrollToBottom(this.mainPageDivElement);
         }, 200);
@@ -23350,6 +23362,1875 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
                 }]
         }] });
 
+class LandingMultiLayoutComponentService {
+    constructor(http, environment) {
+        this.http = http;
+        this.environment = environment;
+        this.headers = new HttpHeaders().set('Content-Type', 'application/json');
+        this.options = { headers: this.headers, withCredentials: true };
+        this._selectedKpiOnClick = new Subject();
+        this._kpilist = new Subject();
+        this._selectKpiFromDropDown = new Subject();
+        this._componentRegistry = new Map();
+        this.kpiFilter = new BehaviorSubject([]);
+    }
+    handleError(error) {
+        return throwError(error);
+    }
+    getlistKpiBrowser() {
+        const apiUrl = this.environment.appUrl + this.environment.apiVersion + '/kpi-config/listKpiBrowser';
+        return this.http
+            .get(apiUrl, { withCredentials: true })
+            .pipe(map((response) => {
+            return response;
+        }), catchError(this.handleError));
+    }
+    getAppPageDetailConfig(pageId) {
+        return this.http
+            .get(this.environment.appUrl + this.environment.apiVersion + '/kpi-config/getAppPageDetailConfig?pageConfigId=' + pageId, this.options)
+            .pipe(map((response) => {
+            return response;
+        }), catchError(this.handleError));
+    }
+    getAppPageConfigs() {
+        const apiUrl = this.environment.appUrl + this.environment.apiVersion + '/kpi-config/getAppPageConfigs';
+        return this.http
+            .get(apiUrl, { withCredentials: true })
+            .pipe(map((response) => {
+            return response;
+        }), catchError(this.handleError));
+    }
+    getAppDatasetConfigs() {
+        const apiUrl = this.environment.appUrl + this.environment.apiVersion + '/kpi-config/getAppDatasetConfigs';
+        return this.http
+            .get(apiUrl, { withCredentials: true })
+            .pipe(map((response) => {
+            return response;
+        }), catchError(this.handleError));
+    }
+    getAppDatasetConfig(datasetId) {
+        const apiUrl = this.environment.appUrl + this.environment.apiVersion + '/kpi-config/getAppDatasetConfig?datasetId=' + datasetId;
+        return this.http
+            .get(apiUrl, { withCredentials: true })
+            .pipe(map((response) => {
+            return response;
+        }), catchError(this.handleError));
+    }
+    getAppFilterConfig(filterId) {
+        return this.http
+            .get(this.environment.appUrl + this.environment.apiVersion + '/kpi-config/getAppFilterConfig?filterId=' + filterId, this.options)
+            .pipe(map((response) => {
+            return response;
+        }), catchError(this.handleError));
+    }
+    getAppViewConfigs() {
+        const apiUrl = this.environment.appUrl + this.environment.apiVersion + '/kpi-config/getAppViewConfigs';
+        return this.http
+            .get(apiUrl, { withCredentials: true })
+            .pipe(map((response) => {
+            return response;
+        }), catchError(this.handleError));
+    }
+    getData(body, requestID) {
+        return this.http
+            .post(this.environment.appUrl + this.environment.apiVersion + requestID, JSON.stringify(body), this.options)
+            .pipe(map((response) => {
+            return response;
+        }), catchError(this.handleError));
+    }
+    getSimpleApiPostRequest(requestApi, body) {
+        return this.http
+            .post(this.environment.appUrl + this.environment.apiVersion + requestApi, JSON.stringify(body), this.options)
+            .pipe(map((response) => {
+            return response;
+        }), catchError(this.handleError));
+    }
+    getSimpleApiGetRequest(requestApi) {
+        return this.http
+            .get(this.environment.appUrl + this.environment.apiVersion + requestApi, { withCredentials: true })
+            .pipe(map((response) => {
+            return response;
+        }), catchError(this.handleError));
+    }
+    getJsonDatasetPayload(requestApi) {
+        return this.http
+            .get(this.environment.appUrl + this.environment.apiVersion + requestApi, { withCredentials: true })
+            .pipe(map((response) => {
+            return response;
+        }), catchError(this.handleError));
+    }
+    genericSqlQueryResponse(requestApi, body) {
+        return this.http
+            .post(this.environment.appUrl + this.environment.apiVersion + requestApi, JSON.stringify(body), this.options)
+            .pipe(map((response) => {
+            return response;
+        }), catchError(this.handleError));
+    }
+}
+LandingMultiLayoutComponentService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: LandingMultiLayoutComponentService, deps: [{ token: i1.HttpClient }, { token: APP_ENVIRONMENT }], target: i0.ɵɵFactoryTarget.Injectable });
+LandingMultiLayoutComponentService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: LandingMultiLayoutComponentService, providedIn: "root" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: LandingMultiLayoutComponentService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: "root" }]
+        }], ctorParameters: function () { return [{ type: i1.HttpClient }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: [APP_ENVIRONMENT]
+                }] }]; } });
+
+class LandingMultiLayoutApplicationDatssetsCall {
+    constructor(service, kpiService, toastr, environment) {
+        this.service = service;
+        this.kpiService = kpiService;
+        this.toastr = toastr;
+        this.environment = environment;
+        this.uniqueDataSetObject = {};
+    }
+    getDataFromDataSet(dataset, datasetId, filters) {
+        if (dataset.datasetType == "mongo") {
+            return this.getDataSetForMongo(dataset, datasetId);
+        }
+        else if (dataset.datasetType == "querybuilder") {
+            return this.getDatasetForImpala(dataset, datasetId, filters);
+        }
+        else if (dataset.datasetType == "simpleApi") {
+            return this.getDatasetForSimpleApiImpala(dataset, datasetId, filters);
+        }
+        else if (dataset.datasetType == "plainjson") {
+            return this.getDatasetForPlainJson(dataset, datasetId, filters);
+        }
+        else if (dataset.datasetType == "sqlQuery") {
+            return this.getDatasetForSqlTemplate(dataset, datasetId, filters);
+        }
+        else {
+            return Promise.resolve();
+        }
+    }
+    getDataSetForMongo(dataset, datasetId) {
+        return new Promise((resolve, reject) => {
+            let apiJsonObject = {
+                requestId: dataset.config.serviceId,
+            };
+            if (dataset.config.fixOperationLevles && dataset.config.fixOperationLevles.length != 0) {
+                for (const item of dataset.config.fixOperationLevles) {
+                    Object.assign(apiJsonObject, item);
+                }
+            }
+            const mon_config = this.kpiService.getAllSeviceApiJson(apiJsonObject);
+            this.service.getData(mon_config, dataset.config.api).subscribe({
+                next: (data) => {
+                    const payload = data["Payload"] || data;
+                    this.uniqueDataSetObject[datasetId] = payload;
+                    resolve();
+                },
+                error: (err) => {
+                    console.error('Error:', err);
+                    reject(err);
+                }
+            });
+        });
+    }
+    getDatasetForImpala(dataset, datasetId, filters) {
+        return new Promise((resolve, reject) => {
+            let request = dataset.config.queryConfig;
+            let transformedObject = {};
+            for (let item of request.reqFields) {
+                const key = Object.keys(item)[0];
+                const value = Object.values(item)[0];
+                if (key === 'startDate') {
+                    transformedObject.recordDate = value;
+                }
+                else {
+                    transformedObject[key] = value;
+                }
+            }
+            const operator = (filters && filters.length !== 0) ? Object.keys(filters.operationFilter).map(key => ({ [key]: filters.operationFilter[key] })) : [];
+            transformedObject['filters'] = this.transformDataForMFilter(operator, request.mapedFilters);
+            transformedObject['sorters'] = request.sorters;
+            transformedObject["paginationRequired"] = false;
+            if (dataset.config.api == "/kpi/genericAggregatePaginatedKpiServiceResponse") {
+                transformedObject['measures'] = request.measures;
+                transformedObject['dimensions'] = request.dimensions;
+            }
+            else {
+                transformedObject['columns'] = this.getFormatObjectForColumn(request.columns);
+            }
+            if (request.havings && request.havings.length !== 0) {
+                transformedObject['havings'] = request.havings;
+            }
+            this.service.getData(transformedObject, dataset.config.api).subscribe({
+                next: (data) => {
+                    const payload = data['dataset'];
+                    this.uniqueDataSetObject[datasetId] = payload;
+                    resolve();
+                },
+                error: (err) => {
+                    console.error('Error:', err);
+                    this.toastr.error(err.message);
+                    reject(err);
+                }
+            });
+        });
+    }
+    getFormatObjectForColumn(columns) {
+        let columnData = [];
+        columns.forEach(element => {
+            const { advancedColumn, columnName, enrichFunction, dataField } = element;
+            columnData.push({
+                "advancedColumn": advancedColumn,
+                "columnName": columnName,
+                "enrichFunction": enrichFunction,
+                "aliasName": dataField
+            });
+        });
+        return columnData;
+    }
+    transformDataForMFilter(filterdata, mapData) {
+        let result = [];
+        mapData.forEach(mapping => {
+            let resultObj = {
+                columnName: mapping.serverColumn,
+                dataType: mapping.dataType,
+                operator: mapping.operatorName,
+                value: mapping.defaultValue
+            };
+            if (mapping.serverColumn.includes('date') && typeof resultObj.value === 'string') {
+                if (mapping.formatter && mapping.formatter !== "") {
+                    resultObj.value = moment$1(resultObj.value, "YYYY-MM-DD").format(mapping.formatter);
+                }
+                else {
+                    resultObj.value = moment$1(resultObj.value, "YYYY-MM-DD").format(this.environment.dataFormat);
+                }
+            }
+            const filter = filterdata.find(f => f.hasOwnProperty(mapping.localColumn));
+            if (filter) {
+                if (mapping.defaultValue === "") {
+                    const value = filter[mapping.localColumn];
+                    if (Array.isArray(value)) {
+                        resultObj.operator = "in";
+                        resultObj.value = value.join(",");
+                    }
+                    else {
+                        resultObj.value = value;
+                    }
+                    if (mapping.serverColumn.includes('date') && typeof resultObj.value === 'string') {
+                        if (mapping.formatter && mapping.formatter !== "") {
+                            resultObj.value = moment$1(resultObj.value, "YYYY-MM-DD").format(mapping.formatter);
+                        }
+                        else {
+                            resultObj.value = moment$1(resultObj.value, "YYYY-MM-DD").format(this.environment.dataFormat);
+                        }
+                    }
+                }
+            }
+            else if (mapping.defaultValue === "") {
+                return;
+            }
+            result.push(resultObj);
+        });
+        filterdata = filterdata.filter(obj => {
+            const key = Object.keys(obj)[0];
+            return key !== 'startDate' && key !== 'endDate';
+        });
+        filterdata.forEach(filter => {
+            const filterKey = Object.keys(filter)[0];
+            const existingMapping = mapData.find(mapping => mapping.localColumn === filterKey);
+            if (!existingMapping) {
+                let resultObj = {
+                    columnName: filterKey,
+                    dataType: "string",
+                    operator: "eq",
+                    value: filter[filterKey]
+                };
+                if (Array.isArray(filter[filterKey])) {
+                    resultObj.operator = "in";
+                    resultObj.value = filter[filterKey].join(",");
+                }
+                else {
+                    resultObj.value = filter[filterKey];
+                }
+                if (filterKey == 'operator_key') {
+                    resultObj.operator = "eq";
+                }
+                result.push(resultObj);
+            }
+        });
+        result = result.filter(obj => obj.value !== null && obj.value !== "");
+        return result;
+    }
+    getDatasetForSimpleApiImpala(dataset, datasetId, filters) {
+        return new Promise((resolve, reject) => {
+            dataset.config.queryConfig.mapedFilters.forEach(filter => {
+                if (filters.operationFilter.hasOwnProperty(filter.localColumn)) {
+                    filter.defaultValue = filters.operationFilter[filter.localColumn];
+                }
+            });
+            if (dataset.config.apiType === "post") {
+                let serviceJson = {};
+                dataset.config.queryConfig.mapedFilters.forEach((filter) => {
+                    let datecolumn = filter.serverColumn.toLowerCase();
+                    if (datecolumn.includes('date') && typeof filter.dataType === 'string') {
+                        serviceJson[filter.serverColumn] = moment$1(filter.defaultValue, "YYYY-MM-DD").format(this.environment.dataFormat);
+                    }
+                    else {
+                        serviceJson[filter.serverColumn] = filter.defaultValue;
+                    }
+                });
+                this.service.getSimpleApiPostRequest(dataset.config.api, serviceJson).subscribe({
+                    next: (data) => {
+                        const payload = data["Payload"] || data;
+                        this.uniqueDataSetObject[datasetId] = payload;
+                        resolve();
+                    },
+                    error: (err) => {
+                        console.error('Error:', err);
+                        this.toastr.error(err.message);
+                        reject(err);
+                    }
+                });
+            }
+            else if (dataset.config.apiType === "get") {
+                let requestUrl = dataset.config.api + "?";
+                dataset.config.queryConfig.mapedFilters.forEach((filter, index) => {
+                    requestUrl += `${filter.serverColumn}=${filter.defaultValue}`;
+                    if (index < dataset.config.queryConfig.mapedFilters.length - 1) {
+                        requestUrl += "&";
+                    }
+                });
+                this.service.getSimpleApiGetRequest(requestUrl).subscribe({
+                    next: (data) => {
+                        const payload = data["Payload"] || data;
+                        this.uniqueDataSetObject[datasetId] = payload;
+                        resolve();
+                    },
+                    error: (err) => {
+                        console.error('Error:', err);
+                        this.toastr.error(err.message);
+                        reject(err);
+                    }
+                });
+            }
+        });
+    }
+    getDatasetForPlainJson(dataset, datasetId, filter) {
+        return new Promise((resolve, reject) => {
+            let requestapi = dataset.config.api + '?datasetId=' + dataset.datasetId;
+            this.service.getJsonDatasetPayload(requestapi).subscribe({
+                next: (data) => {
+                    const payload = data["Payload"] || data;
+                    this.uniqueDataSetObject[datasetId] = payload;
+                    resolve();
+                },
+                error: (err) => {
+                    console.error('Error:', err);
+                    reject(err);
+                }
+            });
+        });
+    }
+    getDatasetForSqlTemplate(dataset, datasetId, filters) {
+        return new Promise((resolve, reject) => {
+            const operator = (filters && filters.length !== 0) ? Object.keys(filters.operationFilter).map(key => ({ [key]: filters.operationFilter[key] })) : [];
+            let requestAp = dataset.config.api;
+            let request_params = {
+                'dbConfig': dataset.config.queryConfig.dbConfig,
+                'databaseName': dataset.config.queryConfig.databaseName,
+                'filters': this.transformDataForMFilterForSQl(operator, dataset.config.queryConfig.mapedFilters),
+                'templateQuery': dataset.config.queryConfig.templateQuery,
+                'enrichments': dataset.config.queryConfig.enrichments,
+            };
+            this.service.genericSqlQueryResponse(requestAp, request_params).subscribe({
+                next: (data) => {
+                    const payload = data["Payload"] || data;
+                    this.uniqueDataSetObject[datasetId] = payload;
+                    resolve();
+                },
+                error: (err) => {
+                    console.error('Error:', err);
+                    this.toastr.error(err.message);
+                    reject(err);
+                }
+            });
+        });
+    }
+    transformDataForMFilterForSQl(filterdata, mapData) {
+        let result = [];
+        mapData.forEach(mapping => {
+            let resultObj = {
+                columnName: mapping.serverColumn,
+                dataType: mapping.dataType,
+                operator: mapping.operatorName,
+                value: mapping.defaultValue,
+                aliasColumnName: mapping.localColumn,
+            };
+            if (mapping.serverColumn.includes('date') && typeof resultObj.value === 'string') {
+                if (mapping.formatter && mapping.formatter !== "") {
+                    resultObj.value = moment$1(resultObj.value, "YYYY-MM-DD").format(mapping.formatter);
+                }
+                else {
+                    resultObj.value = moment$1(resultObj.value, "YYYY-MM-DD").format(this.environment.dataFormat);
+                }
+            }
+            const filter = filterdata.find(f => f.hasOwnProperty(mapping.localColumn));
+            if (filter) {
+                if (mapping.defaultValue === "") {
+                    const value = filter[mapping.localColumn];
+                    if (Array.isArray(value)) {
+                        resultObj.operator = "in";
+                        resultObj.value = value.join(",");
+                    }
+                    else {
+                        resultObj.value = value;
+                    }
+                    if (mapping.serverColumn.includes('date') && typeof resultObj.value === 'string') {
+                        resultObj.value = moment$1(resultObj.value, "YYYY-MM-DD").format(this.environment.dataFormat);
+                    }
+                }
+            }
+            else if (mapping.defaultValue === "") {
+                return;
+            }
+            result.push(resultObj);
+        });
+        filterdata = filterdata.filter(obj => {
+            const key = Object.keys(obj)[0];
+            return key !== 'startDate' && key !== 'endDate';
+        });
+        filterdata.forEach(filter => {
+            const filterKey = Object.keys(filter)[0];
+            const existingMapping = mapData.find(mapping => mapping.localColumn === filterKey);
+            if (!existingMapping) {
+                let resultObj = {
+                    columnName: filterKey,
+                    dataType: "string",
+                    operator: "eq",
+                    value: filter[filterKey]
+                };
+                if (Array.isArray(filter[filterKey])) {
+                    resultObj.operator = "in";
+                    resultObj.value = filter[filterKey].join(",");
+                }
+                else {
+                    resultObj.value = filter[filterKey];
+                }
+                if (filterKey == 'operator_key') {
+                    resultObj.operator = "eq";
+                }
+                result.push(resultObj);
+            }
+        });
+        return result;
+    }
+    getUniqueDataSetObject() {
+        return this.uniqueDataSetObject;
+    }
+}
+LandingMultiLayoutApplicationDatssetsCall.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: LandingMultiLayoutApplicationDatssetsCall, deps: [{ token: LandingMultiLayoutComponentService }, { token: kpicommonService$2 }, { token: i3$1.ToastrService }, { token: APP_ENVIRONMENT }], target: i0.ɵɵFactoryTarget.Injectable });
+LandingMultiLayoutApplicationDatssetsCall.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: LandingMultiLayoutApplicationDatssetsCall, providedIn: "root" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: LandingMultiLayoutApplicationDatssetsCall, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: "root" }]
+        }], ctorParameters: function () { return [{ type: LandingMultiLayoutComponentService }, { type: kpicommonService$2 }, { type: i3$1.ToastrService }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: [APP_ENVIRONMENT]
+                }] }]; } });
+
+const TOKEN_KEY = 'x-auth-token';
+class AppLandingMultiLayoutLocalStorage {
+    constructor(environment) {
+        this.environment = environment;
+    }
+    save(type, token) {
+        window.localStorage[this.getAppVariableName(type)] = token;
+    }
+    get(type) {
+        return window.localStorage[this.getAppVariableName(type)];
+    }
+    delete(type) {
+        return window.localStorage.removeItem[this.getAppVariableName(type)];
+    }
+    destroy() {
+        window.localStorage.removeItem(TOKEN_KEY);
+    }
+    getAppVariableName(attributeName) {
+        return this.environment.appName + '__' + attributeName;
+    }
+}
+AppLandingMultiLayoutLocalStorage.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AppLandingMultiLayoutLocalStorage, deps: [{ token: APP_ENVIRONMENT }], target: i0.ɵɵFactoryTarget.Injectable });
+AppLandingMultiLayoutLocalStorage.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AppLandingMultiLayoutLocalStorage, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AppLandingMultiLayoutLocalStorage, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], ctorParameters: function () { return [{ type: undefined, decorators: [{
+                    type: Inject,
+                    args: [APP_ENVIRONMENT]
+                }] }]; } });
+
+class MultiLayoutLandingComponentComponent {
+    constructor(commonService, activatedRoute, viewContainerRef, componentFactoryResolver, service, toastr, router, datasetService, storage, cdr) {
+        this.commonService = commonService;
+        this.activatedRoute = activatedRoute;
+        this.viewContainerRef = viewContainerRef;
+        this.componentFactoryResolver = componentFactoryResolver;
+        this.service = service;
+        this.toastr = toastr;
+        this.router = router;
+        this.datasetService = datasetService;
+        this.storage = storage;
+        this.cdr = cdr;
+        this.dashbord_container = [];
+        this.widget_width = ['w-full', 'w-1/2', 'w-1/3', 'w-1/4', 'w-1/5', 'w-1/6'];
+        this.page_title = 'Dashboard';
+        this.dynamicComponentRefs = [];
+        this.componentClassMap = {
+            GammaAdvanceChartComponent,
+            GammaTodayPreviousComponent,
+            AppAdvanceHeaderComponent,
+            GammaTableWithPercentageComponent,
+            GammSingleNumberCardComponent,
+            GammaAdvanceOperatorTableComponent,
+            AdvanceWidgetHeaderFilterComponent,
+            GammaGeoChartComponent,
+            GammaHeatChartComponent
+        };
+        this.dataSourceMataData = [];
+        this.queryType = "mongo";
+        this.dataSetModal = [];
+        this.componentConfigDataSource = [];
+        this.dataSourceModal = {};
+        this.isDashBoardContent = false;
+        this.selectedViewFormComponent = {};
+        this.addedwidGetConfig = {
+            "display": true,
+            "widgetTitle": "",
+            "width": "",
+            "height": ""
+        };
+        this.dashBoardWidgetConfig = [];
+        this.selectedIndexObjForChart = {};
+        this.selectedContainerObjectForChart = {};
+        this.uniqueDataSetObject = {};
+        this.isDashBoardContentTypeView = true;
+        this.allWidgetByDataset = [];
+        this.stateDataSource = new Map();
+        this.contextMenuDataSource = [];
+        this.havingDataObject = {};
+        this.globalDefaultFilter = {};
+        this.defaultViewIds = [];
+        this.defaultViewIdsOnPageRefresh = [];
+        this.defaultMatchedFilters = { operationFilter: { startDate: "", endDate: "" } };
+        this.isDefaultFilterParams = false;
+    }
+    ngOnInit() {
+        this.loadingModal = true;
+        this.pageId = this.activatedRoute.snapshot.queryParams['pageId'];
+        this.getPadeDataSource(false);
+    }
+    async getFiltersForTemplate(filter) {
+        this.filters = filter;
+        filter.operationFilter['startDate'] = filter.startDate;
+        filter.operationFilter['endDate'] = filter.endDate;
+        this.loadingModal = true;
+        if (filter.filterObjects && Object.entries(filter.filterObjects).length !== 0) {
+            if (Array.isArray(this.dashBoardWidgetConfig.widgets)) {
+                const index = this.dashBoardWidgetConfig.widgets.findIndex((widget) => widget.widgetId === filter.filterObjects.widgetId);
+                if (index !== -1) {
+                    this.dashBoardWidgetConfig.widgets[index] = filter.filterObjects;
+                }
+                else {
+                }
+            }
+        }
+        else {
+            await this.getPadeDataSource(true);
+        }
+        this.uniqueDataSetObject = {};
+        let apiCalls = [];
+        this.allWidgetByDataset.forEach(view => {
+            view.datasetIds.forEach(id => {
+                if (view.widgetId == filter.filterObjects.widgetId) {
+                    let found = this.dataSetModal.find(d => d.datasetId === id);
+                    let widgetFilter = this.getWidgetFilterItems(filter.filterObjects.filters.filterItems);
+                    view.filters = widgetFilter;
+                    if (found) {
+                        apiCalls.push(this.datasetService.getDataFromDataSet(found, id, widgetFilter));
+                    }
+                }
+            });
+        });
+        Promise.all(apiCalls).then(() => {
+            this.globalDefaultFilter = filter;
+            this.uniqueDataSetObject = this.datasetService.getUniqueDataSetObject();
+            this.createDivElements(this.uniqueDataSetObject, true);
+            this.cdr.detectChanges();
+            this.loadingModal = false;
+        });
+    }
+    getWidgetFilterItems(widgetFilterData) {
+        let apiJsonObject = {};
+        apiJsonObject['operationFilter'] = {};
+        widgetFilterData.forEach(element => {
+            if (element.filterType == 'date' || element.filterType == 'datetime') {
+                apiJsonObject['operationFilter'][element.apiName] = moment$1(element.filterDataSourceValue).format(element.momentFormat);
+            }
+            else {
+                if ((typeof element.filterDataSourceValue === "string" && element.filterDataSourceValue !== "") ||
+                    (Array.isArray(element.filterDataSourceValue) && element.filterDataSourceValue.length > 0)) {
+                    if (element.operatorName !== "") {
+                        if (element.filterType == "content") {
+                            apiJsonObject['operationFilter'][element.operatorName] = element.filterDataSourceValue;
+                        }
+                        if (element.filterType == "single") {
+                            apiJsonObject['operationFilter'][element.operatorName] = element.filterDataSourceValue;
+                        }
+                        else {
+                            apiJsonObject['operationFilter'][element.operatorName] = Array.isArray(element.filterDataSourceValue) ? element.filterDataSourceValue : [element.filterDataSourceValue];
+                        }
+                    }
+                    else {
+                        apiJsonObject[element.apiName] = element.filterDataSourceValue;
+                    }
+                }
+            }
+        });
+        return apiJsonObject;
+    }
+    getPadeDataSource(context) {
+        return new Promise((resolve, reject) => {
+            this.service.getAppPageDetailConfig(this.pageId).subscribe({
+                next: (data) => {
+                    this.pageTitle = data.pageName;
+                    this.dashBoardWidgetConfig = data;
+                    if (!context) {
+                        if (Object.keys(this.uniqueDataSetObject).length != 0) {
+                            this.createDivElements(this.uniqueDataSetObject, false);
+                        }
+                        this.getComponentConfigSet();
+                    }
+                    resolve();
+                },
+                error: (err) => {
+                    this.toastr.error('Unexpected Server Exception. Please contact System Admin.', 'Error');
+                    reject(err);
+                }
+            });
+        });
+    }
+    getPadeDataSourceByfilet(context, widgetObject) {
+        return new Promise((resolve, reject) => {
+            this.service.getAppPageDetailConfig(this.pageId).subscribe({
+                next: (data) => {
+                    this.pageTitle = data.pageName;
+                    if (Array.isArray(data.widgets)) {
+                        const index = data.widgets.findIndex((widget) => widget.widgetId === widgetObject.widgetId);
+                        if (index !== -1) {
+                            data.widgets[index] = widgetObject;
+                        }
+                        else {
+                        }
+                    }
+                    this.dashBoardWidgetConfig = data;
+                    if (!context) {
+                        if (Object.keys(this.uniqueDataSetObject).length !== 0) {
+                            this.createDivElements(this.uniqueDataSetObject, false);
+                        }
+                        this.getComponentConfigSet();
+                    }
+                    resolve();
+                },
+                error: (err) => {
+                    this.toastr.error('Unexpected Server Exception. Please contact System Admin.', 'Error');
+                    reject(err);
+                }
+            });
+        });
+    }
+    getComponentConfigSet() {
+        let dataset = this.service.getAppDatasetConfigs();
+        let viewComponent = this.service.getAppViewConfigs();
+        this.defaultViewIds = [];
+        forkJoin({
+            datasetConfig: dataset,
+            viewConfig: viewComponent
+        }).subscribe({
+            next: (({ datasetConfig, viewConfig }) => {
+                this.componentConfigDataSource = viewConfig;
+                this.dataSetModal = datasetConfig;
+                this.allWidgetByDataset = [];
+                const { pageId, startDate, endDate, ...params } = this.activatedRoute.snapshot.queryParams;
+                this.dashBoardWidgetConfig.widgets.forEach(widget => {
+                    let defaultFilters = { operationFilter: { startDate: "", endDate: "", ...params } };
+                    widget.filters.filterItems.forEach(element => {
+                        debugger;
+                        if (element.filterType === 'date' || element.filterType === 'datetime') {
+                            if (element.defaultFilterType === "dynamic" && element.momentFunction !== "" && element.defaultFilterValue !== "" && element.momentFormat !== "") {
+                                if (element.momentFunction == "monthPicker") {
+                                    let [count, unit] = element.defaultFilterValue.split(',');
+                                    if (element.apiName === "endDate") {
+                                        if (element.display) {
+                                            defaultFilters.operationFilter.endDate = (endDate && endDate !== '') ? endDate : moment$1().subtract(parseInt(count), unit).endOf(unit).format(element.momentFormat);
+                                            this.defaultEndDate = moment$1().subtract(parseInt(count), unit).endOf(unit).format(element.momentFormat);
+                                        }
+                                    }
+                                    if (element.apiName === "startDate") {
+                                        defaultFilters.operationFilter.startDate = (startDate && startDate !== '') ? startDate : moment$1().subtract(parseInt(count), unit).startOf(unit).format(element.momentFormat);
+                                        ;
+                                    }
+                                }
+                                else if (element.momentFunction == "weekPicker") {
+                                    if (element.apiName === "endDate") {
+                                        if (element.display) {
+                                            defaultFilters.operationFilter.endDate = (endDate && endDate !== '') ? endDate : moment$1().endOf('week').format(element.momentFormat);
+                                            this.defaultEndDate = moment$1().endOf('week').format(element.momentFormat);
+                                        }
+                                    }
+                                    if (element.apiName === "startDate") {
+                                        defaultFilters.operationFilter.startDate = (startDate && startDate !== '') ? startDate : moment$1().startOf('week').format(element.momentFormat);
+                                        this.defaultStartDate = moment$1().startOf('week').format(element.momentFormat);
+                                    }
+                                }
+                                else {
+                                    let [count, unit] = element.defaultFilterValue.split(',');
+                                    if (element.apiName === "endDate") {
+                                        if (element.display) {
+                                            defaultFilters.operationFilter.endDate = (endDate && endDate !== '') ? endDate : moment$1()[element.momentFunction](parseInt(count), unit).format(element.momentFormat);
+                                            this.defaultEndDate = moment$1()[element.momentFunction](parseInt(count), unit).format(element.momentFormat);
+                                        }
+                                    }
+                                    if (element.apiName === "startDate") {
+                                        defaultFilters.operationFilter.startDate = (startDate && startDate !== '') ? startDate : moment$1()[element.momentFunction](parseInt(count), unit).format(element.momentFormat);
+                                        this.defaultStartDate = moment$1()[element.momentFunction](parseInt(count), unit).format(element.momentFormat);
+                                    }
+                                }
+                            }
+                            else if (element.defaultFilterType === "static" && element.defaultFilterValue !== "") {
+                                if (element.apiName === "endDate") {
+                                    if (element.display) {
+                                        defaultFilters.operationFilter.endDate = element.defaultFilterValue;
+                                        this.defaultEndDate = element.defaultFilterValue;
+                                    }
+                                }
+                                if (element.apiName === "startDate") {
+                                    defaultFilters.operationFilter.startDate = element.defaultFilterValue;
+                                    this.defaultStartDate = element.defaultFilterValue;
+                                }
+                            }
+                        }
+                        else {
+                            if ((typeof element.filterDataSourceValue === "string" && element.filterDataSourceValue !== "") ||
+                                (Array.isArray(element.filterDataSourceValue) && element.filterDataSourceValue.length > 0)) {
+                                if (element.operatorName !== "") {
+                                    defaultFilters.operationFilter[element.operatorName] = Array.isArray(element.filterDataSourceValue)
+                                        ? element.filterDataSourceValue
+                                        : [element.filterDataSourceValue];
+                                }
+                                else {
+                                    defaultFilters.operationFilter[element.apiName] = element.filterDataSourceValue.join(",");
+                                }
+                            }
+                        }
+                    });
+                    let datasetIds = new Set();
+                    let viewIds = new Set();
+                    let datasetIdsSet = new Set();
+                    widget.widgetNode.forEach(node => {
+                        if (node.nodeProperties.display) {
+                            node.compConfig.viewConfig.forEach(view => {
+                                this.defaultViewIds.push(view.viewId);
+                                const foundObject = this.defaultViewIdsOnPageRefresh?.find(item => item.viewId === view.viewId);
+                                const derivedFilters = foundObject ? this.getDrildownFilter(foundObject, defaultFilters) : defaultFilters;
+                                let obj = {
+                                    "filters": JSON.parse(JSON.stringify(derivedFilters)),
+                                    "keyToPass": [],
+                                    "drillDownType": "natural",
+                                    "drilldownFrom": ""
+                                };
+                                this.stateDataSource.set(view.viewId, obj);
+                                let node = {
+                                    datasetId: view.datasetId,
+                                    viewId: view.viewId,
+                                    filter: derivedFilters
+                                };
+                                datasetIdsSet.add(view.datasetId);
+                                datasetIds.add(node);
+                                viewIds.add(view.viewId);
+                            });
+                        }
+                        else {
+                            node.compConfig.viewConfig.forEach(view => {
+                                this.contextMenuDataSource.push({ viewId: view.viewId, viewName: node.nodeProperties.widgetTitle, displayKey: view.kpiConfig.keyToPass });
+                            });
+                        }
+                    });
+                    if (this.defaultViewIdsOnPageRefresh?.length) {
+                        const newViews = this.defaultViewIdsOnPageRefresh.map(item => item.viewId);
+                        this.defaultViewIds = [...this.defaultViewIds, ...newViews.filter(item => !this.defaultViewIds.includes(item))];
+                    }
+                    let uniquedatasetIds = Array.from(datasetIdsSet);
+                    let obj = {
+                        widgetId: widget.widgetId,
+                        pageId: widget.pageId,
+                        filters: defaultFilters,
+                        datasetIds: uniquedatasetIds
+                    };
+                    this.allWidgetByDataset.push(obj);
+                });
+                this.uniqueDataSetObject = {};
+                let apiCalls = [];
+                this.allWidgetByDataset.forEach(view => {
+                    view.datasetIds.forEach(id => {
+                        let found = datasetConfig.find(d => d.datasetId === id);
+                        if (found) {
+                            apiCalls.push(this.datasetService.getDataFromDataSet(found, id, view.filters));
+                        }
+                    });
+                });
+                Promise.all(apiCalls).then(() => {
+                    this.uniqueDataSetObject = this.datasetService.getUniqueDataSetObject();
+                    this.createDivElements(this.uniqueDataSetObject, false);
+                    this.loadingModal = false;
+                });
+            }), error: (err) => {
+                this.loadingModal = false;
+                this.toastr.error('Unexpected Server Exception. Please contact System Admin.', 'Error');
+            }
+        });
+    }
+    getDataSet() {
+        this.service.getAppDatasetConfigs().subscribe({
+            next: (data) => {
+                this.dataSettableDataSource = data;
+            }, error: (err) => {
+                this.toastr.error('Unexpected Server Exception. Please contact System Admin.', 'Dataset Creation');
+            }
+        });
+    }
+    async createDivElements(datasetById, context) {
+        const container = this.dynamicContainer.nativeElement;
+        container.innerHTML = "";
+        const context_filter = this.dashBoardWidgetConfig.filters ? this.dashBoardWidgetConfig.filters.filterItems : null;
+        this.dashBoardWidgetConfig.widgets.forEach(async (div) => {
+            const rowDiv = document.createElement('div');
+            let w_height = (div.widgetProperties.height == "") ? "h-auto" : 'h-[' + div.widgetProperties.height + ']';
+            rowDiv.classList.add(div.widgetProperties.width, w_height);
+            const filterDiv = document.createElement('div');
+            const filterItems = (div.filters) ? div.filters.filterItems : [];
+            debugger;
+            this.loadFilterComponent(div, filterDiv, filterItems, context_filter);
+            rowDiv.appendChild(filterDiv);
+            if (div.widgetNode.length != 0) {
+                let mainItemDiv = rowDiv.querySelector('.flex.flex-wrap');
+                if (context && mainItemDiv) {
+                    mainItemDiv.innerHTML = "";
+                }
+                else {
+                    mainItemDiv = document.createElement('div');
+                    mainItemDiv.classList.add("flex", "flex-wrap");
+                    rowDiv.appendChild(mainItemDiv);
+                }
+                this.loadWidgetNodes(div, mainItemDiv, datasetById);
+            }
+            container.appendChild(rowDiv);
+        });
+    }
+    loadWidgetNodes(div, mainItemDiv, datasetById) {
+        this.mainPageDivElement = mainItemDiv;
+        div.widgetNode.forEach(item => {
+            this.loadSingleWidgetNode(item, mainItemDiv, datasetById);
+        });
+    }
+    loadSingleWidgetNode(item, containerElement, datasetById) {
+        const elementId = `id-${item.id}`;
+        const existingElement = document.querySelector(`#${elementId}`);
+        if (item.nodeProperties.display && !existingElement) {
+            const w_height = item.nodeProperties.height === "" ? "h-auto" : `h-[${item.nodeProperties.height}]`;
+            const itemDiv = document.createElement('div');
+            itemDiv.id = elementId;
+            itemDiv.classList.add(item.nodeProperties.width, w_height, 'mb-2');
+            if (item.nodeProperties.widgetTitle !== "") {
+                const widgetDiv = this.getWidgetTitleDiv(item);
+                itemDiv.appendChild(widgetDiv);
+            }
+            const innerDiv = document.createElement('div');
+            innerDiv.classList.add('rounded', 'justify-center', 'items-center', 'border', 'p-1', 'm-1', 'flex', 'flex-row');
+            item.compConfig.viewConfig.forEach(element => {
+                element.kpiConfig['dataSource'] = datasetById[element.datasetId];
+                element.kpiConfig['contextMenu'] = this.contextMenuDataSource;
+                element['titleParams'] = item.nodeProperties.widgetParams || "";
+                const comp_object = this.findWidgetById(this.dashBoardWidgetConfig.widgets, item.id);
+                this.loadDynamicComponent(element, comp_object, itemDiv);
+            });
+            containerElement.appendChild(itemDiv);
+            if (!this.isDashBoardContentTypeView) {
+                itemDiv.appendChild(innerDiv);
+            }
+        }
+        else if (existingElement) {
+            const itemDiv = existingElement;
+            itemDiv.innerHTML = '';
+            if (item.nodeProperties.widgetTitle !== "") {
+                const widgetDiv = this.getWidgetTitleDiv(item);
+                itemDiv.appendChild(widgetDiv);
+            }
+            item.compConfig.viewConfig.forEach(element => {
+                element.kpiConfig['dataSource'] = datasetById[element.datasetId];
+                element.kpiConfig['contextMenu'] = this.contextMenuDataSource;
+                element['titleParams'] = item.nodeProperties.widgetParams || "";
+                const comp_object = this.findWidgetById(this.dashBoardWidgetConfig.widgets, item.id);
+                this.loadDynamicComponent(element, comp_object, itemDiv);
+            });
+            if (!this.isDashBoardContentTypeView) {
+                const innerDiv = document.createElement('div');
+                innerDiv.classList.add('rounded', 'justify-center', 'items-center', 'border', 'p-1', 'm-1', 'flex', 'flex-row');
+                itemDiv.appendChild(innerDiv);
+            }
+        }
+    }
+    getWidgetTitleDiv(item) {
+        const widgetDiv = document.createElement('div');
+        widgetDiv.classList.add('flex', 'items-center', 'justify-between', 'font-bold', 'text-md', 'text-gray-900', 'dark:text-white', 'border-b', 'p-3', 'dark:bg-gray-800', 'bg-gray-200', 'mx-2', 'rounded-t-lg', 'relative');
+        const titleDiv = document.createElement('div');
+        titleDiv.classList.add('relative', 'group');
+        let params = "";
+        if (!item.nodeProperties.widgetParams && this.defaultViewIdsOnPageRefresh?.length) {
+            params = this.getTitleParams(item) || "";
+        }
+        else {
+            params = item.nodeProperties.widgetParams || "";
+        }
+        const widgetTitle = item.nodeProperties.widgetTitle;
+        const tooltipMatch = widgetTitle.match(/\$t\{([\s\S]*?)\}/);
+        const displayTitle = widgetTitle.replace(/\$t\{[\s\S]*?\}/g, '').trim();
+        titleDiv.innerText = displayTitle + params;
+        if (tooltipMatch) {
+            const tooltipContent = tooltipMatch[1].trim();
+            const tooltipDiv = document.createElement('div');
+            tooltipDiv.classList.add('absolute', 'left-0', 'bottom-full', 'mb-2', 'w-max', 'max-w-xs', 'bg-black', 'text-white', 'text-sm', 'p-2', 'rounded-lg', 'shadow-lg', 'opacity-0', 'group-hover:opacity-100', 'transition-opacity', 'duration-300', 'z-50');
+            tooltipDiv.innerHTML = tooltipContent;
+            titleDiv.appendChild(tooltipDiv);
+        }
+        widgetDiv.appendChild(titleDiv);
+        const searchContainerDiv = document.createElement('div');
+        searchContainerDiv.classList.add('flex', 'items-center', 'ml-auto', 'space-x-2', 'justify-end');
+        if (item.nodeProperties.isWidgetFilter) {
+            const searchButton = document.createElement('button');
+            searchButton.innerText = 'Filter';
+            searchButton.classList.add('px-3', 'py-1.5', 'bg-blue-600', 'mr-2', 'text-white', 'rounded', 'hover:bg-blue-700');
+            this.nodeproperticeFilterDataSource = {};
+            this.nodeproperticeFilterDataSource['viewConfig'] = item;
+            this.nodeproperticeFilterDataSource['havingConfig'] = [];
+            searchButton.addEventListener('click', () => {
+                this.isWidgetFilters = true;
+                let filtePropertice = [];
+                item.compConfig.viewConfig.forEach(element => {
+                    let key_name = this.uniqueDataSetObject[element.datasetId][0];
+                    Object.keys(key_name).forEach(key => {
+                        if (!filtePropertice.includes(key)) {
+                            filtePropertice.push(key);
+                        }
+                    });
+                });
+                filtePropertice.forEach(element => {
+                    let obj = {
+                        columnName: element,
+                        dataType: "float",
+                        operator: "",
+                        value: "",
+                    };
+                    this.nodeproperticeFilterDataSource.havingConfig.push(obj);
+                });
+            });
+            searchContainerDiv.appendChild(searchButton);
+        }
+        if (item.filterId) {
+            this.nodeproperticeFilterDataSource = {};
+            this.nodeproperticeFilterDataSource['viewConfig'] = item;
+            this.nodeproperticeFilterDataSource['havingConfig'] = [];
+            this.service.getAppFilterConfig(item.filterId).subscribe({
+                next: (data) => {
+                    const filterDiv = document.createElement('div');
+                    this.loadWidgetFilterComponent(item, widgetDiv, data.filterItems, item);
+                }, error: (err) => {
+                }
+            });
+        }
+        if (item.nodeProperties.nodefilters && item.nodeProperties.nodefilters.length !== 0) {
+            item.nodeProperties.nodefilters.forEach(filter => {
+                const filterDiv = document.createElement('div');
+                filterDiv.classList.add('flex', 'items-center');
+                if (filter.input_type === 'text') {
+                    const textBox = document.createElement('input');
+                    textBox.type = 'text';
+                    textBox.placeholder = `Enter ${filter.local_column}`;
+                    textBox.classList.add('px-2', 'py-1.5', 'rounded', 'border', 'mr-1', 'border-gray-500', 'text-gray-900', 'bg-gray-200', 'dark:bg-gray-700', 'dark:text-white');
+                    const searchButton = document.createElement('button');
+                    searchButton.innerText = 'Search';
+                    searchButton.classList.add('px-3', 'py-1.5', 'bg-blue-600', 'mr-2', 'text-white', 'rounded', 'hover:bg-blue-700');
+                    const separerotButton = document.createElement('div');
+                    separerotButton.innerHTML = '|';
+                    searchButton.addEventListener('click', () => {
+                        const searchTerm = textBox.value;
+                        this.getRearchResultFromInputBox(searchTerm, item, filter);
+                    });
+                    filterDiv.appendChild(textBox);
+                    filterDiv.appendChild(searchButton);
+                    filterDiv.appendChild(separerotButton);
+                }
+                searchContainerDiv.appendChild(filterDiv);
+            });
+        }
+        widgetDiv.appendChild(searchContainerDiv);
+        return widgetDiv;
+    }
+    loadDynamicComponent(data, indexObj, containerElement) {
+        const componentClass = this.componentClassMap[data.kpiConfig.componentName];
+        this.CompRefs = this.viewContainerRef.createComponent(componentClass);
+        const dynamicComponentInstance = this.CompRefs.instance;
+        dynamicComponentInstance.chartDataSource = data;
+        dynamicComponentInstance.kpi_name = "";
+        if (data.kpiConfig.componentName == "GammaAdvanceOperatorTableComponent" || data.kpiConfig.componentName == "GammaTableWithPercentageComponent") {
+            dynamicComponentInstance.oRowClick.subscribe((value) => {
+                this.getRowClick(value);
+            });
+            dynamicComponentInstance.onrightClickContextSelection.subscribe((value) => {
+                this.getContextClick(value);
+            });
+        }
+        else if (data.kpiConfig.componentName == "GammaAdvanceChartComponent") {
+            dynamicComponentInstance.onChartPointClick.subscribe((value) => {
+                this.getRowClick(value);
+            });
+        }
+        const cssClass = "w-full";
+        this.CompRefs.location.nativeElement.classList.add(cssClass);
+        containerElement.appendChild(this.CompRefs.location.nativeElement);
+    }
+    loadFilterComponent(indexObj, containerElement, filterItems, context_filter) {
+        let userName = this.storage.get('user_name');
+        console.log(this.allWidgetByDataset, "allWidgetByDataset");
+        let selectedDates = {};
+        this.allWidgetByDataset.forEach(view => {
+            if (view.widgetId == indexObj.widgetId) {
+                selectedDates = { startDate: view.filters.operationFilter['startDate'], endDate: view.filters.operationFilter['endDate'] };
+            }
+        });
+        const componentClass = this.componentClassMap['AppAdvanceHeaderComponent'];
+        this.CompRefs = this.viewContainerRef.createComponent(componentClass);
+        const dynamicComponentInstance = this.CompRefs.instance;
+        dynamicComponentInstance.selectedDates = selectedDates;
+        dynamicComponentInstance.filterItems = filterItems;
+        dynamicComponentInstance.filterObjects = indexObj;
+        dynamicComponentInstance.contextFilterItems = context_filter;
+        dynamicComponentInstance.pageTitle = indexObj.widgetName;
+        dynamicComponentInstance.bread_crumbs_container = this.kpi_breadcrumbs_container;
+        dynamicComponentInstance.isEditButton = (userName && userName == "admin") ? true : false;
+        dynamicComponentInstance.isAdvanceButton = true;
+        dynamicComponentInstance.getFilterPageConfig.subscribe((value) => {
+            this.getFiltersForTemplate(value);
+        });
+        dynamicComponentInstance.getOperatorName.subscribe((value) => {
+            this.loadDataByOperator(value);
+        });
+        dynamicComponentInstance.getContextFilterData.subscribe((value) => {
+            this.getContextFilterData(value);
+        });
+        indexObj.compConfig.dynamicComponentRefs.push(this.CompRefs);
+        const cssClass = "w-full";
+        this.CompRefs.location.nativeElement.classList.add(cssClass);
+        containerElement.appendChild(this.CompRefs.location.nativeElement);
+    }
+    loadWidgetFilterComponent(indexObj, containerElement, filterItems, viewIds) {
+        let selectedDates = { startDate: this.defaultStartDate, endDate: this.defaultEndDate };
+        const componentClass = this.componentClassMap['AdvanceWidgetHeaderFilterComponent'];
+        this.CompRefs = this.viewContainerRef.createComponent(componentClass);
+        const dynamicComponentInstance = this.CompRefs.instance;
+        dynamicComponentInstance.selectedDates = selectedDates;
+        dynamicComponentInstance.filterItems = filterItems;
+        dynamicComponentInstance.viewIds = viewIds;
+        dynamicComponentInstance.getWidgetFilterConfig.subscribe((value) => {
+            this.getWidgetFilterForTemplate(value);
+        });
+        indexObj.compConfig.dynamicComponentRefs.push(this.CompRefs);
+        containerElement.appendChild(this.CompRefs.location.nativeElement);
+    }
+    getContextClick(event) {
+        const stateData = Array.from(this.stateDataSource.keys());
+        const currentViewIndex = stateData.indexOf(event.viewId);
+        const deletedViewIds = [];
+        for (let i = currentViewIndex + 1; i < stateData.length; i++) {
+            deletedViewIds.push(stateData[i]);
+        }
+        this.loadingModal = true;
+        this.dashBoardWidgetConfig.widgets.forEach(element => {
+            element.widgetNode.forEach((node, nodeIndex) => {
+                if (this.getElementOfCurrentView(node, event.drilldownTo)) {
+                    let view = element.widgetNode[nodeIndex];
+                    let apiCalls = [];
+                    let chatApiCall = [];
+                    let appliedFilters = this.getSetOperatorFilter(event, this.stateDataSource.get(event.drilldownFrom));
+                    view.compConfig.viewConfig.forEach(contentView => {
+                        let found = this.dataSetModal.find(d => d.datasetId === contentView.datasetId);
+                        if (found) {
+                            apiCalls.push(this.datasetService.getDataFromDataSet(found, contentView.datasetId, appliedFilters));
+                        }
+                    });
+                    Promise.all(apiCalls).then(() => {
+                        this.uniqueDataSetObject = this.datasetService.getUniqueDataSetObject();
+                        for (let entry of deletedViewIds) {
+                            element.widgetNode.forEach(viewValue => {
+                                viewValue.compConfig.viewConfig.forEach(viewId => {
+                                    if (viewId.viewId == entry) {
+                                        const exists = this.contextMenuDataSource.some(item => item.viewId === viewId.viewId);
+                                        if (!exists) {
+                                            this.contextMenuDataSource.push({
+                                                viewId: viewId.viewId,
+                                                viewName: node.nodeProperties.widgetTitle,
+                                                displayKey: viewId.kpiConfig.keyToPass
+                                            });
+                                        }
+                                        const startData = this.stateDataSource.get(entry);
+                                        if (startData) {
+                                            this.stateDataSource.delete(entry);
+                                        }
+                                        viewValue.nodeProperties['display'] = false;
+                                        const prefixedId = `id-${viewValue.id}`;
+                                        const elementToHide = document.querySelector(`#${prefixedId}`);
+                                        if (elementToHide) {
+                                            elementToHide.remove();
+                                        }
+                                    }
+                                });
+                            });
+                        }
+                        this.contextMenuDataSource = this.contextMenuDataSource.filter(e => e.displayKey !== event.keyToPass);
+                        view.compConfig.viewConfig.forEach(val => {
+                            let obj = {
+                                "filters": appliedFilters,
+                                "keyToPass": this.updateOperatorData(event.keyToPass, event.data),
+                                "drillDownType": event.drillDownType,
+                                "drilldownFrom": event.drilldownFrom
+                            };
+                            this.stateDataSource.set(val['viewId'], obj);
+                        });
+                        view.nodeProperties['display'] = true;
+                        view.nodeProperties['widgetParams'] = event.tableTitle;
+                        const prefixedId = `id-${view.id}`;
+                        const containerElement = document.querySelector(`#${prefixedId}`);
+                        this.loadSingleWidgetNode(view, this.mainPageDivElement, this.uniqueDataSetObject);
+                        setTimeout(() => {
+                            this.scrollToBottom(this.mainPageDivElement);
+                        }, 200);
+                    });
+                }
+                else {
+                }
+            });
+        });
+    }
+    async getRowClick(event) {
+        const stateData = Array.from(this.stateDataSource.keys());
+        const currentViewIndex = stateData.indexOf(event.viewId);
+        const deletedViewIds = [];
+        for (let i = currentViewIndex + 1; i < stateData.length; i++) {
+            deletedViewIds.push(stateData[i]);
+        }
+        const hourlyNode = this.dashBoardWidgetConfig.widgets
+            .map(widget => widget.widgetNode.find(node => this.getHourlyData(node)))
+            .find(node => node);
+        if (hourlyNode && event.keyToPass.includes("recordDate")) {
+            this.getViewByRowCLickForHourlyChart(event, hourlyNode);
+        }
+        const currentViewNode = this.dashBoardWidgetConfig.widgets
+            .map(widget => widget.widgetNode.find(node => this.getElementOfCurrentView(node, event.viewId)))
+            .find(node => node);
+        const queryParams = this.activatedRoute.snapshot.queryParamMap;
+        if (currentViewNode) {
+            const drildownsForCurrentView = [];
+            const drildownsForCurrentPage = [];
+            currentViewNode.compConfig.viewConfig.forEach(async (element) => {
+                if (element.kpiConfig.viewProperties.enableClickEvent) {
+                    if (element.kpiConfig.viewProperties.clickEventOptions?.eventType !== undefined &&
+                        element.kpiConfig.viewProperties.clickEventOptions.eventType !== "") {
+                        let eventType = element.kpiConfig.viewProperties.clickEventOptions.eventType;
+                        let associatedViews = element.kpiConfig.viewProperties.clickEventOptions.associatedViews;
+                        let associatedPage = (element.kpiConfig.viewProperties.clickEventOptions.associatedPage) ? element.kpiConfig.viewProperties.clickEventOptions.associatedPage : "";
+                        let clickEventOptions = element.kpiConfig.viewProperties.clickEventOptions;
+                        if (eventType == 'optionalDrillDown') {
+                            if (associatedViews && associatedViews.length != 0) {
+                                for (let viewForDrillDown of associatedViews) {
+                                    const filterCondition = new URLSearchParams(viewForDrillDown['filterCondition']);
+                                    let matchFound = true;
+                                    filterCondition.forEach((value, key) => {
+                                        if (queryParams.get(key) !== value) {
+                                            matchFound = false;
+                                        }
+                                    });
+                                    if (matchFound) {
+                                        viewForDrillDown['viewId'].forEach(viewForId => {
+                                            drildownsForCurrentView.push(viewForId);
+                                        });
+                                    }
+                                }
+                            }
+                        }
+                        else if (eventType == 'drilldown' || eventType == 'popup') {
+                            for (let entry of associatedViews) {
+                                drildownsForCurrentView.push(entry);
+                            }
+                        }
+                        else if (eventType == 'navigateToPage') {
+                            this.service.getAppPageDetailConfig(associatedPage).subscribe({
+                                next: (data) => {
+                                    let { pageId, ...params } = this.activatedRoute.snapshot.queryParams;
+                                    let associatedParamsTemplate = clickEventOptions.associatedParams;
+                                    let appliedFilters = this.getSetOperatorFilter(event, this.stateDataSource.get(event.viewId));
+                                    event.keyToPass.forEach(element => {
+                                        params[element] = event.data[element];
+                                    });
+                                    params['pageId'] = associatedPage;
+                                    if (associatedParamsTemplate !== "") {
+                                        let finalAssociatedParams = this.replaceAssociatedParams(associatedParamsTemplate, params, appliedFilters);
+                                        const queryParams = {};
+                                        finalAssociatedParams.split("&").forEach(pair => {
+                                            const [key, value] = pair.split("=");
+                                            queryParams[key] = value;
+                                        });
+                                        queryParams['pageId'] = params['pageId'];
+                                        const fullUrl = this.router.serializeUrl(this.router.createUrlTree([data.pageUrl], { queryParams }));
+                                        this.router.navigate([data.pageUrl], { queryParams });
+                                    }
+                                    else {
+                                        const queryString = new URLSearchParams(params).toString();
+                                        const fullUrl = this.router.serializeUrl(this.router.createUrlTree([data.pageUrl], { queryParams: params }));
+                                        this.router.navigate([data.pageUrl], { queryParams });
+                                        console.log(data);
+                                    }
+                                }
+                            });
+                        }
+                        else if (eventType == 'sameViewDrilldown') {
+                            debugger;
+                        }
+                        if (drildownsForCurrentView.length != 0) {
+                            for (let viewIdForNext of drildownsForCurrentView) {
+                                const nextViewNode = this.dashBoardWidgetConfig.widgets
+                                    .map(widget => widget.widgetNode.find(node => this.getElementOfCurrentView(node, viewIdForNext)))
+                                    .find(node => node);
+                                if (eventType == 'popup') {
+                                    this.loadingModal = true;
+                                    await this.getModalViewByRowCLick(event, nextViewNode);
+                                }
+                                else {
+                                    this.loadingModal = true;
+                                    await this.getViewByRowCLick(event, nextViewNode);
+                                }
+                            }
+                        }
+                    }
+                    else {
+                        this.dashBoardWidgetConfig.widgets.forEach(element => {
+                            for (let entry of deletedViewIds) {
+                                element.widgetNode.forEach(viewValue => {
+                                    viewValue.compConfig.viewConfig.forEach(viewId => {
+                                        if (viewId.viewId == entry) {
+                                            const exists = this.contextMenuDataSource.some(item => item.viewId === viewId.viewId);
+                                            if (!exists) {
+                                                this.contextMenuDataSource.push({
+                                                    viewId: viewId.viewId,
+                                                    viewName: currentViewNode.nodeProperties.widgetTitle,
+                                                    displayKey: viewId.kpiConfig.keyToPass
+                                                });
+                                            }
+                                            const startData = this.stateDataSource.get(entry);
+                                            if (startData) {
+                                                this.stateDataSource.delete(entry);
+                                            }
+                                            viewValue.nodeProperties['display'] = false;
+                                            const prefixedId = `id-${viewValue.id}`;
+                                            const elementToHide = document.querySelector(`#${prefixedId}`);
+                                            if (elementToHide) {
+                                                elementToHide.remove();
+                                            }
+                                        }
+                                    });
+                                });
+                            }
+                        });
+                        const nextViewIndex = stateData.indexOf(event.viewId) + 1;
+                        const nextView = this.dashBoardWidgetConfig.widgets
+                            .map(widget => widget.widgetNode[nextViewIndex])
+                            .find(node => node);
+                        if (nextView) {
+                            this.loadingModal = true;
+                            await this.getViewByRowCLick(event, nextView);
+                        }
+                    }
+                }
+            });
+        }
+    }
+    getViewByRowCLickForHourlyChart(event, node) {
+        let apiCalls = [];
+        const deletedViewIds = [];
+        node.compConfig.viewConfig.forEach(item => {
+            let appliedFilters = this.getSetOperatorFilter(event, this.stateDataSource.get(item.viewId));
+            let found = this.dataSetModal.find(d => d.datasetId === item.datasetId);
+            deletedViewIds.push(item.viewId);
+            if (found) {
+                apiCalls.push(this.datasetService.getDataFromDataSet(found, item.datasetId, appliedFilters));
+            }
+        });
+        Promise.all(apiCalls).then(() => {
+            this.uniqueDataSetObject = this.datasetService.getUniqueDataSetObject();
+            this.loadSingleWidgetNode(node, this.mainPageDivElement, this.uniqueDataSetObject);
+            setTimeout(() => {
+                this.scrollToBottom(this.mainPageDivElement);
+            }, 200);
+        });
+    }
+    async getModalViewByRowCLick(event, view) {
+        let apiCalls = [];
+        let appliedFilters = this.getSetOperatorFilter(event, this.stateDataSource.get(event.viewId));
+        view.compConfig.viewConfig.forEach(contentView => {
+            let found = this.dataSetModal.find(d => d.datasetId === contentView.datasetId);
+            if (found) {
+                apiCalls.push(this.datasetService.getDataFromDataSet(found, contentView.datasetId, appliedFilters));
+            }
+        });
+        await Promise.all(apiCalls);
+        this.contextMenuDataSource = this.contextMenuDataSource.filter(e => e.displayKey !== event.keyToPass);
+        view.compConfig.viewConfig.forEach(viewforDataSet => {
+            let obj = {
+                "filters": appliedFilters,
+                "keyToPass": this.updateOperatorData(event.keyToPass, event.data),
+                "drillDownType": event.drillDownType,
+                "drilldownFrom": event.drilldownFrom
+            };
+            this.stateDataSource.set(viewforDataSet['viewId'], obj);
+        });
+        view.nodeProperties['display'] = true;
+        view.nodeProperties['widgetParams'] = event.tableTitle;
+        this.uniqueDataSetObject = this.datasetService.getUniqueDataSetObject();
+        this.modalConfigs = {
+            view: view,
+            datasource: this.uniqueDataSetObject
+        };
+        setTimeout(() => {
+            this.loadingModal = false;
+            this.isPopupView = true;
+        }, 200);
+    }
+    async getViewByRowCLick(event, view) {
+        let apiCalls = [];
+        let chatApiCall = [];
+        let appliedFilters = this.getSetOperatorFilter(event, this.stateDataSource.get(event.viewId));
+        view.compConfig.viewConfig.forEach(contentView => {
+            let found = this.dataSetModal.find(d => d.datasetId === contentView.datasetId);
+            if (found) {
+                apiCalls.push(this.datasetService.getDataFromDataSet(found, contentView.datasetId, appliedFilters));
+            }
+        });
+        await Promise.all(apiCalls);
+        this.contextMenuDataSource = this.contextMenuDataSource.filter(e => e.displayKey !== event.keyToPass);
+        view.compConfig.viewConfig.forEach(viewforDataSet => {
+            let obj = {
+                "filters": appliedFilters,
+                "keyToPass": this.updateOperatorData(event.keyToPass, event.data),
+                "drillDownType": event.drillDownType,
+                "drilldownFrom": event.drilldownFrom
+            };
+            this.stateDataSource.set(viewforDataSet['viewId'], obj);
+        });
+        view.nodeProperties['display'] = true;
+        view.nodeProperties['widgetParams'] = event.tableTitle;
+        const prefixedId = `id-${view.id}`;
+        const containerElement = document.querySelector(`#${prefixedId}`);
+        this.uniqueDataSetObject = this.datasetService.getUniqueDataSetObject();
+        this.loadSingleWidgetNode(view, this.mainPageDivElement, this.uniqueDataSetObject);
+        console.log(this.stateDataSource);
+        setTimeout(() => {
+            this.scrollToBottom(this.mainPageDivElement);
+        }, 200);
+    }
+    replaceAssociatedParams(template, params, appliedFilters) {
+        return template.replace(/\$(F|P)\{([^}]+)\}/g, (match, type, key) => {
+            if (type === "F") {
+                return appliedFilters.operationFilter?.[key] ?? "";
+            }
+            else if (type === "P") {
+                return params?.[key] ?? "";
+            }
+            return match;
+        });
+    }
+    scrollToBottom(container) {
+        setTimeout(() => {
+            container.scrollIntoView({ block: 'end' });
+            this.loadingModal = false;
+        }, 0);
+    }
+    findWidgetById(configs, id) {
+        for (const config of configs) {
+            if (config.id === id) {
+                return config;
+            }
+            if (config.widgetNode && config.widgetNode.length > 0) {
+                const found = this.findWidgetById(config.widgetNode, id);
+                if (found) {
+                    return found;
+                }
+            }
+        }
+        return undefined;
+    }
+    updateOperatorData(key_name, value_data) {
+        let operator = [];
+        for (const key of key_name) {
+            let obj = {};
+            obj[key] = value_data[key];
+            operator.push(obj);
+        }
+        return operator;
+    }
+    getElementOfCurrentView(node, viewId) {
+        const matchedObject = node.compConfig.viewConfig.find(object => object.viewId === viewId);
+        return matchedObject ? node : null;
+    }
+    getHourlyData(node) {
+        const matchedObject = node.compConfig.viewConfig.find(object => object.kpiConfig.formate === 'hourly');
+        return matchedObject ? node : null;
+    }
+    getSetOperatorFilter(objectData, previousViewStates) {
+        const { data, keyToPass } = objectData;
+        const appliedFilter = JSON.parse(JSON.stringify(previousViewStates.filters.operationFilter));
+        keyToPass.forEach(key => {
+            if (key in data) {
+                const normalizedKey = key.toLowerCase().replace(/_/g, '');
+                if (normalizedKey === "recorddate" && "startDate" in appliedFilter && "endDate" in appliedFilter) {
+                    appliedFilter.startDate = data[key];
+                    appliedFilter.endDate = data[key];
+                }
+                else {
+                    appliedFilter[key] = data[key];
+                }
+            }
+        });
+        const defaultoperationFilter = this.globalDefaultFilter.operationFilter;
+        if (defaultoperationFilter) {
+            Object.keys(defaultoperationFilter).forEach(key => {
+                if (!appliedFilter.hasOwnProperty(key)) {
+                    appliedFilter[key] = defaultoperationFilter[key];
+                }
+            });
+        }
+        const operationFilter = {};
+        operationFilter['operationFilter'] = appliedFilter;
+        return operationFilter;
+    }
+    getRearchResultFromInputBox(inputValue, viewConfig, filterObject) {
+        let view = viewConfig;
+        let eventNode = { data: {}, keyToPass: [] };
+        eventNode.data[filterObject.server_column] = inputValue;
+        eventNode['keyToPass'] = [filterObject.server_column];
+        let apiCalls = [];
+        view.compConfig.viewConfig.forEach(contentView => {
+            let appliedFilters = this.getSetOperatorFilter(eventNode, this.stateDataSource.get(contentView.viewId));
+            let found = this.dataSetModal.find(d => d.datasetId === contentView.datasetId);
+            if (found) {
+                apiCalls.push(this.datasetService.getDataFromDataSet(found, contentView.datasetId, appliedFilters));
+            }
+        });
+        viewConfig.nodeProperties['display'] = false;
+        const prefixedId = `id-${viewConfig.id}`;
+        const elementToHide = document.querySelector(`#${prefixedId}`);
+        if (elementToHide) {
+            elementToHide.remove();
+        }
+        Promise.all(apiCalls).then(() => {
+            this.uniqueDataSetObject = this.datasetService.getUniqueDataSetObject();
+            this.loadingModal = true;
+            this.contextMenuDataSource = this.contextMenuDataSource.filter(e => e.displayKey !== viewConfig.keyToPass);
+            view.nodeProperties['display'] = true;
+            const prefixedId = `id-${view.id}`;
+            const containerElement = document.querySelector(`#${prefixedId}`);
+            this.loadSingleWidgetNode(view, this.mainPageDivElement, this.uniqueDataSetObject);
+            setTimeout(() => {
+                this.scrollToBottom(this.mainPageDivElement);
+            }, 200);
+            let params = {};
+            params[filterObject.server_column] = inputValue;
+        });
+    }
+    submitFilter() {
+        let view = this.nodeproperticeFilterDataSource.viewConfig;
+        let apiCalls = [];
+        this.havingDataObject = this.nodeproperticeFilterDataSource.havingConfig.filter(value => value.value !== "");
+        view.compConfig.viewConfig.forEach(contentView => {
+            let appliedFilters = this.stateDataSource.get(contentView.viewId);
+            let found = this.dataSetModal.find(d => d.datasetId === contentView.datasetId);
+            if (found) {
+                apiCalls.push(this.datasetService.getDataFromDataSet(found, contentView.datasetId, appliedFilters.filters));
+            }
+        });
+        Promise.all(apiCalls).then(() => {
+            this.uniqueDataSetObject = this.datasetService.getUniqueDataSetObject();
+            this.nodeproperticeFilterDataSource.viewConfig.nodeProperties['display'] = false;
+            const prefixedId = `id-${this.nodeproperticeFilterDataSource.viewConfig.id}`;
+            const elementToHide = document.querySelector(`#${prefixedId}`);
+            if (elementToHide) {
+                elementToHide.remove();
+            }
+            this.loadingModal = true;
+            this.contextMenuDataSource = this.contextMenuDataSource.filter(e => e.displayKey !== this.nodeproperticeFilterDataSource.viewConfig.keyToPass);
+            this.isWidgetFilters = false;
+            view.nodeProperties['display'] = true;
+            this.loadSingleWidgetNode(view, this.mainPageDivElement, this.uniqueDataSetObject);
+            setTimeout(() => {
+                this.scrollToBottom(this.mainPageDivElement);
+            }, 200);
+        });
+    }
+    getWidgetFilterForTemplate(value) {
+        let apiCalls = [];
+        const deletedViewIds = [];
+        value.viewNodes.compConfig.viewConfig.forEach(item => {
+            let widgetFilter = this.stateDataSource.get(item.viewId);
+            let appliedFilters = widgetFilter.filters;
+            let found = this.dataSetModal.find(d => d.datasetId === item.datasetId);
+            deletedViewIds.push(item.viewId);
+            const having = Object.entries(value.operationFilter).map(([key, value]) => ({
+                columnName: key,
+                dataType: "float",
+                operator: "gte",
+                value: value
+            }));
+            if (found) {
+                found.config.queryConfig['havings'] = having;
+                apiCalls.push(this.datasetService.getDataFromDataSet(found, item.datasetId, appliedFilters));
+            }
+        });
+        Promise.all(apiCalls).then(() => {
+            this.uniqueDataSetObject = this.datasetService.getUniqueDataSetObject();
+            this.loadSingleWidgetNode(value.viewNodes, this.mainPageDivElement, this.uniqueDataSetObject);
+            setTimeout(() => {
+                this.scrollToBottom(this.mainPageDivElement);
+            }, 200);
+        });
+    }
+    async loadDataByOperator(opName) {
+        let filter = { operationFilter: { startDate: "", endDate: "", operator_key: "" } };
+        filter.operationFilter['startDate'] = this.defaultStartDate;
+        filter.operationFilter['endDate'] = this.defaultEndDate;
+        filter.operationFilter['operator_key'] = opName;
+        this.loadingModal = true;
+        await this.getPadeDataSource(true);
+        this.uniqueDataSetObject = {};
+        let apiCalls = [];
+        this.allWidgetByDataset.forEach(view => {
+            view.datasetIds.forEach(id => {
+                let found = this.dataSetModal.find(d => d.datasetId === id.datasetId);
+                if (found) {
+                    apiCalls.push(this.datasetService.getDataFromDataSet(found, id.datasetId, filter));
+                }
+            });
+        });
+        Promise.all(apiCalls).then(() => {
+            this.globalDefaultFilter = filter;
+            this.uniqueDataSetObject = this.datasetService.getUniqueDataSetObject();
+            this.createDivElements(this.uniqueDataSetObject, true);
+            this.loadingModal = false;
+        });
+    }
+    async getContextFilterData(value) {
+        let filter = { operationFilter: { startDate: "", endDate: "" } };
+        filter.operationFilter['startDate'] = this.defaultStartDate;
+        filter.operationFilter['endDate'] = this.defaultEndDate;
+        filter.operationFilter[value.operatorName] = this.parseInput(value.defaultFilterValue);
+        this.loadingModal = true;
+        let obj = {};
+        obj[value.operatorName] = value.defaultFilterValue;
+        await this.getPadeDataSource(true);
+        this.uniqueDataSetObject = {};
+        let apiCalls = [];
+        this.allWidgetByDataset.forEach(view => {
+            view.datasetIds.forEach(id => {
+                let found = this.dataSetModal.find(d => d.datasetId === id.datasetId);
+                if (found) {
+                    apiCalls.push(this.datasetService.getDataFromDataSet(found, id.datasetId, filter));
+                }
+            });
+        });
+        Promise.all(apiCalls).then(() => {
+            this.globalDefaultFilter = filter;
+            this.uniqueDataSetObject = this.datasetService.getUniqueDataSetObject();
+            this.createDivElements(this.uniqueDataSetObject, true);
+            this.loadingModal = false;
+        });
+    }
+    parseInput(input) {
+        input = input.trim();
+        if (input.includes(',')) {
+            return input.split(',').map(item => item.trim());
+        }
+        else {
+            return input;
+        }
+    }
+    getDrilldownDisplayByUrlParams(all_views) {
+        this.defaultViewIdsOnPageRefresh = [];
+        const params = this.activatedRoute.snapshot.queryParams;
+        this.defaultViewIdsOnPageRefresh = (params['views'] && params['views'] !== "") ? JSON.parse(decodeURIComponent(params['views'])) : [];
+        all_views.forEach(element => {
+            for (let entry of element.widgetNode) {
+                let shouldDisplay = false;
+                entry.compConfig.viewConfig.forEach(view => {
+                    if (this.defaultViewIdsOnPageRefresh.length !== 0) {
+                        const foundObject = this.defaultViewIdsOnPageRefresh.find(val => val.viewId === view.viewId);
+                        if (foundObject) {
+                            shouldDisplay = true;
+                        }
+                    }
+                });
+                if (shouldDisplay) {
+                    entry.nodeProperties.display = true;
+                }
+            }
+        });
+    }
+    getFiltersForQueryParams(operators, filters, viewParams) {
+        const operationFilter = operators.operationFilter || {};
+        const currentParams = this.activatedRoute.snapshot.queryParams;
+        let currentViews = [];
+        if (currentParams['views']) {
+            try {
+                currentViews = JSON.parse(decodeURIComponent(currentParams['views']));
+            }
+            catch (e) {
+                console.error("Invalid views param");
+            }
+        }
+        const filterData = { viewId: viewParams.viewId };
+        filters.forEach(filter => {
+            const localKey = filter.localColumn;
+            const serverKey = filter.serverColumn;
+            let value = operationFilter[localKey];
+            if (value !== undefined && value !== "") {
+                filterData[serverKey] = value;
+            }
+        });
+        const existingIndex = currentViews.findIndex(v => v.viewId === viewParams.viewId);
+        if (existingIndex !== -1) {
+            currentViews[existingIndex] = filterData;
+            currentViews = currentViews.slice(0, existingIndex + 1);
+        }
+        else {
+            currentViews.push(filterData);
+        }
+        const encodedViews = encodeURIComponent(JSON.stringify(currentViews));
+        const mergedParams = {
+            ...currentParams,
+            views: encodedViews
+        };
+    }
+    getDrildownFilter(drildownFilter, defaultFilter) {
+        const expectedDateFields = ['recordDate', 'record_date', 'eventDate', 'event_date'];
+        const result = JSON.parse(JSON.stringify(defaultFilter));
+        const { viewId, ...filteredDrilldown } = drildownFilter;
+        let dateValue = null;
+        for (const key of expectedDateFields) {
+            if (filteredDrilldown[key]) {
+                dateValue = filteredDrilldown[key];
+                break;
+            }
+        }
+        if (dateValue) {
+            result.operationFilter.startDate = dateValue;
+            result.operationFilter.endDate = dateValue;
+        }
+        for (const key in filteredDrilldown) {
+            if (!expectedDateFields.includes(key)) {
+                result.operationFilter[key] = filteredDrilldown[key];
+            }
+        }
+        return result;
+    }
+    getTitleParams(items) {
+        const results = [];
+        items.compConfig.viewConfig.forEach(element => {
+            const foundObject = this.defaultViewIdsOnPageRefresh.find(val => val.viewId === element.viewId);
+            if (foundObject) {
+                const result = Object.entries(foundObject)
+                    .filter(([key]) => key !== 'viewId')
+                    .map(([key, value]) => {
+                    const formattedKey = key
+                        .replace(/_/g, ' ')
+                        .replace(/\b\w/g, char => char.toUpperCase());
+                    return `${formattedKey} = ${value}`;
+                })
+                    .join(' | ');
+                results.push(`| ${result} `);
+            }
+        });
+        return results.join('\n');
+    }
+}
+MultiLayoutLandingComponentComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MultiLayoutLandingComponentComponent, deps: [{ token: CommonService }, { token: i2.ActivatedRoute }, { token: i0.ViewContainerRef }, { token: i0.ComponentFactoryResolver }, { token: LandingMultiLayoutComponentService }, { token: i3$1.ToastrService }, { token: i2.Router }, { token: LandingMultiLayoutApplicationDatssetsCall }, { token: AppLandingMultiLayoutLocalStorage }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+MultiLayoutLandingComponentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: MultiLayoutLandingComponentComponent, selector: "app-multi-layout-landing-component", viewQueries: [{ propertyName: "dynamicComponentContainer", first: true, predicate: ["dynamicComponentContainer"], descendants: true, read: ViewContainerRef }, { propertyName: "containerRef", first: true, predicate: ["container"], descendants: true, read: ViewContainerRef }, { propertyName: "dynamicContainer", first: true, predicate: ["dynamicContainer"], descendants: true, static: true }, { propertyName: "dynamicContainerForPopup", first: true, predicate: ["dynamicContainerForPopup"], descendants: true, static: true }], ngImport: i0, template: "<app-loading *ngIf=\"loadingModal\"></app-loading>\n\n<div class=\"w-full\">\n    <div class=\"flex flex-wrap \" #dynamicContainer></div>\n</div>", styles: [""], dependencies: [{ kind: "directive", type: i4$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: LoadingComponent$1, selector: "app-loading" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MultiLayoutLandingComponentComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-multi-layout-landing-component', template: "<app-loading *ngIf=\"loadingModal\"></app-loading>\n\n<div class=\"w-full\">\n    <div class=\"flex flex-wrap \" #dynamicContainer></div>\n</div>" }]
+        }], ctorParameters: function () { return [{ type: CommonService }, { type: i2.ActivatedRoute }, { type: i0.ViewContainerRef }, { type: i0.ComponentFactoryResolver }, { type: LandingMultiLayoutComponentService }, { type: i3$1.ToastrService }, { type: i2.Router }, { type: LandingMultiLayoutApplicationDatssetsCall }, { type: AppLandingMultiLayoutLocalStorage }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { dynamicComponentContainer: [{
+                type: ViewChild,
+                args: ['dynamicComponentContainer', { read: ViewContainerRef }]
+            }], containerRef: [{
+                type: ViewChild,
+                args: ['container', { read: ViewContainerRef }]
+            }], dynamicContainer: [{
+                type: ViewChild,
+                args: ['dynamicContainer', { static: true }]
+            }], dynamicContainerForPopup: [{
+                type: ViewChild,
+                args: ['dynamicContainerForPopup', { static: true }]
+            }] } });
+
+class DefaultLandingMultiLayoutComponenttModule {
+}
+DefaultLandingMultiLayoutComponenttModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DefaultLandingMultiLayoutComponenttModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+DefaultLandingMultiLayoutComponenttModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: DefaultLandingMultiLayoutComponenttModule, declarations: [MultiLayoutLandingComponentComponent], imports: [CommonModule,
+        LoadingModule$1,
+        CommonModule,
+        DevExtremeModule,
+        DxButtonModule,
+        DxCheckBoxModule,
+        DxNumberBoxModule,
+        DxDataGridModule,
+        DxDropDownBoxModule,
+        DxTreeViewModule,
+        DxScrollViewModule,
+        DxFormModule,
+        DxAccordionModule,
+        FormsModule,
+        DxTagBoxModule,
+        ReactiveFormsModule,
+        MatIconModule,
+        DxHtmlEditorModule,
+        DxBulletModule,
+        DxChartModule,
+        DxDateBoxModule,
+        DxLoadPanelModule,
+        DxLookupModule,
+        DxPivotGridModule,
+        DxTemplateModule,
+        DxTextAreaModule,
+        DxValidationSummaryModule,
+        DxValidatorModule,
+        DxCalendarModule,
+        DxTooltipModule,
+        DxContextMenuModule,
+        DxLoadIndicatorModule,
+        DxPieChartModule,
+        MatTooltipModule,
+        DxPopupModule, DxSelectBoxModule, DxTextBoxModule, DxTreeViewModule,
+        MatButtonModule,
+        MatDividerModule,
+        MatMenuModule,
+        MatIconModule,
+        LoadingModule$1], exports: [MultiLayoutLandingComponentComponent] });
+DefaultLandingMultiLayoutComponenttModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DefaultLandingMultiLayoutComponenttModule, providers: [LandingMultiLayoutApplicationDatssetsCall, LandingMultiLayoutComponentService], imports: [CommonModule,
+        LoadingModule$1,
+        CommonModule,
+        DevExtremeModule,
+        DxButtonModule,
+        DxCheckBoxModule,
+        DxNumberBoxModule,
+        DxDataGridModule,
+        DxDropDownBoxModule,
+        DxTreeViewModule,
+        DxScrollViewModule,
+        DxFormModule,
+        DxAccordionModule,
+        FormsModule,
+        DxTagBoxModule,
+        ReactiveFormsModule,
+        MatIconModule,
+        DxHtmlEditorModule,
+        DxBulletModule,
+        DxChartModule,
+        DxDateBoxModule,
+        DxLoadPanelModule,
+        DxLookupModule,
+        DxPivotGridModule,
+        DxTemplateModule,
+        DxTextAreaModule,
+        DxValidationSummaryModule,
+        DxValidatorModule,
+        DxCalendarModule,
+        DxTooltipModule,
+        DxContextMenuModule,
+        DxLoadIndicatorModule,
+        DxPieChartModule,
+        MatTooltipModule,
+        DxPopupModule, DxSelectBoxModule, DxTextBoxModule, DxTreeViewModule,
+        MatButtonModule,
+        MatDividerModule,
+        MatMenuModule,
+        MatIconModule,
+        LoadingModule$1] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DefaultLandingMultiLayoutComponenttModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        MultiLayoutLandingComponentComponent,
+                    ],
+                    imports: [CommonModule,
+                        LoadingModule$1,
+                        CommonModule,
+                        DevExtremeModule,
+                        DxButtonModule,
+                        DxCheckBoxModule,
+                        DxNumberBoxModule,
+                        DxDataGridModule,
+                        DxDropDownBoxModule,
+                        DxTreeViewModule,
+                        DxScrollViewModule,
+                        DxFormModule,
+                        DxAccordionModule,
+                        FormsModule,
+                        DxTagBoxModule,
+                        ReactiveFormsModule,
+                        MatIconModule,
+                        DxHtmlEditorModule,
+                        DxBulletModule,
+                        DxChartModule,
+                        DxDateBoxModule,
+                        DxLoadPanelModule,
+                        DxLookupModule,
+                        DxPivotGridModule,
+                        DxTemplateModule,
+                        DxTextAreaModule,
+                        DxValidationSummaryModule,
+                        DxValidatorModule,
+                        DxCalendarModule,
+                        DxTooltipModule,
+                        DxContextMenuModule,
+                        DxLoadIndicatorModule,
+                        DxPieChartModule,
+                        MatTooltipModule,
+                        DxPopupModule, DxSelectBoxModule, DxTextBoxModule, DxTreeViewModule,
+                        MatButtonModule,
+                        MatDividerModule,
+                        MatMenuModule,
+                        MatIconModule,
+                        LoadingModule$1,
+                    ],
+                    exports: [
+                        MultiLayoutLandingComponentComponent
+                    ],
+                    providers: [LandingMultiLayoutApplicationDatssetsCall, LandingMultiLayoutComponentService],
+                }]
+        }] });
+
 class BookmarkedService {
     constructor(http, environment) {
         this.http = http;
@@ -24754,5 +26635,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
                 }]
         }] });
 
-export { APP_ENVIRONMENT, AdvanceWidgetHeaderFilterComponent, AllMetricsConfigComponent, AppAdvanceHeaderComponent, AppHttpService, AppLandingLayoutLocalStorage, AppLocalStorage, AppMultiLayoutLocalStorage, AppSingleLayoutLocalStorage, AppTitleComponent, ApplicationChatApiCallService, ApplicationContentService, ApplicationDatssetsCall, ApplicationFilterComponent, ApplicationViewsComponent, BookMarkedTemplatemodule, BookmarkedApplicationDatssetsCall, BookmarkedService, BookmarkedTemplateComponent, BreadCrumbsComponent, CdrConfigComponent, CdrConfigMoudule, CommonHeaderComponent, CommonService, CreateCompViewComponent, CreateDatasetComponent, CreateDatasetJsonComponent, CreateDatasetSqlComponent, CreateKpiTreeComponent, CreateMetricsComponent, DashChartComponent, DashTableComponent, DashTodayPreviousComponent, DefaultLandingComponenttModule, DynamicWidgetComponent, DynamicWidgetForMultilayoutComponent, ExceptionOperationComponent, ExceptionOperationModule, GamamWidgetComponent, GammSingleNumberCardComponent, GammaAdvanceChartComponent, GammaAdvanceFilterComponent, GammaAdvanceOperatorTableComponent, GammaAppControllerComponent, GammaAppControllerModule, GammaAppControllerService, GammaGeoChartComponent, GammaHeatChartComponent, GammaTableClumnBarChartComponent, GammaTableWithPercentageComponent, GammaTodayPreviousComponent, GeoMapComponent, GoogleGeoMapComponent, HeatMapSupportComponent, IconsModule, KpiCreationModule, KpiWithDataSetTestComponent, KpiWithMultiLayoutModule, KpiWithMultiLayoutService, KpiWithMultilayoutSetTestComponent, KpiWithSingleLayoutModule, KpiWithSingleLayoutService, LandingApplicationDatssetsCall, LandingComponentComponent, LandingComponentService, LoaderComponent, LoadingComponent, LoadingModule, MultilayoutApplicationDatssetsCall, OflineMetricsComponent, OnlineMetricsComponent, PackageApplicationControllerModule, PageConfigComponent, PageConfigMultilayoutComponent, PageControlerComponent, SafeHtmlPipe, SingleLayoutApplicationDatssetsCall, SqlPipe, TableWithBarComponent, TreeViewAsideItemComponent, TreeViewBasicItemComponent, TreeViewCollapsableItemComponent, TreeViewDividerItemComponent, TreeViewGroupItemComponent, TreeViewSpacerItemComponent, TreeviewComponent, contentSafeHtml, kpicommonService$2 as kpicommonService };
+export { APP_ENVIRONMENT, AdvanceWidgetHeaderFilterComponent, AllMetricsConfigComponent, AppAdvanceHeaderComponent, AppHttpService, AppLandingLayoutLocalStorage, AppLandingMultiLayoutLocalStorage, AppLocalStorage, AppMultiLayoutLocalStorage, AppSingleLayoutLocalStorage, AppTitleComponent, ApplicationChatApiCallService, ApplicationContentService, ApplicationDatssetsCall, ApplicationFilterComponent, ApplicationViewsComponent, BookMarkedTemplatemodule, BookmarkedApplicationDatssetsCall, BookmarkedService, BookmarkedTemplateComponent, BreadCrumbsComponent, CdrConfigComponent, CdrConfigMoudule, CommonHeaderComponent, CommonService, CreateCompViewComponent, CreateDatasetComponent, CreateDatasetJsonComponent, CreateDatasetSqlComponent, CreateKpiTreeComponent, CreateMetricsComponent, DashChartComponent, DashTableComponent, DashTodayPreviousComponent, DefaultLandingComponenttModule, DefaultLandingMultiLayoutComponenttModule, DynamicWidgetComponent, DynamicWidgetForMultilayoutComponent, ExceptionOperationComponent, ExceptionOperationModule, GamamWidgetComponent, GammSingleNumberCardComponent, GammaAdvanceChartComponent, GammaAdvanceFilterComponent, GammaAdvanceOperatorTableComponent, GammaAppControllerComponent, GammaAppControllerModule, GammaAppControllerService, GammaGeoChartComponent, GammaHeatChartComponent, GammaTableClumnBarChartComponent, GammaTableWithPercentageComponent, GammaTodayPreviousComponent, GeoMapComponent, GoogleGeoMapComponent, HeatMapSupportComponent, IconsModule, KpiCreationModule, KpiWithDataSetTestComponent, KpiWithMultiLayoutModule, KpiWithMultiLayoutService, KpiWithMultilayoutSetTestComponent, KpiWithSingleLayoutModule, KpiWithSingleLayoutService, LandingApplicationDatssetsCall, LandingComponentComponent, LandingComponentService, LandingMultiLayoutApplicationDatssetsCall, LandingMultiLayoutComponentService, LoaderComponent, LoadingComponent, LoadingModule, MultiLayoutLandingComponentComponent, MultilayoutApplicationDatssetsCall, OflineMetricsComponent, OnlineMetricsComponent, PackageApplicationControllerModule, PageConfigComponent, PageConfigMultilayoutComponent, PageControlerComponent, SafeHtmlPipe, SingleLayoutApplicationDatssetsCall, SqlPipe, TableWithBarComponent, TreeViewAsideItemComponent, TreeViewBasicItemComponent, TreeViewCollapsableItemComponent, TreeViewDividerItemComponent, TreeViewGroupItemComponent, TreeViewSpacerItemComponent, TreeviewComponent, contentSafeHtml, kpicommonService$2 as kpicommonService };
 //# sourceMappingURL=gamma-app-controller.mjs.map