Separating schema and resource names in frontend for more genericity

back/app/entity/models.py

@@ -35,7 +35,7 @@ class Employee(BaseModel):
     entity_id: str = Field(foreignKey={
                                 "reference": {
                                     "resource": "entity",
-                                    "displayName": "_id",
+                                    "schema": "Entity",
                                     "condition": "entity_data.type=individual"
                                 }
                             })

front/app/src/app/views/entities/entities.component.ts

@@ -8,23 +8,24 @@ import { getStyle, rgbToHex } from '@coreui/utils/src';
 
 
 export class BaseEntitiesComponent {
-  protected resource: string = "Entity";
+  protected resource: string = "entity";
+  protected schema: string = "Entity";
 }
 
 @Component({
-  template: '<crud-list [resource]="this.resource"></crud-list>'
+  template: '<crud-list [resource]="this.resource" [schema]="this.schema"></crud-list>'
 })
 export class EntityListComponent extends BaseEntitiesComponent{
 }
 
 @Component({
-  template: '<crud-card [resource]="this.resource"></crud-card>'
+  template: '<crud-card [resource]="this.resource" [schema]="this.schema"></crud-card>'
 })
 export class EntityNewComponent extends BaseEntitiesComponent {
 }
 
 @Component({
-  template: '<crud-card [resource]="this.resource" [resource_id]="this.resource_id"></crud-card>'
+  template: '<crud-card [resource]="this.resource" [resource_id]="this.resource_id" [schema]="this.schema"></crud-card>'
 })
 export class EntityCardComponent extends BaseEntitiesComponent implements OnInit {
 

front/app/src/common/crud/card/card.component.html

@@ -1,6 +1,6 @@
 <div>
   <form cForm [formGroup]="form" (ngSubmit)="onSubmit(model)">
-    <span class="col col-form-label" *ngIf="loading$ | async">Loading...</span>
+    <span class="col col-form-label" *ngIf="formLoading$ || modelLoading$ | async">Loading...</span>
     <formly-form [form]="form" [fields]="fields" [model]="model"></formly-form>
     <button class="btn btn-success btn-lg" type="submit" [disabled]="!form.valid">
       {{ this.isCreateForm() ? "Create" : "Update" }}

front/app/src/common/crud/card/card.component.ts

@@ -19,6 +19,7 @@ export interface Model {
 export class CardComponent implements OnInit {
   @Input() resource: string | undefined;
   @Input() resource_id: string | null = null;
+  @Input() schema: string | undefined;
   @Input() is_modal: Boolean = false;
 
     @Output() resourceCreated: EventEmitter<string> = new EventEmitter();
@@ -31,11 +32,16 @@ export class CardComponent implements OnInit {
 
   schemas = JSON.parse(`{}`);
 
-  private _loading$ = new BehaviorSubject<boolean>(true);
+    private _formLoading$ = new BehaviorSubject<boolean>(true);
+    private _modelLoading$ = new BehaviorSubject<boolean>(true);
 
-  get loading$() {
+    get formLoading$() {
-    return this._loading$.asObservable();
+        return this._formLoading$.asObservable();
-  }
+    }
+
+    get modelLoading$() {
+        return this._modelLoading$.asObservable();
+    }
 
   constructor(private crudService: CrudService,
               private formlyJsonschema: CrudFormlyJsonschemaService,
@@ -44,28 +50,31 @@ export class CardComponent implements OnInit {
   ) { }
 
     ngOnInit(): void {
-        this._loading$.next(true);
+        this._formLoading$.next(true);
+        this._modelLoading$.next(true);
         let fields$;
         if (this.isCreateForm()) {
-            fields$ = this.formlyJsonschema.getCreateFields(this.resource!);
+            this._modelLoading$.next(false);
+            fields$ = this.formlyJsonschema.getCreateFields(this.schema!);
         } else {
             this.crudService.get(this.resource!, this.resource_id!).subscribe((model: any) => {
-                this.model = model
+                this.model = model;
-                this._loading$.next(false);
+                this._modelLoading$.next(false);
             });
-            fields$ = this.formlyJsonschema.getUpdateFields(this.resource!);
+            fields$ = this.formlyJsonschema.getUpdateFields(this.schema!);
         }
 
         fields$.subscribe((fields: any) => {
             this.fields = [fields]
+            this._formLoading$.next(false);
         });
     }
 
   onSubmit(model: any) {
-    this._loading$.next(true);
+    this._modelLoading$.next(true);
     if (this.isCreateForm()) {
       this.crudService.create(this.resource!, model).subscribe((response: any) => {
-          this._loading$.next(false);
+          this._modelLoading$.next(false);
           if (! this.is_modal) {
               this.router.navigate([`../${response.id}`], {relativeTo: this.route});
           } else {
@@ -75,15 +84,15 @@ export class CardComponent implements OnInit {
     } else {
       this.crudService.update(this.resource!, model).subscribe((model: any) => {
         this.model = model;
-        this._loading$.next(false);
+        this._modelLoading$.next(false);
       });
     }
   }
 
     onDelete() {
-        this._loading$.next(true);
+        this._modelLoading$.next(true);
         this.crudService.delete(this.resource!, this.model).subscribe((model: any) => {
-            this._loading$.next(false);
+            this._modelLoading$.next(false);
             if (! this.is_modal) {
                 this.router.navigate(['../'], {relativeTo: this.route});
             } else {

front/app/src/common/crud/list/list.component.ts

@@ -27,6 +27,7 @@ interface State {
 export class ListComponent implements OnInit {
   @Input() resource: string = "";
   @Input() columns: string[] = [];
+  @Input() schema: string | undefined;
 
   public displayedColumns: string[] = [];
 
@@ -41,7 +42,7 @@ export class ListComponent implements OnInit {
     ) { }
 
     ngOnInit(): void {
-        this.jsonSchemasService.getUpdateResource(this.resource!).subscribe((schemas: any) => {
+        this.jsonSchemasService.getUpdateResource(this.schema!).subscribe((schemas: any) => {
             if (this.columns.length == 0) {
                 for (let param_name in schemas.properties) {
                     if (param_name != "_id") {

front/app/src/common/crud/types/foreignkey.type.ts

@@ -55,8 +55,19 @@ import {formatDate} from "@angular/common";
                         (click)="modal.dismiss('Cross click')"></button>
             </div>
             <div class="modal-body">
-                <crud-card *ngIf="this.hasValue()" [resource]="this.foreignResource" [resource_id]="this.foreignModel._id" [is_modal]="true" (resourceDeleted)="onResourceDeleted($event)"></crud-card>
+                <crud-card *ngIf="this.hasValue()" 
-                <crud-card *ngIf="! this.hasValue()" [resource]="this.foreignResource" [is_modal]="true" (resourceCreated)="onResourceCreated($event)"></crud-card>
+                           [resource]="this.foreignResource" 
+                           [resource_id]="this.foreignModel._id" 
+                           [schema]="this.foreignSchema" 
+                           [is_modal]="true" 
+                           (resourceDeleted)="onResourceDeleted($event)">
+                </crud-card>
+                <crud-card *ngIf="! this.hasValue()" 
+                           [resource]="this.foreignResource"
+                           [schema]="this.foreignSchema"
+                           [is_modal]="true"
+                           (resourceCreated)="onResourceCreated($event)">
+                </crud-card>
             </div>
             <div class="modal-footer">
             </div>
@@ -68,6 +79,7 @@ export class ForeignkeyTypeComponent extends FieldType<FieldTypeConfig> implemen
     public foreignModel: any = {}
     public foreignLabel: string = ""
     public foreignResource : string = "";
+    public foreignSchema : string = "";
     public errorMsg: string = "";
     public displayModal = false;
 
@@ -85,6 +97,8 @@ export class ForeignkeyTypeComponent extends FieldType<FieldTypeConfig> implemen
     ngOnInit() {
         // @ts-ignore
         this.foreignResource = this.field.foreignKey.reference.resource;
+        // @ts-ignore
+        this.foreignSchema = this.field.foreignKey.reference.schema;
         if (this.hasValue()) {
             this.getResource(this.formControl.value)
         }