code refactoring

src/app/blog/blog.component.html

@@ -12,13 +12,13 @@
           <a [href]="post.postUrl" target="_blank">
 
             <figure class="blog-banner-box" *ngIf="post.image">
-              <img src="{{blogImageUrl + post.image}}" [alt]="post.title" loading="lazy">
+              <img src="{{blogUrl + post.image}}" [alt]="post.title" loading="lazy">
             </figure>
 
             <div class="blog-content">
 
               <div class="blog-meta">
-                <p class="blog-category">{{post.categories}}</p>
+                <p class="blog-category" *ngFor="let category of post.categories; index as i">{{post.categories.length - i > 1 ? category + ',' : category}}</p>
 
                 <span class="dot"></span>
 

src/app/blog/blog.component.ts

@@ -10,7 +10,7 @@ import { environment } from 'src/environments/environment';
   styleUrl: './blog.component.scss'
 })
 export class BlogComponent extends BaseComponent<IBlog> implements OnInit{
-  blogImageUrl: string = environment.blogImagesUrl;
+  blogUrl!: string;
   constructor(svc: CvService){
     super(svc);
   }
@@ -23,6 +23,7 @@ export class BlogComponent extends BaseComponent<IBlog> implements OnInit{
     this.svc.getBlog(this.candidateId).subscribe((response: IBlog) => {
       this.svc.blog = this.svc.blog ?? response;
       this.assignData(response);
+      this.blogUrl = this.svc.blog.blogUrl;
     });
   }
 }

src/app/blog/blog.model.ts

@@ -1,5 +1,6 @@
 import { IPost } from "../models/post.model";
 
 export interface IBlog{
+    blogUrl: string;
     posts: IPost[];
 }

src/app/models/post.model.ts

@@ -3,7 +3,7 @@ export interface IPost{
     slug: string;
     title: string;
     description: string;
-    categories: string;
+    categories: string[];
     postUrl: string;
     likes: number;
     views: number;

src/app/models/project.model.ts

@@ -2,7 +2,7 @@ export interface IProject{
     projectId: number;
     name: string;
     description: string;
-    categories: string;
+    categories: string[];
     categoryList: string[];
     roles: string[];
     responsibilities: string[];

src/app/projects/projects.component.html

@@ -53,12 +53,12 @@
                 <ion-icon name="eye-outline"></ion-icon>
               </div> -->
 
-              <img src="{{imagesOrigin + project.imagePath}}" [alt]="project.categories" loading="lazy">
+              <img src="{{imagesOrigin + project.imagePath}}" loading="lazy">
             </figure>
 
             <h3 class="project-title">{{project.name}}</h3>
 
-            <p class="project-category">{{project.categories}}</p>
+            <span class="project-category" *ngFor="let category of project.categories; index as i" [ngClass]="i > 0 ? 'inline no-margin' : 'inline'">{{i > 0 ? ', ' + category : category}}</span>
 
           </a>
         </li>

src/app/projects/projects.component.scss

@@ -0,0 +1,7 @@
+.inline{
+    display: inline;
+}
+
+.no-margin{
+    margin-left: 0px;
+}

src/app/projects/projects.component.ts

@@ -38,7 +38,7 @@ categoryClicked: boolean = false;
       ? this.model.projects
       : this.model.projects.filter(
         (project: IProject) => {
-          return project.categoryList.includes(category)
+          return project.categories.includes(category)
         });
   }
 }

src/environments/environment.development.ts

@@ -1,5 +1,4 @@
 export const environment = {
     apiUrl: 'https://localhost:7013',
-    blogImagesUrl: 'https://bangararaju-uat.kottedi.in/blog/assets/img/posts/',
     apiKey: "c6eAXYcNT873TT7BfMgQyS4ii7hxa53TLEUN7pAGaaU="
 };

src/environments/environment.ts

@@ -1,5 +1,4 @@
 export const environment = {
     apiUrl: 'https://localhost:7013',
-    blogImagesUrl: 'https://bangararaju-uat.kottedi.in/blog/assets/img/posts/',
     apiKey: "c6eAXYcNT873TT7BfMgQyS4ii7hxa53TLEUN7pAGaaU="
 };