The Node.js® Website

feat: npm link to npm version (#6472)

* feat: npm link to npm version

* Update NpmLink.tsx

Co-authored-by: Caner Akdas <canerakdas@gmail.com>
Signed-off-by: Claudio W <cwunder@gnome.org>

* chore: fix stuff

* Update next.mdx.use.mjs

Signed-off-by: Brian Muenzenmeyer <brian.muenzenmeyer@gmail.com>

---------

Signed-off-by: Claudio W <cwunder@gnome.org>
Signed-off-by: Brian Muenzenmeyer <brian.muenzenmeyer@gmail.com>
Co-authored-by: Caner Akdas <canerakdas@gmail.com>
Co-authored-by: Brian Muenzenmeyer <brian.muenzenmeyer@gmail.com>

authored by Claudio W Caner Akdas Brian Muenzenmeyer and committed by GitHub 2bcf50da 5e6a6e27

Changed files
+30 -27
components
Downloads
pages
en
download
package-manager
prebuilt-binaries
source-code
+19
components/Downloads/Release/NpmLink.tsx
··· 1 + 'use client'; 2 + 3 + import { useContext } from 'react'; 4 + import type { FC } from 'react'; 5 + 6 + import LinkWithArrow from '@/components/Downloads/Release/LinkWithArrow'; 7 + import { ReleaseContext } from '@/providers/releaseProvider'; 8 + 9 + const NpmLink: FC = () => { 10 + const { release } = useContext(ReleaseContext); 11 + 12 + return ( 13 + <LinkWithArrow href={`https://www.npmjs.com/package/npm/v/${release.npm}`}> 14 + npm ({release.npm}) 15 + </LinkWithArrow> 16 + ); 17 + }; 18 + 19 + export default NpmLink;
-16
components/Downloads/Release/NpmVersion.tsx
··· 1 - 'use client'; 2 - 3 - import { useContext } from 'react'; 4 - import type { FC } from 'react'; 5 - 6 - import { ReleaseContext } from '@/providers/releaseProvider'; 7 - 8 - const NpmVersion: FC = () => { 9 - const { 10 - release: { npm }, 11 - } = useContext(ReleaseContext); 12 - 13 - return <>{npm}</>; 14 - }; 15 - 16 - export default NpmVersion;
+3 -3
next.mdx.use.mjs
··· 9 9 import BlogPostLink from './components/Downloads/Release/BlogPostLink'; 10 10 import ReleaseDownloadButton from './components/Downloads/Release/DownloadButton'; 11 11 import LinkWithArrow from './components/Downloads/Release/LinkWithArrow'; 12 - import NpmVersion from './components/Downloads/Release/NpmVersion'; 12 + import NpmLink from './components/Downloads/Release/NpmLink'; 13 13 import OperatingSystemDropdown from './components/Downloads/Release/OperatingSystemDropdown'; 14 14 import PlatformDropdown from './components/Downloads/Release/PlatformDropdown'; 15 15 import ReleaseCodeBox from './components/Downloads/Release/ReleaseCodeBox'; ··· 66 66 BitnessDropdown: BitnessDropdown, 67 67 // Renders a drop-down menu from which the operating system can select 68 68 OperatingSystemDropdown: OperatingSystemDropdown, 69 - // Renders a npm version of the selected release 70 - NpmVersion: NpmVersion, 69 + // Renders a link to the npm version of the selected release 70 + NpmLink: NpmLink, 71 71 // Renders a release version of the selected release 72 72 Version: ReleaseVersion, 73 73 // Renders a release status of the selected release
+1 -1
pages/en/download/current.mdx
··· 11 11 </section> 12 12 13 13 <section> 14 - Node.js includes <LinkWithArrow href="https://npmjs.com">npm</LinkWithArrow> (<Release.NpmVersion />). 14 + Node.js includes <Release.NpmLink />. 15 15 16 16 Read the blog post for <Release.BlogPostLink>this version</Release.BlogPostLink> 17 17
+1 -1
pages/en/download/index.mdx
··· 11 11 </section> 12 12 13 13 <section> 14 - Node.js includes <LinkWithArrow href="https://npmjs.com">npm</LinkWithArrow> (<Release.NpmVersion />). 14 + Node.js includes <Release.NpmLink />. 15 15 16 16 Read the blog post for <Release.BlogPostLink>this version</Release.BlogPostLink> 17 17
+1 -1
pages/en/download/package-manager/current.mdx
··· 11 11 </section> 12 12 13 13 <section> 14 - Node.js includes <LinkWithArrow href="https://npmjs.com">npm</LinkWithArrow> (<Release.NpmVersion />). 14 + Node.js includes <Release.NpmLink />. 15 15 16 16 Read the blog post for <Release.BlogPostLink>this version</Release.BlogPostLink> 17 17
+1 -1
pages/en/download/package-manager/index.mdx
··· 11 11 </section> 12 12 13 13 <section> 14 - Node.js includes <LinkWithArrow href="https://npmjs.com">npm</LinkWithArrow> (<Release.NpmVersion />). 14 + Node.js includes <Release.NpmLink />. 15 15 16 16 Read the blog post for <Release.BlogPostLink>this version</Release.BlogPostLink> 17 17
+1 -1
pages/en/download/prebuilt-binaries/current.mdx
··· 11 11 </section> 12 12 13 13 <section> 14 - Node.js includes <LinkWithArrow href="https://npmjs.com">npm</LinkWithArrow> (<Release.NpmVersion />). 14 + Node.js includes <Release.NpmLink />. 15 15 16 16 Read the blog post for <Release.BlogPostLink>this version</Release.BlogPostLink> 17 17
+1 -1
pages/en/download/prebuilt-binaries/index.mdx
··· 11 11 </section> 12 12 13 13 <section> 14 - Node.js includes <LinkWithArrow href="https://npmjs.com">npm</LinkWithArrow> (<Release.NpmVersion />). 14 + Node.js includes <Release.NpmLink />. 15 15 16 16 Read the blog post for <Release.BlogPostLink>this version</Release.BlogPostLink> 17 17
+1 -1
pages/en/download/source-code/current.mdx
··· 11 11 </section> 12 12 13 13 <section> 14 - Node.js includes <LinkWithArrow href="https://npmjs.com">npm</LinkWithArrow> (<Release.NpmVersion />). 14 + Node.js includes <Release.NpmLink />. 15 15 16 16 Read the blog post for <Release.BlogPostLink>this version</Release.BlogPostLink> 17 17
+1 -1
pages/en/download/source-code/index.mdx
··· 11 11 </section> 12 12 13 13 <section> 14 - Node.js includes <LinkWithArrow href="https://npmjs.com">npm</LinkWithArrow> (<Release.NpmVersion />). 14 + Node.js includes <Release.NpmLink />. 15 15 16 16 Read the blog post for <Release.BlogPostLink>this version</Release.BlogPostLink> 17 17