fix(nextjs): fix static exports (#8439)

* fix(static): fix static rendering

* fixup!

* fixup! use async anyway

* fixup! async caching

* fixup!

* Update .github/workflows/build.yml

Co-authored-by: Claudio Wunder <[email protected]>
Signed-off-by: Aviv Keller <[email protected]>

* fixup!

---------

Signed-off-by: Aviv Keller <[email protected]>
Co-authored-by: Claudio Wunder <[email protected]>

Author: avivkeller

.github/workflows/build.yml

@@ -67,8 +67,6 @@ jobs:
           # this should be a last resort in case by any chances the build memory gets too high
           # but in general this should never happen
           NODE_OPTIONS: '--max_old_space_size=4096'
-          # We want to ensure that static exports for all locales do not occur on `pull_request` events
-          NEXT_PUBLIC_STATIC_EXPORT_LOCALE: ${{ github.event_name == 'push' }}
           # See https://github.com/vercel/next.js/pull/81318
           TURBOPACK_STATS: ${{ matrix.os == 'ubuntu-latest' }}
 
@@ -77,3 +75,14 @@ jobs:
         with:
           name: webpack-stats
           path: apps/site/.next/server/webpack-stats.json
+
+      - name: Build Next.js (Static Export)
+        # We want to generate a static build, as it is a requirement of our website.
+        run: node_modules/.bin/turbo deploy ${{ env.TURBO_ARGS }}
+        env:
+          # We want to ensure we have enough RAM allocated to the Node.js process
+          # this should be a last resort in case by any chances the build memory gets too high
+          # but in general this should never happen
+          NODE_OPTIONS: '--max_old_space_size=4096'
+          # We want to ensure that static exports for all locales do not occur on `pull_request` events
+          NEXT_PUBLIC_STATIC_EXPORT_LOCALE: ${{ github.event_name == 'push' }}

apps/site/app/[locale]/not-found.tsx

@@ -1,5 +1,3 @@
-'use server';
-
 import { getTranslations } from 'next-intl/server';
 
 import Button from '#site/components/Common/Button';

apps/site/components/withDownloadSection.tsx

@@ -22,19 +22,21 @@ const WithDownloadSection: FC<WithDownloadSectionProps> = async ({
 }) => {
   const locale = await getLocale();
 
-  const snippets = await provideDownloadSnippets(locale);
+  const snippets = await provideDownloadSnippets();
+
+  const localeSnippets = snippets.get(locale) ?? [];
 
   // By default the translated languages do not contain all the download snippets
   // Hence we always merge any translated snippet with the fallbacks for missing snippets
-  const fallbackSnippets = await provideDownloadSnippets(defaultLocale.code);
+  const fallbackSnippets = snippets.get(defaultLocale.code) ?? [];
 
   const { pathname } = getClientContext();
 
   // Some available translations do not have download snippets translated or have them partially translated
   // This aims to merge the available translated snippets with the fallback snippets
   const memoizedSnippets = fallbackSnippets
-    .filter(snippet => !snippets.some(s => s.name === snippet.name))
-    .concat(snippets);
+    .filter(snippet => !localeSnippets.some(s => s.name === snippet.name))
+    .concat(localeSnippets);
 
   // Decides which initial release to use based on the current pathname
   const initialRelease = pathname.endsWith('/current')

apps/site/components/withNodeRelease.tsx

@@ -1,5 +1,3 @@
-'use server';
-
 import provideReleaseData from '#site/next-data/providers/releaseData';
 
 import type { NodeRelease, NodeReleaseStatus } from '#site/types';

apps/site/components/withReleaseSelect.tsx

@@ -1,5 +1,3 @@
-'use server';
-
 import StatelessSelect from '@node-core/ui-components/Common/Select/StatelessSelect';
 
 import Link from '#site/components/Link';

apps/site/components/withSupporters.tsx

@@ -1,5 +1,3 @@
-'use server';
-
 import provideSupporters from '#site/next-data/providers/supportersData';
 
 import type { FC, PropsWithChildren } from 'react';

apps/site/next-data/generators/majorNodeReleases.mjs

@@ -2,12 +2,12 @@
 
 import nodevu from '@nodevu/core';
 
-const nodevuData = await nodevu({ fetch });
-
 /**
  * Filters Node.js release data to return only major releases with documented support.
  */
 export default async function getMajorNodeReleases() {
+  const nodevuData = await nodevu({ fetch });
+
   return Object.entries(nodevuData).filter(([version, { support }]) => {
     // Filter out those without documented support
     // Basically those not in schedule.json

apps/site/next-data/providers/downloadSnippets.ts

@@ -1,15 +1,5 @@
-'use cache';
+import { cache } from 'react';
 
 import generateDownloadSnippets from '#site/next-data/generators/downloadSnippets.mjs';
 
-const provideDownloadSnippets = async (language: string) => {
-  const downloadSnippets = await generateDownloadSnippets();
-
-  if (downloadSnippets.has(language)) {
-    return downloadSnippets.get(language)!;
-  }
-
-  return [];
-};
-
-export default provideDownloadSnippets;
+export default cache(generateDownloadSnippets);

apps/site/next-data/providers/releaseData.ts

@@ -1,5 +1,5 @@
-'use cache';
+import { cache } from 'react';
 
-import provideReleaseData from '#site/next-data/generators/releaseData.mjs';
+import generateReleaseData from '#site/next-data/generators/releaseData.mjs';
 
-export default provideReleaseData;
+export default cache(generateReleaseData);

apps/site/next-data/providers/releaseVersions.ts

@@ -1,5 +1,5 @@
-'use cache';
+import { cache } from 'react';
 
-import provideReleaseVersions from '#site/next-data/generators/releaseVersions.mjs';
+import generateReleaseVersions from '#site/next-data/generators/releaseVersions.mjs';
 
-export default provideReleaseVersions;
+export default cache(generateReleaseVersions);