@smartsoft001/crud-shell-angular 2.76.0 → 2.80.0

package/src/lib/pages/list/list.component.ts

@@ -1,438 +0,0 @@
-import { NgTemplateOutlet } from '@angular/common';
-import {
-  ChangeDetectorRef,
-  Component,
-  ComponentFactory,
-  computed,
-  inject,
-  Injector,
-  input,
-  OnDestroy,
-  OnInit,
-  Signal,
-  TemplateRef,
-  viewChild,
-  viewChildren,
-  ViewContainerRef,
-  WritableSignal,
-} from '@angular/core';
-import { Router } from '@angular/router';
-import { Subject } from 'rxjs';
-
-import {
-  CreateDynamicComponent,
-  DynamicComponentLoader,
-  DynamicContentDirective,
-  HardwareService,
-  IIconButtonOptions,
-  IListOptions,
-  IPageOptions,
-  ListMode,
-  MenuService,
-  PageComponent,
-} from '@smartsoft001/angular';
-import { IEntity } from '@smartsoft001/domain-core';
-import {
-  getModelFieldsWithOptions,
-  getModelOptions,
-  IFieldEditMetadata,
-  IFieldListMetadata,
-} from '@smartsoft001/models';
-import { SpecificationService } from '@smartsoft001/utils';
-
-import { CrudFacade } from '../../+state/crud.facade';
-import { ExportComponent } from '../../components';
-import { FiltersComponent } from '../../components';
-import { MultiselectComponent } from '../../components';
-import { CrudFullConfig } from '../../crud.config';
-import { CrudListPageBaseComponent } from './base/base.component';
-import { CrudListPaginationFactory } from '../../factories/list-pagination/list-pagination.factory';
-import { ICrudFilter } from '../../models';
-import { ListStandardComponent } from './standard/standard.component';
-import { PageService } from '../../services/page/page.service';
-import { CrudSearchService } from '../../services/search/search.service';
-
-@Component({
-  selector: 'smart-crud-list-page',
-  imports: [PageComponent, ListStandardComponent, NgTemplateOutlet],
-  template: `
-    @if (filter()) {
-      <smart-page [options]="pageOptions()">
-        <div #topTpl></div>
-
-        @if (template() === 'default') {
-          <smart-crud-list-standard-page [listOptions]="listOptions()">
-            <ng-container [ngTemplateOutlet]="contentTpl"></ng-container>
-          </smart-crud-list-standard-page>
-        }
-        <ng-template #contentTpl>
-          <ng-content></ng-content>
-        </ng-template>
-        <div class="dynamic-content"></div>
-      </smart-page>
-    }
-  `,
-})
-export class ListComponent<T extends IEntity<string>>
-  extends CreateDynamicComponent<CrudListPageBaseComponent<any>>(
-    'crud-list-page',
-  )
-  implements OnInit, OnDestroy
-{
-  private facade = inject(CrudFacade<T>);
-  private router = inject(Router);
-  private dynamicComponentLoader = inject(DynamicComponentLoader<T>);
-  private injector = inject(Injector);
-  private cd = inject(ChangeDetectorRef);
-  private menuService = inject(MenuService);
-  private hardwareService = inject(HardwareService);
-  private paginationFacade = inject(CrudListPaginationFactory<T>);
-  private pageService = inject(PageService<T>);
-  public config = inject(CrudFullConfig<T>);
-  private searchService = inject(CrudSearchService);
-
-  private _cleanMultiSelected$ = new Subject<void>();
-
-  pageOptions: Signal<IPageOptions>;
-  listOptions: WritableSignal<IListOptions<T>>;
-  links: { next; prev };
-
-  filter: Signal<ICrudFilter> = this.facade.filter;
-
-  topTpl = viewChild<ViewContainerRef>('topTpl');
-
-  contentTpl = viewChild<TemplateRef<any>>('contentTpl');
-
-  dynamicContents = viewChildren<DynamicContentDirective>(
-    DynamicContentDirective,
-  );
-
-  constructor() {
-    super();
-
-    this.links = this.facade.links();
-  }
-
-  refreshProperties(): void {
-    this.baseComponentRef.setInput('listOptions', this.listOptions());
-  }
-
-  async ngOnInit(): Promise<void> {
-    this.pageService.checkPermissions();
-
-    const options = getModelOptions(this.config.type);
-
-    let newFilter = null;
-
-    if (this.config.list?.resetQuery === 'beforeInit') {
-      newFilter = {
-        query: this.config.baseQuery ? [...this.config.baseQuery] : [],
-        paginationMode: this.config.list.paginationMode,
-        limit: this.config.pagination ? this.config.pagination.limit : null,
-        offset: this.config.pagination ? 0 : null,
-        sortBy: this.config.sort ? this.config.sort['default'] : null,
-        sortDesc: this.config.sort ? this.config.sort['defaultDesc'] : null,
-        ...this.searchService.filter,
-      };
-    } else if (this.filter()) {
-      newFilter = this.filter();
-    } else {
-      newFilter = {
-        paginationMode: this.config.list.paginationMode,
-        limit: this.searchService.filter?.limit
-          ? this.searchService.filter.limit
-          : this.config.pagination
-            ? this.config.pagination.limit
-            : null,
-        offset:
-          this.searchService.filter?.offset ||
-          this.searchService.filter?.offset === 0
-            ? this.searchService.filter.offset
-            : this.config.pagination
-              ? 0
-              : null,
-        sortBy: this.searchService.filter?.sortBy
-          ? this.searchService.filter.sortBy
-          : this.config.sort
-            ? this.config.sort['default']
-            : null,
-        sortDesc: this.searchService.filter?.sortDesc
-          ? this.searchService.filter.sortDesc
-          : this.config.sort
-            ? this.config.sort['defaultDesc']
-            : null,
-        query: this.config.baseQuery ? [...this.config.baseQuery] : [],
-        ...this.searchService.filter,
-      };
-    }
-
-    this.facade.read(newFilter);
-
-    const endButtons = this.getEndButtons();
-
-    this.pageOptions = computed(() => ({
-      title: this.config.title,
-      search: this.config.search
-        ? {
-            text: computed(() => this.filter().searchText ?? null),
-            set: (txt) => {
-              if (txt !== this.filter().searchText)
-                this.facade.read({
-                  ...this.filter(),
-                  searchText: txt,
-                  offset: 0,
-                });
-            },
-          }
-        : null,
-      endButtons: endButtons,
-    }));
-
-    const compiledComponents =
-      await this.dynamicComponentLoader.getComponentsWithFactories({
-        components: [
-          ...(this.config.details &&
-          this.config.details['components'] &&
-          this.config.details['components'].top
-            ? [this.config.details['components'].top]
-            : []),
-          ...(this.config.details &&
-          this.config.details['components'] &&
-          this.config.details['components'].bottom
-            ? [this.config.details['components'].bottom]
-            : []),
-          ...(this.config.list &&
-          this.config.list['components'] &&
-          this.config.list['components'].top
-            ? [this.config.list['components'].top]
-            : []),
-        ],
-      });
-
-    this.listOptions.set({
-      provider: {
-        getData: (filter): void => {
-          const global = {
-            ...this.filter(),
-            ...filter,
-          };
-          this.facade.read(global);
-        },
-        onChangeMultiSelected: async (list) => {
-          if (list.length && !this.menuService.openedEnd) {
-            await this.menuService.openEnd({
-              injector: this.injector,
-              component: MultiselectComponent,
-            });
-          } else if (!list.length && this.menuService.openedEnd) {
-            await this.menuService.closeEnd();
-          }
-
-          this.facade.multiSelect(list);
-        },
-        list: this.facade.list,
-        loading: this.facade.loading,
-        onCleanMultiSelected$: this._cleanMultiSelected$,
-      },
-      cellPipe: this.config.list ? this.config.list.cellPipe : null,
-      mode: this.config.list?.mode,
-      type: this.config.type,
-      details: this.config.details
-        ? {
-            provider: {
-              getData: (id) => {
-                this.facade.select(id);
-              },
-              clearData: () => {
-                this.facade.unselect();
-              },
-              item: this.facade.selected,
-              loading: this.facade.loading,
-            },
-            componentFactories: {
-              top:
-                this.config.details &&
-                this.config.details['components'] &&
-                this.config.details['components'].top
-                  ? compiledComponents.find(
-                      (cc) =>
-                        cc.component === this.config.details['components'].top,
-                    ).factory
-                  : null,
-              bottom:
-                this.config.details &&
-                this.config.details['components'] &&
-                this.config.details['components'].bottom
-                  ? compiledComponents.find(
-                      (cc) =>
-                        cc.component ===
-                        this.config.details['components'].bottom,
-                    ).factory
-                  : null,
-            },
-          }
-        : null,
-      item:
-        !!this.config.edit || this.config.details
-          ? {
-              options: {
-                routingPrefix: '/' + this.router.routerState.snapshot.url + '/',
-                edit: !!this.config.edit,
-              },
-            }
-          : null,
-      remove: this.config.remove
-        ? {
-            provider: {
-              invoke: (id) => this.facade.delete(id),
-              check: (item: T) => {
-                return options?.remove?.enabled
-                  ? SpecificationService.valid(item, options?.remove?.enabled)
-                  : true;
-              },
-            },
-          }
-        : null,
-      pagination: await this.paginationFacade.create({
-        mode: this.config.list.paginationMode,
-        limit: this.config.pagination.limit,
-        provider: {
-          getFilter: () => {
-            return this.filter();
-          },
-          getLinks: () => this.links,
-        },
-      }),
-      sort: this.config.sort,
-    });
-
-    this.cd.detectChanges();
-
-    this.initCloseMenu();
-    this.initTopComponent(compiledComponents);
-
-    this.refreshDynamicInstance();
-  }
-
-  private initCloseMenu() {
-    this.router.events.pipe(this.takeUntilDestroy).subscribe(async () => {
-      await this.clear();
-    });
-  }
-
-  private async clear() {
-    await this.menuService.closeEnd();
-
-    this.listOptions.update((val) => ({
-      ...val,
-      select: null,
-    }));
-
-    this.facade.multiSelect([]);
-  }
-
-  private getEndButtons(): Array<IIconButtonOptions> {
-    const fieldsWithOptions = getModelFieldsWithOptions(new this.config.type());
-    const modelOptions = getModelOptions(this.config.type);
-
-    const showFilters =
-      fieldsWithOptions.some(
-        (x) => (x.options?.list as IFieldListMetadata)?.filter,
-      ) || modelOptions?.filters?.length;
-
-    const showMultiEdit =
-      this.config.list?.components?.multi ||
-      (this.config.edit &&
-        fieldsWithOptions.some(
-          (x) => (x.options?.update as IFieldEditMetadata)?.multi,
-        ) &&
-        !this.hardwareService.isMobile &&
-        (!this.config?.list?.mode ||
-          this.config?.list?.mode === ListMode.desktop));
-
-    return [
-      ...(showMultiEdit
-        ? [
-            {
-              icon: 'checkbox-outline',
-              text: 'multi',
-              handler: () => {
-                this.facade.multiSelect([]);
-                this._cleanMultiSelected$.next();
-
-                setTimeout(async () => {
-                  this.listOptions.update((val) => ({
-                    ...val,
-                    select: val.select === 'multi' ? null : 'multi',
-                  }));
-                  if (this.menuService.openedEnd)
-                    await this.menuService.closeEnd();
-                  this.cd.detectChanges();
-                });
-              },
-            },
-          ]
-        : []),
-      ...(showFilters
-        ? [
-            {
-              icon: 'filter-outline',
-              text: 'filters',
-              handler: async () => {
-                await this.menuService.openEnd({
-                  injector: this.injector,
-                  component: FiltersComponent,
-                });
-              },
-            },
-          ]
-        : []),
-      ...(this.config.add
-        ? [
-            {
-              icon: 'add',
-              text: 'add',
-              handler: () => {
-                this.router.navigate([
-                  '/' + this.router.routerState.snapshot.url + '/add',
-                ]);
-              },
-            },
-          ]
-        : []),
-      ...(this.config.export
-        ? [
-            {
-              text: 'export',
-              icon: 'download-outline',
-              type: 'popover' as const,
-              component: ExportComponent,
-            },
-          ]
-        : []),
-      ...(this.config.buttons ? this.config.buttons : []),
-    ];
-  }
-
-  private initTopComponent(
-    compiledComponents: {
-      component: any;
-      factory: ComponentFactory<any>;
-    }[],
-  ) {
-    const factory =
-      this.config.list &&
-      this.config.list['components'] &&
-      this.config.list['components'].top
-        ? compiledComponents.find(
-            (cc) => cc.component === this.config.list['components'].top,
-          ).factory
-        : null;
-
-    setTimeout(() => {
-      if (factory && !this.topTpl().get(0)) {
-        this.topTpl().createComponent(factory);
-      }
-    });
-  }
-}

