Refactor best practices

src/lib/best-practice-topic.ts

@@ -1,5 +1,5 @@
 import type { MarkdownFileType } from './file';
-import type { BestPracticeFrontmatter } from './best-pratice';
+import type { BestPracticeFrontmatter } from './best-practice';
 
 // Generates URL from the topic file path e.g.
 // -> /src/data/best-practices/frontend-performance/content/100-use-https-everywhere
@@ -34,7 +34,7 @@ export async function getAllBestPracticeTopicFiles(): Promise<
     '/src/data/best-practices/*/content/**/*.md',
     {
       eager: true,
-    }
+    },
   );
 
   const mapping: Record<string, BestPracticeTopicFileType> = {};
@@ -63,4 +63,4 @@ export async function getAllBestPracticeTopicFiles(): Promise<
   }
 
   return mapping;
-}
+}

src/lib/best-practice.ts

@@ -48,7 +48,7 @@ export async function getBestPracticeIds() {
     '/src/data/best-practices/*/*.md',
     {
       eager: true,
-    }
+    },
   );
 
   return Object.keys(bestPracticeFiles).map(bestPracticePathToId);
@@ -64,7 +64,7 @@ export async function getAllBestPractices(): Promise<BestPracticeFileType[]> {
     '/src/data/best-practices/*/*.md',
     {
       eager: true,
-    }
+    },
   );
 
   const bestPracticeFiles = Object.values(bestPracticeFilesMap);
@@ -74,6 +74,19 @@ export async function getAllBestPractices(): Promise<BestPracticeFileType[]> {
   }));
 
   return bestPracticeItems.sort(
-    (a, b) => a.frontmatter.order - b.frontmatter.order
+    (a, b) => a.frontmatter.order - b.frontmatter.order,
   );
 }
+
+export async function getBestPracticeById(
+  id: string,
+): Promise<BestPracticeFileType> {
+  const bestPracticeFile = await import(
+    `/src/data/best-practices/${id}/${id}.md`
+  );
+
+  return {
+    ...bestPracticeFile,
+    id: bestPracticePathToId(bestPracticeFile.file),
+  };
+}

src/pages/best-practices/[bestPracticeId]/index.astro

@@ -10,7 +10,8 @@ import { UserProgressModal } from '../../../components/UserProgress/UserProgress
 import {
   type BestPracticeFileType,
   type BestPracticeFrontmatter,
-} from '../../../lib/best-pratice';
+  getBestPracticeById,
+} from '../../../lib/best-practice';
 import { generateArticleSchema } from '../../../lib/jsonld-schema';
 
 interface Params extends Record<string, string | undefined> {
@@ -22,17 +23,11 @@ interface Props {
 }
 
 const { bestPracticeId } = Astro.params as Params;
+const bestPractice = await getBestPracticeById(bestPracticeId).catch(
+  () => null,
+);
 
-let bestPractice;
+if (!bestPractice) {
-try {
-  bestPractice = await import(
-    `../../../data/best-practices/${bestPracticeId}/${bestPracticeId}.md`
-  );
-
-  if (!bestPractice) {
-    return Astro.redirect('/404');
-  }
-} catch (error) {
   return Astro.redirect('/404');
 }
 

src/pages/best-practices/index.astro

@@ -2,7 +2,7 @@
 import GridItem from '../../components/GridItem.astro';
 import SimplePageHeader from '../../components/SimplePageHeader.astro';
 import BaseLayout from '../../layouts/BaseLayout.astro';
-import { getAllBestPractices } from '../../lib/best-pratice';
+import { getAllBestPractices } from '../../lib/best-practice';
 
 const bestPractices = await getAllBestPractices();
 ---

src/pages/index.astro

@@ -4,7 +4,7 @@ import FeaturedGuides from '../components/FeaturedGuides.astro';
 import FeaturedItems from '../components/FeaturedItems/FeaturedItems.astro';
 import HeroSection from '../components/HeroSection/HeroSection.astro';
 import BaseLayout from '../layouts/BaseLayout.astro';
-import { getAllBestPractices } from '../lib/best-pratice';
+import { getAllBestPractices } from '../lib/best-practice';
 import { getAllGuides } from '../lib/guide';
 import { getRoadmapsByTag } from '../lib/roadmap';
 import { getAllVideos } from '../lib/video';

src/pages/pages.json.ts

@@ -1,4 +1,4 @@
-import { getAllBestPractices } from '../lib/best-pratice';
+import { getAllBestPractices } from '../lib/best-practice';
 import { getAllGuides } from '../lib/guide';
 import { getRoadmapsByTag } from '../lib/roadmap';
 import { getAllVideos } from '../lib/video';