Merge pull request #1 from nelsonr-lopez/feat/sorted-dates

Feat/sorted dates

Author: coderdiaz

.prettierrc

@@ -0,0 +1,3 @@
+{
+  "singleQuote": true
+}

src/lib/utils.ts

@@ -1,4 +1,5 @@
 import { DEFAULT_CONFIGURATION } from './constants';
+import type { CollectionEntry } from 'astro:content';
 
 export const formatDate = (date: Date) => {
   const formatter = new Intl.DateTimeFormat('en-US', {
@@ -7,16 +8,29 @@ export const formatDate = (date: Date) => {
     day: 'numeric',
     timeZone: 'UTC', // Default to UTC to prevent timezone issues
   });
-  
+
   // Ensure we're parsing the date correctly
   return formatter.format(new Date(date));
-}
+};
 
-export const generateAbsoluteUrl = (path: string) => DEFAULT_CONFIGURATION.baseUrl.concat(path);
+export const generateAbsoluteUrl = (path: string) =>
+  DEFAULT_CONFIGURATION.baseUrl.concat(path);
 
 export const isDevelopment = () => import.meta.env.MODE === 'development';
 
 export const includeDraft = (draft: boolean) => {
   if (isDevelopment()) return true;
   return draft !== true;
-};
+};
+
+export const sortJobsByDate = (jobs: CollectionEntry<'jobs'>[]) => {
+  // Convert "Now" to current year, otherwise returns the year as is
+  const getEndYear = (job: CollectionEntry<'jobs'>) =>
+    job.data.to === 'Now' ? new Date().getFullYear() : job.data.to;
+
+  return jobs.sort((current, next) => {
+    // Compare end years first, then fall back to start years if end years are equal
+    const [currentEnd, nextEnd] = [getEndYear(current), getEndYear(next)];
+    return nextEnd - currentEnd || next.data.from - current.data.from;
+  });
+};

src/pages/index.astro

@@ -6,12 +6,14 @@ import Author from '@/components/ui/Author.astro';
 import { DEFAULT_CONFIGURATION } from '@/lib/constants';
 import WorkExperience from '@/components/ui/WorkExperience.astro';
 import Talk from '@/components/ui/Talk.astro';
+import { sortJobsByDate } from '@/lib/utils';
 
 const entry = await getEntry('pages', 'homepage');
 const { Content } = await render(entry);
 
 const links = await getCollection('links');
 const jobs = await getCollection('jobs');
+const sortedJobs = sortJobsByDate(jobs);
 const talks = await getCollection('talks');
 ---
 
@@ -33,47 +35,66 @@ const talks = await getCollection('talks');
       </div>
     </Container>
   </section>
-  { links.length > 0 && (
-    <section class="py-8">
-      <Container>
-        <div class="flex flex-col gap-5">
-          <span class="text-headings">Contact</span>
-          <ul class="flex flex-col gap-3">
-            {links.map((link) => (
-              <li class="py-0.5">
-                <div class="flex items-center gap-5">
-                  <span class="min-w-28 text-muted-foreground">{link.data.label}</span>
-                  <a class="text-headings font-medium" rel="noopener noreferrer" target="_blank" href={link.data.url}>{link.data.name}</a>
-                </div>
-              </li>
-            ))}
-          </ul>
-        </div>
-      </Container>
-    </section>
-  )}
-  { jobs.length > 0 && (
-    <section class="py-6">
-      <Container>
-        <div class="flex flex-col gap-5">
-          <span class="text-headings">Work Experience</span>
-        <ul class="flex flex-col gap-8">
-          {jobs.map((job) => <WorkExperience entry={job} />)}
-        </ul>
-      </div>
-      </Container>
-    </section>
-  )}
-  {talks.length > 0 && (
-    <section class="py-6">
-      <Container>
-        <div class="flex flex-col gap-5">
-          <span class="text-headings">Speaking</span>
-        <ul class="flex flex-col gap-8">
-          {talks.map((talk) => <Talk entry={talk} />)}
-        </ul>
-      </div>
-      </Container>
-    </section>
-  )}
-</BaseLayout>
+  {
+    links.length > 0 && (
+      <section class="py-8">
+        <Container>
+          <div class="flex flex-col gap-5">
+            <span class="text-headings">Contact</span>
+            <ul class="flex flex-col gap-3">
+              {links.map((link) => (
+                <li class="py-0.5">
+                  <div class="flex items-center gap-5">
+                    <span class="min-w-28 text-muted-foreground">
+                      {link.data.label}
+                    </span>
+                    <a
+                      class="text-headings font-medium"
+                      rel="noopener noreferrer"
+                      target="_blank"
+                      href={link.data.url}
+                    >
+                      {link.data.name}
+                    </a>
+                  </div>
+                </li>
+              ))}
+            </ul>
+          </div>
+        </Container>
+      </section>
+    )
+  }
+  {
+    sortedJobs.length > 0 && (
+      <section class="py-6">
+        <Container>
+          <div class="flex flex-col gap-5">
+            <span class="text-headings">Work Experience</span>
+            <ul class="flex flex-col gap-8">
+              {sortedJobs.map((job) => (
+                <WorkExperience entry={job} />
+              ))}
+            </ul>
+          </div>
+        </Container>
+      </section>
+    )
+  }
+  {
+    talks.length > 0 && (
+      <section class="py-6">
+        <Container>
+          <div class="flex flex-col gap-5">
+            <span class="text-headings">Speaking</span>
+            <ul class="flex flex-col gap-8">
+              {talks.map((talk) => (
+                <Talk entry={talk} />
+              ))}
+            </ul>
+          </div>
+        </Container>
+      </section>
+    )
+  }
+</BaseLayout>