From a7f697753d76d2becc55ca5b5e394c582889f597 Mon Sep 17 00:00:00 2001
From: Silas Owu <owusilasyp00@gmail.com>
Date: Thu, 3 Oct 2024 17:26:04 -0700
Subject: [PATCH] refact: refact fireblog-page and post card with edit and
 delete implementation

---
 .../post-card/post-card.component.ts           | 18 +++++++++++++++---
 .../fireblog/fireblog-facade.service.ts        | 11 +++++++++--
 2 files changed, 24 insertions(+), 5 deletions(-)

diff --git a/src/app/components/post-card/post-card.component.ts b/src/app/components/post-card/post-card.component.ts
index bcb54da..66457b2 100644
--- a/src/app/components/post-card/post-card.component.ts
+++ b/src/app/components/post-card/post-card.component.ts
@@ -1,4 +1,4 @@
-import { Component, Input } from '@angular/core';
+import { Component, EventEmitter, Input, Output } from '@angular/core';
 import { LikesComponent } from "../likes/likes/likes.component";
 import { CommonModule } from '@angular/common';
 import { FormsModule } from '@angular/forms';
@@ -6,9 +6,11 @@ import { MatButtonModule } from '@angular/material/button';
 import { MatFormFieldModule } from '@angular/material/form-field';
 import { MatInputModule } from '@angular/material/input';
 import { MatIconModule } from '@angular/material/icon';
+import { MatExpansionModule } from '@angular/material/expansion';
 import { IBlog, IUser } from '../../services/blog.interface';
 import { FireblogFacadeService } from '../../services/fireblog/fireblog-facade.service';
-// import { FireblogFacadeService } from '../../services/fireblog-facade.service';
+import { CommentsComponent } from "../comments/comments.component";
+import { PrependAtPipe } from '../../pipe/prepend-at.pipe';
 
 @Component({
   selector: 'app-post-card',
@@ -20,13 +22,17 @@ import { FireblogFacadeService } from '../../services/fireblog/fireblog-facade.s
     MatButtonModule,
     MatFormFieldModule,
     MatInputModule,
-    MatIconModule
+    MatIconModule,
+    MatExpansionModule,
+    CommentsComponent,
+    PrependAtPipe
   ],
   templateUrl: './post-card.component.html',
   styleUrl: './post-card.component.scss'
 })
 export class PostCardComponent {
   @Input() blogPost!: IBlog;
+  @Output() commentToggled = new EventEmitter<string>();
 
   randomAvatarUrl: string = '';
   currentUser: IUser | null = null;
@@ -94,4 +100,10 @@ export class PostCardComponent {
         .catch(error => console.error('Error deleting post:', error));
     }
   }
+
+  toggleComments() {
+    if (this.blogPost.id) {
+      this.commentToggled.emit(this.blogPost.id);
+    }
+  }
 }
diff --git a/src/app/services/fireblog/fireblog-facade.service.ts b/src/app/services/fireblog/fireblog-facade.service.ts
index d975cfd..cf36174 100644
--- a/src/app/services/fireblog/fireblog-facade.service.ts
+++ b/src/app/services/fireblog/fireblog-facade.service.ts
@@ -1,9 +1,9 @@
 import { Injectable } from '@angular/core';
 import { collectionData, docData } from '@angular/fire/firestore';
-import { collection, doc, addDoc, updateDoc, deleteDoc } from 'firebase/firestore';
+import { collection, doc, addDoc, updateDoc, deleteDoc, arrayUnion } from 'firebase/firestore';
 import { Firestore } from '@angular/fire/firestore';
 import { BehaviorSubject, Observable } from 'rxjs';
-import { IBlog, IUser } from '../blog.interface';
+import { IBlog, IComment, IUser } from '../blog.interface';
 import { Auth, User, onAuthStateChanged } from '@angular/fire/auth';
 
 @Injectable({
@@ -78,4 +78,11 @@ export class FireblogFacadeService {
     const blogPostDoc = doc(this.firestore, `fireblogPosts/${id}`);
     await deleteDoc(blogPostDoc);
   }
+
+  async addCommentToBlogPost(postId: string, comment: IComment): Promise<void> {
+    const blogPostDoc = doc(this.firestore, `fireblogPosts/${postId}`);
+    await updateDoc(blogPostDoc, {
+      comments: arrayUnion(comment)
+    });
+  }
 }