fix: displays featured section only if featured posts exist

src/pages/index.astro

@@ -13,6 +13,9 @@ import Socials from "@components/Socials.astro";
 const posts = await Astro.glob<Frontmatter>("../contents/**/*.md");
 
 const sortedPosts = getSortedPosts(posts);
+const featuredPosts = sortedPosts.filter(
+  ({ frontmatter }) => frontmatter.featured
+);
 ---
 
 <Layout>
@@ -59,25 +62,25 @@ const sortedPosts = getSortedPosts(posts);
 
     <Hr />
 
+    {
+      featuredPosts.length > 0 && (
+        <>
           <section id="featured">
             <h2>Featured</h2>
             <ul>
-        {
+              {featuredPosts.map(({ frontmatter }) => (
-          sortedPosts.map(
-            ({ frontmatter }) =>
-              frontmatter.featured && (
                 <Card
                   href={`/posts/${slugify(frontmatter)}`}
                   post={frontmatter}
                   secHeading={false}
                 />
-              )
+              ))}
-          )
-        }
             </ul>
           </section>
-
           <Hr />
+        </>
+      )
+    }
 
     <section id="recent-posts">
       <h2>Recent Posts</h2>