From 8b78c426a5cef3f6772d618879a57da686cd16df Mon Sep 17 00:00:00 2001 From: Dario Piotrowicz Date: Thu, 23 Apr 2026 12:04:02 +0100 Subject: [PATCH 1/4] fix: fix the incorrect architecture detection in PlatformDropdown for Cloudflare builds --- .../Downloads/Release/PlatformDropdown.tsx | 18 ++++++++++++------ 1 file changed, 12 insertions(+), 6 deletions(-) diff --git a/apps/site/components/Downloads/Release/PlatformDropdown.tsx b/apps/site/components/Downloads/Release/PlatformDropdown.tsx index 3d5b4e65eb72d..ab26f0b8b23c7 100644 --- a/apps/site/components/Downloads/Release/PlatformDropdown.tsx +++ b/apps/site/components/Downloads/Release/PlatformDropdown.tsx @@ -16,14 +16,18 @@ const PlatformDropdown: FC = () => { const { architecture, bitness } = useClientContext(); const release = use(ReleaseContext); + const t = useTranslations(); + // Compute the platform during render so it's available to both `useEffect` calls below in the same cycle + // (avoiding race conditions when architecture detection and OS detection arrive in the same batch) + const currentPlatform = + architecture && bitness ? getUserPlatform(architecture, bitness) : null; + useEffect( () => { - if (architecture && bitness) { - const autoDetectedPlatform = getUserPlatform(architecture, bitness); - - release.setPlatform(autoDetectedPlatform); + if (currentPlatform) { + release.setPlatform(currentPlatform); } }, // Only react on the change of the Client Context Architecture and Bitness @@ -49,12 +53,14 @@ const PlatformDropdown: FC = () => { useEffect( () => { if (release.os !== 'LOADING' && release.platform !== '') { - release.setPlatform(nextItem(release.platform, parsedPlatforms)); + // Use the current platform if available, otherwise fall back to the current release platform + const currentTargetPlatform = currentPlatform ?? release.platform; + release.setPlatform(nextItem(currentTargetPlatform, parsedPlatforms)); } }, // We only want to react on the change of the OS and Version // eslint-disable-next-line @eslint-react/exhaustive-deps - [release.os, release.version, release.platform] + [release.os, release.version] ); return ( From e7a30c9e3b14f5d0984463f2823eb4a77c4a2960 Mon Sep 17 00:00:00 2001 From: Dario Piotrowicz Date: Thu, 23 Apr 2026 13:20:37 +0100 Subject: [PATCH 2/4] make sure that the user manually selected platform is respected --- .../Downloads/Release/PlatformDropdown.tsx | 26 +++++++++++++++---- 1 file changed, 21 insertions(+), 5 deletions(-) diff --git a/apps/site/components/Downloads/Release/PlatformDropdown.tsx b/apps/site/components/Downloads/Release/PlatformDropdown.tsx index ab26f0b8b23c7..5876e2313a390 100644 --- a/apps/site/components/Downloads/Release/PlatformDropdown.tsx +++ b/apps/site/components/Downloads/Release/PlatformDropdown.tsx @@ -2,7 +2,7 @@ import Select from '@node-core/ui-components/Common/Select'; import { useTranslations } from 'next-intl'; -import { useEffect, use, useMemo } from 'react'; +import { useEffect, use, useMemo, useRef } from 'react'; import useClientContext from '#site/hooks/useClientContext'; import { ReleaseContext } from '#site/providers/releaseProvider'; @@ -24,9 +24,15 @@ const PlatformDropdown: FC = () => { const currentPlatform = architecture && bitness ? getUserPlatform(architecture, bitness) : null; + // Track whether the user has manually selected a platform via the dropdown. + // When true the OS/version effect will respect their choice instead of + // resetting to the auto-detected value. + const userSelectedPlatformRef = useRef(false); + useEffect( () => { if (currentPlatform) { + userSelectedPlatformRef.current = false; release.setPlatform(currentPlatform); } }, @@ -53,9 +59,14 @@ const PlatformDropdown: FC = () => { useEffect( () => { if (release.os !== 'LOADING' && release.platform !== '') { - // Use the current platform if available, otherwise fall back to the current release platform - const currentTargetPlatform = currentPlatform ?? release.platform; - release.setPlatform(nextItem(currentTargetPlatform, parsedPlatforms)); + // If the user has not manually selected a platform and there is a currently + // auto-detected one then use it otherwise fallback to the current release platform + const basePlatform = + !userSelectedPlatformRef.current && currentPlatform + ? currentPlatform + : release.platform; + + release.setPlatform(nextItem(basePlatform, parsedPlatforms)); } }, // We only want to react on the change of the OS and Version @@ -70,7 +81,12 @@ const PlatformDropdown: FC = () => { loading={release.os === 'LOADING' || release.platform === ''} placeholder={t('layouts.download.dropdown.unknown')} ariaLabel={t('layouts.download.dropdown.platform')} - onChange={platform => platform && release.setPlatform(platform)} + onChange={platform => { + if (platform) { + userSelectedPlatformRef.current = true; + release.setPlatform(platform); + } + }} className="min-w-28" inline={true} /> From 377a683b39c03329a6bf77a627ff3eca90c6da71 Mon Sep 17 00:00:00 2001 From: Dario Piotrowicz Date: Thu, 23 Apr 2026 15:28:17 +0100 Subject: [PATCH 3/4] remove unnecessary `platform` check --- apps/site/components/Downloads/Release/PlatformDropdown.tsx | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/apps/site/components/Downloads/Release/PlatformDropdown.tsx b/apps/site/components/Downloads/Release/PlatformDropdown.tsx index 5876e2313a390..5c1c8bca1a114 100644 --- a/apps/site/components/Downloads/Release/PlatformDropdown.tsx +++ b/apps/site/components/Downloads/Release/PlatformDropdown.tsx @@ -82,10 +82,8 @@ const PlatformDropdown: FC = () => { placeholder={t('layouts.download.dropdown.unknown')} ariaLabel={t('layouts.download.dropdown.platform')} onChange={platform => { - if (platform) { - userSelectedPlatformRef.current = true; - release.setPlatform(platform); - } + userSelectedPlatformRef.current = true; + release.setPlatform(platform); }} className="min-w-28" inline={true} From a095200e7470f58cdef4b9b9612de5f6cb6d2909 Mon Sep 17 00:00:00 2001 From: Dario Piotrowicz Date: Thu, 23 Apr 2026 16:11:58 +0100 Subject: [PATCH 4/4] use `useState` instead of `useRef` --- .../components/Downloads/Release/PlatformDropdown.tsx | 11 ++++++----- 1 file changed, 6 insertions(+), 5 deletions(-) diff --git a/apps/site/components/Downloads/Release/PlatformDropdown.tsx b/apps/site/components/Downloads/Release/PlatformDropdown.tsx index 5c1c8bca1a114..091fc7b3b5d65 100644 --- a/apps/site/components/Downloads/Release/PlatformDropdown.tsx +++ b/apps/site/components/Downloads/Release/PlatformDropdown.tsx @@ -2,7 +2,7 @@ import Select from '@node-core/ui-components/Common/Select'; import { useTranslations } from 'next-intl'; -import { useEffect, use, useMemo, useRef } from 'react'; +import { useEffect, use, useMemo, useState } from 'react'; import useClientContext from '#site/hooks/useClientContext'; import { ReleaseContext } from '#site/providers/releaseProvider'; @@ -27,12 +27,13 @@ const PlatformDropdown: FC = () => { // Track whether the user has manually selected a platform via the dropdown. // When true the OS/version effect will respect their choice instead of // resetting to the auto-detected value. - const userSelectedPlatformRef = useRef(false); + const [userHasSelectedPlatform, setUserHasSelectedPlatform] = useState(false); useEffect( () => { if (currentPlatform) { - userSelectedPlatformRef.current = false; + // eslint-disable-next-line @eslint-react/set-state-in-effect + setUserHasSelectedPlatform(false); release.setPlatform(currentPlatform); } }, @@ -62,7 +63,7 @@ const PlatformDropdown: FC = () => { // If the user has not manually selected a platform and there is a currently // auto-detected one then use it otherwise fallback to the current release platform const basePlatform = - !userSelectedPlatformRef.current && currentPlatform + !userHasSelectedPlatform && currentPlatform ? currentPlatform : release.platform; @@ -82,7 +83,7 @@ const PlatformDropdown: FC = () => { placeholder={t('layouts.download.dropdown.unknown')} ariaLabel={t('layouts.download.dropdown.platform')} onChange={platform => { - userSelectedPlatformRef.current = true; + setUserHasSelectedPlatform(true); release.setPlatform(platform); }} className="min-w-28"