Fix tracks loading script

flake.lock

@@ -1,45 +1,12 @@
 {
   "nodes": {
-    "home-manager": {
-      "inputs": {
-        "nixpkgs": "nixpkgs"
-      },
-      "locked": {
-        "lastModified": 1763228015,
-        "narHash": "sha256-1rYieMVUyZ3kK/cBIr8mOusxrOEJ1/+2MsOg0oJ7b3A=",
-        "owner": "nix-community",
-        "repo": "home-manager",
-        "rev": "96156a9e86281c4bfc451236bc2ddfe4317e6f39",
-        "type": "github"
-      },
-      "original": {
-        "id": "home-manager",
-        "type": "indirect"
-      }
-    },
     "nixpkgs": {
       "locked": {
-        "lastModified": 1762111121,
+        "lastModified": 1766070988,
-        "narHash": "sha256-4vhDuZ7OZaZmKKrnDpxLZZpGIJvAeMtK6FKLJYUtAdw=",
+        "narHash": "sha256-G/WVghka6c4bAzMhTwT2vjLccg/awmHkdKSd2JrycLc=",
-        "owner": "NixOS",
-        "repo": "nixpkgs",
-        "rev": "b3d51a0365f6695e7dd5cdf3e180604530ed33b4",
-        "type": "github"
-      },
-      "original": {
-        "owner": "NixOS",
-        "ref": "nixos-unstable",
-        "repo": "nixpkgs",
-        "type": "github"
-      }
-    },
-    "nixpkgs_2": {
-      "locked": {
-        "lastModified": 1762977756,
-        "narHash": "sha256-4PqRErxfe+2toFJFgcRKZ0UI9NSIOJa+7RXVtBhy4KE=",
         "owner": "nixos",
         "repo": "nixpkgs",
-        "rev": "c5ae371f1a6a7fd27823bc500d9390b38c05fa55",
+        "rev": "c6245e83d836d0433170a16eb185cefe0572f8b8",
         "type": "github"
       },
       "original": {
@@ -51,8 +18,7 @@
     },
     "root": {
       "inputs": {
-        "home-manager": "home-manager",
+        "nixpkgs": "nixpkgs"
-        "nixpkgs": "nixpkgs_2"
       }
     }
   },

flake.nix

@@ -4,7 +4,7 @@
   inputs.nixpkgs.url = "github:nixos/nixpkgs/nixos-unstable";
 
   outputs =
-    inputs@{ nixpkgs, home-manager, ... }:
+    inputs@{ nixpkgs, ... }:
     let
       systems = [
         "x86_64-linux"

src/layouts/PageLayout.astro

@@ -22,7 +22,7 @@ const { title, description, pubDate, modDate, slug } = Astro.props;
     <Header {title} {pubDate} {modDate} {slug} />
     <main class="flex-1 bg-white dark:bg-neutral-800">
       <div
-        class={`relative prose prose-neutral dark:prose-invert mx-auto px-4 ${pubDate ? "pt-0" : "pt-8"} pb-16 ${Astro.originPathname === "/" ? "prose-headings:scroll-mt-12" : "prose-headings:scroll-mt-24 lg:prose-headings:scroll-mt-16"} prose-table:text-base prose-h1:font-bold prose-pre:!bg-neutral-700 prose-a:font-normal prose-a:not-in-prose-headings:text-blue-800 prose-a:not-in-prose-headings:dark:text-blue-300 prose-a:hover:no-underline prose-a:active:bg-neutral-200 prose-a:active:dark:bg-neutral-700 prose-a:in-prose-headings:font-bold prose-a:in-prose-headings:decoration-2 prose-a:in-prose-headings:no-underline prose-a:in-prose-headings:hover:underline`}
+        class={`relative prose prose-neutral dark:prose-invert mx-auto px-4 ${pubDate ? "pt-0" : "pt-8"} pb-16 ${Astro.originPathname === "/" ? "prose-headings:scroll-mt-12" : "prose-headings:scroll-mt-24 lg:prose-headings:scroll-mt-16"} prose-table:text-base prose-h1:font-bold prose-pre:!bg-neutral-700 prose-a:font-normal prose-table:m-0 prose-a:not-in-prose-headings:text-blue-800 prose-a:not-in-prose-headings:dark:text-blue-300 prose-a:hover:no-underline prose-a:active:bg-neutral-200 prose-a:active:dark:bg-neutral-700 prose-a:in-prose-headings:font-bold prose-a:in-prose-headings:decoration-2 prose-a:in-prose-headings:no-underline prose-a:in-prose-headings:hover:underline`}
       >
         <slot />
       </div>

src/pages/tracks.astro

@@ -31,6 +31,14 @@ const tracks = await getCollection("tracks");
 
 <script is:inline define:vars={{ tracks }}>
   const loadThumbnails = async () => {
+    const tracksContainer = document.getElementById("tracks-container");
+    const loadingIndicator = document.getElementById("loading-indicator");
+    const percentageEl = document.getElementById("loading-percentage");
+
+    if (!tracksContainer || !loadingIndicator || !percentageEl) {
+      return;
+    }
+
     const thumbnailUrls = tracks.map(({ data: { youtubeLink } }) => {
       const videoId = youtubeLink.split("v=")[1];
       return `https://img.youtube.com/vi/${videoId}/maxresdefault.jpg`;
@@ -38,7 +46,6 @@ const tracks = await getCollection("tracks");
 
     let loadedCount = 0;
     const total = thumbnailUrls.length;
-    const percentageEl = document.getElementById("loading-percentage");
 
     const preloadImages = thumbnailUrls.map((url) => {
       return new Promise((resolve) => {
@@ -58,8 +65,8 @@ const tracks = await getCollection("tracks");
 
     await Promise.all(preloadImages);
 
-    document.getElementById("loading-indicator").classList.add("hidden");
+    loadingIndicator.classList.add("hidden");
-    document.getElementById("tracks-container").classList.remove("hidden");
+    tracksContainer.classList.remove("hidden");
   };
 
   loadThumbnails();