@abp/ng.components 8.3.1 → 9.0.0-rc.1

package/fesm2022/abp-ng.components-extensible.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { inject, ChangeDetectorRef, Optional, SkipSelf, Component, ChangeDetectionStrategy, Input, ViewChild, InjectionToken, Injectable, Pipe, Injector, Directive, ViewChildren, EventEmitter, LOCALE_ID, Output, NgModule } from '@angular/core';
+import { inject, ChangeDetectorRef, Optional, SkipSelf, Component, ChangeDetectionStrategy, Input, ViewChild, InjectionToken, Injectable, Pipe, Injector, Directive, ViewChildren, LOCALE_ID, EventEmitter, Output, NgModule } from '@angular/core';
 import * as i5 from '@angular/common';
 import { CommonModule, NgClass, NgTemplateOutlet, formatDate, AsyncPipe, NgComponentOutlet } from '@angular/common';
 import * as i2 from '@angular/forms';
@@ -12,8 +12,8 @@ import { DateTimeAdapter, DisabledDirective, DateAdapter, TimeAdapter, EllipsisD
 import { LinkedList } from '@abp/utils';
 import * as i2$1 from '@abp/ng.core';
 import { RestService, ConfigStateService, AbpValidators, TrackByService, ShowPasswordDirective, PermissionDirective, LocalizationModule, escapeHtmlChars, PermissionService, getShortDateShortTimeFormat, getShortTimeFormat, getShortDateFormat, LocalizationService, createLocalizationPipeKeyGenerator, CoreModule } from '@abp/ng.core';
-import { of, merge, pipe, zip } from 'rxjs';
-import { map, debounceTime, distinctUntilChanged, switchMap, filter, take } from 'rxjs/operators';
+import { of, map as map$1, filter, merge, pipe, zip } from 'rxjs';
+import { map, debounceTime, distinctUntilChanged, switchMap, filter as filter$1, take } from 'rxjs/operators';
 import * as i1$1 from '@swimlane/ngx-datatable';
 import { NgxDatatableModule } from '@swimlane/ngx-datatable';
 
@@ -916,6 +916,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.5", ngImpor
 
 const DEFAULT_ACTIONS_COLUMN_WIDTH = 150;
 class ExtensibleTableComponent {
+    #injector;
     set actionsText(value) {
         this._actionsText = value;
     }
@@ -925,16 +926,16 @@ class ExtensibleTableComponent {
     set actionsColumnWidth(width) {
         this.setColumnWidths(width ? Number(width) : undefined);
     }
-    #injector;
     constructor() {
-        this.tableActivate = new EventEmitter();
-        this.trackByFn = (_, item) => item.name;
+        this.#injector = inject(Injector);
+        this.getInjected = this.#injector.get.bind(this.#injector);
+        this.cdr = inject(ChangeDetectorRef);
         this.locale = inject(LOCALE_ID);
         this.config = inject(ConfigStateService);
         this.entityPropTypeClasses = inject(ENTITY_PROP_TYPE_CLASSES);
-        this.#injector = inject(Injector);
-        this.getInjected = this.#injector.get.bind(this.#injector);
-        this.permissionService = this.#injector.get(PermissionService);
+        this.permissionService = inject(PermissionService);
+        this.tableActivate = new EventEmitter();
+        this.trackByFn = (_, item) => item.name;
         const extensions = this.#injector.get(ExtensionsService);
         const name = this.#injector.get(EXTENSIONS_IDENTIFIER);
         this.propList = extensions.entityProps.get(name).props;
@@ -966,7 +967,7 @@ class ExtensibleTableComponent {
         return key;
     }
     getContent(prop, data) {
-        return prop.valueResolver(data).pipe(map(value => {
+        return prop.valueResolver(data).pipe(map$1(value => {
             switch (prop.type) {
                 case "boolean" /* ePropType.Boolean */:
                     return this.getIcon(value);
@@ -1031,6 +1032,12 @@ class ExtensibleTableComponent {
         });
         return visibleActions.length > 0;
     }
+    ngAfterViewInit() {
+        this.list?.requestStatus$?.pipe(filter(status => status === 'loading')).subscribe(() => {
+            this.data = [];
+            this.cdr.markForCheck();
+        });
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.5", ngImport: i0, type: ExtensibleTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.1.5", type: ExtensibleTableComponent, isStandalone: true, selector: "abp-extensible-table", inputs: { actionsText: "actionsText", data: "data", list: "list", recordsTotal: "recordsTotal", actionsColumnWidth: "actionsColumnWidth", actionsTemplate: "actionsTemplate" }, outputs: { tableActivate: "tableActivate" }, exportAs: ["abpExtensibleTable"], usesOnChanges: true, ngImport: i0, template: "<ngx-datatable\r\n  default\r\n  [rows]=\"data\"\r\n  [count]=\"recordsTotal\"\r\n  [list]=\"list\"\r\n  (activate)=\"tableActivate.emit($event)\"\r\n>\r\n  @if (actionsTemplate || (actionList.length && hasAtLeastOnePermittedAction)) {\r\n    <ngx-datatable-column\r\n      [name]=\"actionsText | abpLocalization\"\r\n      [maxWidth]=\"columnWidths[0]\"\r\n      [width]=\"columnWidths[0]\"\r\n      [sortable]=\"false\"\r\n    >\r\n      <ng-template let-row=\"row\" let-i=\"rowIndex\" ngx-datatable-cell-template>\r\n        <ng-container\r\n          *ngTemplateOutlet=\"actionsTemplate || gridActions; context: { $implicit: row, index: i }\"\r\n        ></ng-container>\r\n        <ng-template #gridActions>\r\n          @if (isVisibleActions(row)) {\r\n            <abp-grid-actions [index]=\"i\" [record]=\"row\" text=\"AbpUi::Actions\"></abp-grid-actions>\r\n          }\r\n        </ng-template>\r\n      </ng-template>\r\n    </ngx-datatable-column>\r\n  }\r\n  @for (prop of propList; track prop.name; let i = $index) {\r\n    <ngx-datatable-column\r\n      *abpVisible=\"prop.columnVisible(getInjected)\"\r\n      [width]=\"columnWidths[i + 1] || 200\"\r\n      [name]=\"prop.displayName | abpLocalization\"\r\n      [prop]=\"prop.name\"\r\n      [sortable]=\"prop.sortable\"\r\n    >\r\n      <ng-template ngx-datatable-header-template let-column=\"column\">\r\n        @if (prop.tooltip) {\r\n          <span\r\n            [ngbTooltip]=\"prop.tooltip.text | abpLocalization\"\r\n            [placement]=\"prop.tooltip.placement || 'auto'\"\r\n            container=\"body\"\r\n          >\r\n            {{ column.name }} <i class=\"fa fa-info-circle\" aria-hidden=\"true\"></i>\r\n          </span>\r\n        } @else {\r\n          {{ column.name }}\r\n        }\r\n      </ng-template>\r\n      <ng-template let-row=\"row\" let-i=\"index\" ngx-datatable-cell-template>\r\n        <ng-container *abpPermission=\"prop.permission; runChangeDetection: false\">\r\n          <ng-container *abpVisible=\"row['_' + prop.name]?.visible\">\r\n            @if (!row['_' + prop.name].component) {\r\n              <div\r\n                [innerHTML]=\"\r\n                  !prop.isExtra\r\n                    ? (row['_' + prop.name]?.value | async)\r\n                    : ('::' + (row['_' + prop.name]?.value | async) | abpLocalization)\r\n                \"\r\n                (click)=\"\r\n                  prop.action && prop.action({ getInjected: getInjected, record: row, index: i })\r\n                \"\r\n                [ngClass]=\"entityPropTypeClasses[prop.type]\"\r\n                [class.pointer]=\"prop.action\"\r\n              ></div>\r\n            } @else {\r\n              <ng-container\r\n                *ngComponentOutlet=\"\r\n                  row['_' + prop.name].component;\r\n                  injector: row['_' + prop.name].injector\r\n                \"\r\n              ></ng-container>\r\n            }\r\n          </ng-container>\r\n        </ng-container>\r\n      </ng-template>\r\n    </ngx-datatable-column>\r\n  }\r\n</ngx-datatable>\r\n", dependencies: [{ kind: "directive", type: AbpVisibleDirective, selector: "[abpVisible]", inputs: ["abpVisible"] }, { kind: "ngmodule", type: NgxDatatableModule }, { kind: "component", type: i1$1.DatatableComponent, selector: "ngx-datatable", inputs: ["targetMarkerTemplate", "rows", "groupRowsBy", "groupedRows", "columns", "selected", "scrollbarV", "scrollbarH", "rowHeight", "columnMode", "headerHeight", "footerHeight", "externalPaging", "externalSorting", "limit", "count", "offset", "loadingIndicator", "selectionType", "reorderable", "swapColumns", "sortType", "sorts", "cssClasses", "messages", "rowClass", "selectCheck", "displayCheck", "groupExpansionDefault", "trackByProp", "selectAllRowsOnPage", "virtualization", "treeFromRelation", "treeToRelation", "summaryRow", "summaryHeight", "summaryPosition", "rowIdentity"], outputs: ["scroll", "activate", "select", "sort", "page", "reorder", "resize", "tableContextmenu", "treeAction"] }, { kind: "directive", type: i1$1.DataTableColumnDirective, selector: "ngx-datatable-column", inputs: ["name", "prop", "frozenLeft", "frozenRight", "flexGrow", "resizeable", "comparator", "pipe", "sortable", "draggable", "canAutoResize", "minWidth", "width", "maxWidth", "checkboxable", "headerCheckboxable", "headerClass", "cellClass", "isTreeColumn", "treeLevelIndent", "summaryFunc", "summaryTemplate", "cellTemplate", "headerTemplate", "treeToggleTemplate"] }, { kind: "directive", type: i1$1.DataTableColumnHeaderDirective, selector: "[ngx-datatable-header-template]" }, { kind: "directive", type: i1$1.DataTableColumnCellDirective, selector: "[ngx-datatable-cell-template]" }, { kind: "component", type: GridActionsComponent, selector: "abp-grid-actions", inputs: ["icon", "index", "text"], exportAs: ["abpGridActions"] }, { kind: "directive", type: NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: NgxDatatableDefaultDirective, selector: "ngx-datatable[default]", inputs: ["class"], exportAs: ["ngxDatatableDefault"] }, { kind: "directive", type: NgxDatatableListDirective, selector: "ngx-datatable[list]", inputs: ["list"], exportAs: ["ngxDatatableList"] }, { kind: "directive", type: PermissionDirective, selector: "[abpPermission]", inputs: ["abpPermission", "abpPermissionRunChangeDetection"] }, { kind: "ngmodule", type: LocalizationModule }, { kind: "pipe", type: i2$1.LocalizationPipe, name: "abpLocalization" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
@@ -1130,7 +1137,13 @@ function generateFormFromProps(data) {
     props.forEach(({ value: prop }) => {
         const name = prop.name;
         const isExtraProperty = prop.isExtra || name in extraProperties;
-        let value = isExtraProperty ? extraProperties[name] : name in record ? record[name] : undefined;
+        let value = undefined;
+        if (isExtraProperty) {
+            value = extraProperties[name];
+        }
+        else if (name in record) {
+            value = record[name];
+        }
         if (typeof value === 'undefined')
             value = prop.defaultValue;
         if (value) {
@@ -1172,6 +1185,40 @@ function mergeWithDefaultProps(extension, defaultProps, ...contributors) {
         contributors.forEach(contributor => (contributor[name] || []).forEach((callback) => props.addContributor(callback)));
     });
 }
+function checkPolicies(properties, configState, permissionService) {
+    const props = Object.entries(properties);
+    const checkPolicy = (policy) => {
+        const { permissions, globalFeatures, features } = policy;
+        const checks = [
+            {
+                items: permissions?.permissionNames,
+                requiresAll: permissions?.requiresAll,
+                check: (item) => permissionService.getGrantedPolicy(item),
+            },
+            {
+                items: globalFeatures?.features,
+                requiresAll: globalFeatures?.requiresAll,
+                check: (item) => configState.getGlobalFeatureIsEnabled(item),
+            },
+            {
+                items: features?.features,
+                requiresAll: features?.requiresAll,
+                check: (item) => configState.getFeatureIsEnabled(item),
+            },
+        ];
+        return checks.every(({ items, requiresAll, check }) => {
+            if (!items?.length) {
+                return true;
+            }
+            return requiresAll ? items.every(check) : items.some(check);
+        });
+    };
+    props.forEach(([name, property]) => {
+        if (property.policy && !checkPolicy(property.policy)) {
+            delete properties[name];
+        }
+    });
+}
 
 function createEnum(members) {
     const enumObject = {};
@@ -1256,9 +1303,9 @@ function getObjectExtensionEntitiesFromStore(configState, moduleKey) {
             return null;
         return (extensions.modules[moduleKey] || {})
             .entities;
-    }), map(entities => (isUndefined(entities) ? {} : entities)), filter(Boolean), take(1));
+    }), map(entities => (isUndefined(entities) ? {} : entities)), filter$1(Boolean), take(1));
 }
-function mapEntitiesToContributors(configState, resource) {
+function mapEntitiesToContributors(configState, permissionService, resource) {
     return pipe(switchMap((entities) => zip(selectLocalization(configState), selectEnums(configState)).pipe(map(([localization, enums]) => {
         const generateDisplayName = createDisplayNameLocalizationPipeKeyGenerator(localization);
         return Object.keys(entities).reduce((acc, key) => {
@@ -1266,11 +1313,14 @@ function mapEntitiesToContributors(configState, resource) {
             acc.createForm[key] = [];
             acc.editForm[key] = [];
             const entity = entities[key];
-            if (!entity)
+            if (!entity) {
                 return acc;
+            }
             const properties = entity.properties;
-            if (!properties)
+            if (!properties) {
                 return acc;
+            }
+            checkPolicies(properties, configState, permissionService);
             const mapPropertiesToContributors = createPropertiesToContributorsMapper(generateDisplayName, resource, enums);
             return mapPropertiesToContributors(properties, acc, key);
         }, {
@@ -1424,5 +1474,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.5", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { ActionList, CreateFormPropsFactory, CreateInjectorPipe, ENTITY_PROP_TYPE_CLASSES, EXTENSIBLE_FORM_VIEW_PROVIDER, EXTENSIONS_ACTION_CALLBACK, EXTENSIONS_ACTION_DATA, EXTENSIONS_ACTION_TYPE, EXTENSIONS_FORM_PROP, EXTENSIONS_FORM_PROP_DATA, EXTENSIONS_IDENTIFIER, EXTRA_PROPERTIES_KEY, EditFormPropsFactory, EntityAction, EntityActionList, EntityActions, EntityActionsFactory, EntityProp, EntityPropList, EntityProps, EntityPropsFactory, ExtensibleDateTimePickerComponent, ExtensibleFormComponent, ExtensibleFormPropComponent, ExtensibleModule, ExtensibleTableComponent, ExtensionsService, FormProp, FormPropData, FormPropList, FormProps, GridActionsComponent, objectExtensions as ObjectExtensions, PROP_DATA_STREAM, PageToolbarComponent, PropDataDirective, PropList, ToolbarAction, ToolbarActionList, ToolbarActions, ToolbarActionsFactory, ToolbarComponent, createExtraPropertyValueResolver, generateFormFromProps, getObjectExtensionEntitiesFromStore, mapEntitiesToContributors, mergeWithDefaultActions, mergeWithDefaultProps };
+export { ActionList, CreateFormPropsFactory, CreateInjectorPipe, ENTITY_PROP_TYPE_CLASSES, EXTENSIBLE_FORM_VIEW_PROVIDER, EXTENSIONS_ACTION_CALLBACK, EXTENSIONS_ACTION_DATA, EXTENSIONS_ACTION_TYPE, EXTENSIONS_FORM_PROP, EXTENSIONS_FORM_PROP_DATA, EXTENSIONS_IDENTIFIER, EXTRA_PROPERTIES_KEY, EditFormPropsFactory, EntityAction, EntityActionList, EntityActions, EntityActionsFactory, EntityProp, EntityPropList, EntityProps, EntityPropsFactory, ExtensibleDateTimePickerComponent, ExtensibleFormComponent, ExtensibleFormPropComponent, ExtensibleModule, ExtensibleTableComponent, ExtensionsService, FormProp, FormPropData, FormPropList, FormProps, GridActionsComponent, objectExtensions as ObjectExtensions, PROP_DATA_STREAM, PageToolbarComponent, PropDataDirective, PropList, ToolbarAction, ToolbarActionList, ToolbarActions, ToolbarActionsFactory, ToolbarComponent, checkPolicies, createExtraPropertyValueResolver, generateFormFromProps, getObjectExtensionEntitiesFromStore, mapEntitiesToContributors, mergeWithDefaultActions, mergeWithDefaultProps };
 //# sourceMappingURL=abp-ng.components-extensible.mjs.map