fixed links in blog posts

ortwic · May 10, 2024 · 1c53f73 · 1c53f73
1 parent b495474
commit 1c53f73
Show file tree

Hide file tree

Showing 3 changed files with 33 additions and 13 deletions.
diff --git a/src/app/pages/blog-post/blog-post.component.ts b/src/app/pages/blog-post/blog-post.component.ts
@@ -1,6 +1,7 @@
 import { Component, inject } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { ActivatedRoute } from '@angular/router';
+import { switchMap } from 'rxjs';
 import { IFrameComponent } from '../../components/ui/iframe/iframe.component';
 import { MarkdownComponent } from '../../components/ui/markdown/markdown.component';
 import { BlogService } from '../../services/blog.service';
@@ -14,18 +15,29 @@ import { BlogPost } from '../../models/blog.model';
     styles: ``,
 })
 export class BlogPostComponent {
-    readonly route = inject(ActivatedRoute);
-    readonly blogService = inject(BlogService);
+    private readonly _route = inject(ActivatedRoute);
+    private readonly _blogService = inject(BlogService);
 
-    readonly document = this.loadDocument();
+    readonly document = this._route.params.pipe(
+        switchMap((params) => this.loadDocument(params['id']))
+    );
 
-    private async loadDocument(): Promise<BlogPost | undefined> {
-        const id = this.route.snapshot.params['id'];
-        return this.blogService.getDocument<BlogPost>(id).then((post) => {
+    private async loadDocument(id: string): Promise<BlogPost> {
+        return this._blogService.getDocument<BlogPost>(id).then((post) => {
+            console.log(post)
             if (post) {
                 document.title = post.title + ' | Why App';
+                return post;
             }
-            return post;
+            return {
+                title: 'Blog Post Not Found',
+                content: [
+                    {
+                        type: 'text',
+                        value: 'The blog post you were looking for was not found',
+                    },
+                ],
+            } as BlogPost;
         });
     }
 }
diff --git a/src/app/pages/blog/blog.component.ts b/src/app/pages/blog/blog.component.ts
@@ -23,10 +23,14 @@ export class BlogComponent {
     );
 
     constructor() {
-        const tag = this.route.snapshot.params['tag'];
+        const tag = this.route.snapshot.params['tag']?.toLowerCase();
+        const contains = (array: string[]) => {
+            return array && array.join().toLowerCase().includes(tag);
+        };
+
         if (tag) {
             this.blogPosts$ = this.service.data$.pipe(
-                map((posts) => posts.filter((post) => post.tags?.includes(tag))),
+                map((posts) => posts.filter((post) => contains(post.tags))),
                 switchMap(async (posts) => this.resolveUrl(posts))
             );
             document.title = 'Blog - ' + tag + ' | Why App';

diff --git a/src/app/services/firestore.service.ts b/src/app/services/firestore.service.ts
@@ -95,10 +95,14 @@ export class FirestoreService {
 
     public async getDocument<T>(id: string): Promise<T | undefined> {
         const docRef = doc(this.store, this.path, id);
-        return {
-            id: id,
-            ...await this.toDocument(docRef) as T
-        };
+        const document = await this.toDocument(docRef) as T;
+        if (document) {
+            return {
+                id: id,
+                ...document
+            };
+        }
+        return undefined;
     }
 
     protected async toDocument<T>(docRef: DocumentReference<T, DocumentData>) {