Fix website deployment

Author: ardatan

package.json

@@ -86,6 +86,8 @@
       "micromatch": "4.0.8",
       "node-forge": "1.3.3",
       "dompurify": "3.3.1",
+      "jws": "4.0.1",
+      "mdast-util-to-hast": "13.2.1",
       "webpack": "5.103.0",
       "axios": "1.13.2",
       "undici": "5.29.0",

pnpm-lock.yaml

@@ -0,0 +1 @@
+out/

website/.gitignore

@@ -1,5 +1,6 @@
 /// <reference types="next" />
 /// <reference types="next/image-types/global" />
+/// <reference path="./.next/types/routes.d.ts" />
 
 // NOTE: This file should not be edited
 // see https://nextjs.org/docs/pages/api-reference/config/typescript for more information.

website/next-env.d.ts

@@ -2,8 +2,9 @@ import { useMemo } from 'react';
 import { StaticImageData } from 'next/image';
 import { compareDesc } from 'date-fns';
 import { useData } from 'nextra/hooks';
+import { fetchPackageInfoCachedAndRetried } from '@/lib/fetch-package-info-cached-and-retried';
 import { ALL_TAGS, PLUGINS } from '@/lib/plugins';
-import { cn, fetchPackageInfo, MarketplaceSearch } from '@theguild/components';
+import { cn, MarketplaceSearch } from '@theguild/components';
 
 type Plugin = {
   title: string;
@@ -18,43 +19,40 @@ type Plugin = {
   className?: string;
 };
 
-function retry<T>(fn: () => Promise<T>, retriesLeft = 3, interval = 1000): Promise<T> {
-  return fn().catch(error => {
-    if (retriesLeft === 1) {
-      throw error;
-    }
-    return new Promise<T>(resolve => {
-      setTimeout(() => {
-        resolve(retry(fn, retriesLeft - 1, interval));
-      }, interval);
-    });
-  });
-}
-
 export const getStaticProps = async () => {
-  const plugins: Plugin[] = [];
-  await Promise.all(
-    PLUGINS.map(({ identifier, npmPackage, title, icon, tags, githubReadme, className = '' }) =>
-      retry(() => fetchPackageInfo(npmPackage, githubReadme))
-        .then(({ readme, createdAt, updatedAt, description, weeklyNPMDownloads = 0 }) => {
-          plugins.push({
-            title,
-            readme,
-            createdAt,
-            updatedAt,
-            description,
-            linkHref: `/plugins/${identifier}`,
-            weeklyNPMDownloads,
-            icon,
-            tags,
-            className,
-          });
-        })
-        .catch(err => {
-          console.warn(`failed to fetch package info for ${npmPackage}`, err);
-        }),
+  const plugins: Plugin[] = await Promise.all(
+    PLUGINS.map(
+      async ({ identifier, npmPackage, title, icon, tags, githubReadme, className = '' }) => {
+        const {
+          readme,
+          createdAt,
+          updatedAt,
+          description,
+          weeklyNPMDownloads = 0,
+        } = await fetchPackageInfoCachedAndRetried(npmPackage, githubReadme);
+        const actualReadme = githubReadme ? 'TODO' : readme;
+
+        return {
+          title,
+          readme: actualReadme,
+          createdAt,
+          updatedAt,
+          description,
+          linkHref: `/plugins/${identifier}`,
+          weeklyNPMDownloads,
+          icon,
+          tags,
+          className,
+        };
+      },
     ),
-  );
+  ).catch(err => {
+    console.error('failed to fetch plugins', err);
+    if (process.env.NODE_ENV === 'development') {
+      return []; // flakily fails on HMR
+    }
+    throw err;
+  });
 
   return {
     props: {

website/src/components/plugins-page.tsx

@@ -0,0 +1,48 @@
+import { fetchPackageInfo } from '@theguild/components';
+
+const cache = new Map<string, Awaited<ReturnType<typeof fetchPackageInfo>>>();
+
+export async function fetchPackageInfoCachedAndRetried(
+  packageName: string,
+  githubReadme?: { repo: string; path: string },
+  retriesLeft = 3,
+  interval = 1000,
+): Promise<Awaited<ReturnType<typeof fetchPackageInfo>>> {
+  const cacheKey = githubReadme
+    ? `${packageName}::${githubReadme.repo}::${githubReadme.path}`
+    : packageName;
+  if (cache.has(cacheKey)) {
+    return Promise.resolve(cache.get(cacheKey)!);
+  }
+  try {
+    const result = await retry(
+      () => fetchPackageInfo(packageName, githubReadme),
+      retriesLeft,
+      interval,
+    );
+    cache.set(cacheKey, result);
+    return result;
+  } catch (error) {
+    console.warn(`failed to fetch package info for ${packageName}`, error);
+    return {
+      readme: 'Readme not available',
+      createdAt: new Date().toISOString(),
+      updatedAt: new Date().toISOString(),
+      description: 'Description not available',
+      weeklyNPMDownloads: 0,
+    };
+  }
+}
+
+function retry<T>(fn: () => Promise<T>, retriesLeft = 3, interval = 1000): Promise<T> {
+  return fn().catch(error => {
+    if (retriesLeft === 1) {
+      throw error;
+    }
+    return new Promise<T>(resolve => {
+      setTimeout(() => {
+        resolve(retry(fn, retriesLeft - 1, interval));
+      }, interval);
+    });
+  });
+}

website/src/lib/fetch-package-info-cached-and-retried.ts

@@ -2,6 +2,7 @@ import { GetStaticPaths, GetStaticProps } from 'next';
 import { format } from 'date-fns';
 import { buildDynamicMDX, buildDynamicMeta } from 'nextra/remote';
 import { fetchPackageInfo } from '@theguild/components';
+import { fetchPackageInfoCachedAndRetried } from './fetch-package-info-cached-and-retried';
 import { PLUGINS } from './plugins';
 
 export const getStaticPaths: GetStaticPaths = () => ({
@@ -19,7 +20,7 @@ export const getStaticProps: GetStaticProps = async ctx => {
     throw new Error(`Unknown "${pluginPath}" plugin identifier`);
   }
   const { npmPackage, githubReadme, title } = plugin;
-  const { readme, updatedAt } = await fetchPackageInfo(npmPackage, githubReadme);
+  const { readme, updatedAt } = await fetchPackageInfoCachedAndRetried(npmPackage, githubReadme);
 
   const mdx = await buildDynamicMDX(
     `