@lenne.tech/ng-base 13.14.2 → 13.17.0

package/fesm2020/lenne.tech-ng-base-base-cms.mjs

@@ -0,0 +1,263 @@
+import * as i0 from '@angular/core';
+import { InjectionToken, Component, Inject, NgModule } from '@angular/core';
+import * as i4 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import { ReactiveFormsModule } from '@angular/forms';
+import * as i1 from '@lenne.tech/ng-base/shared';
+import { BasicUser } from '@lenne.tech/ng-base/shared';
+import * as i2 from '@angular/router';
+import { RouterModule } from '@angular/router';
+import * as i3 from '@lenne.tech/ng-base/base-components';
+import { BaseComponentsModule } from '@lenne.tech/ng-base/base-components';
+
+const BASE_CMS_MODULE_CONFIG = new InjectionToken('BASE_CMS_MODULE_CONFIG');
+
+class BaseCmsComponent {
+    constructor(moduleConfig, graphQLMetaService, route, router, authService) {
+        this.moduleConfig = moduleConfig;
+        this.graphQLMetaService = graphQLMetaService;
+        this.route = route;
+        this.router = router;
+        this.authService = authService;
+        this.types = [];
+        this.route.params.subscribe((value) => {
+            if (value['modelName']) {
+                if (!this.checkModelIsExcludedOrRestrcited(value['modelName'])) {
+                    this.modelName = value['modelName'];
+                }
+                else {
+                    this.init().then((types) => {
+                        this.router.navigate(['../' + types[0].name.toLowerCase()], { relativeTo: this.route });
+                    });
+                }
+            }
+            if (value['id']) {
+                this.id = value['id'];
+            }
+        });
+    }
+    async ngOnInit() {
+        await this.init();
+    }
+    /**
+     * It returns a promise that resolves to an array of GraphqlCrudType objects
+     *
+     * @returns The types that are available to the user.
+     */
+    init() {
+        return new Promise((resolve, reject) => {
+            this.graphQLMetaService.getMeta().subscribe((meta) => {
+                this.meta = meta;
+                if (this.route.snapshot?.params?.['modelName']) {
+                    this.modelName = this.route.snapshot?.params?.['modelName'];
+                }
+                if (this.route.snapshot?.params?.['id']) {
+                    this.id = this.route.snapshot?.params?.['id'];
+                }
+                const excludedModels = this.moduleConfig.excludedModels?.map((e) => e.toLowerCase());
+                const types = meta.getTypes();
+                // Check for excluded types
+                const filteredTypes = types.filter((e) => !excludedModels?.includes(e.name.toLowerCase()));
+                // Check for restricted types
+                this.types = filteredTypes.filter((e) => {
+                    const foundRestrict = this.moduleConfig.restrictedModels?.find((v) => v.model.toLowerCase() === e.name.toLowerCase());
+                    if (foundRestrict) {
+                        if (!this.authService?.currentUser) {
+                            return false;
+                        }
+                        const user = this.authService?.currentUser;
+                        const mappedUser = BasicUser.map(user);
+                        return mappedUser?.hasAllRoles(foundRestrict.roles);
+                    }
+                    else {
+                        return true;
+                    }
+                });
+                if (this.moduleConfig?.logging) {
+                    console.log('BaseCmsComponent::init->types', this.types);
+                }
+                resolve(this.types);
+                if (!this.modelName && this.types) {
+                    this.router.navigate(['./' + this.types[0].name.toLowerCase()], { relativeTo: this.route });
+                }
+            });
+        });
+    }
+    /**
+     * It checks if the model is excluded or restricted
+     *
+     * @param model - The name of the model you want to check.
+     * @returns A boolean value.
+     */
+    checkModelIsExcludedOrRestrcited(model) {
+        if (!model) {
+            return false;
+        }
+        const excludedModels = this.moduleConfig.excludedModels?.map((e) => e.toLowerCase());
+        return !!(excludedModels?.includes(model?.toLowerCase()) ||
+            this.moduleConfig.restrictedModels?.find((e) => e.model.toLowerCase() === model.toLowerCase()));
+    }
+    /**
+     * If the model name is set and the types are set, then return the type that matches the model name
+     *
+     * @returns The type object that matches the model name.
+     */
+    getTypeByModelName() {
+        if (this.modelName && this.types) {
+            return this.types.find((e) => e.name.toLowerCase() === this.modelName.toLowerCase());
+        }
+        else {
+            return null;
+        }
+    }
+    /**
+     * When the createModeChanged event is emitted, if the createMode is true, navigate to the new route
+     *
+     * @param createMode - boolean - This is a boolean value that indicates whether the user is in create mode or
+     * not.
+     */
+    onCreateModeChanged(createMode) {
+        if (createMode) {
+            this.router.navigate(['./' + 'new'], { relativeTo: this.route });
+        }
+    }
+    /**
+     * If the type exists, return the create property of the type, otherwise return false.
+     *
+     * @returns A boolean value.
+     */
+    isCreatePossible() {
+        const type = this.getTypeByModelName();
+        return type ? type.create : false;
+    }
+    /**
+     * If the model name is found in the type map, return the update property of the type object
+     *
+     * @returns A boolean value.
+     */
+    isUpdatePossible() {
+        const type = this.getTypeByModelName();
+        return type ? type.update : false;
+    }
+    /**
+     * If the type is defined, return the delete property of the type, otherwise return false
+     *
+     * @returns A boolean value.
+     */
+    isDeletePossible() {
+        const type = this.getTypeByModelName();
+        return type ? type.delete : false;
+    }
+    /**
+     * If the id is truthy, navigate to the id, otherwise navigate to the parent route
+     *
+     * @param id - The id of the selected item.
+     */
+    idSelected(id) {
+        if (id) {
+            this.router.navigate(['./' + id], { relativeTo: this.route });
+        }
+        else {
+            this.router.navigate(['..'], { relativeTo: this.route });
+        }
+    }
+}
+BaseCmsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: BaseCmsComponent, deps: [{ token: BASE_CMS_MODULE_CONFIG }, { token: i1.GraphQLMetaService }, { token: i2.ActivatedRoute }, { token: i2.Router }, { token: i1.AuthService }], target: i0.ɵɵFactoryTarget.Component });
+BaseCmsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: BaseCmsComponent, selector: "app-base-cms", ngImport: i0, template: "<div class=\"main\">\n  <div class=\"sidebar\">\n    <div class=\"d-flex flex-column flex-shrink-0 p-3 h-100\">\n      <ng-container *ngIf=\"moduleConfig.branding\">\n        <a href=\"/\" class=\"d-flex flex-column align-items-start mb-3 mt-3 me-md-auto link-dark text-decoration-none\">\n          <span class=\"d-block fs-4\"><b class=\"text-primary\">Base</b>CMS</span>\n          <small class=\"fw-lighter\">The auto generated GraphQL CMS</small>\n        </a>\n        <hr />\n      </ng-container>\n      <ul class=\"nav nav-pills flex-column mb-auto\" *ngIf=\"types\">\n        <li class=\"nav-item\" *ngFor=\"let type of types\">\n          <a\n            class=\"nav-link\"\n            aria-current=\"page\"\n            [routerLink]=\"(id ? '../../' : '../') + type?.name?.toLowerCase()\"\n            [ngClass]=\"{ active: type?.name?.toLowerCase() === this.modelName?.toLowerCase() }\"\n          >\n            {{ type.name + 's' }}\n          </a>\n        </li>\n      </ul>\n    </div>\n  </div>\n\n  <div class=\"sidebar-content\">\n    <div class=\"p-5\">\n      <base-model-table\n        [tableFields]=\"moduleConfig?.tableFields ?? ['name']\"\n        [modelName]=\"modelName\"\n        [logging]=\"moduleConfig?.logging\"\n        [objectId]=\"id !== 'new' ? id : ''\"\n        [createMode]=\"id === 'new'\"\n        (createModeChanged)=\"onCreateModeChanged($event)\"\n        (idSelected)=\"idSelected($event)\"\n        [create]=\"isCreatePossible()\"\n        [update]=\"isUpdatePossible()\"\n        [delete]=\"isDeletePossible()\"\n      ></base-model-table>\n    </div>\n  </div>\n</div>\n", styles: [".active{color:var(--bs-primary)!important;background-color:rgba(var(--bs-primary-rgb),.2)!important;font-weight:700}.nav-link{color:var(--bs-body-color)}.sidebar{box-shadow:#7090b014 14px 17px 40px 4px;transition:all .2s linear 0s;z-index:99}.main{display:flex;flex-direction:row;overflow:hidden;height:100%}.main .sidebar{flex:1 0 22%;max-width:300px}.main .sidebar-content{flex-grow:999;overflow-y:auto;background-color:#f5f7fe}.nav-flush .nav-link{border-radius:0}\n"], components: [{ type: i3.ModelTableComponent, selector: "base-model-table", inputs: ["modelName", "objectId", "createMode", "create", "update", "delete", "logging", "tableFields"], outputs: ["idSelected", "createModeChanged"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: BaseCmsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-base-cms', template: "<div class=\"main\">\n  <div class=\"sidebar\">\n    <div class=\"d-flex flex-column flex-shrink-0 p-3 h-100\">\n      <ng-container *ngIf=\"moduleConfig.branding\">\n        <a href=\"/\" class=\"d-flex flex-column align-items-start mb-3 mt-3 me-md-auto link-dark text-decoration-none\">\n          <span class=\"d-block fs-4\"><b class=\"text-primary\">Base</b>CMS</span>\n          <small class=\"fw-lighter\">The auto generated GraphQL CMS</small>\n        </a>\n        <hr />\n      </ng-container>\n      <ul class=\"nav nav-pills flex-column mb-auto\" *ngIf=\"types\">\n        <li class=\"nav-item\" *ngFor=\"let type of types\">\n          <a\n            class=\"nav-link\"\n            aria-current=\"page\"\n            [routerLink]=\"(id ? '../../' : '../') + type?.name?.toLowerCase()\"\n            [ngClass]=\"{ active: type?.name?.toLowerCase() === this.modelName?.toLowerCase() }\"\n          >\n            {{ type.name + 's' }}\n          </a>\n        </li>\n      </ul>\n    </div>\n  </div>\n\n  <div class=\"sidebar-content\">\n    <div class=\"p-5\">\n      <base-model-table\n        [tableFields]=\"moduleConfig?.tableFields ?? ['name']\"\n        [modelName]=\"modelName\"\n        [logging]=\"moduleConfig?.logging\"\n        [objectId]=\"id !== 'new' ? id : ''\"\n        [createMode]=\"id === 'new'\"\n        (createModeChanged)=\"onCreateModeChanged($event)\"\n        (idSelected)=\"idSelected($event)\"\n        [create]=\"isCreatePossible()\"\n        [update]=\"isUpdatePossible()\"\n        [delete]=\"isDeletePossible()\"\n      ></base-model-table>\n    </div>\n  </div>\n</div>\n", styles: [".active{color:var(--bs-primary)!important;background-color:rgba(var(--bs-primary-rgb),.2)!important;font-weight:700}.nav-link{color:var(--bs-body-color)}.sidebar{box-shadow:#7090b014 14px 17px 40px 4px;transition:all .2s linear 0s;z-index:99}.main{display:flex;flex-direction:row;overflow:hidden;height:100%}.main .sidebar{flex:1 0 22%;max-width:300px}.main .sidebar-content{flex-grow:999;overflow-y:auto;background-color:#f5f7fe}.nav-flush .nav-link{border-radius:0}\n"] }]
+        }], ctorParameters: function () { return [{ type: undefined, decorators: [{
+                    type: Inject,
+                    args: [BASE_CMS_MODULE_CONFIG]
+                }] }, { type: i1.GraphQLMetaService }, { type: i2.ActivatedRoute }, { type: i2.Router }, { type: i1.AuthService }]; } });
+
+const routes = [
+    {
+        path: '',
+        component: BaseCmsComponent,
+    },
+    {
+        path: ':modelName',
+        component: BaseCmsComponent,
+    },
+    {
+        path: ':modelName/:id',
+        component: BaseCmsComponent,
+    },
+];
+class BaseCMSRoutingModule {
+}
+BaseCMSRoutingModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: BaseCMSRoutingModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+BaseCMSRoutingModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: BaseCMSRoutingModule, imports: [i2.RouterModule], exports: [RouterModule] });
+BaseCMSRoutingModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: BaseCMSRoutingModule, imports: [[RouterModule.forChild(routes)], RouterModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: BaseCMSRoutingModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [RouterModule.forChild(routes)],
+                    exports: [RouterModule],
+                }]
+        }] });
+
+function CMSConfigFactory() {
+    return {
+        tableFields: ['id', 'name', 'title', 'description', 'email', 'createdAt', 'updatedAt'],
+        excludedModels: [],
+        restrictedModels: [],
+        branding: true,
+        logging: false,
+        ...BaseCMSModule.config,
+    };
+}
+class BaseCMSModule {
+}
+BaseCMSModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: BaseCMSModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+BaseCMSModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: BaseCMSModule, declarations: [BaseCmsComponent], imports: [
+        // Modules
+        CommonModule,
+        ReactiveFormsModule,
+        BaseCMSRoutingModule,
+        BaseComponentsModule] });
+BaseCMSModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: BaseCMSModule, providers: [
+        {
+            provide: BASE_CMS_MODULE_CONFIG,
+            useFactory: CMSConfigFactory,
+        },
+    ], imports: [[
+            // Modules
+            CommonModule,
+            ReactiveFormsModule,
+            BaseCMSRoutingModule,
+            BaseComponentsModule,
+        ]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: BaseCMSModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [
+                        // Modules
+                        CommonModule,
+                        ReactiveFormsModule,
+                        BaseCMSRoutingModule,
+                        BaseComponentsModule,
+                    ],
+                    declarations: [BaseCmsComponent],
+                    exports: [],
+                    providers: [
+                        {
+                            provide: BASE_CMS_MODULE_CONFIG,
+                            useFactory: CMSConfigFactory,
+                        },
+                    ],
+                }]
+        }] });
+
+/**
+ * Exports for public API
+ */
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { BASE_CMS_MODULE_CONFIG, BaseCMSModule, BaseCmsComponent, CMSConfigFactory };
+//# sourceMappingURL=lenne.tech-ng-base-base-cms.mjs.map

