Skip to content

Commit 5886e1b

Browse files
araujoguiaraujogui
committed
refactor: cache release data
1 parent 11fa0e5 commit 5886e1b

14 files changed

Lines changed: 254 additions & 197 deletions

File tree

‎apps/site/app/[locale]/download/archive/[version]/page.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,7 @@ const getPage: FC<PageParams> = async props => {
4646
const [locale, pathname] = basePage.getLocaleAndPath(version, routeLocale);
4747

4848
if (version === 'current') {
49-
const releaseData = provideReleaseData();
49+
const releaseData = await provideReleaseData();
5050

5151
const release = releaseData.find(release => release.status === 'Current');
5252

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

Lines changed: 0 additions & 83 deletions
This file was deleted.

‎apps/site/components/EOL/EOLReleaseTable/TableBody.tsx‎

Lines changed: 68 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,68 @@
1+
'use client';
2+
3+
import { useTranslations } from 'next-intl';
4+
import type { FC } from 'react';
5+
import { Fragment, useState } from 'react';
6+
7+
import FormattedTime from '#site/components/Common/FormattedTime';
8+
import LinkWithArrow from '#site/components/Common/LinkWithArrow';
9+
import EOLModal from '#site/components/EOL/EOLModal';
10+
import VulnerabilityChips from '#site/components/EOL/VulnerabilityChips';
11+
import type { NodeRelease } from '#site/types/releases.js';
12+
import type { GroupedVulnerabilities } from '#site/types/vulnerabilities.js';
13+
14+
type EOLReleaseTableBodyProps = {
15+
eolReleases: Array<NodeRelease>;
16+
vulnerabilities: GroupedVulnerabilities;
17+
};
18+
19+
const EOLReleaseTableBody: FC<EOLReleaseTableBodyProps> = ({
20+
eolReleases,
21+
vulnerabilities,
22+
}) => {
23+
const t = useTranslations();
24+
25+
const [currentModal, setCurrentModal] = useState<string | undefined>();
26+
27+
return (
28+
<tbody>
29+
{eolReleases.map(release => (
30+
<Fragment key={release.major}>
31+
<tr>
32+
<td data-label="Version">
33+
v{release.major} {release.codename ? `(${release.codename})` : ''}
34+
</td>
35+
36+
<td data-label="Date">
37+
<FormattedTime date={release.releaseDate} />
38+
</td>
39+
40+
<td>
41+
<VulnerabilityChips
42+
vulnerabilities={vulnerabilities[release.major]}
43+
/>
44+
</td>
45+
46+
<td>
47+
<LinkWithArrow
48+
className="cursor-pointer"
49+
onClick={() => setCurrentModal(release.version)}
50+
>
51+
{t('components.downloadReleasesTable.details')}
52+
</LinkWithArrow>
53+
</td>
54+
</tr>
55+
56+
<EOLModal
57+
release={release}
58+
vulnerabilities={vulnerabilities[release.major]}
59+
open={currentModal === release.version}
60+
onOpenChange={open => open || setCurrentModal(undefined)}
61+
/>
62+
</Fragment>
63+
))}
64+
</tbody>
65+
);
66+
};
67+
68+
export default EOLReleaseTableBody;

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

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
import { getTranslations } from 'next-intl/server';
2+
import type { FC } from 'react';
3+
4+
import provideReleaseData from '#site/next-data/providers/releaseData';
5+
import provideVulnerabilities from '#site/next-data/providers/vulnerabilities';
6+
import { EOL_VERSION_IDENTIFIER } from '#site/next.constants.mjs';
7+
8+
import EOLReleaseTableBody from './TableBody';
9+
10+
const EOLReleaseTable: FC = async () => {
11+
const releaseData = await provideReleaseData();
12+
const vulnerabilities = provideVulnerabilities();
13+
14+
const eolReleases = releaseData.filter(
15+
release => release.status === EOL_VERSION_IDENTIFIER
16+
);
17+
18+
const t = await getTranslations();
19+
20+
return (
21+
<table id="tbVulnerabilities">
22+
<thead>
23+
<tr>
24+
<th>
25+
{t('components.eolTable.version')} (
26+
{t('components.eolTable.codename')})
27+
</th>
28+
<th>{t('components.eolTable.lastUpdated')}</th>
29+
<th>{t('components.eolTable.vulnerabilities')}</th>
30+
<th>{t('components.eolTable.details')}</th>
31+
</tr>
32+
</thead>
33+
34+
<EOLReleaseTableBody
35+
eolReleases={eolReleases}
36+
vulnerabilities={vulnerabilities}
37+
/>
38+
</table>
39+
);
40+
};
41+
42+
export default EOLReleaseTable;

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

Lines changed: 0 additions & 98 deletions
This file was deleted.

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

Lines changed: 87 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,87 @@
1+
'use client';
2+
3+
import Badge from '@node-core/ui-components/Common/Badge';
4+
import { useTranslations } from 'next-intl';
5+
import type { FC } from 'react';
6+
import { Fragment, useState } from 'react';
7+
8+
import FormattedTime from '#site/components/Common/FormattedTime';
9+
import LinkWithArrow from '#site/components/Common/LinkWithArrow';
10+
import Link from '#site/components/Link';
11+
import type { NodeRelease } from '#site/types/releases.js';
12+
13+
import ReleaseModal from '../ReleaseModal';
14+
15+
const BADGE_KIND_MAP = {
16+
'End-of-life': 'warning',
17+
'Maintenance LTS': 'neutral',
18+
'Active LTS': 'info',
19+
Current: 'default',
20+
Pending: 'default',
21+
} as const;
22+
23+
type PreviousReleasesTableBodyProps = {
24+
releaseData: Array<NodeRelease>;
25+
};
26+
27+
const PreviousReleasesTableBody: FC<PreviousReleasesTableBodyProps> = ({
28+
releaseData,
29+
}) => {
30+
const t = useTranslations();
31+
32+
const [currentModal, setCurrentModal] = useState<string | undefined>();
33+
34+
return (
35+
<tbody>
36+
{releaseData.map(release => (
37+
<Fragment key={release.major}>
38+
<tr data-label={release.versionWithPrefix}>
39+
<td data-label={t('components.downloadReleasesTable.version')}>
40+
<Link href={`/download/archive/${release.versionWithPrefix}`}>
41+
v{release.major}
42+
</Link>
43+
</td>
44+
45+
<td data-label={t('components.downloadReleasesTable.codename')}>
46+
{release.codename || '-'}
47+
</td>
48+
49+
<td
50+
data-label={t('components.downloadReleasesTable.firstReleased')}
51+
>
52+
<FormattedTime date={release.currentStart} />
53+
</td>
54+
55+
<td data-label={t('components.downloadReleasesTable.lastUpdated')}>
56+
<FormattedTime date={release.releaseDate} />
57+
</td>
58+
59+
<td data-label={t('components.downloadReleasesTable.status')}>
60+
<Badge kind={BADGE_KIND_MAP[release.status]} size="small">
61+
{release.status}
62+
{release.status === 'End-of-life' ? ' (EoL)' : ''}
63+
</Badge>
64+
</td>
65+
66+
<td>
67+
<LinkWithArrow
68+
className="cursor-pointer"
69+
onClick={() => setCurrentModal(release.version)}
70+
>
71+
{t('components.downloadReleasesTable.details')}
72+
</LinkWithArrow>
73+
</td>
74+
</tr>
75+
76+
<ReleaseModal
77+
release={release}
78+
open={currentModal === release.version}
79+
onOpenChange={open => open || setCurrentModal(undefined)}
80+
/>
81+
</Fragment>
82+
))}
83+
</tbody>
84+
);
85+
};
86+
87+
export default PreviousReleasesTableBody;

0 commit comments

Comments
 (0)