feat(projects): add github source link support to project listing and detail pages

Author: Aarushb

src/pages/projects/[slug].astro

@@ -3,9 +3,7 @@ import Layout from '@layouts/Default.astro';
 import data from '@data/projects.json';
 
 export async function getStaticPaths() {
-  // Extract all years (keys) from the data object
   const years = Object.keys(data);
-  // Flatten all projects from all years into a single array
   const allProjects = years.flatMap(year => data[year]);
   
   return allProjects.map(project => ({
@@ -16,6 +14,7 @@ export async function getStaticPaths() {
 
 const { project } = Astro.props;
 
+// Robust MDX loading
 const allProjectMdxFiles = import.meta.glob('/src/data/projects/*.mdx', { eager: true });
 const matchingPath = Object.keys(allProjectMdxFiles)
   .find(path => path.endsWith(`${project.slug}.mdx`));
@@ -31,6 +30,17 @@ const { Content } = mdxModule;
 <Layout title={`Project: ${project.title}`}>
   <section class="section">
     <div class="container content">
+      
+        <!-- GitHub Button (Only shows if link exists) -->
+        {project.githubLink && (
+            <div class="buttons mb-5">
+                <a href={project.githubLink} target="_blank" rel="noopener noreferrer" class="button is-dark">
+                    <span class="icon"><i class="fa-brands fa-github"></i></span>
+                    <span>View Source Code on GitHub</span>
+                </a>
+            </div>
+        )}
+
       <Content />
 
       {project.leads && project.leads.length > 0 && (

src/pages/projects/index.astro

@@ -29,12 +29,20 @@ const archiveYears = years.slice(1);
                 <h2 class="title">{project.emoji} {project.title}</h2>
                 <h4 class="subtitle">{project.name}</h4>
                 <p>{project.desc}</p>
-                <a href={`/projects/${project.slug}`} class="button is-info">
-                  <span>View Project Details</span>
-                  <span class="icon is-small">
-                    <i class="fa-solid fa-arrow-right"></i>
-                  </span>
-                </a>
+                
+                <div class="buttons">
+                    <a href={`/projects/${project.slug}`} class="button is-info">
+                        <span>View Project Details</span>
+                        <span class="icon is-small"><i class="fa-solid fa-arrow-right"></i></span>
+                    </a>
+                    {project.githubLink && (
+                        <a href={project.githubLink} target="_blank" rel="noopener noreferrer" class="button is-dark is-outlined">
+                            <span class="icon"><i class="fa-brands fa-github"></i></span>
+                            <span>Source Code</span>
+                        </a>
+                    )}
+                </div>
+
               </div>
             </div>
           </article>
@@ -57,9 +65,19 @@ const archiveYears = years.slice(1);
                                         <div class="content">
                                             <h3 class="title is-5">{project.emoji} {project.title}</h3>
                                             <p>{project.desc}</p>
-                                            <a href={`/projects/${project.slug}`} class="button is-small is-info is-outlined">
-                                                <span>View Project</span>
-                                            </a>
+                                            
+                                            <div class="buttons is-small">
+                                                <a href={`/projects/${project.slug}`} class="button is-small is-info is-outlined">
+                                                    <span>View Project</span>
+                                                </a>
+                                                {project.githubLink && (
+                                                    <a href={project.githubLink} target="_blank" rel="noopener noreferrer" class="button is-small is-dark is-outlined">
+                                                        <span class="icon"><i class="fa-brands fa-github"></i></span>
+                                                        <span>Source</span>
+                                                    </a>
+                                                )}
+                                            </div>
+
                                         </div>
                                     </div>
                                 </article>