From 1c8d68183a15f00cbc095404aa84156e1c32d5af Mon Sep 17 00:00:00 2001
From: Pattadon <pattadon2546pn@gmail.com>
Date: Fri, 8 Nov 2024 16:43:12 +0700
Subject: [PATCH] feat: improve tag display logic in ProjectCard component to
 filter out null or blank tags

---
 src/components/projectCard.tsx | 22 +++++++++++++---------
 1 file changed, 13 insertions(+), 9 deletions(-)

diff --git a/src/components/projectCard.tsx b/src/components/projectCard.tsx
index ded4889..86de0f5 100644
--- a/src/components/projectCard.tsx
+++ b/src/components/projectCard.tsx
@@ -71,15 +71,19 @@ export function ProjectCard(props: ProjectCardProps) {
                 <span className="text-xs">{props.location}</span>
               </div>
               <div className="flex flex-wrap mt-1 items-center text-muted-foreground">
-                {props.tags && Array.isArray(props.tags) ? (
-                  props.tags.map((tag) => (
-                    <span id="tag" key={tag} className="text-[10px] rounded-md bg-slate-200 dark:bg-slate-700 p-1 mr-1">
-                      {tag}
-                    </span>
-                  ))
-                ) : (
-                  <span className="text-xs text-muted-foreground">No tags available</span>
-                )}
+                {props.tags?.length !== 0 && Array.isArray(props.tags)
+                  ? props.tags
+                      .filter((tag) => tag && tag.trim() !== "") // Filters out null or blank tags
+                      .map((tag) => (
+                        <span
+                          id="tag"
+                          key={tag}
+                          className="text-[10px] rounded-md bg-slate-200 dark:bg-slate-700 p-1 mr-1"
+                        >
+                          {tag}
+                        </span>
+                      ))
+                  : null}
               </div>
             </div>
           </div>