feat - add "clone" note functionality

apps/codever-ui/src/app/my-notes/clone-note/clone-note.component.html

@@ -0,0 +1,5 @@
+<app-note-editor
+  [note]="note"
+  [isEditMode]="false"
+  [cloneNote]="true"
+></app-note-editor>

apps/codever-ui/src/app/my-notes/clone-note/clone-note.component.scss

@@ -0,0 +1,35 @@
+label {
+  display: inline-block;
+  margin: 0.5em 0;
+  color: #607d8b;
+  font-weight: bold;
+}
+input {
+  height: 2em;
+  font-size: 1em;
+  padding-left: 0.4em;
+}
+
+input[type='checkbox'],
+input[type='radio'] {
+  vertical-align: middle;
+  position: relative;
+  bottom: 1px;
+}
+
+#shared_label {
+  width: 100%;
+}
+
+mat-chip {
+  max-width: 200px;
+}
+
+.demo-chip-list {
+  width: 100%;
+}
+
+.markdown-link {
+  font-weight: normal;
+  margin-left: 0.15rem;
+}

apps/codever-ui/src/app/my-notes/clone-note/clone-note.component.ts

@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+import { Note } from '../../core/model/note';
+
+@Component({
+  selector: 'app-clone-note',
+  templateUrl: './clone-note.component.html',
+  styleUrls: ['./clone-note.component.scss'],
+})
+export class CloneNoteComponent implements OnInit {
+  note: Note;
+
+  ngOnInit(): void {
+    this.note = window.history.state.note;
+  }
+}

apps/codever-ui/src/app/my-notes/my-notes.module.ts

@@ -19,8 +19,9 @@ import { UpdatePersonalNoteComponent } from './update-note/update-personal-note.
 import { NoteEditorComponent } from './save-note-form/note-editor.component';
 import { NoteDetailsComponent } from '../shared/note-details/note-details.component';
 import { PersonalNotesService } from '../core/personal-notes.service';
+import { CloneNoteComponent } from './clone-note/clone-note.component';
 
