Skip to content

Commit ec17ab7

Browse files
g-francescag-francesca
authored
Merge branch 'nodejs:main' into main
2 parents 3a209c7 + cf23e7c commit ec17ab7

File tree

47 files changed

+855
-328
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

47 files changed

+855
-328
lines changed

‎apps/site/components/Downloads/Release/ReleaseCodeBox.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,21 +11,21 @@ import CodeBox from '#site/components/Common/CodeBox';
1111
import LinkWithArrow from '#site/components/Common/LinkWithArrow';
1212
import Link from '#site/components/Link';
1313
import WithReleaseAlertBox from '#site/components/withReleaseAlertBox';
14-
import { createSval } from '#site/next.jsx.compiler.mjs';
1514
import {
1615
ReleaseContext,
1716
ReleasesContext,
1817
} from '#site/providers/releaseProvider';
1918
import type { DownloadSnippet } from '#site/types/download';
2019
import type { ReleaseContextType } from '#site/types/release';
2120
import { INSTALL_METHODS } from '#site/util/download';
21+
import createInterpreter from '#site/util/interpreter';
2222

2323
// Creates a minimal JavaScript interpreter for parsing the JavaScript code from the snippets
2424
// Note: that the code runs inside a sandboxed environment and cannot interact with any code outside of the sandbox
2525
// It also does not have access to any Global or Window objects, nor it can execute code on the end-user's browser
2626
// It also only allows a return statement for a string and it forces the return value to also be a string and only be used
2727
// by Shiki to render the highlighted syntax. Hence XSS attacks or JavaScript injections are not possible.
28-
const interpreter = createSval({}, 'script');
28+
const interpreter = createInterpreter({}, 'script');
2929

