Skip to content
This repository was archived by the owner on Apr 26, 2024. It is now read-only.

Commit e8719d2

Browse files
authored
Homepage: Changes hardcoded data version and download urls (#665)
* fix(hero.tsx): Removed hardcoded version and use useReleaseHistory * fix(hero.tsx): Get last change from staging and fix hooks path * fix(hero.tsx): Update hero.tsx snap * fix(hero.tsx): Remove whats new link and fix lts/current download urls * fix(doc.tsx): Fix lint with npm run lint -- --fix
1 parent b290d65 commit e8719d2

6 files changed

Lines changed: 94 additions & 48 deletions

File tree

src/components/Hero/__tests__/__snapshots__/hero.test.tsx.snap

Lines changed: 11 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -16,26 +16,22 @@ exports[`Hero component renders correctly 1`] = `
1616
<div
1717
className="download-lts-container"
1818
>
19-
<button
20-
className="download-lts-cta t-body1"
21-
type="button"
19+
<a
20+
href="https://nodejs.org/dist//node-.tar.gz"
2221
>
23-
Download Node (LTS)
24-
</button>
22+
<button
23+
className="download-lts-cta t-body1"
24+
type="button"
25+
>
26+
Download Node (LTS)
27+
</button>
28+
</a>
2529
<p
2630
className="links t-caption"
2731
>
28-
Version 10.15.3
29-
-
30-
<a
31-
href="/download"
32-
>
33-
What’s new
34-
</a>
35-
/
36-
32+
3733
<a
38-
href="/download"
34+
href="https://nodejs.org/dist//node-.tar.gz"
3935
>
4036
Get Current
4137
</a>

src/components/Hero/index.tsx

Lines changed: 71 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,34 +1,83 @@
11
import React from 'react';
22
import { Link } from 'gatsby';
33

4+
import { detectOS, UserOS } from '../../util/detectOS';
5+
import { useReleaseHistory, ReleaseData } from '../../hooks/useReleaseHistory';
6+
47
interface Props {
58
title: string;
69
subTitle: string;
710
}
811

9-
const NodeVersion = 'Version 10.15.3';
10-
11-
const Hero = ({ title, subTitle }: Props): JSX.Element => (
12-
<div className="home-page-hero">
13-
<h1>{title}</h1>
14-
<h2 className="sub-title t-subheading">{subTitle}</h2>
15-
<div className="btn-ctas">
16-
<div className="download-lts-container">
17-
<button className="download-lts-cta t-body1" type="button">
18-
Download Node (LTS)
19-
</button>
20-
<p className="links t-caption">
21-
{NodeVersion} - <Link to="/download">What’s new</Link> /{' '}
22-
<Link to="/download">Get Current</Link>
23-
</p>
12+
function downloadUrlByOS(userOS: UserOS, version: string): string {
13+
const baseURL = `https://nodejs.org/dist/${version}`;
14+
15+
if (userOS === UserOS.MOBILE) {
16+
return baseURL;
17+
}
18+
19+
if (userOS === UserOS.MAC) {
20+
return `${baseURL}/node-${version}.pkg`;
21+
}
22+
23+
if (userOS === UserOS.WIN) {
24+
if (
25+
navigator.appVersion.indexOf('WOW64') !== -1 ||
26+
navigator.appVersion.indexOf('Win64') !== -1
27+
) {
28+
return `${baseURL}/node-${version}-x64.msi`;
29+
}
30+
31+
return `${baseURL}/node-${version}-x86.msi`;
32+
}
33+
34+
return `${baseURL}/node-${version}.tar.gz`;
35+
}
36+
37+
const Hero = ({ title, subTitle }: Props): JSX.Element => {
38+
const userOS = detectOS();
39+
const [currentRelease, ...releases] = useReleaseHistory();
40+
41+
// find first lts version (first found is last LTS)
42+
const lastLTSRelease = releases.find(
43+
(release: ReleaseData): boolean => release.lts
44+
);
45+
46+
const ltsVersionUrl = downloadUrlByOS(
47+
userOS,
48+
lastLTSRelease ? lastLTSRelease.version : ''
49+
);
50+
const currentVersionUrl = downloadUrlByOS(
51+
userOS,
52+
currentRelease ? currentRelease.version : ''
53+
);
54+
55+
return (
56+
<div className="home-page-hero">
57+
<h1>{title}</h1>
58+
<h2 className="sub-title t-subheading">{subTitle}</h2>
59+
<div className="btn-ctas">
60+
<div className="download-lts-container">
61+
<a href={ltsVersionUrl}>
62+
<button className="download-lts-cta t-body1" type="button">
63+
Download Node (LTS)
64+
</button>
65+
</a>
66+
<p className="links t-caption">
67+
{lastLTSRelease
68+
? `Version ${lastLTSRelease.version.substr(1)} - `
69+
: ''}
70+
<a href={currentVersionUrl}>Get Current</a>
71+
</p>
72+
</div>
73+
<Link to="/learn">
74+
<button className="learn-cta t-body1" type="button">
75+
Learn Node
76+
</button>
77+
</Link>
2478
</div>
25-
<Link to="/learn">
26-
<button className="learn-cta t-body1" type="button">
27-
Learn Node
28-
</button>
29-
</Link>
3079
</div>
31-
</div>
32-
);
80+
);
81+
};
3382

