@memberjunction/ng-explorer-core 4.0.0 → 4.2.0

package/dist/lib/navigation/navigation.component.js

@@ -1,1212 +0,0 @@
-import { Component, ElementRef, ViewChild, HostListener, HostBinding, Input } from '@angular/core';
-import { NavigationEnd, NavigationSkipped } from '@angular/router';
-import { DrawerComponent } from "@progress/kendo-angular-layout";
-import { Metadata, RunView, LogError, LogStatus } from '@memberjunction/core';
-import { MJEventType, MJGlobal } from '@memberjunction/global';
-import { EventCodes, SharedService } from '@memberjunction/ng-shared';
-import { BaseResourceComponent } from '@memberjunction/ng-shared';
-import { ResourceData } from '@memberjunction/core-entities';
-import { ItemType, TreeItem } from '../../generic/Item.types';
-import { TemplateEngineBase } from '@memberjunction/templates-base-types';
-import { CommunicationEngineBase } from '@memberjunction/communication-types';
-import { EntityCommunicationsEngineClient } from '@memberjunction/entity-communications-client';
-import { MJNotificationService } from '@memberjunction/ng-notifications';
-import { LoadEntityCommunicationsEngineClient } from '@memberjunction/entity-communications-client';
-import * as i0 from "@angular/core";
-import * as i1 from "@angular/router";
-import * as i2 from "@memberjunction/ng-shared";
-import * as i3 from "@angular/common";
-import * as i4 from "@angular/platform-browser";
-import * as i5 from "@progress/kendo-angular-dialog";
-import * as i6 from "@progress/kendo-angular-layout";
-import * as i7 from "@memberjunction/ng-tabstrip";
-import * as i8 from "@memberjunction/ng-shared-generic";
-import * as i9 from "../generic/resource-container-component";
-const _c0 = ["mjTabstrip"];
-const _c1 = ["drawerWrapper"];
-const _c2 = ["container"];
-const _forTrack0 = ($index, $item) => $item.id;
-const _c3 = a0 => ({ "waiting": a0 });
-function NavigationComponent_mj_loading_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "mj-loading", 7);
-} if (rf & 2) {
-    i0.ɵɵproperty("showText", false);
-} }
-function NavigationComponent_kendo_drawer_container_3_ng_template_3_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "span", 14);
-} }
-function NavigationComponent_kendo_drawer_container_3_ng_template_3_Conditional_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "span");
-} if (rf & 2) {
-    const item_r3 = i0.ɵɵnextContext().$implicit;
-    i0.ɵɵclassMap(item_r3.icon);
-} }
-function NavigationComponent_kendo_drawer_container_3_ng_template_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 13);
-    i0.ɵɵtemplate(1, NavigationComponent_kendo_drawer_container_3_ng_template_3_Conditional_1_Template, 1, 0, "span", 14)(2, NavigationComponent_kendo_drawer_container_3_ng_template_3_Conditional_2_Template, 1, 2, "span", 15);
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "div", 16)(4, "div");
-    i0.ɵɵtext(5);
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(6, "span", 17);
-    i0.ɵɵtext(7);
-    i0.ɵɵelementEnd()();
-} if (rf & 2) {
-    const item_r3 = ctx.$implicit;
-    i0.ɵɵadvance();
-    i0.ɵɵconditional(item_r3.text === "Ask Skip" ? 1 : 2);
-    i0.ɵɵadvance(4);
-    i0.ɵɵtextInterpolate(item_r3.text);
-    i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(item_r3.description);
-} }
-function NavigationComponent_kendo_drawer_container_3_For_12_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "span", 18);
-} }
-function NavigationComponent_kendo_drawer_container_3_For_12_Conditional_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "span");
-} if (rf & 2) {
-    const tab_r4 = i0.ɵɵnextContext().$implicit;
-    i0.ɵɵclassMap(tab_r4.icon + " tab-icon");
-} }
-function NavigationComponent_kendo_drawer_container_3_For_12_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "mj-tab", 12);
-    i0.ɵɵtemplate(1, NavigationComponent_kendo_drawer_container_3_For_12_Conditional_1_Template, 1, 0, "span", 18)(2, NavigationComponent_kendo_drawer_container_3_For_12_Conditional_2_Template, 1, 2, "span", 15);
-    i0.ɵɵtext(3);
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const tab_r4 = ctx.$implicit;
-    i0.ɵɵproperty("TabCloseable", true);
-    i0.ɵɵadvance();
-    i0.ɵɵconditional((tab_r4 == null ? null : tab_r4.contentLoading) ? 1 : (tab_r4 == null ? null : tab_r4.icon) ? 2 : -1);
-    i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate1(" ", tab_r4.labelLoading ? "Loading..." : tab_r4.label, " ");
-} }
-function NavigationComponent_kendo_drawer_container_3_For_14_Template(rf, ctx) { if (rf & 1) {
-    const _r5 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "mj-tab-body")(1, "mj-resource", 19);
-    i0.ɵɵlistener("ResourceRecordSaved", function NavigationComponent_kendo_drawer_container_3_For_14_Template_mj_resource_ResourceRecordSaved_1_listener($event) { const tab_r6 = i0.ɵɵrestoreView(_r5).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.HandleResourceRecordSaved(tab_r6, $event)); })("ContentLoadingStarted", function NavigationComponent_kendo_drawer_container_3_For_14_Template_mj_resource_ContentLoadingStarted_1_listener() { const tab_r6 = i0.ɵɵrestoreView(_r5).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.setTabContentLoadingStatus(tab_r6, true)); })("ContentLoadingComplete", function NavigationComponent_kendo_drawer_container_3_For_14_Template_mj_resource_ContentLoadingComplete_1_listener() { const tab_r6 = i0.ɵɵrestoreView(_r5).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.setTabContentLoadingStatus(tab_r6, false)); });
-    i0.ɵɵelementEnd()();
-} if (rf & 2) {
-    const tab_r6 = ctx.$implicit;
-    const ɵ$index_52_r7 = ctx.$index;
-    const ctx_r1 = i0.ɵɵnextContext(2);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("Data", tab_r6.data)("isVisible", ctx_r1.activeTabIndex - 1 === ɵ$index_52_r7);
-} }
-function NavigationComponent_kendo_drawer_container_3_Template(rf, ctx) { if (rf & 1) {
-    const _r1 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "kendo-drawer-container")(1, "kendo-drawer", 8, 1);
-    i0.ɵɵlistener("select", function NavigationComponent_kendo_drawer_container_3_Template_kendo_drawer_select_1_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onDrawerSelect($event)); });
-    i0.ɵɵtemplate(3, NavigationComponent_kendo_drawer_container_3_ng_template_3_Template, 8, 3, "ng-template", 9);
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "kendo-drawer-content", 10)(5, "mj-tabstrip", 11, 2);
-    i0.ɵɵlistener("TabClosed", function NavigationComponent_kendo_drawer_container_3_Template_mj_tabstrip_TabClosed_5_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.handleTabClosed($event)); })("TabSelected", function NavigationComponent_kendo_drawer_container_3_Template_mj_tabstrip_TabSelected_5_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.handleTabSelected($event)); })("TabContextMenu", function NavigationComponent_kendo_drawer_container_3_Template_mj_tabstrip_TabContextMenu_5_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.handleTabContextMenu($event)); })("ResizeContainer", function NavigationComponent_kendo_drawer_container_3_Template_mj_tabstrip_ResizeContainer_5_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.sharedService.InvokeManualResize()); });
-    i0.ɵɵelementStart(7, "mj-tab", 12);
-    i0.ɵɵtext(8, " Home ");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(9, "mj-tab-body");
-    i0.ɵɵelement(10, "router-outlet");
-    i0.ɵɵelementEnd();
-    i0.ɵɵrepeaterCreate(11, NavigationComponent_kendo_drawer_container_3_For_12_Template, 4, 3, "mj-tab", 12, _forTrack0);
-    i0.ɵɵrepeaterCreate(13, NavigationComponent_kendo_drawer_container_3_For_14_Template, 2, 2, "mj-tab-body", null, _forTrack0);
-    i0.ɵɵelementEnd()()();
-} if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext();
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("items", ctx_r1.drawerItems)("mini", true)("animation", false)("autoCollapse", true);
-    i0.ɵɵadvance(6);
-    i0.ɵɵproperty("TabCloseable", false);
-    i0.ɵɵadvance(4);
-    i0.ɵɵrepeater(ctx_r1.tabs);
-    i0.ɵɵadvance(2);
-    i0.ɵɵrepeater(ctx_r1.tabs);
-} }
-function NavigationComponent_div_4_Template(rf, ctx) { if (rf & 1) {
-    const _r8 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 20)(1, "div", 21);
-    i0.ɵɵlistener("click", function NavigationComponent_div_4_Template_div_click_1_listener() { i0.ɵɵrestoreView(_r8); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.handleContextMenuOption(1)); });
-    i0.ɵɵtext(2, "Close All");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "div", 21);
-    i0.ɵɵlistener("click", function NavigationComponent_div_4_Template_div_click_3_listener() { i0.ɵɵrestoreView(_r8); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.handleContextMenuOption(2)); });
-    i0.ɵɵtext(4, "Close Others");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(5, "div", 21);
-    i0.ɵɵlistener("click", function NavigationComponent_div_4_Template_div_click_5_listener() { i0.ɵɵrestoreView(_r8); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.handleContextMenuOption(3)); });
-    i0.ɵɵtext(6, "Close Tabs to the Right");
-    i0.ɵɵelementEnd()();
-} if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("ngStyle", ctx_r1.contextMenuStyle);
-} }
-// Prevent tree-shaking of EntityCommunicationsEngineClient
-LoadEntityCommunicationsEngineClient();
-export class NavigationComponent {
-    router;
-    route;
-    sharedService;
-    location;
-    renderer;
-    titleService;
-    cdr;
-    applicationName;
-    drawerItems = [{
-            text: 'Loading...',
-            icon: 'k-i-apps',
-        }];
-    mode = 'push';
-    mini = true;
-    viewsList = [];
-    selectedDrawerItem = null;
-    selectedApp = null;
-    selectedEntity = null;
-    selectedView = null;
-    loading = true;
-    loader = false;
-    tabs = [];
-    closedTabs = []; // should always be empty after using it
-    tabQueryParams = {};
-    workSpace = undefined;
-    workSpaceItems = [];
-    panelItems = [];
-    showExpansionPanel = false;
-    routeSub = null;
-    isMobileScreen = false;
-    resizeTimeout;
-    drawer;
-    mjTabStrip;
-    drawerWrapper;
-    container;
-    onWindowResize() {
-        clearTimeout(this.resizeTimeout);
-        this.resizeTimeout = setTimeout(() => {
-            this.checkViewportSize();
-        }, 200); // Adjust the debounce time as needed
-    }
-    onClick() {
-        this.contextMenuVisible = false;
-    }
-    contextMenuStyle = {};
-    contextMenuVisible = false;
-    // Inject the authentication service into your component through the constructor
-    constructor(router, route, sharedService, location, renderer, titleService, cdr) {
-        this.router = router;
-        this.route = route;
-        this.sharedService = sharedService;
-        this.location = location;
-        this.renderer = renderer;
-        this.titleService = titleService;
-        this.cdr = cdr;
-        this.tabs = [];
-    }
-    _contextMenuSelectedTabIndex = -1;
-    handleTabContextMenu(event) {
-        event.mouseEvent.preventDefault();
-        this._contextMenuSelectedTabIndex = event.index;
-        const mouseX = event.mouseEvent.clientX;
-        const mouseY = event.mouseEvent.clientY;
-        this.contextMenuStyle = {
-            top: mouseY + 'px',
-            left: mouseX + 'px'
-        };
-        this.contextMenuVisible = true;
-    }
-    async handleContextMenuOption(option) {
-        this.closedTabs = [];
-        switch (option) {
-            case 1:
-                // Close All
-                this.closedTabs = this.closedTabs.concat(this.tabs);
-                this.tabs = [];
-                break;
-            case 2:
-                // Close Others
-                // the _contextMenuSelectedTabIndex is the index of the tab that was right-clicked on and it INCLUDES the home tab so we have to adjust it
-                // keep just that item 
-                if (this._contextMenuSelectedTabIndex > 0) {
-                    this.closedTabs = this.tabs.filter((tab, index) => index !== this._contextMenuSelectedTabIndex - 1);
-                    this.tabs = [this.tabs[this._contextMenuSelectedTabIndex - 1]];
-                }
-                break;
-            case 3:
-                // Close Tabs to the Right
-                const currentTabIndex = this._contextMenuSelectedTabIndex - 1; // because the HOME tab is not in the array so we have to offset by 1 here for our data structure
-                this.closedTabs = this.tabs.slice(currentTabIndex + 1); // close everything to right
-                this.tabs = this.tabs.slice(0, currentTabIndex + 1);
-                break;
-            default:
-                // Handle other options if needed
-                break;
-        }
-        this.contextMenuVisible = false;
-        // CRITICAL: Force immediate change detection after tab array modifications
-        // This ensures Angular immediately processes component destruction for closed tabs
-        await this.waitForDomUpdate();
-        const md = new Metadata();
-        const transGroup = await md.CreateTransactionGroup();
-        for (let i = 0; i < this.closedTabs.length; ++i) {
-            const tab = this.closedTabs[i];
-            await this.removeWorkspaceItem(tab, transGroup);
-        }
-        transGroup.Submit(); // INTENTIONALLY NOT USING AWAIT here - let's let the database updates for workspace edits happen in the background, no need to wait
-        await this.waitForDomUpdate(); // make sure the DOM is updated before we do anything else so that the tab control knows about the changes from our data structure changes ABOVE
-        if (this.activeTabIndex > this.tabs.length) // DO NOT add 1 here because in this case, the array boundary is the max for the tab control
-            this.activeTabIndex = this.tabs.length; // don't subtract 1 here because the activeTabIndex is relative to the full set of tabs and the this.tabs array doesn't include the HOME tab
-        else
-            this.activeTabIndex = this.activeTabIndex; // this is a hack to force the tab control to update the selected tab
-        if (this.activeTabIndex === 0) {
-            // in this situation we have the home tab showing, so we need to update the URL path based on what's selected in the drawer
-            let url = this.selectedDrawerItem ? this.selectedDrawerItem.path : '/home';
-            this.router.navigate([url]);
-            //this.location.go(url); // update the browser URL if needed  
-            this._mostRecentURL = url;
-        }
-    }
-    checkViewportSize() {
-        this.isMobileScreen = window.innerWidth <= 840;
-    }
-    ngAfterViewInit() {
-        MJGlobal.Instance.GetEventListener(true) // true gets us replay of past events so we can "catch up" as needed
-            .subscribe(event => {
-            this.handleEvent(event, event.args);
-        });
-        this.route.queryParams.subscribe(params => {
-            // what we want to do here is CACHE the params for the CURRENT tab so we have them 
-            // to throw back in the URL whenever the tab gets clicked on again in the future
-            this.tabQueryParams['tab_' + this.activeTabIndex] = params;
-        });
-    }
-    _loggedIn = false;
-    _earlyEvents = [];
-    async handleEvent(event, args) {
-        // event handler
-        switch (event.event) {
-            case MJEventType.LoggedIn:
-                await this.loadApp();
-                await this.loadWorkspace();
-                this._loggedIn = true;
-                // check for early events and replay them now that we're logged in
-                for (let i = 0; i < this._earlyEvents.length; ++i) {
-                    const e = this._earlyEvents[i];
-                    this.handleEvent(e.event, e.args); // recursve call to handle the event
-                }
-                this._earlyEvents.length = 0; // clear the array
-                // resize everything after a short delay
-                setTimeout(() => {
-                    this.sharedService.InvokeManualResize();
-                }, 100);
-                this.checkForBaseURL();
-                break;
-            case MJEventType.ComponentEvent:
-                if (!this._loggedIn) {
-                    // we're not logged in yet, so queue up the event to be handled later
-                    this._earlyEvents.push({ event, args });
-                }
-                else {
-                    // we're logged in so go ahead and handle normally
-                    switch (event.eventCode) {
-                        case EventCodes.ViewNotifications:
-                            this.setActiveTabToHome();
-                            break;
-                        case EventCodes.ViewCreated:
-                        case EventCodes.AddDashboard:
-                        case EventCodes.AddReport:
-                        case EventCodes.AddQuery:
-                        case EventCodes.EntityRecordClicked:
-                        case EventCodes.ViewClicked:
-                        case EventCodes.ViewClicked:
-                        case EventCodes.RunSearch:
-                        case EventCodes.ListCreated:
-                        case EventCodes.ListClicked:
-                            // another component requested that we add something to our tab structure
-                            this.AddOrSelectTab(event.args);
-                            break;
-                        case EventCodes.CloseCurrentTab:
-                            if (this.mjTabStrip && this.activeTabIndex > 0) {
-                                this.mjTabStrip.CloseTab(this.activeTabIndex);
-                            }
-                            else {
-                                LogError("no active tab to close or tabstrip not available");
-                            }
-                            break;
-                        default:
-                            break;
-                    }
-                }
-                break;
-            default:
-                break;
-        }
-    }
-    gotFirstNav = false;
-    ngOnInit() {
-        this.checkViewportSize();
-        // Subscribe to route changes
-        this.routeSub = this.router.events.pipe().subscribe((args) => {
-            if (args instanceof NavigationEnd || args instanceof PopStateEvent) {
-                const trigger = args.navigationTrigger;
-                switch (trigger) {
-                    case 'imperative':
-                        // this is a programmatic navigation, so we don't want to do anything here
-                        break;
-                    case 'popstate':
-                        // this is a browser back/forward navigation, so we want to do something here
-                        // when the route changes and it maps to one of our drawer items, select it
-                        this.NavigateFromUrl();
-                        break;
-                    default:
-                        // this is a click on a link, so we want to do something here
-                        // when the route changes and it maps to one of our drawer items, select it
-                        this.NavigateFromUrl();
-                        break;
-                }
-            }
-            else if (args instanceof NavigationSkipped) {
-                // check to see if the route in args is truly the same as the this.route
-                // if so, then we're navigating to the same route and we don't want to do anything
-                // if not, then we're navigating to a different route and we want to do something
-                if (this._mostRecentURL.trim().toLowerCase() != args.url.trim().toLowerCase()) {
-                    this.NavigateFromUrl();
-                }
-            }
-        });
-    }
-    _mostRecentURL = '';
-    _mostRecentHomeURL = ''; // used only when we're on the home tab so we can remember the full URL for the HOME tab when we come back to it from another tab
-    async NavigateFromUrl() {
-        let url = this.router.url.trim().toLowerCase();
-        if (url === '/') {
-            this._mostRecentURL = '/home';
-            this.router.navigate(['/home']); // redirect to /home
-            this.gotFirstNav = true;
-        }
-        else {
-            this._mostRecentURL = this.router.url;
-            // see if this matches a drawer item or not
-            const item = this.drawerItems.find(i => url.toLowerCase().trim().startsWith(i.path?.toLowerCase().trim()));
-            if (item) {
-                this.selectDrawerItem(this.drawerItems.indexOf(item));
-                this.gotFirstNav = true;
-            }
-        }
-        if (this.activeTabIndex > 0) {
-            // check to see if there are query params on the url and if so, stash em in the tabQueryParams array so we can restore the full set of query params later if we
-            // come back to this tab
-            const urlParts = this.router.url.split('?');
-            if (urlParts.length > 1) {
-                // we have query params, so stash them
-                const params = new URLSearchParams(urlParts[1]);
-                const queryParams = {};
-                for (const [key, value] of params.entries()) {
-                    queryParams[key] = value;
-                }
-                this.tabQueryParams['tab_' + this.activeTabIndex] = queryParams;
-            }
-        }
-        if (url.toLowerCase().includes('/app') && this.activeTabIndex > 0) {
-            this.setActiveTabToHome();
-        }
-        // finally, if we are on the home tab, update the _mostRecentHomeURL property to the current URL
-        if (this.activeTabIndex === 0) {
-            // only update the most recent home URL if we have a url that starts with something that is in the drawer
-            // or /app
-            if (!url.startsWith('/home') && (url.startsWith("/app") || this.drawerItems.find((item) => url.startsWith(item.path))))
-                this._mostRecentHomeURL = url;
-        }
-    }
-    selectDrawerItem(index) {
-        this.selectedDrawerItem = this.drawerItems[index];
-        this.showExpansionPanel = index === 2;
-        // Get the <ul> element that contains the <li> elements
-        const ulElement = this.drawerWrapper.nativeElement.querySelector('ul');
-        if (ulElement) {
-            // Get the <li> element at the specified index
-            const liElement = ulElement.children[index];
-            // add the k-selected class to the <li> element
-            this.renderer.addClass(liElement, 'k-selected');
-            // and remove k-selected from all other <li> within the <ul>
-            for (let i = 0; i < ulElement.children.length; ++i) {
-                if (i !== index)
-                    this.renderer.removeClass(ulElement.children[i], 'k-selected');
-            }
-        }
-        // make sure that the first tab is selected since this is showing stuff in the Home/Nav tab
-        this.setActiveTabToHome();
-    }
-    setActiveTabToHome() {
-        this.innerSelectTab(null);
-    }
-    innerSelectTab(tab) {
-        // get index from the tabs array
-        const index = tab ? this.tabs.indexOf(tab) + 1 : 0; // add one because the HOME tab is not in the array so we have to offset by 1 here for our data structure
-        this.sharedService.InvokeManualResize();
-        if (index === 0) {
-            // this means the HOME tab
-            let url = this.selectedDrawerItem ? this.selectedDrawerItem.path : '/home';
-            if (this.selectedDrawerItem !== null && this.selectedDrawerItem !== undefined)
-                url = this.selectedDrawerItem.path;
-            if (!this._mostRecentURL.startsWith(url)) {
-                // we only do this IF the most recent URL does NOT start with the selectedDrawerItem path. 
-                // The reason is because there could be SUB-PATHS within the _mostRecentURL that are not part of the selectedDrawerItem path
-                // plus this is redundant if we're already on the selectedDrawerItem path
-                if (this._mostRecentHomeURL.startsWith(url) ||
-                    (url === '/data' && this._mostRecentHomeURL.startsWith('/app')) || // special case for the /data drawer item, it leads to resources that start with /app after the first level, so we compare that too 
-                    (url === '/home' && this._mostRecentHomeURL.startsWith('/app')) // special case for the /data drawer item, it leads to resources that start with /app after the first level, so we compare that too 
-                ) {
-                    // we use the most recent HomeURL if it starts with the selectedDrawerItem path
-                    // this is because we want to preserve the query params that were on the URL when we first navigated to the home tab
-                    url = this._mostRecentHomeURL;
-                }
-                this.router.navigate([url]);
-                this.setAppTitle();
-                this._mostRecentURL = url;
-            }
-        }
-        else {
-            const tab = this.tabs[index - 1];
-            if (tab) {
-                this.setAppTitle(tab.label);
-                const data = tab.data;
-                this.updateBrowserURL(tab, data);
-            }
-        }
-    }
-    checkForBaseURL() {
-        setTimeout(() => {
-            // this is a hack to get the first navigation to work correctly when the route is to the / base URL that doesn't seem to trigger the rest of our code like all other routes
-            if (!this.gotFirstNav) {
-                this.gotFirstNav = true;
-                this.NavigateFromUrl();
-            }
-        }, 10);
-    }
-    /**
-     * This method will load the user's workspace and all the workspace items that are part of the workspace from the database.
-     */
-    async loadWorkspace() {
-        const md = new Metadata();
-        const rv = new RunView();
-        const workspaceParams = {
-            EntityName: "Workspaces",
-            ExtraFilter: `UserID='${md.CurrentUser.ID}'`,
-            OrderBy: "__mj_UpdatedAt DESC", // by default get the workspace that was most recently updated
-            ResultType: "entity_object" /*we want entity objects back so that we can modify them as needed*/
-        };
-        const workspaces = await rv.RunView(workspaceParams);
-        if (workspaces.Success) {
-            if (workspaces.Results.length) {
-                this.workSpace = workspaces.Results[0]; // by default get the first one, and since we are sorting by __mj_UpdatedAt DESC above, will be most recently modified one. Future feature for multi-workspace support we'll have to adjust this
-            }
-            else {
-                // no matching record found, so create a new one
-                this.workSpace = await md.GetEntityObject('Workspaces');
-                this.workSpace.NewRecord();
-                this.workSpace.Name = `${md.CurrentUser.Name || md.CurrentUser.ID}'s Workspace`;
-                this.workSpace.UserID = md.CurrentUser.ID;
-                await this.workSpace.Save();
-            }
-            if (!this.workSpace)
-                throw new Error('Error loading workspace');
-            if (this.workSpace.IsSaved) {
-                const workspaceItemParams = {
-                    EntityName: "Workspace Items",
-                    ExtraFilter: `WorkspaceID='${this.workSpace.ID}'`,
-                    OrderBy: "Sequence ASC", // get them in order
-                    ResultType: "entity_object" /*we want entity objects back so that we can modify them as needed*/
-                };
-                const workspaceItems = await rv.RunView(workspaceItemParams);
-                if (workspaceItems.Success) {
-                    this.workSpaceItems = workspaceItems.Results;
-                    await this.LoadWorkspaceItems();
-                }
-            }
-        }
-        else
-            throw new Error('Error loading workspace');
-    }
-    /**
-     * This method will load all the workspace items that are part of the workspace currently set in the workSpace member variable
-     */
-    async LoadWorkspaceItems() {
-        const md = new Metadata();
-        this.tabs = []; // first clear out the tabs - this is often already the state but in case this is a full refresh, make sure we do this.
-        for (let item of this.workSpaceItems) {
-            const itemData = item.Configuration ? JSON.parse(item.Configuration) : {};
-            const resourceData = new ResourceData({
-                ID: item.ID,
-                Name: item.Name,
-                ResourceTypeID: item.ResourceTypeID,
-                ResourceRecordID: item.ResourceRecordID,
-                Configuration: itemData,
-            });
-            const newTab = {
-                id: item.ID,
-                labelLoading: true,
-                contentLoading: false,
-                data: resourceData,
-                workspaceItem: item, // provide the entity object here so we can modify it later if needed
-                icon: resourceData.ResourceIcon
-            };
-            // now add to data structure
-            await this.internalAddTab(newTab);
-            setTimeout(async () => {
-                // non-blocking, load the resource names dynamically as this requires additional DB lookups
-                newTab.label = await this.GetWorkspaceItemDisplayName(resourceData);
-                const resourceDynamicIcon = await this.GetWorkspaceItemIconClass(resourceData);
-                newTab.icon = resourceDynamicIcon ? resourceDynamicIcon : newTab.icon;
-                newTab.labelLoading = false;
-                if (newTab === this.tabs[this.activeTabIndex - 1]) // subtract one since the activeTabIndex is relative to the full set of tabs and the this.tabs array doesn't include the HOME tab
-                    this.setAppTitle(newTab.label);
-            }, 10);
-        }
-        this.mjTabStrip.SelectedTabIndex = 0;
-    }
-    setAppTitle(title = '') {
-        if (title === '')
-            this.titleService.setTitle(this.applicationName);
-        else
-            this.titleService.setTitle(title + ' (' + this.applicationName + ')');
-    }
-    /**
-     * This method is responsible for searching for a matching tab in the existing tab structure of the loaded workspace. It returns either a Tab object or null if one isn't found that matches the ResourceData provided.
-     * @param data
-     * @returns
-     */
-    findExistingTab(data) {
-        let existingTab;
-        if (data.ResourceType.trim().toLowerCase() === 'search results') {
-            // we have a different matching logic for search results because we want to match on the search input as well as the entity
-            existingTab = this.tabs.find(t => t.data.ResourceTypeID === data.ResourceTypeID &&
-                t.data.Configuration.Entity === data.Configuration.Entity &&
-                t.data.Configuration.SearchInput === data.Configuration.SearchInput);
-        }
-        else if (data.ResourceType.trim().toLowerCase() === 'user views') {
-            // a viwe can be either saved (where we have a view id) or dyanmic (where we have an entity name, and optionally, an extra filter)
-            if (data.ResourceRecordID) {
-                // saved view
-                existingTab = this.tabs.find(t => t.data.ResourceTypeID === data.ResourceTypeID &&
-                    t.data.ResourceRecordID === data.ResourceRecordID &&
-                    data.ResourceRecordID !== null &&
-                    data.ResourceRecordID !== undefined // make sure that we don't match on null/undefined ResourceRecordID's - these should always be NEW tabs
-                );
-            }
-            else {
-                // dynamic view, compare entity name and if we have extra filter use that for comparison too
-                existingTab = this.tabs.find(t => t.data.ResourceTypeID === data.ResourceTypeID &&
-                    t.data.Configuration.Entity === data.Configuration.Entity &&
-                    t.data.Configuration.ExtraFilter === data.Configuration.ExtraFilter);
-            }
-        }
-        else {
-            existingTab = this.tabs.find(t => {
-                if (t.data.ResourceTypeID === data.ResourceTypeID &&
-                    t.data.ResourceRecordID === data.ResourceRecordID) {
-                    // we now have to do one more check, we have to make sure that all of the values within the Configuration object match as well
-                    let bMatch = true;
-                    // ignore keys that start with an underscore or are the NewRecordValues key
-                    const keys = Object.keys(data.Configuration).filter(k => !k.startsWith('_') && k.trim().toLowerCase() !== 'newrecordvalues');
-                    for (const key of keys) {
-                        if (data.Configuration[key] !== t.data.Configuration[key]) {
-                            bMatch = false;
-                            break;
-                        }
-                    }
-                    return bMatch;
-                }
-                else
-                    return false;
-            });
-        }
-        return existingTab;
-    }
-    /**
-     * This utility method is used to either Add a tab if a matching tab for the given data parameter isn't found, or to select the existing tab if it already exists.
-     * @param data
-     */
-    async AddOrSelectTab(data) {
-        const t = this.tabs;
-        this.loader = true;
-        const existingTab = this.findExistingTab(data);
-        if (existingTab) {
-            // merge the data that we are provided with in terms of its raw query params with the existing tab
-            // override existing values in the data.Configuration.___rawQueryParams from keys in the data.Configuration.___rawQueryParams
-            existingTab.data.Configuration.___rawQueryParams = { ...existingTab.data.Configuration.___rawQueryParams, ...data.Configuration.___rawQueryParams };
-            const index = this.tabs.indexOf(existingTab);
-            // next, before we set the active tab, we need to merge the query params that we have for this tab with the query params that we have for the tab that we're about to select
-            // when the app first loads there won't be any query params for the tabs, but as we navigate around and the tabs get selected, we'll cache the query params for each tab
-            const tqp = this.tabQueryParams['tab_' + (index + 1)];
-            if (tqp)
-                this.tabQueryParams['tab_' + (index + 1)] = { ...tqp, ...existingTab.data.Configuration.___rawQueryParams };
-            else
-                this.tabQueryParams['tab_' + (index + 1)] = existingTab.data.Configuration.___rawQueryParams;
-            // add one because the HOME tab is not in the tabs array but it IS part of our tab structure
-            this.activeTabIndex = index + 1;
-            this.scrollIntoView();
-            if (existingTab.label)
-                this.setAppTitle(existingTab.label);
-            else
-                this.setAppTitle();
-            this.loader = false;
-        }
-        else {
-            const newTab = {
-                id: "", // initially blank but will be changed to the WorkspaceItem ID once we save it
-                data: data,
-                labelLoading: true,
-                contentLoading: false,
-                workspaceItem: null,
-                icon: data.ResourceIcon,
-            };
-            // save it before we push to the tabs colleciton because we want the WorkspaceItem ID to be populated in the tab.id before we initialize the new tab by adding it to the this.tabs array
-            await this.SaveSingleWorkspaceItem(newTab);
-            // now add to data structure
-            await this.internalAddTab(newTab);
-            // select the new tab
-            this.activeTabIndex = this.tabs.length; // this is intentionally past array boundary because ActiveTabIndex includes the Home tab that is not part of the tabs array
-            this.sharedService.InvokeManualResize();
-            this.scrollIntoView();
-            setTimeout(async () => {
-                // non-blocking this way
-                newTab.label = await this.GetWorkspaceItemDisplayName(data); // do this after we fire up the loading so that we don't block anything
-                const resourceDynamicIcon = await this.GetWorkspaceItemIconClass(data);
-                newTab.icon = resourceDynamicIcon ? resourceDynamicIcon : newTab.icon;
-                this.setAppTitle(newTab.label);
-                newTab.labelLoading = false;
-                this.loader = false;
-            }, 10);
-        }
-    }
-    async internalAddTab(newTab) {
-        // add the tab to the tabs collection
-        this.tabs.push(newTab);
-        // Manually trigger change detection and wait for DOM updates
-        await this.waitForDomUpdate();
-    }
-    waitForDomUpdate() {
-        return new Promise(resolve => {
-            this.cdr.detectChanges(); // Manually trigger change detection
-            setTimeout(() => { resolve(); }, 0); // Resolve on the next tick to ensure changes are reflected in the DOM
-        });
-    }
-    updateBrowserURL(tab, data) {
-        // update the URL to reflect the current tab
-        // FIRST, construct the base URL based on the resource type
-        const rt = this.sharedService.ResourceTypeByID(data.ResourceTypeID);
-        let url = '/resource';
-        switch (rt?.Name.toLowerCase().trim()) {
-            case 'user views':
-                if (data.ResourceRecordID) {
-                    url += `/view/${data.ResourceRecordID}`;
-                }
-                else if (data.Configuration?.Entity) {
-                    // we don't have a view id. This can occur when we're referring to a dyanmic view where our data.Configuration.Entity is set and data.Configuration.ExtraFilter is set
-                    // so we need to construct a URL that will load up the dynamic view
-                    url += `/view/0?Entity=${data.Configuration.Entity}&ExtraFilter=${data.Configuration.ExtraFilter}`;
-                }
-                else {
-                    // we don't have a view ID and we also don't have an entity name, so this is an error condition
-                    LogError(`Invalid view configuration. No view ID or entity name specified.`);
-                    this.sharedService.CreateSimpleNotification(`Invalid view configuration. No view ID or entity name specified.`, "error", 5000);
-                    return;
-                }
-                break;
-            case 'dashboards':
-                url += `/dashboard/${data.ResourceRecordID}`;
-                break;
-            case 'reports':
-                url += `/report/${data.ResourceRecordID}`;
-                break;
-            case 'queries':
-                url += `/query/${data.ResourceRecordID}`;
-                break;
-            case 'records':
-                const recIDAsString = data.ResourceRecordID !== null && data.ResourceRecordID !== undefined ? (typeof data.ResourceRecordID === "string" ? data.ResourceRecordID : data.ResourceRecordID.toString()) : "";
-                url += `/record/${recIDAsString.trim()}?Entity=${data.Configuration.Entity}`;
-                if (data.Configuration.NewRecordValues) {
-                    url += `&NewRecordValues=${data.Configuration.NewRecordValues}`;
-                }
-                break;
-            case 'search results':
-                url += `/search/${data.Configuration.SearchInput}?Entity=${data.Configuration.Entity}`;
-                break;
-            case 'settings':
-                url += `/settings`;
-                break;
-            case 'notifications':
-                url += `/notifications`;
-                break;
-            case 'lists':
-                url += `/list/${data.ResourceRecordID}`;
-                break;
-        }
-        // SECOND, we need to, in some cases, append query params that the TAB had created, we don't know what those are, they could be anything. In the AfterViewInit() code above we cache
-        // these whenever they change for each tab.
-        // Split the URL into the path and existing query params
-        let [path, existingQuery] = url.split('?');
-        const currentURL = window.location.href;
-        const urlObj = new URL(currentURL);
-        //Remove Entity as existingQuery will have it
-        urlObj.searchParams.delete('Entity');
-        for (const [key, value] of urlObj.searchParams.entries()) {
-            existingQuery = existingQuery ? existingQuery + `&${key}=${value}` : `${key}=${value}`;
-        }
-        // Create a URLSearchParams object from the existing query params
-        const queryParams = new URLSearchParams(existingQuery);
-        const tabIndex = this.tabs.indexOf(tab) + 1; // we add 1 Because the HOME tab is not in the array so we have to offset by 1 here for our data structure
-        let cachedQueryParams = this.tabQueryParams['tab_' + tabIndex];
-        if (!cachedQueryParams) {
-            // there is a case when we are first loading and cached query params might have been stuffed into a 'tab_-1' key because at the time activeTabIndex wasn't yet known. So we need to check for that
-            cachedQueryParams = this.tabQueryParams['tab_-1'];
-            if (cachedQueryParams) {
-                delete this.tabQueryParams['tab_-1']; // remove it from the -1 key
-                const tqp = this.tabQueryParams['tab_' + tabIndex];
-                if (tqp)
-                    this.tabQueryParams['tab_' + tabIndex] = { ...tqp, ...cachedQueryParams }; // merge it with the existing key if it exists
-                else
-                    this.tabQueryParams['tab_' + tabIndex] = { ...cachedQueryParams }; // stuff it into the correct key
-            }
-        }
-        if (cachedQueryParams) {
-            // Merge cached query params if they don't already exist in the URL
-            const keys = Object.keys(cachedQueryParams);
-            for (const key of keys) {
-                if (!queryParams.has(key)) {
-                    queryParams.append(key, cachedQueryParams[key]);
-                }
-            }
-        }
-        // Construct the new URL with merged query params
-        const params = queryParams.toString();
-        const newUrl = `${path}${params && params.length > 0 ? '?' + queryParams.toString() : ''}`;
-        // Update the most recent URL
-        this._mostRecentURL = newUrl;
-        // Update the browser URL without triggering Angular navigation
-        //    this.location.go(newUrl);
-        this.router.navigateByUrl(newUrl); //, { skipLocationChange: true });
-        // Update the app title
-        this.setAppTitle(tab.label);
-    }
-    scrollIntoView() {
-        if (this.mjTabStrip)
-            this.mjTabStrip.scrollIntoView(this.activeTabIndex);
-    }
-    async GetWorkspaceItemDisplayName(data) {
-        const resourceReg = MJGlobal.Instance.ClassFactory.GetRegistration(BaseResourceComponent, data.ResourceType);
-        if (resourceReg) {
-            const resource = new resourceReg.SubClass();
-            return await resource.GetResourceDisplayName(data);
-        }
-        else {
-            return `Workspace Item ${data.ID}`;
-        }
-    }
-    async GetWorkspaceItemIconClass(data) {
-        const resourceReg = MJGlobal.Instance.ClassFactory.GetRegistration(BaseResourceComponent, data.ResourceType);
-        if (resourceReg) {
-            const resource = new resourceReg.SubClass();
-            return await resource.GetResourceIconClass(data);
-        }
-        else {
-            return '';
-        }
-    }
-    /**
-     * Saves the workspace to the database.
-     * @returns
-     */
-    async SaveWorkspace() {
-        let bSuccess = true;
-        for (let i = 0; i < this.tabs.length; ++i) {
-            const tab = this.tabs[i];
-            bSuccess = await this.SaveSingleWorkspaceItem(tab) && bSuccess;
-        }
-        return bSuccess;
-    }
-    async HandleResourceRecordSaved(tab, resourceRecord) {
-        const oldId = tab.data.ResourceRecordID;
-        tab.data.ResourceRecordID = resourceRecord.PrimaryKey.ToURLSegment();
-        // we need to update the label in case the "Name" of the record changed, or if it was new and no longer is new
-        tab.label = await this.GetWorkspaceItemDisplayName(tab.data);
-        const resourceDynamicIcon = await this.GetWorkspaceItemIconClass(tab.data);
-        tab.icon = resourceDynamicIcon ? resourceDynamicIcon : tab.icon;
-        // now check to see if the old id and the new ID are any different
-        // check for tab names that start with New as well...
-        // and if so we need to replace the state in the URL for Angular so that we don't have a New Record situation in the URL but have the actual ID now
-        //    if (oldId !== tab.data.ResourceRecordID || tab.label?.toLowerCase().trim().startsWith('new') ) {
-        this.updateBrowserURL(tab, tab.data);
-        //  }
-        return await this.SaveSingleWorkspaceItem(tab);
-    }
-    /**
-     * Saves a single workspace item to the database.
-     * @param tab
-     * @returns
-     */
-    async SaveSingleWorkspaceItem(tab) {
-        try {
-            if (!this.workSpace)
-                throw new Error('No workspace loaded');
-            let index = this.tabs.indexOf(tab);
-            if (index < 0)
-                index = this.tabs.length; // this situation occurs when the tab hasn't yet been added to the tabs collection so the index will be = the length of the tabs collection
-            const md = new Metadata();
-            let wsItem;
-            if (!tab.workspaceItem) {
-                wsItem = await md.GetEntityObject('Workspace Items');
-                if (tab.data.ID && tab.data.ID.length > 0)
-                    await wsItem.Load(tab.data.ID);
-                else {
-                    wsItem.NewRecord();
-                    wsItem.Name = tab.data.Name ? tab.data.Name : tab.data.ResourceType + ' Record:' + tab.data.ResourceRecordID;
-                    wsItem.WorkspaceID = this.workSpace.ID;
-                    wsItem.ResourceTypeID = tab.data?.ResourceTypeID;
-                }
-                tab.workspaceItem = wsItem;
-            }
-            else {
-                wsItem = tab.workspaceItem;
-            }
-            wsItem.ResourceRecordID = tab.data.ResourceRecordID.toString();
-            wsItem.Sequence = index;
-            wsItem.Configuration = JSON.stringify(tab.data.Configuration); // JSON.stringify({ Entity: tab.data.Entity });
-            const result = await wsItem.Save();
-            if (!result) {
-                // do a console error and display a simple notification
-                LogError(`Error saving workspace item ${wsItem.Name} to the database. ${wsItem.LatestResult.Message || wsItem.LatestResult.Error || wsItem.LatestResult.Errors?.join('\n')}`);
-                MJNotificationService.Instance.CreateSimpleNotification(`Error saving workspace item ${wsItem.Name} to the database. ${wsItem.LatestResult.Message}`, 'error', 5000);
-                return false;
-            }
-            tab.id = wsItem.ID;
-            return result;
-        }
-        catch (err) {
-            LogError(err);
-            return false;
-        }
-    }
-    setTabContentLoadingStatus(tab, bLoading) {
-        tab.contentLoading = bLoading;
-        this.cdr.detectChanges(); // Manually trigger change detection
-    }
-    async handleTabClosed(event) {
-        // get our tab data structure item based on the index that we get in the event
-        if (event.index !== null && event.index >= 0 && event.index <= this.tabs.length) {
-            const tab = this.tabs[event.index - 1]; // subtract 1 because the event index includes the home tab and our data structure does not
-            await this.closeTab(tab, event.newTabIndex);
-        }
-        event.done(); // let the tab control know that we're done handling the event
-    }
-    handleTabSelected(event) {
-        if (event.index !== null && event.index >= 0 && event.index <= this.tabs.length) {
-            if (event.index > 0) {
-                const tab = this.tabs[event.index - 1]; // subtract 1 because the event index includes the home tab and our data structure does not
-                this.innerSelectTab(tab);
-            }
-            else
-                this.innerSelectTab(null); // home
-        }
-    }
-    async closeTab(tab, newTabIndex) {
-        const tabIndex = this.tabs.indexOf(tab);
-        if (tabIndex >= 0) {
-            // INTENTIONAL - do not use await here, we want to let the database updates happen in the background
-            this.removeWorkspaceItem(this.tabs[tabIndex], null /*no transaction group*/);
-            //await this.waitForDomUpdate(); // make sure dom is up to date
-            // now, check to see how many tabs we have left and if we have none, then we need to select the HOME tab
-            if (this.tabs.length > 0) {
-                if (newTabIndex === 0) {
-                    // home tab
-                    this.innerSelectTab(null); // null param means home tab
-                }
-                else {
-                    // not home tab
-                    const tab = this.tabs[newTabIndex - 1]; // remove 1 because the newTabIndex includes the HOME tab and our data structure does not
-                    this.updateBrowserURL(tab, tab?.data);
-                }
-            }
-            else {
-                this.innerSelectTab(null); // null param means home tab
-            }
-        }
-    }
-    async removeWorkspaceItem(tab, transGroup) {
-        // remove the tab from the tabs collection
-        const index = this.tabs.indexOf(tab);
-        if (index >= 0) {
-            this.tabs.splice(index, 1);
-            // CRITICAL: Force immediate change detection to trigger component destruction
-            // This ensures Angular processes the @for removal and calls ngOnDestroy on child components
-            await this.waitForDomUpdate();
-        }
-        if (!tab.workspaceItem && tab.id && tab.id.length > 0) {
-            // we lazy load the workspaceItem entity objects, so we load it here so we can delete it below, but only when it wasn't already loaded
-            const md = new Metadata();
-            tab.workspaceItem = await md.GetEntityObject('Workspace Items');
-            await tab.workspaceItem.Load(tab.id);
-        }
-        if (tab.workspaceItem) {
-            const entity = tab.workspaceItem;
-            if (!transGroup) {
-                if (!await entity.Delete()) {
-                    // error deleting the workspace item, alert the user
-                    this.sharedService.CreateSimpleNotification('Error deleting workspace item ' + tab.workspaceItem.Name + ' from the database. Please contact your system administrator.', 'error', 5000);
-                }
-            }
-            else {
-                entity.TransactionGroup = transGroup;
-                await entity.Delete();
-            }
-        }
-    }
-    getActiveTabId() {
-        if (this.activeTabIndex === 0) {
-            return null;
-        }
-        else // subtract 1 from the activeTabIndex if it is not the first tab since our data structure is for tabs 1 to n
-            return this.tabs[this.activeTabIndex - 1]?.id;
-    }
-    isTabActive(tabId) {
-        return this.getActiveTabId() === tabId;
-    }
-    ngOnDestroy() {
-        // Clean up the subscription when the component is destroyed
-        clearTimeout(this.resizeTimeout);
-        if (this.routeSub)
-            this.routeSub.unsubscribe();
-        window.removeEventListener('resize', () => { });
-    }
-    onDrawerSelect(ev) {
-        this.selectedDrawerItem = ev.item;
-        this.router.navigate([ev.item.path]);
-        this._mostRecentURL = ev.item.path;
-        // make sure that the first tab is selected since this is showing stuff in the Home/Nav tab
-        if (this.activeTabIndex !== 0) {
-            this.activeTabIndex = 0;
-        }
-        this.setAppTitle(ev.item.text);
-    }
-    get activeTabIndex() {
-        if (this.mjTabStrip)
-            return this.mjTabStrip.SelectedTabIndex;
-        else
-            return -1;
-    }
-    set activeTabIndex(index) {
-        if (this.mjTabStrip)
-            this.mjTabStrip.SelectedTabIndex = index;
-    }
-    getEntityItemFromViewItem(viewItem) {
-        for (let item of this.drawerItems) {
-            if (item.id === viewItem.parentId) {
-                // got the parent, this is the entity
-                return item;
-            }
-        }
-        return null;
-    }
-    getAppItemFromViewItem(viewItem) {
-        let entityItem = this.getEntityItemFromViewItem(viewItem), appItem = null;
-        if (entityItem)
-            for (let item of this.drawerItems) {
-                if (item.id == entityItem.parentId) {
-                    // got the parent, this is the app
-                    appItem = item;
-                    break;
-                }
-            }
-        return appItem;
-    }
-    async loadApp() {
-        //setting the panelItems here because by this point
-        //the provider class is set within the MetaData class
-        //and the applications property is populated
-        const md = new Metadata();
-        const applications = md.Applications;
-        this.panelItems = applications.map((app) => {
-            let item = new TreeItem(app, ItemType.Application);
-            item.ChildItems = app.ApplicationEntities.map((entity) => {
-                let childItem = new TreeItem(entity, ItemType.Entity);
-                childItem.Name = entity.Entity;
-                childItem.ChildItems.push(new TreeItem({ Name: 'Stub Node' }, ItemType.StubData));
-                return childItem;
-            });
-            return item;
-        });
-        await TemplateEngineBase.Instance.Config(false);
-        await CommunicationEngineBase.Instance.Config(false);
-        await EntityCommunicationsEngineClient.Instance.Config(false);
-        await this.LoadDrawer();
-        this.setDrawerConfig();
-        window.addEventListener('resize', () => {
-            this.setDrawerConfig();
-        });
-    }
-    async LoadDrawer() {
-        const md = new Metadata();
-        //make sure SharedService_resourceTypes is populated first
-        await SharedService.RefreshData(true);
-        this.drawerItems.length = 0; // clear the array
-        const items = md.VisibleExplorerNavigationItems.filter(item => item.ShowInNavigationDrawer);
-        items.forEach(item => {
-            const drawerItem = {
-                id: item.ID,
-                selected: false,
-                text: item.Name,
-                path: item.Route,
-                icon: item.IconCSSClass
-            };
-            this.drawerItems.push(drawerItem);
-        });
-        this.loading = false;
-    }
-    async loadHome(md) {
-        const drawerItem = {
-            id: 'Home',
-            selected: true,
-            text: 'Home',
-            path: '/home',
-            icon: "fa-solid fa-house"
-        };
-        this.drawerItems.push(drawerItem);
-    }
-    async loadSettings(md) {
-        const drawerItem = {
-            id: 'Settings',
-            selected: false,
-            text: 'Settings',
-            path: '/settings',
-            icon: "fa-solid fa-gear"
-        };
-        this.drawerItems.push(drawerItem);
-    }
-    async loadLists() {
-        const drawerItem = {
-            id: 'Lists',
-            selected: false,
-            text: 'Lists',
-            path: '/lists',
-            icon: "fa-solid fa-list"
-        };
-        this.drawerItems.push(drawerItem);
-    }
-    async loadFiles() {
-        const rv = new RunView();
-        const viewResults = await rv.RunView({
-            EntityName: 'File Storage Providers',
-            ExtraFilter: 'IsActive = 1',
-        });
-        const filesEnabled = viewResults.RowCount > 0;
-        if (filesEnabled) {
-            const drawerItem = {
-                id: 'Files',
-                selected: false,
-                text: 'Files',
-                path: '/files',
-                icon: "fa-regular fa-folder"
-            };
-            this.drawerItems.push(drawerItem);
-        }
-    }
-    async loadApplications(md) {
-        const drawerItem = {
-            id: 'Data',
-            selected: false,
-            text: 'Data',
-            path: '/data',
-            icon: "fa-solid fa-database"
-        };
-        this.drawerItems.push(drawerItem);
-    }
-    async loadResourceType(key, resourceType, path, currentUserID) {
-        const rt = this.sharedService.ResourceTypeByName(resourceType);
-        if (rt) {
-            const drawerItem = {
-                id: key,
-                selected: false,
-                text: resourceType,
-                path: path,
-                icon: rt.Icon ? rt.Icon : "fa-regular fa-file-alt"
-            };
-            this.drawerItems.push(drawerItem);
-        }
-        else {
-            LogStatus("no resource type found for " + resourceType);
-        }
-    }
-    setDrawerConfig() {
-        const pageWidth = window.innerWidth;
-        if (pageWidth <= 840) {
-            this.mode = 'overlay';
-            this.mini = false;
-        }
-        else {
-            this.mode = 'push';
-            this.mini = true;
-        }
-    }
-    toggle() {
-        this.drawer.toggle();
-        this.mini = !this.mini;
-        this.sharedService.InvokeManualResize();
-    }
-    static ɵfac = function NavigationComponent_Factory(t) { return new (t || NavigationComponent)(i0.ɵɵdirectiveInject(i1.Router), i0.ɵɵdirectiveInject(i1.ActivatedRoute), i0.ɵɵdirectiveInject(i2.SharedService), i0.ɵɵdirectiveInject(i3.Location), i0.ɵɵdirectiveInject(i0.Renderer2), i0.ɵɵdirectiveInject(i4.Title), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: NavigationComponent, selectors: [["mj-navigation"]], viewQuery: function NavigationComponent_Query(rf, ctx) { if (rf & 1) {
-            i0.ɵɵviewQuery(DrawerComponent, 5);
-            i0.ɵɵviewQuery(_c0, 5);
-            i0.ɵɵviewQuery(_c1, 5);
-            i0.ɵɵviewQuery(_c2, 7, ElementRef);
-        } if (rf & 2) {
-            let _t;
-            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.drawer = _t.first);
-            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.mjTabStrip = _t.first);
-            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.drawerWrapper = _t.first);
-            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.container = _t.first);
-        } }, hostVars: 2, hostBindings: function NavigationComponent_HostBindings(rf, ctx) { if (rf & 1) {
-            i0.ɵɵlistener("resize", function NavigationComponent_resize_HostBindingHandler() { return ctx.onWindowResize(); }, false, i0.ɵɵresolveWindow)("click", function NavigationComponent_click_HostBindingHandler() { return ctx.onClick(); }, false, i0.ɵɵresolveDocument);
-        } if (rf & 2) {
-            i0.ɵɵclassProp("mobile-screen", ctx.isMobileScreen);
-        } }, inputs: { applicationName: "applicationName" }, decls: 5, vars: 6, consts: [["drawerWrapper", ""], ["drawer", ""], ["mjTabstrip", ""], ["kendoDialogContainer", "", 1, "navigation-wrap", 3, "ngClass"], ["size", "large", 3, "showText", 4, "ngIf"], [4, "ngIf"], ["class", "context-menu", 3, "ngStyle", 4, "ngIf"], ["size", "large", 3, "showText"], ["mode", "push", 3, "select", "items", "mini", "animation", "autoCollapse"], ["kendoDrawerItemTemplate", ""], ["kendoDialogContainer", ""], [3, "TabClosed", "TabSelected", "TabContextMenu", "ResizeContainer"], [3, "TabCloseable"], [1, "drawer-item-icon"], [1, "skip-icon"], [3, "class"], [1, "item-descr-wrap"], [1, "item-descr"], [1, "fa-regular", "fa-clock", "tab-icon"], [1, "tab-resource", 3, "ResourceRecordSaved", "ContentLoadingStarted", "ContentLoadingComplete", "Data", "isVisible"], [1, "context-menu", 3, "ngStyle"], [1, "context-menu-item", 3, "click"]], template: function NavigationComponent_Template(rf, ctx) { if (rf & 1) {
-            i0.ɵɵelementStart(0, "div", 3, 0);
-            i0.ɵɵtemplate(2, NavigationComponent_mj_loading_2_Template, 1, 1, "mj-loading", 4)(3, NavigationComponent_kendo_drawer_container_3_Template, 15, 5, "kendo-drawer-container", 5);
-            i0.ɵɵelementEnd();
-            i0.ɵɵtemplate(4, NavigationComponent_div_4_Template, 7, 1, "div", 6);
-        } if (rf & 2) {
-            i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(4, _c3, ctx.loader));
-            i0.ɵɵadvance(2);
-            i0.ɵɵproperty("ngIf", ctx.loading);
-            i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", !ctx.loading);
-            i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", ctx.contextMenuVisible);
-        } }, dependencies: [i1.RouterOutlet, i3.NgClass, i3.NgIf, i3.NgStyle, i5.DialogContainerDirective, i6.DrawerComponent, i6.DrawerContainerComponent, i6.DrawerContentComponent, i6.DrawerItemTemplateDirective, i7.MJTabStripComponent, i7.MJTabBodyComponent, i7.MJTabComponent, i8.LoadingComponent, i9.ResourceContainerComponent], styles: [".navigation-wrap[_ngcontent-%COMP%] {\n  height: calc(100vh - 80px);\n}\n\n.context-menu[_ngcontent-%COMP%] {\n  position: fixed;\n  z-index: 9999;\n  background-color: #ffffff;\n  border: 1px solid #ccc;\n  padding: 3px 3px;\n  box-shadow: var(--shadow);\n}\n\n.nav-tab-title[_ngcontent-%COMP%] {\n  margin-left: 10px;\n}\n\n.context-menu[_ngcontent-%COMP%] {\n  position: fixed;\n  z-index: 9999;\n  background-color: #ffffff;\n  border: 1px solid var(--gray-600);\n  padding: 3px 3px;\n  box-shadow: var(--shadow);\n}\n\n.tab-icon[_ngcontent-%COMP%] {\n  margin-right: 5px;\n}\n\n.context-menu-item[_ngcontent-%COMP%] {\n  padding: 8px 16px;\n  cursor: pointer;\n}\n\n.context-menu-item[_ngcontent-%COMP%]:hover {\n  background-color: var(--gray-700);\n}\n\n.navigation-wrap[_ngcontent-%COMP%]   .drawer-container[_ngcontent-%COMP%] {\n  background: var(--gray-color);\n}\n\n.navigation-wrap[_ngcontent-%COMP%]   .drawer-container[_ngcontent-%COMP%]   .k-content[_ngcontent-%COMP%] {\n  padding: 25px;\n}\n\n.navigation-wrap[_ngcontent-%COMP%]   .drawer-container[_ngcontent-%COMP%]   .k-tabstrip-items-wrapper[_ngcontent-%COMP%] {\n  background: var(--med-gray);\n  padding-left: 20px;\n}\n\n.navigation-wrap[_ngcontent-%COMP%]   .drawer-container[_ngcontent-%COMP%]   .k-tabstrip-items-wrapper[_ngcontent-%COMP%]   .k-item.k-active[_ngcontent-%COMP%] {\n  border: 1px solid var(--light-gray);\n  background: var(--light-gray);\n  border-radius: 8px 8px 0 0;\n  color: var(--blue-text);\n\n}\n\n.navigation-wrap[_ngcontent-%COMP%]   .drawer-container[_ngcontent-%COMP%]   .k-tabstrip-items-wrapper[_ngcontent-%COMP%]   .k-item[_ngcontent-%COMP%]:hover {\n  color: var(--blue-text);\n}\n\n.navigation-wrap[_ngcontent-%COMP%]   .drawer-container[_ngcontent-%COMP%]   .k-tabstrip-items-wrapper[_ngcontent-%COMP%]   .k-item[_ngcontent-%COMP%] {\n  background: var(--med-gray);\n  border-radius: 0;\n  border-right: 1px solid #909090;\n}\n\n.tab-resource[_ngcontent-%COMP%] {\n  display: block;\n}\n\n.k-drawer-container[_ngcontent-%COMP%] {\n  flex: 1;\n  position: relative;\n  z-index: 1;\n  height: calc(100vh - 80px);\n}\n\n.k-drawer-push[_ngcontent-%COMP%]   .k-drawer[_ngcontent-%COMP%] {\n  padding: 1.5rem 0;\n  background-color: var(--gray-600);\n  transition: var(--transition-time);\n}\n\n  .k-drawer-mini .item-descr-wrap {\n  display: none;\n}\n\n  .k-drawer-item {\n  padding: 1rem;\n  color: var(--gray-800);\n  white-space: nowrap;\n  transition: var(--transition-time);\n}\n\n  .k-drawer-item:hover {\n  background-color: var(--gray-700);\n}\n\n  .k-drawer-item.k-selected {\n  background-color: var(--mj-blue);\n}\n\n@media (max-width: 768px) {\n  .k-drawer-container.k-drawer-push[_ngcontent-%COMP%]   .k-drawer[_ngcontent-%COMP%] {\n    position: fixed;\n    top: 80px;\n    left: -50px;\n    bottom: 0;\n    padding: 16px 0;\n    z-index: 9999;\n  }\n\n  .k-drawer-expanded.k-drawer-push[_ngcontent-%COMP%]   .k-drawer[_ngcontent-%COMP%] {\n    left: 0px;\n  }\n\n    .k-drawer-mini .item-descr-wrap {\n    display: block;\n  }\n\n}"] });
-}
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(NavigationComponent, [{
-        type: Component,
-        args: [{ selector: 'mj-navigation', template: "<div class=\"navigation-wrap\" [ngClass]=\"{'waiting': loader}\"  #drawerWrapper kendoDialogContainer>\n  <mj-loading *ngIf=\"loading\" [showText]=\"false\" size=\"large\"></mj-loading>\n  <kendo-drawer-container *ngIf=\"!loading\" >\n    <kendo-drawer\n      #drawer\n      [items]=\"drawerItems\"\n      mode=\"push\"\n      [mini]=\"true\"\n      [animation]=\"false\"\n      (select)=\"onDrawerSelect($event)\"\n      [autoCollapse]=\"true\"\n    >\n      <ng-template kendoDrawerItemTemplate let-item>\n        <div class=\"drawer-item-icon\">\n          @if (item.text === 'Ask Skip') {\n            <span class=\"skip-icon\"></span>\n          } @else {\n            <span [class]=\"item.icon\"></span>\n          }\n        </div>\n        <div class=\"item-descr-wrap\">\n          <div>{{ item.text }}</div>\n          <span class=\"item-descr\">{{ item.description }}</span>\n        </div>\n      </ng-template>    \n    </kendo-drawer>\n    <kendo-drawer-content kendoDialogContainer>\n\n      <mj-tabstrip #mjTabstrip (TabClosed)=\"handleTabClosed($event)\" (TabSelected)=\"handleTabSelected($event)\" (TabContextMenu)=\"handleTabContextMenu($event)\" (ResizeContainer)=\"sharedService.InvokeManualResize()\">\n        <mj-tab [TabCloseable]=\"false\">\n          Home\n        </mj-tab>\n        <mj-tab-body>\n          <router-outlet></router-outlet>\n        </mj-tab-body>\n\n        @for(tab of tabs; track tab.id; let i = $index) {\n          <mj-tab [TabCloseable]=\"true\">\n            @if(tab?.contentLoading) {\n              <span class=\"fa-regular fa-clock tab-icon\"></span>\n            }\n            @else if (tab?.icon) {\n              <span [class]=\"tab.icon + ' tab-icon'\"></span>\n            }\n            {{ tab.labelLoading ? 'Loading...' : tab.label }}\n          </mj-tab>\n        }\n        @for(tab of tabs; track tab.id; let i = $index) {\n          <mj-tab-body>\n            <mj-resource [Data]=\"tab.data\" [isVisible]=\"activeTabIndex - 1 === i\"\n              (ResourceRecordSaved)=\"HandleResourceRecordSaved(tab, $event)\"\n              (ContentLoadingStarted)=\"setTabContentLoadingStatus(tab, true)\"\n              (ContentLoadingComplete)=\"setTabContentLoadingStatus(tab, false)\"\n              class=\"tab-resource\"\n            ></mj-resource>\n          </mj-tab-body>  \n        }\n      </mj-tabstrip>\n    </kendo-drawer-content>\n  </kendo-drawer-container>\n\n  \n  <!-- <mj-skip-button\n    action=\"route\"\n  ></mj-skip-button> -->\n  <!-- Skip Button shows up through the above line of code -->\n</div>\n\n<div class=\"context-menu\" [ngStyle]=\"contextMenuStyle\" *ngIf=\"contextMenuVisible\">\n  <div class=\"context-menu-item\" (click)=\"handleContextMenuOption(1)\">Close All</div>\n  <div class=\"context-menu-item\" (click)=\"handleContextMenuOption(2)\">Close Others</div>\n  <div class=\"context-menu-item\" (click)=\"handleContextMenuOption(3)\">Close Tabs to the Right</div>\n </div>", styles: [".navigation-wrap {\n  height: calc(100vh - 80px);\n}\n\n.context-menu {\n  position: fixed;\n  z-index: 9999;\n  background-color: #ffffff;\n  border: 1px solid #ccc;\n  padding: 3px 3px;\n  box-shadow: var(--shadow);\n}\n\n.nav-tab-title {\n  margin-left: 10px;\n}\n\n.context-menu {\n  position: fixed;\n  z-index: 9999;\n  background-color: #ffffff;\n  border: 1px solid var(--gray-600);\n  padding: 3px 3px;\n  box-shadow: var(--shadow);\n}\n\n.tab-icon {\n  margin-right: 5px;\n}\n\n.context-menu-item {\n  padding: 8px 16px;\n  cursor: pointer;\n}\n\n.context-menu-item:hover {\n  background-color: var(--gray-700);\n}\n\n.navigation-wrap .drawer-container {\n  background: var(--gray-color);\n}\n\n.navigation-wrap .drawer-container .k-content {\n  padding: 25px;\n}\n\n.navigation-wrap .drawer-container .k-tabstrip-items-wrapper {\n  background: var(--med-gray);\n  padding-left: 20px;\n}\n\n.navigation-wrap .drawer-container .k-tabstrip-items-wrapper .k-item.k-active {\n  border: 1px solid var(--light-gray);\n  background: var(--light-gray);\n  border-radius: 8px 8px 0 0;\n  color: var(--blue-text);\n\n}\n\n.navigation-wrap .drawer-container .k-tabstrip-items-wrapper .k-item:hover {\n  color: var(--blue-text);\n}\n\n.navigation-wrap .drawer-container .k-tabstrip-items-wrapper .k-item {\n  background: var(--med-gray);\n  border-radius: 0;\n  border-right: 1px solid #909090;\n}\n\n.tab-resource {\n  display: block;\n}\n\n.k-drawer-container {\n  flex: 1;\n  position: relative;\n  z-index: 1;\n  height: calc(100vh - 80px);\n}\n\n.k-drawer-push .k-drawer {\n  padding: 1.5rem 0;\n  background-color: var(--gray-600);\n  transition: var(--transition-time);\n}\n\n::ng-deep .k-drawer-mini .item-descr-wrap {\n  display: none;\n}\n\n::ng-deep .k-drawer-item {\n  padding: 1rem;\n  color: var(--gray-800);\n  white-space: nowrap;\n  transition: var(--transition-time);\n}\n\n::ng-deep .k-drawer-item:hover {\n  background-color: var(--gray-700);\n}\n\n::ng-deep .k-drawer-item.k-selected {\n  background-color: var(--mj-blue);\n}\n\n@media (max-width: 768px) {\n  .k-drawer-container.k-drawer-push .k-drawer {\n    position: fixed;\n    top: 80px;\n    left: -50px;\n    bottom: 0;\n    padding: 16px 0;\n    z-index: 9999;\n  }\n\n  .k-drawer-expanded.k-drawer-push .k-drawer {\n    left: 0px;\n  }\n\n  ::ng-deep .k-drawer-mini .item-descr-wrap {\n    display: block;\n  }\n\n}"] }]
-    }], () => [{ type: i1.Router }, { type: i1.ActivatedRoute }, { type: i2.SharedService }, { type: i3.Location }, { type: i0.Renderer2 }, { type: i4.Title }, { type: i0.ChangeDetectorRef }], { applicationName: [{
-            type: Input
-        }], isMobileScreen: [{
-            type: HostBinding,
-            args: ['class.mobile-screen']
-        }], drawer: [{
-            type: ViewChild,
-            args: [DrawerComponent, { static: false }]
-        }], mjTabStrip: [{
-            type: ViewChild,
-            args: ['mjTabstrip', { static: false }]
-        }], drawerWrapper: [{
-            type: ViewChild,
-            args: ['drawerWrapper', { static: false }]
-        }], container: [{
-            type: ViewChild,
-            args: ['container', { static: true, read: ElementRef }]
-        }], onWindowResize: [{
-            type: HostListener,
-            args: ['window:resize']
-        }], onClick: [{
-            type: HostListener,
-            args: ['document:click']
-        }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(NavigationComponent, { className: "NavigationComponent" }); })();
-//# sourceMappingURL=navigation.component.js.map