package/src/lib/pages/list/standard/standard.component.ts

@@ -1,42 +0,0 @@
-import { Component, computed, inject, Signal } from '@angular/core';
-
-import { ListComponent } from '@smartsoft001/angular';
-import { IEntity } from '@smartsoft001/domain-core';
-
-import { CrudFacade } from '../../../+state/crud.facade';
-import { FiltersConfigComponent, GroupComponent } from '../../../components';
-import { CrudFullConfig } from '../../../crud.config';
-import { CrudListGroupService } from '../../../services/list-group/list-group.service';
-import { CrudListPageBaseComponent } from '../base/base.component';
-
-@Component({
-  selector: 'smart-crud-list-standard-page',
-  template: `
-    <smart-crud-filters-config></smart-crud-filters-config>
-    @let groups = config.list?.groups;
-    @if (listOptions) {
-      <smart-list
-        [hidden]="groups && !isSearch()"
-        [options]="listOptions()"
-      ></smart-list>
-    }
-    @if (groups && !isSearch()) {
-      <smart-crud-group
-        [groups]="groups"
-        [listOptions]="listOptions()"
-      ></smart-crud-group>
-    }
-  `,
-  imports: [FiltersConfigComponent, ListComponent, GroupComponent],
-  providers: [CrudListGroupService],
-})
-export class ListStandardComponent<
-  T extends IEntity<string>,
-> extends CrudListPageBaseComponent<T> {
-  private readonly facade = inject(CrudFacade<T>);
-  public readonly config = inject(CrudFullConfig<T>);
-
-  isSearch: Signal<boolean> = computed(
-    () => !!this.facade.filter()?.searchText,
-  );
-}

