Duplication modal on card

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

@@ -7,6 +7,11 @@
               [disabled]="!form.valid && (formLoading$ || modelLoading$ | async)">
         {{ this.isCreateForm() ? "Create" : "Update" }}
       </button>
+      <button class="btn btn-primary btn-lg" type="button" *ngIf="!this.isCreateForm()"
+              [disabled]="!form.valid && (formLoading$ || modelLoading$ | async)"
+              (click)="open(duplicationModal)">
+        Duplicate
+      </button>
       <button class="btn btn-danger btn-lg" type="button" *ngIf="!this.isCreateForm()"
               [disabled]="formLoading$ || modelLoading$ | async"
               (click)="open(confirmDeleteModal)">
@@ -14,7 +19,7 @@
       </button>
       <ng-template #confirmDeleteModal let-modal>
         <div class="modal-header">
-            <h4 class="modal-title" id="modal-basic-title">Are you sure you want to delete this {{ this.schema }}?</h4>
+            <h4 class="modal-title">Are you sure you want to delete this {{ this.schema }}?</h4>
             <button type="button" class="btn-close" aria-label="Cancel" (click)="modal.dismiss('Cancel Deletion')"></button>
         </div>
         <div class="modal-footer">
@@ -22,6 +27,20 @@
             <button type="button" class="btn btn-danger" (click)="modal.close('Save click')">Delete</button>
         </div>
       </ng-template>
+      <ng-template #duplicationModal let-modal>
+        <div class="modal-header">
+            <h4 class="modal-title">Duplicate {{ this.schema }}</h4>
+            <button type="button" class="btn-close" aria-label="Cancel" (click)="modal.dismiss('Cancel Deletion')"></button>
+        </div>
+        <div class="modal-body">
+            <crud-card [resource]="this.resource"
+                       [schema]="this.schema"
+                       [model]="this.model"
+                       [is_modal]="true"
+                       (resourceCreated)="onModelDuplicated($event)">
+            </crud-card>
+        </div>
+      </ng-template>
     </div>
   </form>
 </div>

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

@@ -17,6 +17,7 @@ export class CardComponent implements OnInit {
   @Input() resource: string | undefined;
   @Input() resource_id: string | null = null;
   @Input() schema: string | undefined;
+  @Input() model = {};
   @Input() is_modal: Boolean = false;
 
     @Output() resourceCreated: EventEmitter<string> = new EventEmitter();
@@ -25,7 +26,6 @@ export class CardComponent implements OnInit {
 
 
   form = new FormGroup({});
-  model = {};
   fields: FormlyFieldConfig[] = [];
 
   schemas = JSON.parse(`{}`);
@@ -101,8 +101,8 @@ export class CardComponent implements OnInit {
         });
     }
 
-    onDuplicate() {
-
+    onModelDuplicated(resource_id: string) {
+        this.modalService.dismissAll();
     }
 
   isCreateForm() {