refactor: update best practices to support any file extension

Signed-off-by: Adam Setch <[email protected]>

Author: setchy

src/memes/memes.ts

@@ -3,29 +3,34 @@ import type { BestPractice } from '~/types';
 export const bestPractices: BestPractice[] = [
   {
     title: 'Before Coding',
-    meme: 'distracted-boyfriend.jpg',
+    meme: 'distracted-boyfriend',
+    ext: 'jpg',
     caption:
       'Developer looking at "New Feature" while ignoring "Existing Bugs"',
   },
   {
     title: 'Pull Request Feedback',
-    meme: 'drake-hotline-bling.jpg',
+    meme: 'drake-hotline-bling',
+    ext: 'jpg',
     caption:
       'Drake rejecting "Messy Code" and approving "Clean, Refactored Code"',
   },
   {
     title: 'Daily Stand-up',
-    meme: 'hide-the-pain-harold.jpg',
+    meme: 'hide-the-pain-harold',
+    ext: 'jpg',
     caption: '"Finally fixed that bug!"',
   },
   {
     title: 'Retrospective',
-    meme: 'sus-fry.jpg',
+    meme: 'sus-fry',
+    ext: 'jpg',
     caption: '"Carrying over stories for the third sprint in a row"',
   },
   {
     title: 'Sprint Review',
-    meme: 'one-does-not-simply.jpg',
+    meme: 'one-does-not-simply',
+    ext: 'jpg',
     caption: 'Discussing "what is a story point" for the tenth time this month',
   },
 ];

src/sections/best-practices.astro

@@ -19,7 +19,7 @@ import { bestPractices } from "~/memes/memes";
             class="w-full h-64 object-cover rounded-lg shadow-lg mb-2"
             width="500"
             height="400"
-            src={import(`../memes/${item.meme}`)}
+            src={import(`../memes/${item.meme}.${item.ext}`)}
             alt={item.title}
           />
           <div class="text-xs italic mt-1">{item.caption}</div>

src/types.ts

@@ -13,6 +13,7 @@ export interface IconDetails {
 export interface BestPractice {
   title: string;
   meme: string;
+  ext: 'jpg' | 'png' | 'svg';
   caption: string;
 }