-const snippetRoutes: Routes = [
+const notesRoutes: Routes = [
   {
     path: 'new',
     canActivate: [AuthGuard],
@@ -31,6 +32,11 @@ const snippetRoutes: Routes = [
     canActivate: [AuthGuard],
     component: UpdatePersonalNoteComponent,
   },
+  {
+    path: ':id/clone',
+    canActivate: [AuthGuard],
+    component: CloneNoteComponent,
+  },
   {
     path: ':id/details',
     canActivate: [AuthGuard],
@@ -43,9 +49,10 @@ const snippetRoutes: Routes = [
     CreatePersonalNoteComponent,
     UpdatePersonalNoteComponent,
     NoteEditorComponent,
+    CloneNoteComponent,
   ],
   imports: [
-    RouterModule.forChild(snippetRoutes),
+    RouterModule.forChild(notesRoutes),
     SharedModule,
     MatTabsModule,
     MatAutocompleteModule,

apps/codever-ui/src/app/my-notes/save-note-form/note-editor.component.ts

@@ -92,6 +92,9 @@ export class NoteEditorComponent implements OnInit, OnDestroy, OnChanges {
   @Input()
   note: Note;
 
+  @Input()
+  cloneNote = false;
+
   @Input()
   initiator: string;
 
@@ -151,7 +154,7 @@ export class NoteEditorComponent implements OnInit, OnDestroy, OnChanges {
   }
 
   ngOnInit(): void {
-    if (!this.isEditMode) {
+    if (!this.isEditMode && !this.cloneNote) {
       this.buildForm();
     }
   }
@@ -169,7 +172,7 @@ export class NoteEditorComponent implements OnInit, OnDestroy, OnChanges {
     if (!this.noteForm) {
       this.buildForm();
     }
-    if (this.isEditMode && this.note) {
+    if (this.note && (this.isEditMode || this.cloneNote)) {
       this.noteForm.patchValue({
         title: this.note.title,
         content: this.note.content,
@@ -241,8 +244,10 @@ export class NoteEditorComponent implements OnInit, OnDestroy, OnChanges {
   saveNote(note: Note) {
     if (this.isEditMode) {
       this.updateNote(note);
-    } else {
+    } else if (this.cloneNote) {
       this.createNote(note);
+    } else {
+      this.cloneNoteFunction(note);
     }
   }
 
@@ -254,17 +259,18 @@ export class NoteEditorComponent implements OnInit, OnDestroy, OnChanges {
     note.initiator = this.initiator;
     this.personalNotesService
       .createNote(this.userId, note)
+      .pipe(takeUntil(this.destroy$))
       .subscribe((response) => {
         const headers = response.headers;
         // get the snippet id, which lies in the "location" response header
         const lastSlashIndex = headers.get('location').lastIndexOf('/');
         const newNoteId = headers.get('location').substring(lastSlashIndex + 1);
         note._id = newNoteId;
-        this.navigateToSnippetDetails(note, {});
+        this.navigateToNoteDetails(note, {});
       });
   }
 
-  navigateToSnippetDetails(note: Note, queryParams: Params): void {
+  navigateToNoteDetails(note: Note, queryParams: Params): void {
     const link = [`./my-notes/${note._id}/details`];
     this.router.navigate(link, {
       state: { snippet: note },
@@ -277,16 +283,29 @@ export class NoteEditorComponent implements OnInit, OnDestroy, OnChanges {
     note.updatedAt = now;
     note.userId = this.note.userId;
     note._id = this.note._id;
-    this.personalNotesService.updateNote(note).subscribe(() => {
-      this.navigateToSnippetDetails(note, {});
-    });
+    this.personalNotesService
+      .updateNote(note)
+      .pipe(takeUntil(this.destroy$))
+      .subscribe(() => {
+        this.navigateToNoteDetails(note, {});
+      });
   }
 
-  navigateToNoteDetails(note: Note): void {
-    const link = [`./my-notes/${note._id}/details`];
-    this.router.navigate(link, {
-      state: { note: note },
-    });
+  cloneNoteFunction(note: Note): void {
+    const now = new Date();
+    note.createdAt = now;
+    note.userId = this.note.userId;
+    note._id = null;
+    this.personalNotesService
+      .createNote(this.note.userId, note)
+      .pipe(takeUntil(this.destroy$))
+      .subscribe((response) => {
+        const headers = response.headers;
+        const lastSlashIndex = headers.get('location').lastIndexOf('/');
+        const newNoteId = headers.get('location').substring(lastSlashIndex + 1);
+        note._id = newNoteId;
+        this.navigateToNoteDetails(note, {});
+      });
   }
 
   get tags() {
@@ -328,18 +347,21 @@ export class NoteEditorComponent implements OnInit, OnDestroy, OnChanges {
   }
 
   deleteNote(note: Note) {
-    this.personalNotesService.deleteNoteById(this.userId, note._id).subscribe(
-      () => {
-        this.router.navigate(['']);
-        this.deleteNotificationService.showSuccessNotification(
-          `Note - "${note.title}" was deleted`
-        );
-      },
-      () => {
-        this.deleteNotificationService.showErrorNotification(
-          'Note could not be deleted. Please try again later!'
-        );
-      }
-    );
+    this.personalNotesService
+      .deleteNoteById(this.userId, note._id)
+      .pipe(takeUntil(this.destroy$))
+      .subscribe(
+        () => {
+          this.router.navigate(['']);
+          this.deleteNotificationService.showSuccessNotification(
+            `Note - "${note.title}" was deleted`
+          );
+        },
+        () => {
+          this.deleteNotificationService.showErrorNotification(
+            'Note could not be deleted. Please try again later!'
+          );
+        }
+      );
   }
 }

apps/codever-ui/src/app/shared/note-details/note-details.component.html

@@ -66,6 +66,15 @@ <h6 class="card-subtitle mb-2 text-muted url-under-title">
         >
           <i class="far fa-edit"></i> Edit
         </button>
+        <button
+          *ngIf="(userId$ | async) && note.userId === (userId$ | async)"
+          type="button"
+          class="btn btn-light btn-sm"
+          (click)="cloneNote(note)"
+          title="Clone note"
+        >
+          <i class="far fa-clone"></i> Clone
+        </button>
       </div>
     </div>
   </div>

apps/codever-ui/src/app/shared/note-details/note-details.component.ts

@@ -53,4 +53,9 @@ export class NoteDetailsComponent implements OnInit {
     const link = [`/my-notes/${note._id}/edit`];
     this.router.navigate(link, { state: { note: note } });
   }
+
+  cloneNote(note: Note) {
+    const link = [`/my-notes/${note._id}/clone`];
+    this.router.navigate(link, { state: { note: note } });
+  }
 }

package.json

@@ -1,6 +1,6 @@
 {
   "name": "Codever",
-  "version": "8.8.0",
+  "version": "8.9.0",
   "description": "Codever - bookmarks, snippets and notes manager for developers & co",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",