prime8dev

commit 337a5a0c52fca316f653031772783508d8003313
parent fb5b8f6959e7c69a63b827d10339147e92298b4c
Author: Damian Myrda <damian@prime8.dev>
Date:   Thu, 22 Jan 2026 15:15:16 -0600

feat: add current job info to about page with link to experience

Diffstat:
M
web/src/constants/external/wakatime.ts
 | 
3
++-
M
web/src/layouts/components/Footer.astro
 | 
4
+++-
M
web/src/layouts/tabs/About.astro
 | 
64
+++++++++++++++++++++++++++++++++++++++++++++++++++++-----------

3 files changed, 58 insertions(+), 13 deletions(-)
diff --git a/web/src/constants/external/wakatime.ts b/web/src/constants/external/wakatime.ts
@@ -1,2 +1,3 @@
-export const WAKATIME_API_BASE = "https://wakatime.com/api/v1";
+export const WAKATIME_BASE_URL = "https://wakatime.com";
+export const WAKATIME_API_BASE = `${WAKATIME_BASE_URL}/api/v1`;
 export const WAKATIME_API_KEY = import.meta.env.WAKATIME_API_KEY;
diff --git a/web/src/layouts/components/Footer.astro b/web/src/layouts/components/Footer.astro
@@ -1,4 +1,6 @@
 ---
+import { WAKATIME_BASE_URL } from "../../constants/external/wakatime";
+import { about } from "../../config";
 import type { WakaTimeData } from "../../external/wakatime";
 
 interface Props {
@@ -15,7 +17,7 @@ const { wakaTimeData } = Astro.props;
     wakaTimeData?.weeklyStats && (
       <a
         class="wakatime"
-        href="https://wakatime.com/@moncheeta"
+        href={`${WAKATIME_BASE_URL}/@${about.handle}`}
         target="_blank"
         rel="noopener noreferrer"
       >
diff --git a/web/src/layouts/tabs/About.astro b/web/src/layouts/tabs/About.astro
@@ -1,6 +1,7 @@
 ---
 import type { WakaTimeData } from "../../external/wakatime";
 import { about, contact } from "../../config";
+import { currentJob } from "../../config/experience";
 import { getTagClass } from "../../utils/tags";
 
 interface Props {
@@ -51,17 +52,35 @@ const { wakaTimeData } = Astro.props;
       </div>
       <div class="section">
         <div class="box-title">─ Info ─</div>
-        <div class="info-row">
-          <span class="label">Location</span>
-          {about.location}
-        </div>
-        <div class="info-row">
-          <span class="label">School</span>
-          {about.school}
-        </div>
-        <div class="info-row">
-          <span class="label">Graduating</span>
-          {about.graduating}
+        <div class="info-columns">
+          <div class="info-column">
+            <div class="info-row">
+              <span class="label">Location</span>
+              {about.location}
+            </div>
+            <div class="info-row">
+              <span class="label">School</span>
+              {about.school}
+            </div>
+            <div class="info-row">
+              <span class="label">Graduating</span>
+              {about.graduating}
+            </div>
+          </div>
+          {currentJob && (
+            <div class="info-column">
+              <div class="info-row">
+                <span class="label">Company</span>
+                <a href={`#experience/${currentJob.id}`}>
+                  {currentJob.company}
+                </a>
+              </div>
+              <div class="info-row">
+                <span class="label">Position</span>
+                {currentJob.role}
+              </div>
+            </div>
+          )}
         </div>
       </div>
       <div class="section">
@@ -219,6 +238,15 @@ const { wakaTimeData } = Astro.props;
     font-style: italic;
   }
 
+  .info-columns {
+    display: flex;
+    gap: 48px;
+  }
+
+  .info-column {
+    flex: 1;
+  }
+
   .info-row {
     display: flex;
     font-size: 13px;
@@ -231,6 +259,15 @@ const { wakaTimeData } = Astro.props;
     flex-shrink: 0;
   }
 
+  .info-row a {
+    color: var(--light-blue);
+    text-decoration: none;
+  }
+
+  .info-row a:hover {
+    opacity: 0.8;
+  }
+
   .tags {
     display: flex;
     flex-wrap: wrap;
@@ -348,6 +385,11 @@ const { wakaTimeData } = Astro.props;
       font-size: 12px;
     }
 
+    .info-columns {
+      flex-direction: column;
+      gap: 12px;
+    }
+
     .tags {
       gap: 4px;
     }