Skip to content

fix: fix the incorrect architecture detection in PlatformDropdown for Cloudflare builds #8839

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
dario-piotrowicz merged 4 commits into from
Apr 23, 2026
+29 −8
Merged

fix: fix the incorrect architecture detection in PlatformDropdown for Cloudflare builds #8839

Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
8b78c42
fix: fix the incorrect architecture detection in PlatformDropdown for…
dario-piotrowicz Apr 23, 2026
e7a30c9
make sure that the user manually selected platform is respected
dario-piotrowicz Apr 23, 2026
377a683
remove unnecessary `platform` check
dario-piotrowicz Apr 23, 2026
a095200
use `useState` instead of `useRef`
dario-piotrowicz Apr 23, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
37 changes: 29 additions & 8 deletions apps/site/components/Downloads/Release/PlatformDropdown.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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, useState } from 'react';

import useClientContext from '#site/hooks/useClientContext';
import { ReleaseContext } from '#site/providers/releaseProvider';
Expand All @@ -16,14 +16,25 @@ 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 =
Comment thread
ovflowd marked this conversation as resolved.
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 [userHasSelectedPlatform, setUserHasSelectedPlatform] = useState(false);

useEffect(
() => {
if (architecture && bitness) {
const autoDetectedPlatform = getUserPlatform(architecture, bitness);

release.setPlatform(autoDetectedPlatform);
if (currentPlatform) {
// eslint-disable-next-line @eslint-react/set-state-in-effect
setUserHasSelectedPlatform(false);
release.setPlatform(currentPlatform);
}
},
// Only react on the change of the Client Context Architecture and Bitness
Expand All @@ -49,12 +60,19 @@ const PlatformDropdown: FC = () => {
useEffect(
() => {
if (release.os !== 'LOADING' && release.platform !== '') {
release.setPlatform(nextItem(release.platform, 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 =
Comment thread
ovflowd marked this conversation as resolved.
!userHasSelectedPlatform && currentPlatform
? currentPlatform
: release.platform;

release.setPlatform(nextItem(basePlatform, parsedPlatforms));
}
Comment thread
dario-piotrowicz marked this conversation as resolved.
},
// 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 (
Expand All @@ -64,7 +82,10 @@ 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 => {
setUserHasSelectedPlatform(true);
release.setPlatform(platform);
}}
className="min-w-28"
inline={true}
/>
Expand Down
Loading