package/fesm2020/lenne.tech-ng-base-base-cms.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"lenne.tech-ng-base-base-cms.mjs","sources":["../../../projects/ng-base/base-cms/interfaces/base-cms-module-config.interface.ts","../../../projects/ng-base/base-cms/pages/base-cms/base-cms.component.ts","../../../projects/ng-base/base-cms/pages/base-cms/base-cms.component.html","../../../projects/ng-base/base-cms/base-cms-routing.module.ts","../../../projects/ng-base/base-cms/base-cms.module.ts","../../../projects/ng-base/base-cms/public-api.ts","../../../projects/ng-base/base-cms/lenne.tech-ng-base-base-cms.ts"],"sourcesContent":["import { InjectionToken } from '@angular/core';\n\nexport interface BaseCMSModuleConfig {\n  tableFields?: string[];\n  excludedModels?: string[];\n  restrictedModels?: { model: string; roles: string[] }[];\n  logging?: boolean;\n  branding?: boolean;\n}\n\nexport const BASE_CMS_MODULE_CONFIG = new InjectionToken('BASE_CMS_MODULE_CONFIG');\n","import { Component, Inject, OnInit } from '@angular/core';\nimport { AuthService, BasicUser, GraphqlCrudType, GraphQLMeta, GraphQLMetaService } from '@lenne.tech/ng-base/shared';\nimport { ActivatedRoute, Router } from '@angular/router';\nimport { BASE_CMS_MODULE_CONFIG, BaseCMSModuleConfig } from '../../interfaces/base-cms-module-config.interface';\n\n@Component({\n  selector: 'app-base-cms',\n  templateUrl: './base-cms.component.html',\n  styleUrls: ['./base-cms.component.scss'],\n})\nexport class BaseCmsComponent implements OnInit {\n  meta: GraphQLMeta;\n  modelName: string;\n  id: string;\n  types: GraphqlCrudType[] = [];\n\n  constructor(\n    @Inject(BASE_CMS_MODULE_CONFIG) public moduleConfig: BaseCMSModuleConfig,\n    private graphQLMetaService: GraphQLMetaService,\n    private route: ActivatedRoute,\n    private router: Router,\n    private authService: AuthService\n  ) {\n    this.route.params.subscribe((value) => {\n      if (value['modelName']) {\n        if (!this.checkModelIsExcludedOrRestrcited(value['modelName'])) {\n          this.modelName = value['modelName'];\n        } else {\n          this.init().then((types: GraphqlCrudType[]) => {\n            this.router.navigate(['../' + types[0].name.toLowerCase()], { relativeTo: this.route });\n          });\n        }\n      }\n\n      if (value['id']) {\n        this.id = value['id'];\n      }\n    });\n  }\n\n  async ngOnInit() {\n    await this.init();\n  }\n\n  /**\n   * It returns a promise that resolves to an array of GraphqlCrudType objects\n   *\n   * @returns The types that are available to the user.\n   */\n  init(): Promise<GraphqlCrudType[]> {\n    return new Promise((resolve, reject) => {\n      this.graphQLMetaService.getMeta().subscribe((meta) => {\n        this.meta = meta;\n\n        if (this.route.snapshot?.params?.['modelName']) {\n          this.modelName = this.route.snapshot?.params?.['modelName'];\n        }\n\n        if (this.route.snapshot?.params?.['id']) {\n          this.id = this.route.snapshot?.params?.['id'];\n        }\n\n        const excludedModels = this.moduleConfig.excludedModels?.map((e) => e.toLowerCase());\n        const types = meta.getTypes();\n\n        // Check for excluded types\n        const filteredTypes = types.filter((e) => !excludedModels?.includes(e.name.toLowerCase()));\n\n        // Check for restricted types\n        this.types = filteredTypes.filter((e) => {\n          const foundRestrict = this.moduleConfig.restrictedModels?.find(\n            (v) => v.model.toLowerCase() === e.name.toLowerCase()\n          );\n\n          if (foundRestrict) {\n            if (!this.authService?.currentUser) {\n              return false;\n            }\n            const user = this.authService?.currentUser;\n            const mappedUser = BasicUser.map(user);\n\n            return mappedUser?.hasAllRoles(foundRestrict.roles);\n          } else {\n            return true;\n          }\n        });\n\n        if (this.moduleConfig?.logging) {\n          console.log('BaseCmsComponent::init->types', this.types);\n        }\n\n        resolve(this.types);\n\n        if (!this.modelName && this.types) {\n          this.router.navigate(['./' + this.types[0].name.toLowerCase()], { relativeTo: this.route });\n        }\n      });\n    });\n  }\n\n  /**\n   * It checks if the model is excluded or restricted\n   *\n   * @param model - The name of the model you want to check.\n   * @returns A boolean value.\n   */\n  checkModelIsExcludedOrRestrcited(model: string): boolean {\n    if (!model) {\n      return false;\n    }\n    const excludedModels = this.moduleConfig.excludedModels?.map((e) => e.toLowerCase());\n    return !!(\n      excludedModels?.includes(model?.toLowerCase()) ||\n      this.moduleConfig.restrictedModels?.find((e) => e.model.toLowerCase() === model.toLowerCase())\n    );\n  }\n\n  /**\n   * If the model name is set and the types are set, then return the type that matches the model name\n   *\n   * @returns The type object that matches the model name.\n   */\n  getTypeByModelName() {\n    if (this.modelName && this.types) {\n      return this.types.find((e) => e.name.toLowerCase() === this.modelName.toLowerCase());\n    } else {\n      return null;\n    }\n  }\n\n  /**\n   * When the createModeChanged event is emitted, if the createMode is true, navigate to the new route\n   *\n   * @param createMode - boolean - This is a boolean value that indicates whether the user is in create mode or\n   * not.\n   */\n  onCreateModeChanged(createMode: boolean) {\n    if (createMode) {\n      this.router.navigate(['./' + 'new'], { relativeTo: this.route });\n    }\n  }\n\n  /**\n   * If the type exists, return the create property of the type, otherwise return false.\n   *\n   * @returns A boolean value.\n   */\n  isCreatePossible(): boolean {\n    const type = this.getTypeByModelName();\n    return type ? type.create : false;\n  }\n\n  /**\n   * If the model name is found in the type map, return the update property of the type object\n   *\n   * @returns A boolean value.\n   */\n  isUpdatePossible(): boolean {\n    const type = this.getTypeByModelName();\n    return type ? type.update : false;\n  }\n\n  /**\n   * If the type is defined, return the delete property of the type, otherwise return false\n   *\n   * @returns A boolean value.\n   */\n  isDeletePossible(): boolean {\n    const type = this.getTypeByModelName();\n    return type ? type.delete : false;\n  }\n\n  /**\n   * If the id is truthy, navigate to the id, otherwise navigate to the parent route\n   *\n   * @param id - The id of the selected item.\n   */\n  idSelected(id: string) {\n    if (id) {\n      this.router.navigate(['./' + id], { relativeTo: this.route });\n    } else {\n      this.router.navigate(['..'], { relativeTo: this.route });\n    }\n  }\n}\n","<div class=\"main\">\n  <div class=\"sidebar\">\n    <div class=\"d-flex flex-column flex-shrink-0 p-3 h-100\">\n      <ng-container *ngIf=\"moduleConfig.branding\">\n        <a href=\"/\" class=\"d-flex flex-column align-items-start mb-3 mt-3 me-md-auto link-dark text-decoration-none\">\n          <span class=\"d-block fs-4\"><b class=\"text-primary\">Base</b>CMS</span>\n          <small class=\"fw-lighter\">The auto generated GraphQL CMS</small>\n        </a>\n        <hr />\n      </ng-container>\n      <ul class=\"nav nav-pills flex-column mb-auto\" *ngIf=\"types\">\n        <li class=\"nav-item\" *ngFor=\"let type of types\">\n          <a\n            class=\"nav-link\"\n            aria-current=\"page\"\n            [routerLink]=\"(id ? '../../' : '../') + type?.name?.toLowerCase()\"\n            [ngClass]=\"{ active: type?.name?.toLowerCase() === this.modelName?.toLowerCase() }\"\n          >\n            {{ type.name + 's' }}\n          </a>\n        </li>\n      </ul>\n    </div>\n  </div>\n\n  <div class=\"sidebar-content\">\n    <div class=\"p-5\">\n      <base-model-table\n        [tableFields]=\"moduleConfig?.tableFields ?? ['name']\"\n        [modelName]=\"modelName\"\n        [logging]=\"moduleConfig?.logging\"\n        [objectId]=\"id !== 'new' ? id : ''\"\n        [createMode]=\"id === 'new'\"\n        (createModeChanged)=\"onCreateModeChanged($event)\"\n        (idSelected)=\"idSelected($event)\"\n        [create]=\"isCreatePossible()\"\n        [update]=\"isUpdatePossible()\"\n        [delete]=\"isDeletePossible()\"\n      ></base-model-table>\n    </div>\n  </div>\n</div>\n","import { RouterModule, Routes } from '@angular/router';\nimport { NgModule } from '@angular/core';\nimport { BaseCmsComponent } from './pages/base-cms/base-cms.component';\n\nconst routes: Routes = [\n  {\n    path: '',\n    component: BaseCmsComponent,\n  },\n  {\n    path: ':modelName',\n    component: BaseCmsComponent,\n  },\n  {\n    path: ':modelName/:id',\n    component: BaseCmsComponent,\n  },\n];\n\n@NgModule({\n  imports: [RouterModule.forChild(routes)],\n  exports: [RouterModule],\n})\nexport class BaseCMSRoutingModule {}\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { ReactiveFormsModule } from '@angular/forms';\nimport { BaseCmsComponent } from './pages/base-cms/base-cms.component';\nimport { BaseCMSRoutingModule } from './base-cms-routing.module';\nimport { BaseComponentsModule } from '@lenne.tech/ng-base/base-components';\nimport { BASE_CMS_MODULE_CONFIG, BaseCMSModuleConfig } from './interfaces/base-cms-module-config.interface';\n\nexport function CMSConfigFactory() {\n  return {\n    tableFields: ['id', 'name', 'title', 'description', 'email', 'createdAt', 'updatedAt'],\n    excludedModels: [],\n    restrictedModels: [],\n    branding: true,\n    logging: false,\n    ...BaseCMSModule.config,\n  };\n}\n\n@NgModule({\n  imports: [\n    // Modules\n    CommonModule,\n    ReactiveFormsModule,\n    BaseCMSRoutingModule,\n    BaseComponentsModule,\n  ],\n  declarations: [BaseCmsComponent],\n  exports: [],\n  providers: [\n    {\n      provide: BASE_CMS_MODULE_CONFIG,\n      useFactory: CMSConfigFactory,\n    },\n  ],\n})\nexport class BaseCMSModule {\n  static config: BaseCMSModuleConfig;\n}\n","/**\n * Exports for public API\n */\n\n// Module\nexport * from './base-cms.module';\n\n// Pages\nexport * from './pages/base-cms/base-cms.component';\n\n// Interface\nexport * from './interfaces/base-cms-module-config.interface';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2020/lenne.tech-ng-base-base-components.mjs

@@ -375,6 +375,7 @@ class ModelFormComponent {
         this.graphQLService = graphQLService;
         this.formsService = formsService;
         this.delete = true;
+        this.logging = false;
         this.finished = new EventEmitter();
         this.loading = false;
         this.keys = [];
@@ -404,6 +405,10 @@ class ModelFormComponent {
             });
             this.fields = this.fields['input'];
             this.keys = Object.keys(this.fields);
+            if (this.logging) {
+                console.log('ModelFormComponent::init->fields', this.fields);
+                console.log('ModelFormComponent::init->keys', this.keys);
+            }
             this.createForm(this.fields);
             if (this.id) {
                 this.getObjectById(this.id);
@@ -416,6 +421,9 @@ class ModelFormComponent {
      * @param id - The id of the object to be loaded
      */
     getObjectById(id) {
+        if (this.logging) {
+            console.log('ModelFormComponent::getObjectById->id', id);
+        }
         this.graphQLService
             .graphQl('get' + this.capitalizeFirstLetter(this.modelName), {
             arguments: { id },
@@ -424,6 +432,9 @@ class ModelFormComponent {
         })
             .subscribe({
             next: (value) => {
+                if (this.logging) {
+                    console.log('ModelFormComponent::get->value', value);
+                }
                 this.form.patchValue({ ...{}, ...value });
             },
             error: (err) => {
@@ -441,7 +452,7 @@ class ModelFormComponent {
         const group = {};
         for (const [key, value] of Object.entries(fields)) {
             if (fields[key]?.type) {
-                group[key] = new FormControl('', Validators.required);
+                group[key] = new FormControl('', value.isRequired ? Validators.required : []);
             }
         }
         this.form = new FormGroup(group);
@@ -521,7 +532,7 @@ class ModelFormComponent {
     }
 }
 ModelFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ModelFormComponent, deps: [{ token: i1$1.GraphQLMetaService }, { token: i1$1.GraphQLService }, { token: i1$1.FormsService }], target: i0.ɵɵFactoryTarget.Component });
-ModelFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: ModelFormComponent, selector: "base-model-form", inputs: { modelName: "modelName", id: "id", delete: "delete" }, outputs: { finished: "finished" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"w-100\" *ngIf=\"form\">\n  <h1>{{ capitalizeFirstLetter(modelName) }} {{ operation === 'update' ? 'bearbeiten' : 'erstellen' }}</h1>\n\n  <form [formGroup]=\"form\">\n    <div class=\"mt-3\" *ngFor=\"let key of keys\">\n      <ng-container [ngSwitch]=\"fields[key]?.type\">\n        <ng-container *ngSwitchCase=\"'String'\">\n          <ng-container *ngIf=\"fields[key]?.isList\">\n            <base-tags\n              [id]=\"key\"\n              [name]=\"key\"\n              [label]=\"capitalizeFirstLetter(key)\"\n              [control]=\"transformToControl(form?.get(key))\"\n              [required]=\"fields[key].isRequired\"\n            ></base-tags>\n          </ng-container>\n\n          <ng-container *ngIf=\"!fields[key]?.isList\">\n            <base-input\n              [id]=\"key\"\n              [name]=\"key\"\n              [label]=\"capitalizeFirstLetter(key)\"\n              [type]=\"'text'\"\n              [control]=\"transformToControl(form?.get(key))\"\n              [required]=\"fields[key].isRequired\"\n            ></base-input>\n          </ng-container>\n        </ng-container>\n\n        <ng-container *ngSwitchCase=\"'Boolean'\">\n          <base-checkbox\n            [id]=\"key\"\n            [name]=\"key\"\n            [label]=\"capitalizeFirstLetter(key)\"\n            [control]=\"transformToControl(form?.get(key))\"\n            [required]=\"true\"\n          ></base-checkbox>\n        </ng-container>\n\n        <ng-container *ngSwitchCase=\"'DateTime'\">\n          <base-input\n            [id]=\"key\"\n            [name]=\"key\"\n            [label]=\"capitalizeFirstLetter(key)\"\n            [type]=\"'datetime-local'\"\n            [control]=\"transformToControl(form?.get(key))\"\n            [required]=\"true\"\n          ></base-input>\n        </ng-container>\n      </ng-container>\n    </div>\n\n    <div class=\"d-flex mt-4\" [ngClass]=\"id && delete ? 'justify-content-between' : 'justify-content-end'\">\n      <div *ngIf=\"id && delete\">\n        <button class=\"btn btn-danger\" type=\"button\" (click)=\"deleteObject()\">L\u00F6schen</button>\n      </div>\n      <div>\n        <button class=\"btn btn-primary\" type=\"button\" (click)=\"submit()\" *ngIf=\"!loading\">\n          {{ operation === 'create' ? 'Erstellen' : 'Speichern' }}\n        </button>\n        <button class=\"btn btn-primary\" type=\"button\" disabled *ngIf=\"loading\">\n          <span class=\"spinner-border spinner-border-sm\" role=\"status\" aria-hidden=\"true\"></span>\n          {{ operation === 'create' ? 'Erstellen' : 'Speichern' }}...\n        </button>\n      </div>\n    </div>\n  </form>\n</div>\n", styles: [""], components: [{ type: TagsComponent, selector: "base-tags", inputs: ["id", "name", "label", "placeholder", "autocomplete", "tabIndex", "control", "options", "custom", "removeByKey", "required"] }, { type: InputComponent, selector: "base-input", inputs: ["id", "name", "label", "placeholder", "autocomplete", "tabIndex", "control", "type", "required"] }, { type: CheckboxComponent, selector: "base-checkbox", inputs: ["id", "name", "label", "value", "control", "required"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
+ModelFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: ModelFormComponent, selector: "base-model-form", inputs: { modelName: "modelName", id: "id", delete: "delete", logging: "logging" }, outputs: { finished: "finished" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"w-100\" *ngIf=\"form\">\n  <h1>{{ capitalizeFirstLetter(modelName) }} {{ operation === 'update' ? 'bearbeiten' : 'erstellen' }}</h1>\n\n  <form [formGroup]=\"form\">\n    <div class=\"mt-3\" *ngFor=\"let key of keys\">\n      <ng-container [ngSwitch]=\"fields[key]?.type\">\n        <ng-container *ngSwitchCase=\"'String'\">\n          <ng-container *ngIf=\"fields[key]?.isList\">\n            <base-tags\n              [id]=\"key\"\n              [name]=\"key\"\n              [label]=\"capitalizeFirstLetter(key)\"\n              [control]=\"transformToControl(form?.get(key))\"\n              [required]=\"fields[key].isRequired\"\n            ></base-tags>\n          </ng-container>\n\n          <ng-container *ngIf=\"!fields[key]?.isList\">\n            <base-input\n              [id]=\"key\"\n              [name]=\"key\"\n              [label]=\"capitalizeFirstLetter(key)\"\n              [type]=\"'text'\"\n              [control]=\"transformToControl(form?.get(key))\"\n              [required]=\"fields[key].isRequired\"\n            ></base-input>\n          </ng-container>\n        </ng-container>\n\n        <ng-container *ngSwitchCase=\"'Boolean'\">\n          <base-checkbox\n            [id]=\"key\"\n            [name]=\"key\"\n            [label]=\"capitalizeFirstLetter(key)\"\n            [control]=\"transformToControl(form?.get(key))\"\n            [required]=\"true\"\n          ></base-checkbox>\n        </ng-container>\n\n        <ng-container *ngSwitchCase=\"'DateTime'\">\n          <base-input\n            [id]=\"key\"\n            [name]=\"key\"\n            [label]=\"capitalizeFirstLetter(key)\"\n            [type]=\"'datetime-local'\"\n            [control]=\"transformToControl(form?.get(key))\"\n            [required]=\"true\"\n          ></base-input>\n        </ng-container>\n      </ng-container>\n    </div>\n\n    <div class=\"d-flex mt-4\" [ngClass]=\"id && delete ? 'justify-content-between' : 'justify-content-end'\">\n      <div *ngIf=\"id && delete\">\n        <button class=\"btn btn-danger\" type=\"button\" (click)=\"deleteObject()\">L\u00F6schen</button>\n      </div>\n      <div>\n        <button class=\"btn btn-primary\" type=\"button\" (click)=\"submit()\" *ngIf=\"!loading\">\n          {{ operation === 'create' ? 'Erstellen' : 'Speichern' }}\n        </button>\n        <button class=\"btn btn-primary\" type=\"button\" disabled *ngIf=\"loading\">\n          <span class=\"spinner-border spinner-border-sm\" role=\"status\" aria-hidden=\"true\"></span>\n          {{ operation === 'create' ? 'Erstellen' : 'Speichern' }}...\n        </button>\n      </div>\n    </div>\n  </form>\n</div>\n", styles: [""], components: [{ type: TagsComponent, selector: "base-tags", inputs: ["id", "name", "label", "placeholder", "autocomplete", "tabIndex", "control", "options", "custom", "removeByKey", "required"] }, { type: InputComponent, selector: "base-input", inputs: ["id", "name", "label", "placeholder", "autocomplete", "tabIndex", "control", "type", "required"] }, { type: CheckboxComponent, selector: "base-checkbox", inputs: ["id", "name", "label", "value", "control", "required"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ModelFormComponent, decorators: [{
             type: Component,
             args: [{ selector: 'base-model-form', template: "<div class=\"w-100\" *ngIf=\"form\">\n  <h1>{{ capitalizeFirstLetter(modelName) }} {{ operation === 'update' ? 'bearbeiten' : 'erstellen' }}</h1>\n\n  <form [formGroup]=\"form\">\n    <div class=\"mt-3\" *ngFor=\"let key of keys\">\n      <ng-container [ngSwitch]=\"fields[key]?.type\">\n        <ng-container *ngSwitchCase=\"'String'\">\n          <ng-container *ngIf=\"fields[key]?.isList\">\n            <base-tags\n              [id]=\"key\"\n              [name]=\"key\"\n              [label]=\"capitalizeFirstLetter(key)\"\n              [control]=\"transformToControl(form?.get(key))\"\n              [required]=\"fields[key].isRequired\"\n            ></base-tags>\n          </ng-container>\n\n          <ng-container *ngIf=\"!fields[key]?.isList\">\n            <base-input\n              [id]=\"key\"\n              [name]=\"key\"\n              [label]=\"capitalizeFirstLetter(key)\"\n              [type]=\"'text'\"\n              [control]=\"transformToControl(form?.get(key))\"\n              [required]=\"fields[key].isRequired\"\n            ></base-input>\n          </ng-container>\n        </ng-container>\n\n        <ng-container *ngSwitchCase=\"'Boolean'\">\n          <base-checkbox\n            [id]=\"key\"\n            [name]=\"key\"\n            [label]=\"capitalizeFirstLetter(key)\"\n            [control]=\"transformToControl(form?.get(key))\"\n            [required]=\"true\"\n          ></base-checkbox>\n        </ng-container>\n\n        <ng-container *ngSwitchCase=\"'DateTime'\">\n          <base-input\n            [id]=\"key\"\n            [name]=\"key\"\n            [label]=\"capitalizeFirstLetter(key)\"\n            [type]=\"'datetime-local'\"\n            [control]=\"transformToControl(form?.get(key))\"\n            [required]=\"true\"\n          ></base-input>\n        </ng-container>\n      </ng-container>\n    </div>\n\n    <div class=\"d-flex mt-4\" [ngClass]=\"id && delete ? 'justify-content-between' : 'justify-content-end'\">\n      <div *ngIf=\"id && delete\">\n        <button class=\"btn btn-danger\" type=\"button\" (click)=\"deleteObject()\">L\u00F6schen</button>\n      </div>\n      <div>\n        <button class=\"btn btn-primary\" type=\"button\" (click)=\"submit()\" *ngIf=\"!loading\">\n          {{ operation === 'create' ? 'Erstellen' : 'Speichern' }}\n        </button>\n        <button class=\"btn btn-primary\" type=\"button\" disabled *ngIf=\"loading\">\n          <span class=\"spinner-border spinner-border-sm\" role=\"status\" aria-hidden=\"true\"></span>\n          {{ operation === 'create' ? 'Erstellen' : 'Speichern' }}...\n        </button>\n      </div>\n    </div>\n  </form>\n</div>\n", styles: [""] }]
@@ -531,6 +542,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImpor
                 type: Input
             }], delete: [{
                 type: Input
+            }], logging: [{
+                type: Input
             }], finished: [{
                 type: Output
             }] } });
@@ -543,6 +556,7 @@ class ModelTableComponent {
         this.create = true;
         this.update = true;
         this.delete = true;
+        this.logging = false;
         this.tableFields = ['id', 'name', 'title', 'description', 'email', 'createdAt', 'updatedAt'];
         this.idSelected = new EventEmitter();
         this.createModeChanged = new EventEmitter();
@@ -567,6 +581,9 @@ class ModelTableComponent {
         }
         if (changes['objectId'] && this.meta) {
             if (this.selectedId !== this.objectId) {
+                if (this.logging) {
+                    console.log('ModelTableComponent::ngOnChanges->selectedId', this.selectedId);
+                }
                 this.selectedId = this.objectId;
             }
         }
@@ -584,6 +601,11 @@ class ModelTableComponent {
                 this.availableFields.push(field);
             }
         });
+        if (this.logging) {
+            console.log('ModelTableComponent::init->possibleFields', possibleFields);
+            console.log('ModelTableComponent::init->keys', keys);
+            console.log('ModelTableComponent::init->availableFields', this.availableFields);
+        }
         this.loadObjects(this.availableFields);
     }
     /**
@@ -608,6 +630,9 @@ class ModelTableComponent {
         })
             .subscribe({
             next: (value) => {
+                if (this.logging) {
+                    console.log('ModelTableComponent::loadObjects->value', value);
+                }
                 this.objects = value;
             },
             error: (err) => {
@@ -642,10 +667,10 @@ class ModelTableComponent {
     }
 }
 ModelTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ModelTableComponent, deps: [{ token: i1$1.GraphQLMetaService }, { token: i1$1.GraphQLService }], target: i0.ɵɵFactoryTarget.Component });
-ModelTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: ModelTableComponent, selector: "base-model-table", inputs: { modelName: "modelName", objectId: "objectId", createMode: "createMode", create: "create", update: "update", delete: "delete", tableFields: "tableFields" }, outputs: { idSelected: "idSelected", createModeChanged: "createModeChanged" }, usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"!selectedId && !createMode\">\n  <div class=\"w-100 d-flex flex-row justify-content-between mb-4\">\n    <h1 *ngIf=\"modelName\">{{ capitalizeFirstLetter(modelName) }}s</h1>\n    <div class=\"d-flex align-items-center\">\n      <button class=\"btn btn-primary\" (click)=\"createNewObject()\" *ngIf=\"create\">Erstellen</button>\n    </div>\n  </div>\n  <table class=\"table table-hover table-responsive bg-white\">\n    <thead>\n      <tr>\n        <th scope=\"col\" *ngFor=\"let field of availableFields\">{{ capitalizeFirstLetter(field) }}</th>\n      </tr>\n    </thead>\n    <tbody>\n      <tr *ngFor=\"let object of objects\">\n        <td class=\"cursor-pointer\" *ngFor=\"let field of availableFields\" (click)=\"selectId(object)\">\n          {{ object[field] }}\n        </td>\n      </tr>\n    </tbody>\n  </table>\n</div>\n\n<div class=\"w-100\" *ngIf=\"selectedId || createMode\">\n  <button class=\"btn btn-outline-primary mb-3\" (click)=\"selectId('')\">Zur\u00FCck</button>\n  <base-model-form\n    [modelName]=\"modelName\"\n    [id]=\"selectedId\"\n    (finished)=\"selectId('')\"\n    [delete]=\"delete\"\n  ></base-model-form>\n</div>\n", styles: [".cursor-pointer{cursor:pointer}.table>:not(:first-child){border-top:0}table{border-radius:.25rem;border-color:#e2e8f0!important}table thead{text-transform:uppercase;font-size:12px}table thead th{padding:12px 24px}table tbody tr td{font-weight:400!important;font-size:16px;padding:16px 24px}\n"], components: [{ type: ModelFormComponent, selector: "base-model-form", inputs: ["modelName", "id", "delete"], outputs: ["finished"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+ModelTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: ModelTableComponent, selector: "base-model-table", inputs: { modelName: "modelName", objectId: "objectId", createMode: "createMode", create: "create", update: "update", delete: "delete", logging: "logging", tableFields: "tableFields" }, outputs: { idSelected: "idSelected", createModeChanged: "createModeChanged" }, usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"!selectedId && !createMode\">\n  <div class=\"w-100 d-flex flex-row justify-content-between mb-4\">\n    <h1 *ngIf=\"modelName\">{{ capitalizeFirstLetter(modelName) }}s</h1>\n    <div class=\"d-flex align-items-center\">\n      <button class=\"btn btn-primary\" (click)=\"createNewObject()\" *ngIf=\"create\">Erstellen</button>\n    </div>\n  </div>\n  <table class=\"table table-hover table-responsive bg-white\">\n    <thead>\n      <tr>\n        <th scope=\"col\" *ngFor=\"let field of availableFields\">{{ capitalizeFirstLetter(field) }}</th>\n      </tr>\n    </thead>\n    <tbody>\n      <tr *ngFor=\"let object of objects\">\n        <td class=\"cursor-pointer\" *ngFor=\"let field of availableFields\" (click)=\"selectId(object)\">\n          {{ object[field] }}\n        </td>\n      </tr>\n    </tbody>\n  </table>\n</div>\n\n<div class=\"w-100\" *ngIf=\"selectedId || createMode\">\n  <button class=\"btn btn-outline-primary mb-3\" (click)=\"selectId('')\">Zur\u00FCck</button>\n  <base-model-form\n    [modelName]=\"modelName\"\n    [logging]=\"logging\"\n    [id]=\"selectedId\"\n    (finished)=\"selectId('')\"\n    [delete]=\"delete\"\n  ></base-model-form>\n</div>\n", styles: [".cursor-pointer{cursor:pointer}.table>:not(:first-child){border-top:0}table{border-radius:.25rem;border-color:#e2e8f0!important}table thead{text-transform:uppercase;font-size:12px}table thead th{padding:12px 24px}table tbody tr td{font-weight:400!important;font-size:16px;padding:16px 24px}\n"], components: [{ type: ModelFormComponent, selector: "base-model-form", inputs: ["modelName", "id", "delete", "logging"], outputs: ["finished"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ModelTableComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'base-model-table', template: "<div *ngIf=\"!selectedId && !createMode\">\n  <div class=\"w-100 d-flex flex-row justify-content-between mb-4\">\n    <h1 *ngIf=\"modelName\">{{ capitalizeFirstLetter(modelName) }}s</h1>\n    <div class=\"d-flex align-items-center\">\n      <button class=\"btn btn-primary\" (click)=\"createNewObject()\" *ngIf=\"create\">Erstellen</button>\n    </div>\n  </div>\n  <table class=\"table table-hover table-responsive bg-white\">\n    <thead>\n      <tr>\n        <th scope=\"col\" *ngFor=\"let field of availableFields\">{{ capitalizeFirstLetter(field) }}</th>\n      </tr>\n    </thead>\n    <tbody>\n      <tr *ngFor=\"let object of objects\">\n        <td class=\"cursor-pointer\" *ngFor=\"let field of availableFields\" (click)=\"selectId(object)\">\n          {{ object[field] }}\n        </td>\n      </tr>\n    </tbody>\n  </table>\n</div>\n\n<div class=\"w-100\" *ngIf=\"selectedId || createMode\">\n  <button class=\"btn btn-outline-primary mb-3\" (click)=\"selectId('')\">Zur\u00FCck</button>\n  <base-model-form\n    [modelName]=\"modelName\"\n    [id]=\"selectedId\"\n    (finished)=\"selectId('')\"\n    [delete]=\"delete\"\n  ></base-model-form>\n</div>\n", styles: [".cursor-pointer{cursor:pointer}.table>:not(:first-child){border-top:0}table{border-radius:.25rem;border-color:#e2e8f0!important}table thead{text-transform:uppercase;font-size:12px}table thead th{padding:12px 24px}table tbody tr td{font-weight:400!important;font-size:16px;padding:16px 24px}\n"] }]
+            args: [{ selector: 'base-model-table', template: "<div *ngIf=\"!selectedId && !createMode\">\n  <div class=\"w-100 d-flex flex-row justify-content-between mb-4\">\n    <h1 *ngIf=\"modelName\">{{ capitalizeFirstLetter(modelName) }}s</h1>\n    <div class=\"d-flex align-items-center\">\n      <button class=\"btn btn-primary\" (click)=\"createNewObject()\" *ngIf=\"create\">Erstellen</button>\n    </div>\n  </div>\n  <table class=\"table table-hover table-responsive bg-white\">\n    <thead>\n      <tr>\n        <th scope=\"col\" *ngFor=\"let field of availableFields\">{{ capitalizeFirstLetter(field) }}</th>\n      </tr>\n    </thead>\n    <tbody>\n      <tr *ngFor=\"let object of objects\">\n        <td class=\"cursor-pointer\" *ngFor=\"let field of availableFields\" (click)=\"selectId(object)\">\n          {{ object[field] }}\n        </td>\n      </tr>\n    </tbody>\n  </table>\n</div>\n\n<div class=\"w-100\" *ngIf=\"selectedId || createMode\">\n  <button class=\"btn btn-outline-primary mb-3\" (click)=\"selectId('')\">Zur\u00FCck</button>\n  <base-model-form\n    [modelName]=\"modelName\"\n    [logging]=\"logging\"\n    [id]=\"selectedId\"\n    (finished)=\"selectId('')\"\n    [delete]=\"delete\"\n  ></base-model-form>\n</div>\n", styles: [".cursor-pointer{cursor:pointer}.table>:not(:first-child){border-top:0}table{border-radius:.25rem;border-color:#e2e8f0!important}table thead{text-transform:uppercase;font-size:12px}table thead th{padding:12px 24px}table tbody tr td{font-weight:400!important;font-size:16px;padding:16px 24px}\n"] }]
         }], ctorParameters: function () { return [{ type: i1$1.GraphQLMetaService }, { type: i1$1.GraphQLService }]; }, propDecorators: { modelName: [{
                 type: Input
             }], objectId: [{
@@ -658,6 +683,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImpor
                 type: Input
             }], delete: [{
                 type: Input
+            }], logging: [{
+                type: Input
             }], tableFields: [{
                 type: Input
             }], idSelected: [{