chore: organise folder structure

src/components/BlogSideBar.astro → src/components/blog/BlogSideBar.astro

@@ -1,5 +1,5 @@
 ---
-import { getTags } from "../helpers/getTags";
+import { getTags } from "../../helpers/getTags";
 import TagItem from "./TagItem.astro";
 const tags = await getTags();
 

src/components/TagItem.astro → src/components/blog/TagItem.astro

@@ -1,5 +1,5 @@
 ---
-import { getRandomColor } from "../helpers/colorGenerator";
+import { getRandomColor } from "../../helpers/colorGenerator";
 
 const { tag } = Astro.props;
 ---

src/components/TagList.astro → src/components/blog/TagList.astro

@@ -2,19 +2,20 @@
 import TagItem from "./TagItem.astro";
 
 type TagItem = {
-  label: string,
-  url: string
-}
+  label: string;
+  url: string;
+};
 
 const { tags } = Astro.props;
 
-const mappedTags: TagItem[] = tags.map((tag: string) => ({label: tag, url: `/tags/${tag}`}))
+const mappedTags: TagItem[] = tags.map((tag: string) => ({
+  label: tag,
+  url: `/tags/${tag}`,
+}));
 ---
 
 <ul class="tags">
-  {mappedTags.map((tag) => 
-  <TagItem tag={tag}/>
-  )}
+  {mappedTags.map((tag) => <TagItem tag={tag} />)}
 </ul>
 <style scoped>
   .tags {

src/components/JobItem.astro → src/components/work/JobItem.astro

@@ -1,7 +1,7 @@
 ---
 import type { CollectionEntry } from "astro:content";
-import Markdown from "./MarkdownComponent.astro";
-import TagList from "./TagList.astro";
+import Markdown from "../MarkdownComponent.astro";
+import TagList from "../blog/TagList.astro";
 import JobTag from "./JobTag.astro";
 interface Props {
   job: CollectionEntry<"work">;

src/components/JobTag.astro → src/components/work/JobTag.astro

@@ -1,5 +1,5 @@
 ---
-import { getRandomColor } from "../helpers/colorGenerator";
+import { getRandomColor } from "../../helpers/colorGenerator";
 const { tag } = Astro.props;
 ---
 

src/layouts/BlogLayout.astro

@@ -1,6 +1,6 @@
 ---
 import PageLayout from "../layouts/PageLayout.astro";
-import BlogSideBar from "../components/BlogSideBar.astro";
+import BlogSideBar from "../components/blog/BlogSideBar.astro";
 
 const { title } = Astro.props;
 ---

src/layouts/BlogPostLayout.astro

@@ -2,7 +2,7 @@
 import type { CollectionEntry } from "astro:content";
 import BlogLayout from "./BlogLayout.astro";
 import Markdown from "../components/MarkdownComponent.astro";
-import TagList from "../components/TagList.astro";
+import TagList from "../components/blog/TagList.astro";
 
 type Props = CollectionEntry<"blog">["data"];
 const { title, updateDate, tags } = Astro.props;
@@ -38,9 +38,9 @@ const postDate = updateDate.toLocaleDateString("en-uk", {
   h2 {
     margin-bottom: var(--space-extra-small);
   }
-  
+
   time {
-    color: var(--highligth-color)
+    color: var(--highligth-color);
   }
 
   .content {

src/pages/index.astro

@@ -1,34 +1,33 @@
 ---
 import BlogLayout from "../layouts/BlogLayout.astro";
 import { getCollection } from "astro:content";
-import PostCard from "../components/PostCard.astro";
+import PostCard from "../components/blog/PostCard.astro";
 
 const postList = await getCollection("blog");
 const blogPostList = postList.filter((post) => !post.data.draft);
-
 ---
 
 <BlogLayout title="Blog">
-    <div>
-      {
-        blogPostList
-          .sort(
-            (a, b) => b.data.updateDate.getTime() - a.data.updateDate.getTime()
-          )
-          .map((post) => {
-            const { title, description, updateDate, tags } = post.data;
-            return (
-              <>
-                <PostCard
-                  title={title}
-                  date={updateDate}
-                  description={description}
-                  tags={tags}
-                  slug={post.slug}
-                />
-              </>
-            );
-          })
-      }
-    </div>
+  <div>
+    {
+      blogPostList
+        .sort(
+          (a, b) => b.data.updateDate.getTime() - a.data.updateDate.getTime()
+        )
+        .map((post) => {
+          const { title, description, updateDate, tags } = post.data;
+          return (
+            <>
+              <PostCard
+                title={title}
+                date={updateDate}
+                description={description}
+                tags={tags}
+                slug={post.slug}
+              />
+            </>
+          );
+        })
+    }
+  </div>
 </BlogLayout>

src/pages/tags/[tag].astro

@@ -1,21 +1,22 @@
 ---
-import PostCard from '../../components/PostCard.astro';
-import BlogLayout from '../../layouts/BlogLayout.astro';
+import PostCard from "../../components/blog/PostCard.astro";
+import BlogLayout from "../../layouts/BlogLayout.astro";
 import { getCollection } from "astro:content";
 
-
 export async function getStaticPaths() {
   const posts = await getCollection("blog");
-  const tags = [...new Set(posts.map((post) => post.data.tags).flat())]
-  return tags.map((tag)=> ({ params: { tag: String(tag) }, props: { posts }}))
+  const tags = [...new Set(posts.map((post) => post.data.tags).flat())];
+  return tags.map((tag) => ({
+    params: { tag: String(tag) },
+    props: { posts },
+  }));
 }
 
-
 const { tag } = Astro.params;
 const { posts } = Astro.props;
-const filteredPosts = posts.filter((post) => post.data.tags.includes(tag) );
-
+const filteredPosts = posts.filter((post) => post.data.tags.includes(tag));
 ---
+
 <BlogLayout pageTitle={tag}>
   <div>
     <h2>#{tag}</h2>
@@ -46,4 +47,4 @@ const filteredPosts = posts.filter((post) => post.data.tags.includes(tag) );
   h2 {
     margin-bottom: var(--space-large);
   }
-</style>
+</style>

src/pages/work.astro

@@ -1,7 +1,7 @@
 ---
 import { getCollection } from "astro:content";
 import PageLayout from "../layouts/PageLayout.astro";
-import JobItem from "../components/JobItem.astro";
+import JobItem from "../components/work/JobItem.astro";
 
 const jobs = await getCollection("work");
 ---