@memberjunction/ng-explorer-core 0.9.14 → 0.9.15

package/dist/lib/ask-skip/ask-skip.component.d.ts

@@ -30,6 +30,9 @@ export declare class SkipData {
     ReportTitle: string;
     DisplayType: string;
     ChartOptions: SkipChartOptions;
+    DrillDownView?: string;
+    DrillDownBaseViewField?: string;
+    DrillDownReportValueField?: string;
     UserMessage?: string;
     ReportExplanation?: string;
     Analysis?: string;

package/dist/lib/generic/dynamic-chart.d.ts

@@ -1,5 +1,6 @@
-import { SeriesType } from '@progress/kendo-angular-charts';
+import { SeriesType, CategoryAxisTitle } from '@progress/kendo-angular-charts';
 import { SkipColumnInfo, SkipData } from '../ask-skip/ask-skip.component';
+import { SeriesClickEvent } from '@progress/kendo-angular-charts';
 import * as i0 from "@angular/core";
 export declare class DynamicChartComponent {
     private _data;
@@ -9,18 +10,24 @@ export declare class DynamicChartComponent {
     chartType: string;
     xAxis: string | string[] | null;
     yAxis: string | string[] | null;
+    xLabel: string;
+    yLabel: string;
     columns: SkipColumnInfo[];
     private _skipData;
     get SkipData(): SkipData | undefined;
     set SkipData(d: SkipData | undefined);
     get kendoSeriesType(): SeriesType;
     private _axes;
-    get chartCategoryAxes(): any[];
+    get chartCategoryAxes(): {
+        categories: string[];
+        title: CategoryAxisTitle;
+    }[];
     protected convertAxisToArray(axis: string | string[] | null): string[];
     private _series;
     get chartSeries(): any[];
     private colors;
     getSeriesColor(item: any): string;
+    onChartSeriesClick(e: SeriesClickEvent): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<DynamicChartComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DynamicChartComponent, "app-dynamic-chart", never, { "data": "data"; "chartTitle": "chartTitle"; "chartType": "chartType"; "xAxis": "xAxis"; "yAxis": "yAxis"; "columns": "columns"; "SkipData": "SkipData"; }, {}, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DynamicChartComponent, "app-dynamic-chart", never, { "data": "data"; "chartTitle": "chartTitle"; "chartType": "chartType"; "xAxis": "xAxis"; "yAxis": "yAxis"; "xLabel": "xLabel"; "yLabel": "yLabel"; "columns": "columns"; "SkipData": "SkipData"; }, {}, never, never, false, never>;
 }

package/dist/lib/generic/dynamic-chart.js

@@ -1,5 +1,8 @@
 import { Component, Input } from '@angular/core';
-import { LogError } from '@memberjunction/core';
+import { EntityFieldTSType, LogError, LogStatus, Metadata } from '@memberjunction/core';
+import { MJEventType, MJGlobal } from '@memberjunction/global';
+import { EventCodes, SharedService } from '../shared/shared.service';
+import { ResourceData } from './base-resource-component';
 import * as i0 from "@angular/core";
 import * as i1 from "@angular/common";
 import * as i2 from "@progress/kendo-angular-charts";
@@ -8,16 +11,15 @@ function DynamicChartComponent_kendo_chart_category_axis_item_3_Template(rf, ctx
     i0.ɵɵelement(0, "kendo-chart-category-axis-item", 4);
 } if (rf & 2) {
     const axis_r2 = ctx.$implicit;
-    i0.ɵɵproperty("categories", axis_r2.categories);
+    i0.ɵɵproperty("title", axis_r2.title)("categories", axis_r2.categories);
 } }
 function DynamicChartComponent_kendo_chart_series_item_5_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelement(0, "kendo-chart-series-item", 5);
 } if (rf & 2) {
     const item_r3 = ctx.$implicit;
     const ctx_r1 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("type", ctx_r1.kendoSeriesType)("data", item_r3.data)("name", item_r3.name);
+    i0.ɵɵproperty("color", ctx_r1.getSeriesColor(item_r3))("type", ctx_r1.kendoSeriesType)("data", item_r3.data)("name", item_r3.name);
 } }
