Replace entry slug with id

Author: albertchae

src/components/pages/blog/BlogListEntry.astro

@@ -5,7 +5,7 @@ const { post } = Astro.props;
 ---
 
 <article
-  data-category={post.slug.split('/')[0]}
+  data-category={post.id.split('/')[0]}
   class="font-light"
   aria-hidden="false"
 >

src/lib/utils.js

@@ -3,11 +3,11 @@ import MarkdownIt from 'markdown-it';
 export function generatePathFromPost(post, attachBlog = true) {
   const postDate = new Date(post.data.date);
   return `/${attachBlog ? 'blog/' : ''}${
-    post.slug.split('/')[0] +
+    post.id.split('/')[0] +
     '/' +
     postDate.getFullYear() +
     '/' +
-    post.slug.split('/').pop().split('_').pop()
+    post.id.split('/').pop().split('_').pop()
   }`;
 }
 

src/pages/blog/[category].astro

@@ -10,7 +10,7 @@ export async function getStaticPaths() {
   const blogEntries = await getCollection('blog');
 
   const filteredEntries = blogEntries.reduce((groups, entry) => {
-    const category = entry.slug.split('/')[0];
+    const category = entry.id.split('/')[0];
     if (!groups[category]) {
       groups[category] = {
         params: {

src/pages/blog/[category]/[year].astro

@@ -10,7 +10,7 @@ export async function getStaticPaths() {
   const blogEntries = await getCollection('blog');
 
   const filteredEntries = blogEntries.reduce((groups, entry) => {
-    const category = entry.slug.split('/')[0];
+    const category = entry.id.split('/')[0];
     const postYear = new Date(entry.data.date).getFullYear();
     if (!groups[category + postYear]) {
       groups[category + postYear] = {

src/pages/blog/[category]/[year]/[id].astro

@@ -8,9 +8,9 @@ export async function getStaticPaths() {
   const blogEntries = await getCollection('blog');
   return blogEntries.map((entry) => ({
     params: {
-      category: entry.slug.split('/')[0],
+      category: entry.id.split('/')[0],
       year: new Date(entry.data.date).getFullYear(),
-      id: entry.slug.split('/').pop().split('_').pop(),
+      id: entry.id.split('/').pop().split('_').pop(),
     },
     props: { entry },
   }));

src/pages/community.astro

@@ -422,7 +422,7 @@ import nixosFoundationLogo from '../assets/image/nixos-foundation-logo.svg';
           teams.map((team) => (
             <li class="flex grow basis-72 flex-col items-center gap-2 text-center text-white md:items-start md:text-left [&>a]:inline-block">
               <img
-                src={`/images/teams/${team.slug.split('_')[1]}.svg`}
+                src={`/images/teams/${team.id.split('_')[1]}.svg`}
                 alt={`${team.data.name} Logo`}
                 class="h-24"
               />
@@ -432,7 +432,7 @@ import nixosFoundationLogo from '../assets/image/nixos-foundation-logo.svg';
               </p>
               <Button
                 color="green"
-                href={'/community/teams/' + team.slug.split('_')[1]}
+                href={'/community/teams/' + team.id.split('_')[1]}
               >
                 Read more
               </Button>
@@ -461,9 +461,7 @@ import nixosFoundationLogo from '../assets/image/nixos-foundation-logo.svg';
         <ul class="mx-auto mt-2 list-disc pl-8 md:w-72 md:pl-10">
           {
             teams
-              .filter(
-                (team) => team.slug.split('_')[1] === 'foundation-board',
-              )[0]
+              .find((team) => team.id.split('_')[1] === 'foundation-board')
               .data.members.map((member) => (
                 <li class="mb-1">
                   {member.name}

src/pages/community/teams/[...slug].astro

@@ -9,7 +9,7 @@ import Layout from '../../../layouts/Layout.astro';
 export async function getStaticPaths() {
   const teamEntries = await getCollection('teams');
   return teamEntries.map((entry) => ({
-    params: { slug: entry.slug.split('_')[1] },
+    params: { slug: entry.id.split('_')[1] },
     props: { entry },
   }));
 }

src/pages/index.astro

@@ -20,7 +20,7 @@ posts
     return dateA > dateB ? -1 : 1;
   })
   .filter((p) => {
-    return p.slug.split('/')?.[0] === 'announcements';
+    return p.id.split('/')?.[0] === 'announcements';
   })
   .reverse();
 ---