✨ Latest projects on landing page, moved landing page components

src/components/projects/MyProjectsPage.astro

@@ -1,32 +1,12 @@
 ---
-import ProjectCard from "./ProjectCard.astro"
+import ProjectGrid from "./ProjectGrid.astro"
 import { type CollectionEntry } from "astro:content"
-import { type NavLink } from "@/utils/linking"
 
 interface Props {
   projects: CollectionEntry<"projects">[]
 }
 
 const { projects } = Astro.props
-
-const baseUrl: NavLink = "/projects"
 ---
 
-<div class="flex flex-wrap justify-around">
-  {
-    projects.map(
-      ({ data: { title, description, tags, heroImage, heroImageAlt }, id }) => (
-        <div class="my-5 px-2">
-          <ProjectCard
-            title={title}
-            linkTo={`${baseUrl}/${id}`}
-            description={description}
-            tags={tags}
-            image={heroImage}
-            imageAlt={heroImageAlt}
-          />
-        </div>
-      ),
-    )
-  }
-</div>
+<ProjectGrid projects={projects} />

src/components/projects/ProjectGrid.astro

@@ -0,0 +1,32 @@
+---
+import type { Project } from "@/types/types"
+import type { NavLink } from "@/utils/linking"
+import ProjectCard from "./ProjectCard.astro"
+
+interface Props {
+  projects: ReadonlyArray<Project>
+}
+
+const { projects } = Astro.props
+
+const baseUrl: NavLink = "/projects"
+---
+
+<div class="flex flex-wrap justify-around">
+  {
+    projects.map(
+      ({ data: { title, description, tags, heroImage, heroImageAlt }, id }) => (
+        <div class="my-5 px-2">
+          <ProjectCard
+            title={title}
+            linkTo={`${baseUrl}/${id}`}
+            description={description}
+            tags={tags}
+            image={heroImage}
+            imageAlt={heroImageAlt}
+          />
+        </div>
+      ),
+    )
+  }
+</div>