-// removed  [color]="getSeriesColor(item)" from the kendo-chart-series-item below
 export class DynamicChartComponent {
     constructor() {
         this._data = [];
@@ -25,14 +27,16 @@ export class DynamicChartComponent {
         this.chartType = 'column';
         this.xAxis = null;
         this.yAxis = null;
+        this.xLabel = '';
+        this.yLabel = '';
         this.columns = [];
         this._axes = [];
         this._series = [];
+        // simple default colors
         this.colors = [
             '#e6194b', '#3cb44b', '#ffe119', '#4363d8', '#f58231', '#911eb4', '#46f0f0', '#f032e6', '#bcf60c', '#fabebe',
             '#008080', '#e6beff', '#9a6324', '#fffac8', '#800000', '#aaffc3', '#808000', '#ffd8b1', '#000075', '#808080',
             '#000000', '#7cb9e8', '#c9ffe5', '#b284be', '#5d8aa8', '#00308f', '#72a0c1', '#e32636', '#c46210', '#efdecd'
-            // ... add more colors if needed
         ];
     }
     get data() {
@@ -53,6 +57,8 @@ export class DynamicChartComponent {
             this.data = d.SQLResults.results;
             this.columns = d.SQLResults.columns;
             this.xAxis = d.ChartOptions.xAxis;
+            this.xLabel = d.ChartOptions.xLabel;
+            this.yLabel = d.ChartOptions.yLabel;
             this.yAxis = d.ChartOptions.yAxis;
             this.chartType = d.DisplayType;
             this.chartTitle = d.ReportTitle;
@@ -69,7 +75,10 @@ export class DynamicChartComponent {
                 for (let i = 0; i < xArray.length; i++) {
                     const xItem = xArray[i];
                     if (xItem !== null && xItem !== undefined && xItem.length > 0)
-                        result.push({ categories: this.data.map(x => x[xItem]) });
+                        result.push({
+                            categories: this.data.map(x => x[xItem]),
+                            title: { text: this.xLabel }
+                        });
                 }
             }
             this._axes = result;
@@ -115,26 +124,81 @@ export class DynamicChartComponent {
         }
     }
     getSeriesColor(item) {
+        var _a;
         try {
-            // HILTON - this is where you use the newly provided SKIP data to determine the color of the series
-            const index = this.chartSeries.indexOf(item);
-            return this.colors[index % this.colors.length];
+            const c = (_a = this.SkipData) === null || _a === void 0 ? void 0 : _a.ChartOptions.color;
+            if (c && c.length > 0) {
+                // use the configured color since it was provided
+                return c;
+            }
+            else {
+                const index = this.chartSeries.indexOf(item);
+                return this.colors[index % this.colors.length];
+            }
         }
         catch (ex) {
             LogError(ex);
             return '#000000';
         }
     }
+    onChartSeriesClick(e) {
+        var _a, _b;
+        try {
+            const drillDownValue = e.category; // contains the category for the clicked series item
+            const ddBaseViewField = (_a = this.SkipData) === null || _a === void 0 ? void 0 : _a.DrillDownBaseViewField;
+            const ddV = (_b = this.SkipData) === null || _b === void 0 ? void 0 : _b.DrillDownView;
+            if (ddBaseViewField && ddV && ddBaseViewField.length > 0 && ddV.length > 0 && drillDownValue && drillDownValue.length > 0) {
+                // we have a valid situation to drill down where we have the configuration and we have a drill down value. 
+                const md = new Metadata();
+                const e = md.Entities.find(x => x.BaseView.trim().toLowerCase() === ddV.trim().toLowerCase());
+                if (e) {
+                    // we have a valid entity for the drill down view
+                    // now that we've validated all of this, we can navigate to the drill down view
+                    // which is simply a dynamic view for a given entity with a filter applied
+                    const rd = new ResourceData();
+                    const ef = e.Fields.find(ef => ef.Name.trim().toLowerCase() === ddBaseViewField.trim().toLowerCase());
+                    // next, fix up the drill down value to wrap with quotes if we need if we are a string or  date, and also if a string, escape any single quotes
+                    let filterVal = drillDownValue;
+                    if ((ef === null || ef === void 0 ? void 0 : ef.TSType) === EntityFieldTSType.String) {
+                        filterVal = `'${filterVal.replace(/'/g, "''")}'`;
+                    }
+                    else if ((ef === null || ef === void 0 ? void 0 : ef.TSType) === EntityFieldTSType.Date) {
+                        filterVal = `'${filterVal}'`;
+                    }
+                    rd.ResourceTypeID = SharedService.Instance.ViewResourceType.ID;
+                    rd.ResourceRecordID = 0;
+                    rd.Configuration = {
+                        Entity: e.Name,
+                        ExtraFilter: `${ddBaseViewField} = ${filterVal}`,
+                    };
+                    // now we've built up our ResourceData object, we can raise the event to navigate to the drill down view
+                    LogStatus(`drilling down to ${ddV} with filter ${ddBaseViewField} = ${drillDownValue}`);
+                    MJGlobal.Instance.RaiseEvent({
+                        component: this,
+                        event: MJEventType.ComponentEvent,
+                        eventCode: EventCodes.ViewClicked,
+                        args: rd
+                    });
+                }
+                else
+                    LogError(`Could not find entity for the specified DrillDownView: ${ddV}`);
+            }
+        }
+        catch (e) {
+            LogError(e);
+        }
+    }
 }
 DynamicChartComponent.ɵfac = function DynamicChartComponent_Factory(t) { return new (t || DynamicChartComponent)(); };
-DynamicChartComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: DynamicChartComponent, selectors: [["app-dynamic-chart"]], inputs: { data: "data", chartTitle: "chartTitle", chartType: "chartType", xAxis: "xAxis", yAxis: "yAxis", columns: "columns", SkipData: "SkipData" }, decls: 6, vars: 3, consts: [["mjFillContainer", ""], [3, "text"], [3, "categories", 4, "ngFor", "ngForOf"], [3, "type", "data", "name", 4, "ngFor", "ngForOf"], [3, "categories"], [3, "type", "data", "name"]], template: function DynamicChartComponent_Template(rf, ctx) { if (rf & 1) {
+DynamicChartComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: DynamicChartComponent, selectors: [["app-dynamic-chart"]], inputs: { data: "data", chartTitle: "chartTitle", chartType: "chartType", xAxis: "xAxis", yAxis: "yAxis", xLabel: "xLabel", yLabel: "yLabel", columns: "columns", SkipData: "SkipData" }, decls: 6, vars: 3, consts: [["mjFillContainer", "", 3, "seriesClick"], [3, "text"], [3, "title", "categories", 4, "ngFor", "ngForOf"], [3, "color", "type", "data", "name", 4, "ngFor", "ngForOf"], [3, "title", "categories"], [3, "color", "type", "data", "name"]], template: function DynamicChartComponent_Template(rf, ctx) { if (rf & 1) {
         i0.ɵɵelementStart(0, "kendo-chart", 0);
+        i0.ɵɵlistener("seriesClick", function DynamicChartComponent_Template_kendo_chart_seriesClick_0_listener($event) { return ctx.onChartSeriesClick($event); });
         i0.ɵɵelement(1, "kendo-chart-title", 1);
         i0.ɵɵelementStart(2, "kendo-chart-category-axis");
-        i0.ɵɵtemplate(3, DynamicChartComponent_kendo_chart_category_axis_item_3_Template, 1, 1, "kendo-chart-category-axis-item", 2);
+        i0.ɵɵtemplate(3, DynamicChartComponent_kendo_chart_category_axis_item_3_Template, 1, 2, "kendo-chart-category-axis-item", 2);
         i0.ɵɵelementEnd();
         i0.ɵɵelementStart(4, "kendo-chart-series");
-        i0.ɵɵtemplate(5, DynamicChartComponent_kendo_chart_series_item_5_Template, 1, 3, "kendo-chart-series-item", 3);
+        i0.ɵɵtemplate(5, DynamicChartComponent_kendo_chart_series_item_5_Template, 1, 4, "kendo-chart-series-item", 3);
         i0.ɵɵelementEnd()();
     } if (rf & 2) {
         i0.ɵɵadvance(1);
@@ -149,13 +213,16 @@ DynamicChartComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: Dynam
         args: [{
                 selector: 'app-dynamic-chart',
                 template: `
-    <kendo-chart mjFillContainer>
+    <kendo-chart mjFillContainer
+        (seriesClick)="onChartSeriesClick($event)"
+        >
         <kendo-chart-title [text]="chartTitle"></kendo-chart-title>
         <kendo-chart-category-axis>
-            <kendo-chart-category-axis-item *ngFor="let axis of chartCategoryAxes" [categories]="axis.categories"></kendo-chart-category-axis-item>
+            <kendo-chart-category-axis-item *ngFor="let axis of chartCategoryAxes" [title]="axis.title" [categories]="axis.categories"></kendo-chart-category-axis-item>
         </kendo-chart-category-axis>
         <kendo-chart-series>
             <kendo-chart-series-item *ngFor="let item of chartSeries" 
+                                     [color]="getSeriesColor(item)"
                                      [type]="kendoSeriesType" 
                                      [data]="item.data" 
                                      [name]="item.name"></kendo-chart-series-item>
@@ -173,6 +240,10 @@ DynamicChartComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: Dynam
             type: Input
         }], yAxis: [{
             type: Input
+        }], xLabel: [{
+            type: Input
+        }], yLabel: [{
+            type: Input
         }], columns: [{
             type: Input
         }], SkipData: [{

package/dist/lib/generic/dynamic-grid.d.ts

@@ -19,6 +19,7 @@ export declare class DynamicGridComponent implements AfterViewInit {
     ngAfterViewInit(): void;
     pageChange(event: PageChangeEvent): void;
     private loadGridView;
+    cellClick(event: any): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<DynamicGridComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<DynamicGridComponent, "app-dynamic-grid", never, { "data": "data"; "columns": "columns"; "pageSize": "pageSize"; "startingRow": "startingRow"; "SkipData": "SkipData"; }, {}, never, never, false, never>;
 }

package/dist/lib/generic/dynamic-grid.js

@@ -1,5 +1,6 @@
 import { Component, Input } from '@angular/core';
 import { DecimalPipe, DatePipe } from '@angular/common';
+import { LogStatus } from '@memberjunction/core';
 import * as i0 from "@angular/core";
 import * as i1 from "@angular/common";
 import * as i2 from "@progress/kendo-angular-grid";
@@ -82,11 +83,15 @@ export class DynamicGridComponent {
             total: this.data.length,
         };
     }
+    cellClick(event) {
+        LogStatus(`Cell clicked in DynamicGrid`, undefined, event);
+        LogStatus('Need to implement cellClick in DynamicGridComponent like DyanmicChartComponent to do drill down!');
+    }
 }
 DynamicGridComponent.ɵfac = function DynamicGridComponent_Factory(t) { return new (t || DynamicGridComponent)(i0.ɵɵdirectiveInject(i1.DecimalPipe), i0.ɵɵdirectiveInject(i1.DatePipe)); };
-DynamicGridComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: DynamicGridComponent, selectors: [["app-dynamic-grid"]], inputs: { data: "data", columns: "columns", pageSize: "pageSize", startingRow: "startingRow", SkipData: "SkipData" }, features: [i0.ɵɵProvidersFeature([DecimalPipe, DatePipe])], decls: 2, vars: 8, consts: [["scrollable", "virtual", 3, "data", "skip", "pageSize", "rowHeight", "reorderable", "resizable", "navigable", "pageChange"], [4, "ngFor", "ngForOf"], [3, "field", "title", "headerStyle"], ["kendoGridCellTemplate", ""]], template: function DynamicGridComponent_Template(rf, ctx) { if (rf & 1) {
+DynamicGridComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: DynamicGridComponent, selectors: [["app-dynamic-grid"]], inputs: { data: "data", columns: "columns", pageSize: "pageSize", startingRow: "startingRow", SkipData: "SkipData" }, features: [i0.ɵɵProvidersFeature([DecimalPipe, DatePipe])], decls: 2, vars: 8, consts: [["scrollable", "virtual", 3, "data", "skip", "pageSize", "rowHeight", "reorderable", "resizable", "navigable", "pageChange", "cellClick"], [4, "ngFor", "ngForOf"], [3, "field", "title", "headerStyle"], ["kendoGridCellTemplate", ""]], template: function DynamicGridComponent_Template(rf, ctx) { if (rf & 1) {
         i0.ɵɵelementStart(0, "kendo-grid", 0);
-        i0.ɵɵlistener("pageChange", function DynamicGridComponent_Template_kendo_grid_pageChange_0_listener($event) { return ctx.pageChange($event); });
+        i0.ɵɵlistener("pageChange", function DynamicGridComponent_Template_kendo_grid_pageChange_0_listener($event) { return ctx.pageChange($event); })("cellClick", function DynamicGridComponent_Template_kendo_grid_cellClick_0_listener($event) { return ctx.cellClick($event); });
         i0.ɵɵtemplate(1, DynamicGridComponent_ng_container_1_Template, 3, 4, "ng-container", 1);
         i0.ɵɵelementEnd();
     } if (rf & 2) {
@@ -107,6 +112,7 @@ DynamicGridComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: Dynami
                 [reorderable]="true"
                 [resizable]="true"
                 (pageChange)="pageChange($event)"
+                (cellClick)="cellClick($event)"
                 [navigable]="true">
         <ng-container *ngFor="let col of columns">
             <kendo-grid-column 

package/dist/lib/navigation/navigation.component.d.ts

@@ -72,6 +72,7 @@ export declare class NavigationComponent implements OnInit, OnDestroy, AfterView
     private getWorkspace;
     LoadWorkSpace(): Promise<void>;
     protected setAppTitle(title?: string): void;
+    protected checkForExistingTab(data: ResourceData): Tab | null;
     protected AddOrSelectTab(data: ResourceData): Promise<void>;
     private updateBrowserURL;
     scrollIntoView(): void;

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

@@ -466,28 +466,49 @@ export class NavigationComponent {
         else
             this.titleService.setTitle(title + ' (' + this.applicationName + ')');
     }
-    AddOrSelectTab(data) {
-        return __awaiter(this, void 0, void 0, function* () {
-            const t = this.tabs;
-            this.loader = true;
-            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
+    checkForExistingTab(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 > 0) {
+                // saved view
                 existingTab = this.tabs.find(t => t.data.ResourceTypeID === data.ResourceTypeID &&
-                    t.data.Configuration.Entity === data.Configuration.Entity &&
-                    t.data.Configuration.SearchInput === data.Configuration.SearchInput);
+                    t.data.ResourceRecordID === data.ResourceRecordID &&
+                    data.ResourceRecordID !== null &&
+                    data.ResourceRecordID !== undefined &&
+                    data.ResourceRecordID > 0 // make sure that we don't match on null/undefined/0 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.ResourceRecordID === data.ResourceRecordID &&
-                    data.ResourceRecordID !== null && data.ResourceRecordID !== undefined && data.ResourceRecordID > 0 // make sure that we don't match on null/undefined/0 ResourceRecordID's - these should always be NEW tabs
-                );
+                    t.data.Configuration.Entity === data.Configuration.Entity &&
+                    t.data.Configuration.ExtraFilter === data.Configuration.ExtraFilter);
             }
+        }
+        else {
+            existingTab = this.tabs.find(t => t.data.ResourceTypeID === data.ResourceTypeID &&
+                t.data.ResourceRecordID === data.ResourceRecordID &&
+                data.ResourceRecordID !== null && data.ResourceRecordID !== undefined && data.ResourceRecordID > 0 // make sure that we don't match on null/undefined/0 ResourceRecordID's - these should always be NEW tabs
+            );
+        }
+        return existingTab;
+    }
+    AddOrSelectTab(data) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const t = this.tabs;
+            this.loader = true;
+            const existingTab = this.checkForExistingTab(data);
             if (existingTab) {
                 const index = this.tabs.indexOf(existingTab);
                 this.activeTabIndex = index + 1; // add one because the HOME tab is not in the tabs array but it IS part of our tab structure
                 this.tabstrip.selectTab(this.activeTabIndex);
-                //this.renderer.selectRootElement(this.tabstrip.wrapper.nativeElement.nativeElement).focus()
                 this.scrollIntoView();
                 if (existingTab.label)
                     this.setAppTitle(existingTab.label);
@@ -526,12 +547,26 @@ export class NavigationComponent {
     }
     updateBrowserURL(tab, data) {
         // update the URL to reflect the current tab
+        var _a;
         // FIRST, construct the base URL based on the resource type
         const rt = this.sharedService.ResourceTypeByID(data.ResourceTypeID);
         let url = '/resource';
         switch (rt === null || rt === void 0 ? void 0 : rt.Name.toLowerCase().trim()) {
             case 'user views':
-                url += `/view/${data.ResourceRecordID}`;
+                if (data.ResourceRecordID && !isNaN(data.ResourceRecordID) && data.ResourceRecordID > 0) {
+                    url += `/view/${data.ResourceRecordID}`;
+                }
+                else if ((_a = data.Configuration) === null || _a === void 0 ? void 0 : _a.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}`;

package/dist/lib/resource-wrappers/view-resource.component.js

@@ -24,20 +24,28 @@ export function LoadViewResource() {
 }
 let UserViewResource = class UserViewResource extends BaseResourceComponent {
     GetResourceDisplayName(data) {
+        var _a, _b, _c;
         return __awaiter(this, void 0, void 0, function* () {
             const md = new Metadata();
-            const name = yield md.GetEntityRecordName('User Views', data.ResourceRecordID);
-            return name ? name : 'View: ' + data.ResourceRecordID;
+            if (data.ResourceRecordID > 0) {
+                const name = yield md.GetEntityRecordName('User Views', data.ResourceRecordID);
+                return name ? name : 'View: ' + data.ResourceRecordID;
+            }
+            else if (((_a = data.Configuration) === null || _a === void 0 ? void 0 : _a.Entity) && ((_b = data.Configuration) === null || _b === void 0 ? void 0 : _b.Entity.length) > 0) {
+                return `${(_c = data.Configuration) === null || _c === void 0 ? void 0 : _c.Entity} [Dynamic${data.Configuration.ExtraFilter ? ' - Filtered' : ' - All'}]`;
+            }
+            else
+                return 'User Views [Error]';
         });
     }
 };
 UserViewResource.ɵfac = /*@__PURE__*/ function () { let ɵUserViewResource_BaseFactory; return function UserViewResource_Factory(t) { return (ɵUserViewResource_BaseFactory || (ɵUserViewResource_BaseFactory = i0.ɵɵgetInheritedFactory(UserViewResource)))(t || UserViewResource); }; }();
-UserViewResource.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: UserViewResource, selectors: [["userview-resource"]], features: [i0.ɵɵInheritDefinitionFeature], decls: 1, vars: 1, consts: [[3, "viewId", "loadComplete"]], template: function UserViewResource_Template(rf, ctx) { if (rf & 1) {
+UserViewResource.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: UserViewResource, selectors: [["userview-resource"]], features: [i0.ɵɵInheritDefinitionFeature], decls: 1, vars: 4, consts: [[3, "viewId", "viewName", "entityName", "extraFilter", "loadComplete"]], template: function UserViewResource_Template(rf, ctx) { if (rf & 1) {
         i0.ɵɵelementStart(0, "app-single-view", 0);
         i0.ɵɵlistener("loadComplete", function UserViewResource_Template_app_single_view_loadComplete_0_listener() { return ctx.NotifyLoadComplete(); });
         i0.ɵɵelementEnd();
     } if (rf & 2) {
-        i0.ɵɵproperty("viewId", ctx.Data.ResourceRecordID);
+        i0.ɵɵproperty("viewId", ctx.Data.ResourceRecordID)("viewName", ctx.Data.Configuration == null ? null : ctx.Data.Configuration.ViewName)("entityName", ctx.Data.Configuration == null ? null : ctx.Data.Configuration.Entity)("extraFilter", ctx.Data.Configuration == null ? null : ctx.Data.Configuration.ExtraFilter);
     } }, dependencies: [i1.SingleViewComponent], encapsulation: 2 });
 UserViewResource = __decorate([
     RegisterClass(BaseResourceComponent, 'User Views')
@@ -47,6 +55,11 @@ export { UserViewResource };
         type: Component,
         args: [{
                 selector: 'userview-resource',
-                template: `<app-single-view [viewId]="Data.ResourceRecordID" (loadComplete)="NotifyLoadComplete()"></app-single-view>`
+                template: `<app-single-view [viewId]="Data.ResourceRecordID" 
+                                [viewName]="Data.Configuration?.ViewName" 
+                                [entityName]="Data.Configuration?.Entity" 
+                                [extraFilter]="Data.Configuration?.ExtraFilter" 
+                                (loadComplete)="NotifyLoadComplete()">
+                </app-single-view>`
             }]
     }], null, null); })();

package/dist/lib/single-view/single-view.component.d.ts

@@ -11,7 +11,10 @@ export declare class SingleViewComponent implements AfterViewInit, OnInit {
     private sharedService;
     viewGrid: UserViewGridComponent;
     viewId: number | null;
+    viewName: string | null;
     selectedView: UserViewEntity | null;
+    extraFilter: string | null;
+    entityName: string | null;
     loadComplete: EventEmitter<any>;
     selectedEntity: EntityInfo | null;
     showSearch: boolean;
@@ -24,11 +27,12 @@ export declare class SingleViewComponent implements AfterViewInit, OnInit {
     private initialLoad;
     handleRowClick(args: GridRowClickedEvent): Promise<void>;
     LoadView(viewInfo: UserViewEntity): Promise<void>;
+    LoadDynamicView(): Promise<void>;
     Refresh(): Promise<void>;
     onSearch(inputValue: string): void;
     private setupSearchDebounce;
     private search;
     viewPropertiesDialogClosed(args: any): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<SingleViewComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<SingleViewComponent, "app-single-view", never, { "viewId": "viewId"; "selectedView": "selectedView"; }, { "loadComplete": "loadComplete"; }, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SingleViewComponent, "app-single-view", never, { "viewId": "viewId"; "viewName": "viewName"; "selectedView": "selectedView"; "extraFilter": "extraFilter"; "entityName": "entityName"; }, { "loadComplete": "loadComplete"; }, never, never, false, never>;
 }

package/dist/lib/single-view/single-view.component.js

@@ -9,7 +9,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
 };
 import { Component, ViewChild, Input, Output, EventEmitter } from '@angular/core';
 import { UserViewGridComponent } from '@memberjunction/ng-user-view-grid';
-import { Metadata } from '@memberjunction/core';
+import { Metadata, LogError } from '@memberjunction/core';
 import { distinctUntilChanged, Subject } from "rxjs";
 import { debounceTime } from "rxjs/operators";
 import { ViewInfo } from '@memberjunction/core-entities';
@@ -23,21 +23,33 @@ import * as i6 from "@memberjunction/ng-container-directives";
 import * as i7 from "@memberjunction/ng-user-view-grid";
 import * as i8 from "../user-view-properties/view-properties-dialog.component";
 function SingleViewComponent_kendo_textbox_2_Template(rf, ctx) { if (rf & 1) {
-    const _r2 = i0.ɵɵgetCurrentView();
+    const _r3 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "kendo-textbox", 5);
-    i0.ɵɵlistener("valueChange", function SingleViewComponent_kendo_textbox_2_Template_kendo_textbox_valueChange_0_listener($event) { i0.ɵɵrestoreView(_r2); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onSearch($event)); })("ngModelChange", function SingleViewComponent_kendo_textbox_2_Template_kendo_textbox_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r2); const ctx_r3 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r3.searchText = $event); });
+    i0.ɵɵlistener("valueChange", function SingleViewComponent_kendo_textbox_2_Template_kendo_textbox_valueChange_0_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onSearch($event)); })("ngModelChange", function SingleViewComponent_kendo_textbox_2_Template_kendo_textbox_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r4 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r4.searchText = $event); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
     i0.ɵɵproperty("clearButton", true)("ngModel", ctx_r0.searchText);
 } }