3030
/**
3131
* Parses a snippet string using the interpreter with the given release context

‎apps/site/components/EOL/VulnerabilitiesTable.tsx‎

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
import classNames from 'classnames';
21
import { useTranslations } from 'next-intl';
32
import type { FC } from 'react';
43

@@ -9,7 +8,7 @@ import type { Vulnerability } from '#site/types/vulnerabilities';
98
const VulnerabilitiesTable: FC<{
109
vulnerabilities: Array<Vulnerability>;
1110
maxWidth?: string;
12-
}> = ({ vulnerabilities, maxWidth = 'max-w-2xs' }) => {
11+
}> = ({ vulnerabilities, maxWidth = 'md:max-w-2xs' }) => {
1312
const t = useTranslations();
1413

1514
if (!vulnerabilities.length) {
@@ -29,7 +28,7 @@ const VulnerabilitiesTable: FC<{
2928
<tbody>
3029
{vulnerabilities.map((vulnerability, i) => (
3130
<tr key={i}>
32-
<td>
31+
<td data-label={t('components.eolModal.table.cves')}>
3332
{vulnerability.cve.map(cveId => (
3433
<div key={cveId}>
3534
<LinkWithArrow
@@ -44,13 +43,16 @@ const VulnerabilitiesTable: FC<{
4443

4544
{vulnerability.cve.length > 0 || '-'}
4645
</td>
47-
<td>
46+
<td data-label={t('components.eolModal.table.severity')}>
4847
<VulnerabilityChip severity={vulnerability.severity} />
4948
</td>
50-
<td className={classNames(maxWidth, 'truncate')}>
49+
<td
50+
data-label={t('components.eolModal.table.overview')}
51+
className={maxWidth}
52+
>
5153
{vulnerability.description || vulnerability.overview || '-'}
5254
</td>
53-
<td>
55+
<td data-label={t('components.eolModal.table.details')}>
5456
{vulnerability.url && (
5557
<LinkWithArrow
5658
href={vulnerability.url}

‎apps/site/components/EOL/VulnerabilityChips/VulnerabilityChip/index.tsx‎

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -20,11 +20,7 @@ const VulnerabilityChip: FC<VulnerabilityChipProps> = ({
2020
const t = useTranslations();
2121

2222
return (
23-
<Badge
24-
size="small"
25-
kind={SEVERITY_KIND_MAP[severity] as BadgeKind}
26-
className="mr-1"
27-
>
23+
<Badge size="small" kind={SEVERITY_KIND_MAP[severity] as BadgeKind}>
2824
{count > 0 ? <span className={styles.chipCount}>{count}</span> : null}
2925
{t(`components.eolChip.severity.${severity}`)}
3026
</Badge>

‎apps/site/components/EOL/VulnerabilityChips/index.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ const VulnerabilityChips: FC<VulnerabilityChipsProps> = ({
2323
);
2424

2525
return (
26-
<div className="vulnerability-chips">
26+
<div className="flex flex-row flex-wrap gap-1 max-sm:justify-end">
2727
{SEVERITY_ORDER.filter(severity => groupedBySeverity[severity] > 0).map(
2828
severity => (
2929
<VulnerabilityChip

‎apps/site/components/Releases/MinorReleasesTable/index.tsx‎

Lines changed: 57 additions & 63 deletions
Original file line numberDiff line numberDiff line change
@@ -21,70 +21,64 @@ const MinorReleasesTable: FC<MinorReleasesTableProps> = ({ releases }) => {
2121
const t = useTranslations();
2222

2323
return (
24-
<div className={styles.scrollable}>
25-
<table>
26-
<thead className={styles.header}>
27-
<tr>
28-
<th>{t('components.minorReleasesTable.version')}</th>
29-
<th>{t('components.minorReleasesTable.information')}</th>
30-
<th>{t('components.minorReleasesTable.links')}</th>
31-
</tr>
32-
</thead>
33-
<tbody>
34-
{releases.map(release => (
35-
<tr key={release.version}>
36-
<td>
37-
<Link href={`/download/archive/v${release.version}`}>
38-
v{release.version}
24+
<table>
25+
<thead>
26+
<tr>
27+
<th>{t('components.minorReleasesTable.version')}</th>
28+
<th>{t('components.minorReleasesTable.nApiVersion')}</th>
29+
<th>{t('components.minorReleasesTable.npmVersion')}</th>
30+
<th>{t('components.minorReleasesTable.v8Version')}</th>
31+
<th>{t('components.minorReleasesTable.links')}</th>
32+
</tr>
33+
</thead>
34+
<tbody>
35+
{releases.map(release => (
36+
<tr key={release.version}>
37+
<td data-label={t('components.minorReleasesTable.version')}>
38+
<Link href={`/download/archive/v${release.version}`}>
39+
v{release.version}
40+
</Link>
41+
</td>
42+
<td data-label={t('components.minorReleasesTable.nApiVersion')}>
43+
{release.modules && (
44+
<ReleaseOverviewItem
45+
Icon={CodeBracketSquareIcon}
46+
title={`v${release.modules}`}
47+
className={styles.releaseOverviewItem}
48+
/>
49+
)}
50+
</td>
51+
<td data-label={t('components.minorReleasesTable.npmVersion')}>
52+
{release.npm && (
53+
<ReleaseOverviewItem
54+
Icon={NpmIcon}
55+
title={`v${release.npm}`}
56+
className={styles.releaseOverviewItem}
57+
/>
58+
)}
59+
</td>
60+
<td data-label={t('components.minorReleasesTable.v8Version')}>
61+
<ReleaseOverviewItem
62+
Icon={CodeBracketSquareIcon}
63+
title={`v${release.v8}`}
64+
className={styles.releaseOverviewItem}
65+
/>
66+
</td>
67+
<td>
68+
<div className={styles.additionalLinks}>
69+
<Link href={getNodeApiUrl(`v${release.version}`)}>
70+
{t('components.minorReleasesTable.actions.docs')}
3971
</Link>
40-
</td>
41-
<td>
42-
<div className={styles.items}>
43-
{release.modules && (
44-
<>
45-
<ReleaseOverviewItem
46-
Icon={CodeBracketSquareIcon}
47-
title={`v${release.modules}`}
48-
subtitle={t('components.releaseOverview.nApiVersion')}
49-
/>
50-
<Separator orientation="vertical" />
51-
</>
52-
)}
53-
{release.npm && (
54-
<>
55-
<ReleaseOverviewItem
56-
Icon={NpmIcon}
57-
title={`v${release.npm}`}
58-
subtitle={t('components.releaseOverview.npmVersion')}
59-
/>
60-
<Separator orientation="vertical" />
61-
</>
62-
)}
63-
<ReleaseOverviewItem
64-
Icon={CodeBracketSquareIcon}
65-
title={`v${release.v8}`}
66-
subtitle={t('components.releaseOverview.v8Version')}
67-
/>
68-
</div>
69-
</td>
70-
<td>
71-
<div className={styles.additionalLinks}>
72-
<Link href={getNodeApiUrl(`v${release.version}`)}>
73-
{t('components.minorReleasesTable.actions.docs')}
74-
</Link>
75-
<Separator orientation="vertical" />
76-
<LinkWithArrow
77-
href={`${BASE_CHANGELOG_URL}${release.version}`}
78-
>
79-
{t('components.minorReleasesTable.actions.changelog')}
80-
</LinkWithArrow>
81-
</div>
82-
</td>
83-
</tr>
84-
))}
85-
</tbody>
86-
</table>
87-
</div>
72+
<Separator orientation="vertical" />
73+
<LinkWithArrow href={`${BASE_CHANGELOG_URL}${release.version}`}>
74+
{t('components.minorReleasesTable.actions.changelog')}
75+
</LinkWithArrow>
76+
</div>
77+
</td>
78+
</tr>
79+
))}
80+
</tbody>
81+
</table>
8882
);
8983
};
9084

‎apps/site/components/Releases/PreviousReleasesTable.tsx‎

Lines changed: 12 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -43,24 +43,30 @@ const PreviousReleasesTable: FC = () => {
4343
<tbody>
4444
{releaseData.map(release => (
4545
<Fragment key={release.major}>
46-
<tr key={release.major}>
47-
<td data-label="Version">
46+
<tr data-label={release.versionWithPrefix}>
47+
<td data-label={t('components.downloadReleasesTable.version')}>
4848
<Link href={`/download/archive/${release.versionWithPrefix}`}>
4949
v{release.major}
5050
</Link>
5151
</td>
5252

53-
<td data-label="LTS">{release.codename || '-'}</td>
53+
<td data-label={t('components.downloadReleasesTable.codename')}>
54+
{release.codename || '-'}
55+
</td>
5456

55-
<td data-label="Date">
57+
<td
58+
data-label={t('components.downloadReleasesTable.firstReleased')}
59+
>
5660
<FormattedTime date={release.currentStart} />
5761
</td>
5862

59-
<td data-label="Date">
63+
<td
64+
data-label={t('components.downloadReleasesTable.lastUpdated')}
65+
>
6066
<FormattedTime date={release.releaseDate} />
6167
</td>
6268

63-
<td data-label="Status">
69+
<td data-label={t('components.downloadReleasesTable.status')}>
6470
<Badge kind={BADGE_KIND_MAP[release.status]} size="small">
6571
{release.status}
6672
{release.status === 'End-of-life' ? ' (EoL)' : ''}

‎apps/site/components/Releases/ReleaseOverview/ReleaseOverviewItem/index.tsx‎

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,26 @@
1+
import classNames from 'classnames';
12
import type { FC, ReactNode, SVGProps } from 'react';
23

34
import styles from './index.module.css';
45

56
type ReleaseOverviewItemProps = {
67
Icon: FC<SVGProps<SVGSVGElement>>;
78
title: ReactNode;
8-
subtitle: ReactNode;
9+
subtitle?: ReactNode;
10+
className?: string;
911
};
1012

1113
const ReleaseOverviewItem: FC<ReleaseOverviewItemProps> = ({
1214
Icon,
1315
title,
1416
subtitle,
17+
className,
1518
}) => {
1619
return (
17-
<div className={styles.item}>
20+
<div className={classNames(styles.item, className)}>
1821
<Icon />
1922
<div>
20-
<h2>{subtitle}</h2>
23+
{subtitle && <h2>{subtitle}</h2>}
2124
<h1>{title}</h1>
2225
</div>
2326
</div>

‎apps/site/next.mdx.compiler.mjs‎ renamed to ‎apps/site/mdx/compiler.mjs‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -4,12 +4,12 @@ import { compile as mdxCompile } from '@mdx-js/mdx';
44
import { Fragment, jsx, jsxs } from 'react/jsx-runtime';
55
import { matter } from 'vfile-matter';
66

7-
import { createSval } from './next.jsx.compiler.mjs';
8-
import { REHYPE_PLUGINS, REMARK_PLUGINS } from './next.mdx.plugins.mjs';
9-
import { createGitHubSlugger } from './util/github';
7+
import { rehypePlugins, remarkPlugins } from './plugins.mjs';
8+
import { createGitHubSlugger } from '../util/github';
9+
import createInterpreter from '../util/interpreter';
1010

1111
// Defines a JSX Fragment and JSX Runtime for the MDX Compiler
12-
export const reactRuntime = { Fragment, jsx, jsxs };
12+
const reactRuntime = { Fragment, jsx, jsxs };
1313

1414
/**
1515
* This is our custom simple MDX Compiler that is used to compile Markdown and MDX
@@ -27,7 +27,7 @@ export const reactRuntime = { Fragment, jsx, jsxs };
2727
* readingTime: import('reading-time').ReadTimeResults;
2828
* }>}
2929
*/
30-
export async function compile(
30+
export default async function compile(
3131
source,
3232
fileExtension,
3333
components = {},
@@ -42,12 +42,12 @@ export async function compile(
4242

4343
// Compiles the MDX/Markdown source into a serializable VFile
4444
const compiled = await mdxCompile(source, {
45-
rehypePlugins: REHYPE_PLUGINS,
46-
remarkPlugins: REMARK_PLUGINS,
45+
rehypePlugins,
46+
remarkPlugins,
4747
format: fileExtension,
4848
});
4949

50-
const interpreter = createSval({
50+
const interpreter = createInterpreter({
5151
...components,
5252
'react/jsx-runtime': reactRuntime,
5353
});

0 commit comments

Comments
 (0)