3483
export default Hero;

src/components/ReleaseCards/index.tsx

Lines changed: 9 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -13,8 +13,9 @@ export default function ReleaseCards({ line }: Props): JSX.Element {
1313
<i className="material-icons">cloud</i>
1414
<p>Windows Installer</p>
1515
<a
16-
href={`https://nodejs.org/dist/${fileName}/node-${line &&
17-
line.version}-x86.msi`}
16+
href={`https://nodejs.org/dist/${fileName}/node-${
17+
line && line.version
18+
}-x86.msi`}
1819
>
1920
node-
2021
{line && line.version}
@@ -25,8 +26,9 @@ export default function ReleaseCards({ line }: Props): JSX.Element {
2526
<i className="material-icons">cloud</i>
2627
<p>Mac Installer</p>
2728
<a
28-
href={`https://nodejs.org/dist/${fileName}/node-${line &&
29-
line.version}.pkg`}
29+
href={`https://nodejs.org/dist/${fileName}/node-${
30+
line && line.version
31+
}.pkg`}
3032
>
3133
node-
3234
{line && line.version}
@@ -37,8 +39,9 @@ export default function ReleaseCards({ line }: Props): JSX.Element {
3739
<i className="material-icons">cloud</i>
3840
<p>Source Code</p>
3941
<a
40-
href={`https://nodejs.org/dist/${fileName}/node-${line &&
41-
line.version}.tar.gz`}
42+
href={`https://nodejs.org/dist/${fileName}/node-${
43+
line && line.version
44+
}.tar.gz`}
4245
>
4346
node-
4447
{line && line.version}

src/pages/docs.tsx

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -57,9 +57,7 @@ function renderArticleOverview(
5757
</a>
5858
{children.length ? (
5959
<ul className="api-key__section">{children}</ul>
60-
) : (
61-
undefined
62-
)}
60+
) : undefined}
6361
</li>
6462
);
6563

src/styles/index.scss

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -62,7 +62,7 @@
6262
color: var(--color-text-secondary);
6363
margin: var(--space-08) 0 0 0;
6464
position: absolute;
65-
left: calc(var(--space-16) * -1);
65+
left: var(--space-16);
6666
}
6767
}
6868

src/util/detectOS.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ export function detectOS(): UserOS {
1414
if (navigator.appVersion.indexOf('Mac') !== -1) OS = UserOS.MAC;
1515
if (navigator.appVersion.indexOf('X11') !== -1) OS = UserOS.UNIX;
1616
if (navigator.appVersion.indexOf('Linux') !== -1) OS = UserOS.LINUX;
17-
// not currently checking for mobile devices
17+
if (navigator.appVersion.indexOf('Mobi') !== -1) OS = UserOS.MOBILE;
1818
}
1919
return OS;
2020
}

0 commit comments

Comments
 (0)