From b9739a3933c6e3ddec6d5df9735dec575821b50b Mon Sep 17 00:00:00 2001
From: Jason Wall <jason@walljm.com>
Date: Mon, 17 Aug 2020 11:58:41 -0400
Subject: [PATCH] Edit saved page title

---
 .../page-edit-modal.component.ts              | 26 +++++++++++++++----
 .../saved-page-card.component.html            |  4 +++
 .../saved-page-card.component.ts              | 10 +++++++
 3 files changed, 35 insertions(+), 5 deletions(-)

diff --git a/app/db/src/app/components/page-edit-modal/page-edit-modal.component.ts b/app/db/src/app/components/page-edit-modal/page-edit-modal.component.ts
index 60844b75..78994133 100644
--- a/app/db/src/app/components/page-edit-modal/page-edit-modal.component.ts
+++ b/app/db/src/app/components/page-edit-modal/page-edit-modal.component.ts
@@ -2,6 +2,7 @@ import { Component, Inject } from '@angular/core';
 import { FormGroup, FormBuilder } from '@angular/forms';
 import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
 import { AppService } from '../../services/app.service';
+import { SavedPage } from 'src/app/models/page-state';
 
 @Component({
   selector: 'app-page-edit-modal',
@@ -13,18 +14,21 @@ export class PageEditModalComponent {
   dialogTitle = 'Save Page using Current Cards';
 
   constructor(
-    @Inject(MAT_DIALOG_DATA) public title: string,
+    @Inject(MAT_DIALOG_DATA) public title: PageEditModalData,
     public dialogRef: MatDialogRef<PageEditModalComponent>,
     private appService: AppService,
     private fb: FormBuilder
   ) {
     if (title) {
       this.dialogTitle = 'Edit Page Name';
+    } else {
+      title = {
+        title: '',
+        savedPage: null,
+      };
     }
 
-    this.form = this.fb.group({
-      title,
-    });
+    this.form = this.fb.group(title);
   }
 
   cancel() {
@@ -32,7 +36,19 @@ export class PageEditModalComponent {
   }
 
   save() {
-    this.appService.savePage(this.form.get('title').value);
+    if (this.dialogTitle === 'Edit Page Name') {
+      this.appService.updateSavedPage({
+        ...this.title.savedPage,
+        title: this.form.get('title').value,
+      });
+    } else {
+      this.appService.savePage(this.form.get('title').value);
+    }
     this.dialogRef.close();
   }
 }
+
+export interface PageEditModalData {
+  title: string;
+  savedPage: SavedPage;
+}
diff --git a/app/db/src/app/components/saved-page-card/saved-page-card.component.html b/app/db/src/app/components/saved-page-card/saved-page-card.component.html
index 3f39f8c9..c8b6990e 100644
--- a/app/db/src/app/components/saved-page-card/saved-page-card.component.html
+++ b/app/db/src/app/components/saved-page-card/saved-page-card.component.html
@@ -29,6 +29,10 @@
       <mat-icon>more_vert</mat-icon>
     </button>
     <mat-menu #moreMenu="matMenu">
+      <button mat-menu-item (click)="onEditPageTitle()">
+        <mat-icon>edit</mat-icon>
+        <span>Edit Page Title</span>
+      </button>
       <button mat-menu-item (click)="onRemovePage()">
         <mat-icon>delete</mat-icon>
         <span>Delete Saved Page</span>
diff --git a/app/db/src/app/components/saved-page-card/saved-page-card.component.ts b/app/db/src/app/components/saved-page-card/saved-page-card.component.ts
index e4127de7..64995a21 100644
--- a/app/db/src/app/components/saved-page-card/saved-page-card.component.ts
+++ b/app/db/src/app/components/saved-page-card/saved-page-card.component.ts
@@ -8,6 +8,7 @@ import { CardItem, CardType } from 'src/app/models/card-state';
 import { NoteItem } from 'src/app/models/note-state';
 import { OkCancelModalComponent, OkCancelResult } from '../ok-cancel-modal/ok-cancel-modal.component';
 import { MatSnackBar } from '@angular/material/snack-bar';
+import { PageEditModalComponent } from '../page-edit-modal/page-edit-modal.component';
 
 @Component({
   selector: 'app-saved-page-card',
@@ -81,6 +82,15 @@ export class SavedPageCardComponent implements OnInit {
       });
   }
 
+  onEditPageTitle() {
+    this.dialog.open(PageEditModalComponent, {
+      data: {
+        title: this.savedPage.title,
+        savedPage: this.savedPage,
+      },
+    });
+  }
+
   moveSavedPageCard(event: CdkDragDrop<string[]>) {
     this.appService.moveSavedPageCard(this.savedPage, event.previousIndex, event.currentIndex);
   }