code refactoring

src/app/blog/blog.component.html

@@ -18,7 +18,7 @@
             <div class="blog-content">
 
               <div class="blog-meta">
-                <p class="blog-category">{{post.category}}</p>
+                <p class="blog-category">{{post.categories}}</p>
 
                 <span class="dot"></span>
 

src/app/contact-sidebar/contact-sidebar.component.html

@@ -88,19 +88,19 @@
 
       <ul class="social-list">
 
-        <li class="social-item">
+        <li class="social-item" *ngIf="model.socialLinks?.linkedin">
             <a href="{{model.socialLinks?.linkedin}}" target="_blank" class="social-link">
               <i class="fa-brands fa-linkedin"></i>
             </a>
           </li>
 
-          <li class="social-item">
+          <li class="social-item" *ngIf="model.socialLinks?.gitHub">
             <a href="{{model.socialLinks?.gitHub}}" target="_blank" class="social-link">
               <i class="fa-brands fa-github"></i>
             </a>
           </li>
 
-        <li class="social-item">
+        <li class="social-item" *ngIf="model.socialLinks?.blogUrl">
           <a href="{{model.socialLinks?.blogUrl}}" target="_blank" class="social-link">
             <i class="fa-duotone fa-blog"></i>
           </a>

src/app/models/post.model.ts

@@ -3,7 +3,7 @@ export interface IPost{
     slug: string;
     title: string;
     description: string;
-    category: 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;
-    category: string;
+    categories: string[];
     roles: string[];
     responsibilities: string[];
     technologiesUsed: 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.category" loading="lazy">
+              <img src="{{imagesOrigin + project.imagePath}}" [alt]="project.categories" loading="lazy">
             </figure>
 
             <h3 class="project-title">{{project.name}}</h3>
 
-            <p class="project-category">{{project.category}}</p>
+            <p class="project-category">{{project.categories}}</p>
 
           </a>
         </li>

src/app/projects/projects.component.ts

@@ -37,11 +37,8 @@ categoryClicked: boolean = false;
     this.projects = this.filter === 'All'
       ? this.model.projects
       : this.model.projects.filter(
-        (project: IProject) => project.category === this.filter
-      );
-  }
-
-  isCategoryActive(category: string){
-    return this.filter === category; 
+        (project: IProject) => {
+          return project.categories.includes(category)
+        });
   }
 }