defer stats in loader (#134)

also fix types for stats
remix-run · Nov 19, 2024 · 6427199 · 6427199
1 parent 740e01e
commit 6427199
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 31 deletions.
diff --git a/app/modules/stats/index.tsx b/app/modules/stats/index.tsx
@@ -43,34 +43,32 @@ global.statCountsCache ??= new LRUCache<string, StatCounts>({
   },
 });
 
-export async function getStats(): Promise<Stats[] | undefined> {
+export async function getStats(): Promise<Stats[]> {
   let cacheKey = "ONE_STATS_KEY_TO_RULE_THEM_ALL";
   let statCounts = await statCountsCache.fetch(cacheKey);
 
-  return statCounts
-    ? [
-        {
-          count: statCounts.npmDownloads,
-          label: "Downloads on npm",
-          svgId: "stat-download",
-        },
-        {
-          count: statCounts.githubContributors,
-          label: "Contributors on GitHub",
-          svgId: "stat-users",
-        },
-        {
-          count: statCounts.githubStars,
-          label: "Stars on GitHub",
-          svgId: "stat-star",
-        },
-        {
-          count: statCounts.githubDependents,
-          label: "Dependents on GitHub",
-          svgId: "stat-box",
-        },
-      ]
-    : undefined;
+  return [
+    {
+      count: statCounts.npmDownloads,
+      label: "Downloads on npm",
+      svgId: "stat-download",
+    },
+    {
+      count: statCounts.githubContributors,
+      label: "Contributors on GitHub",
+      svgId: "stat-users",
+    },
+    {
+      count: statCounts.githubStars,
+      label: "Stars on GitHub",
+      svgId: "stat-star",
+    },
+    {
+      count: statCounts.githubDependents,
+      label: "Dependents on GitHub",
+      svgId: "stat-box",
+    },
+  ];
 }
 
 /**

diff --git a/app/pages/splash.tsx b/app/pages/splash.tsx
@@ -7,11 +7,7 @@ import { getStats } from "~/modules/stats";
 import { getRootMatchData } from "~/ui/meta";
 
 export let loader = async () => {
-  const stats = await getStats();
-  // replace with something better, just fixing types
-  if (!stats) {
-    throw new Error("Failed to load stats");
-  }
+  const stats = getStats();
   return { stats };
 };
 
@@ -153,7 +149,6 @@ export default function Home() {
           <Await resolve={stats} errorElement={null}>
             {(stats) => (
               <ul className="mt-8 grid grid-cols-1 gap-8 md:grid md:grid-cols-2">
-                {/* @ts-expect-error -- these types didn't make it into RR7, this needs to be fixed */}
                 {stats.map(({ svgId, count, label }) => (
                   <li key={svgId} className="flex gap-4">
                     <svg