package/src/lib/pipes/form-options/form-options.pipe.ts

@@ -1,61 +0,0 @@
-import { inject, Pipe, PipeTransform, Type } from '@angular/core';
-
-import { IFormOptions, InputBaseComponent } from '@smartsoft001/angular';
-import { IEntity } from '@smartsoft001/domain-core';
-
-import { CRUD_MODEL_POSSIBILITIES_PROVIDER } from '../../providers/model-possibilities/model-possibilities.provider';
-
-@Pipe({
-  name: 'smartFormOptions',
-})
-export class FormOptionsPipe<T extends IEntity<string>>
-  implements PipeTransform
-{
-  private modelPossibilitiesProvider = inject(
-    CRUD_MODEL_POSSIBILITIES_PROVIDER,
-  );
-
-  transform(
-    item: T,
-    mode: string,
-    type: any,
-    uniqueProvider?: (values: Record<keyof T, any>) => Promise<boolean>,
-    inputComponents?: { [key: string]: Type<InputBaseComponent<any>> },
-  ): IFormOptions<T> {
-    if (!mode || !type) return null;
-
-    let possibilities = {};
-
-    if (type && this.modelPossibilitiesProvider) {
-      possibilities = this.modelPossibilitiesProvider.get(type);
-    }
-
-    if (mode === 'create') {
-      return {
-        mode: 'create',
-        possibilities,
-        inputComponents,
-        uniqueProvider,
-        model: new type(),
-        show: true,
-      };
-    } else {
-      const model = new type();
-
-      if (item) {
-        Object.keys(item).forEach((key) => {
-          model[key] = item[key];
-        });
-      }
-
-      return {
-        mode: mode,
-        uniqueProvider,
-        possibilities: possibilities,
-        inputComponents,
-        model: model,
-        show: true,
-      };
-    }
-  }
-}