+function SingleViewComponent_app_view_properties_dialog_3_Template(rf, ctx) { if (rf & 1) {
+    const _r6 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "app-view-properties-dialog", 6);
+    i0.ɵɵlistener("dialogClosed", function SingleViewComponent_app_view_properties_dialog_3_Template_app_view_properties_dialog_dialogClosed_0_listener($event) { i0.ɵɵrestoreView(_r6); const ctx_r5 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r5.viewPropertiesDialogClosed($event)); });
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("ViewID", ctx_r1.selectedView.ID);
+} }
 export class SingleViewComponent {
     constructor(router, route, sharedService) {
         this.router = router;
         this.route = route;
         this.sharedService = sharedService;
-        this.viewId = -1;
+        this.viewId = null;
+        this.viewName = null;
         this.selectedView = null;
+        this.extraFilter = null;
+        this.entityName = null;
         this.loadComplete = new EventEmitter();
         this.selectedEntity = null;
         this.showSearch = false;
@@ -53,18 +65,36 @@ export class SingleViewComponent {
     }
     initialLoad() {
         return __awaiter(this, void 0, void 0, function* () {
-            if (this.viewId) {
-                const md = new Metadata();
-                const view = yield ViewInfo.GetViewEntity(this.viewId);
+            const md = new Metadata();
+            if (this.viewId || this.viewName) {
+                let view = null;
+                if (this.viewId)
+                    view = (yield ViewInfo.GetViewEntity(this.viewId));
+                else if (this.viewName)
+                    view = (yield ViewInfo.GetViewEntityByName(this.viewName));
                 if (view) {
                     yield this.LoadView(view);
-                    const e = md.Entities.find(e => e.ID === view.EntityID);
+                    const e = md.Entities.find(e => e.ID === (view === null || view === void 0 ? void 0 : view.EntityID));
                     if (e) {
                         this.selectedEntity = e;
                         this.showSearch = e.AllowUserSearchAPI;
                     }
                 }
             }
+            else if (this.entityName && this.entityName.length > 0) {
+                // we are running a dynamic view here, not a view by ID
+                const e = md.Entities.find(e => { var _a; return e.Name.trim().toLowerCase() === ((_a = this.entityName) === null || _a === void 0 ? void 0 : _a.trim().toLowerCase()); });
+                if (e) {
+                    this.selectedEntity = e;
+                    this.showSearch = e.AllowUserSearchAPI;
+                    yield this.LoadDynamicView();
+                }
+                else {
+                    // problem, we don't have a valid entity name
+                    LogError(`Invalid entity name: ${this.entityName}`);
+                    this.sharedService.CreateSimpleNotification(`The entity name ${this.entityName} is not valid. Please check the URL and try again.`, "error", 5000);
+                }
+            }
         });
     }
     handleRowClick(args) {
@@ -86,10 +116,23 @@ export class SingleViewComponent {
             this.loadComplete.emit();
         });
     }
+    LoadDynamicView() {
+        return __awaiter(this, void 0, void 0, function* () {
+            this.selectedView = null;
+            yield this.viewGrid.Refresh({
+                EntityName: this.entityName,
+                ExtraFilter: this.extraFilter,
+                UserSearchString: this.searchText
+            });
+            this.loadComplete.emit();
+        });
+    }
     Refresh() {
         return __awaiter(this, void 0, void 0, function* () {
             if (this.selectedView)
                 yield this.LoadView(this.selectedView);
+            else
+                yield this.LoadDynamicView();
         });
     }
     onSearch(inputValue) {
@@ -102,12 +145,10 @@ export class SingleViewComponent {
         });
     }
     search(inputValue) {
-        if (this.selectedView && this.selectedView.ID && this.selectedView.ID > 0) {
-            this.viewGrid.Refresh({
-                ViewID: this.selectedView.ID,
-                UserSearchString: inputValue
-            });
-        }
+        return __awaiter(this, void 0, void 0, function* () {
+            this.searchText = inputValue;
+            yield this.Refresh();
+        });
     }
     viewPropertiesDialogClosed(args) {
         if (args && args.Saved && args.ViewEntity) {
@@ -122,12 +163,11 @@ SingleViewComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SingleV
     } if (rf & 2) {
         let _t;
         i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.viewGrid = _t.first);
-    } }, inputs: { viewId: "viewId", selectedView: "selectedView" }, outputs: { loadComplete: "loadComplete" }, decls: 5, vars: 3, consts: [["mjFillContainer", ""], [1, "searchBox"], ["id", "txtSearch", "placeholder", "Search here...", "kendoTextBox", "", 3, "clearButton", "ngModel", "valueChange", "ngModelChange", 4, "ngIf"], [3, "ViewID", "dialogClosed"], ["mjFillContainer", "", 3, "AutoNavigate", "rowClicked"], ["id", "txtSearch", "placeholder", "Search here...", "kendoTextBox", "", 3, "clearButton", "ngModel", "valueChange", "ngModelChange"]], template: function SingleViewComponent_Template(rf, ctx) { if (rf & 1) {
+    } }, inputs: { viewId: "viewId", viewName: "viewName", selectedView: "selectedView", extraFilter: "extraFilter", entityName: "entityName" }, outputs: { loadComplete: "loadComplete" }, decls: 5, vars: 3, consts: [["mjFillContainer", ""], [1, "searchBox"], ["id", "txtSearch", "placeholder", "Search here...", "kendoTextBox", "", 3, "clearButton", "ngModel", "valueChange", "ngModelChange", 4, "ngIf"], [3, "ViewID", "dialogClosed", 4, "ngIf"], ["mjFillContainer", "", 3, "AutoNavigate", "rowClicked"], ["id", "txtSearch", "placeholder", "Search here...", "kendoTextBox", "", 3, "clearButton", "ngModel", "valueChange", "ngModelChange"], [3, "ViewID", "dialogClosed"]], template: function SingleViewComponent_Template(rf, ctx) { if (rf & 1) {
         i0.ɵɵelementStart(0, "div", 0)(1, "div", 1);
         i0.ɵɵtemplate(2, SingleViewComponent_kendo_textbox_2_Template, 1, 2, "kendo-textbox", 2);
-        i0.ɵɵelementStart(3, "app-view-properties-dialog", 3);
-        i0.ɵɵlistener("dialogClosed", function SingleViewComponent_Template_app_view_properties_dialog_dialogClosed_3_listener($event) { return ctx.viewPropertiesDialogClosed($event); });
-        i0.ɵɵelementEnd()();
+        i0.ɵɵtemplate(3, SingleViewComponent_app_view_properties_dialog_3_Template, 1, 1, "app-view-properties-dialog", 3);
+        i0.ɵɵelementEnd();
         i0.ɵɵelementStart(4, "mj-user-view-grid", 4);
         i0.ɵɵlistener("rowClicked", function SingleViewComponent_Template_mj_user_view_grid_rowClicked_4_listener($event) { return ctx.handleRowClick($event); });
         i0.ɵɵelementEnd()();
@@ -135,20 +175,26 @@ SingleViewComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SingleV
         i0.ɵɵadvance(2);
         i0.ɵɵproperty("ngIf", ctx.showSearch);
         i0.ɵɵadvance(1);
-        i0.ɵɵproperty("ViewID", ctx.selectedView == null ? null : ctx.selectedView.ID);
+        i0.ɵɵproperty("ngIf", ctx.selectedView);
         i0.ɵɵadvance(1);
         i0.ɵɵproperty("AutoNavigate", false);
     } }, dependencies: [i3.NgIf, i4.NgControlStatus, i4.NgModel, i5.TextBoxComponent, i6.FillContainer, i7.UserViewGridComponent, i8.ViewPropertiesDialogComponent] });
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SingleViewComponent, [{
         type: Component,
-        args: [{ selector: 'app-single-view', template: "<div mjFillContainer>\r\n  <div class=\"card-container\" class=\"searchBox\">\r\n    <kendo-textbox\r\n      id=\"txtSearch\"\r\n      *ngIf=\"showSearch\"\r\n      placeholder=\"Search here...\"\r\n      kendoTextBox\r\n      (valueChange)=\"onSearch($event)\"\r\n      [clearButton]=\"true\"\r\n      [(ngModel)]=\"searchText\"\r\n    ></kendo-textbox>\r\n\r\n    <app-view-properties-dialog [ViewID]=\"selectedView?.ID\" (dialogClosed)=\"this.viewPropertiesDialogClosed($event)\" ></app-view-properties-dialog>\r\n  </div>\r\n\r\n  <mj-user-view-grid (rowClicked)=\"handleRowClick($event)\" [AutoNavigate]=\"false\" mjFillContainer></mj-user-view-grid>\r\n</div>\r\n" }]
+        args: [{ selector: 'app-single-view', template: "<div mjFillContainer>\r\n  <div class=\"card-container\" class=\"searchBox\">\r\n    <kendo-textbox\r\n      id=\"txtSearch\"\r\n      *ngIf=\"showSearch\"\r\n      placeholder=\"Search here...\"\r\n      kendoTextBox\r\n      (valueChange)=\"onSearch($event)\"\r\n      [clearButton]=\"true\"\r\n      [(ngModel)]=\"searchText\"\r\n    ></kendo-textbox>\r\n\r\n    <app-view-properties-dialog *ngIf=\"selectedView\" [ViewID]=\"selectedView.ID\" (dialogClosed)=\"this.viewPropertiesDialogClosed($event)\" ></app-view-properties-dialog>\r\n  </div>\r\n\r\n  <mj-user-view-grid (rowClicked)=\"handleRowClick($event)\" [AutoNavigate]=\"false\" mjFillContainer></mj-user-view-grid>\r\n</div>\r\n" }]
     }], function () { return [{ type: i1.Router }, { type: i1.ActivatedRoute }, { type: i2.SharedService }]; }, { viewGrid: [{
             type: ViewChild,
             args: [UserViewGridComponent, { static: true }]
         }], viewId: [{
             type: Input
+        }], viewName: [{
+            type: Input
         }], selectedView: [{
             type: Input
+        }], extraFilter: [{
+            type: Input
+        }], entityName: [{
+            type: Input
         }], loadComplete: [{
             type: Output
         }] }); })();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@memberjunction/ng-explorer-core",
-  "version": "0.9.14",
+  "version": "0.9.15",
   "description": "MemberJunction Explorer: Core Angular Components",
   "main": "./dist/public-api.js",
   "typings": "./dist/public-api.d.ts",
@@ -27,12 +27,12 @@
     "@progress/kendo-angular-listview": "^12.1.0"
   },
   "dependencies": {
-    "@memberjunction/global": "^0.9.74",
-    "@memberjunction/core": "^0.9.71",
-    "@memberjunction/ng-compare-records": "^0.9.73",
-    "@memberjunction/ng-record-changes": "^0.9.11",
-    "@memberjunction/ng-container-directives": "^0.9.49",
-    "@memberjunction/ng-user-view-grid": "^0.9.53",
+    "@memberjunction/global": "^0.9.75",
+    "@memberjunction/core": "^0.9.72",
+    "@memberjunction/ng-compare-records": "^0.9.74",
+    "@memberjunction/ng-record-changes": "^0.9.12",
+    "@memberjunction/ng-container-directives": "^0.9.50",
+    "@memberjunction/ng-user-view-grid": "^0.9.54",
     "tslib": "^2.3.0"
   },
   "sideEffects": false