package/src/lib/pipes/index.ts

@@ -1,2 +0,0 @@
-export * from './pipes.module';
-export * from './form-options/form-options.pipe';

package/src/lib/pipes/pipes.module.ts

@@ -1,9 +0,0 @@
-import { NgModule } from '@angular/core';
-
-import { FormOptionsPipe } from './form-options/form-options.pipe';
-
-@NgModule({
-  exports: [FormOptionsPipe],
-  imports: [FormOptionsPipe],
-})
-export class CrudPipesModule {}

package/src/lib/providers/model-possibilities/model-possibilities.provider.ts

@@ -1,19 +0,0 @@
-import { InjectionToken } from '@angular/core';
-import { Observable } from 'rxjs';
-
-/**
- * @deprecated - please, use IModelPossibilitiesProvider from @smartsoft001/angular
- */
-export abstract class ICrudModelPossibilitiesProvider {
-  abstract get<T>(type: any): {
-    [key: string]: Observable<{ id: any; text: string }[]>;
-  };
-}
-
-/**
- * @deprecated - please, use MODEL_POSSIBILITIES_PROVIDER from @smartsoft001/angular
- */
-export const CRUD_MODEL_POSSIBILITIES_PROVIDER =
-  new InjectionToken<ICrudModelPossibilitiesProvider>(
-    'CRUD_MODEL_POSSIBILITIES_PROVIDER',
-  );