From 682e0e1802720ead2e940dbd1723239c691681cb Mon Sep 17 00:00:00 2001
From: iCrawl <buechler.noel@outlook.com>
Date: Fri, 26 Aug 2022 12:00:25 +0200
Subject: [PATCH] fix: don't prefetch as links enter viewport

---
 .../website/src/components/HyperlinkedText.tsx   |  2 +-
 .../website/src/components/InheritanceText.tsx   |  2 +-
 packages/website/src/components/SidebarItems.tsx |  2 +-
 .../website/src/components/SidebarLayout.tsx     | 16 ++++++++--------
 packages/website/src/components/tsdoc/TSDoc.tsx  |  4 ++--
 packages/website/src/pages/404.tsx               |  2 +-
 .../src/pages/docs/packages/[package]/index.tsx  |  2 +-
 .../website/src/pages/docs/packages/index.tsx    |  2 +-
 packages/website/src/pages/index.tsx             |  6 +++---
 9 files changed, 19 insertions(+), 19 deletions(-)

diff --git a/packages/website/src/components/HyperlinkedText.tsx b/packages/website/src/components/HyperlinkedText.tsx
index 28fdd135a..9991d304e 100644
--- a/packages/website/src/components/HyperlinkedText.tsx
+++ b/packages/website/src/components/HyperlinkedText.tsx
@@ -15,7 +15,7 @@ export function HyperlinkedText({ tokens }: { tokens: TokenDocumentation[] }) {
 			{tokens.map((token, idx) => {
 				if (token.path) {
 					return (
-						<Link key={idx} href={token.path} passHref>
+						<Link key={idx} href={token.path} passHref prefetch={false}>
 							<Anchor component="a" inherit>
 								{token.text}
 							</Anchor>
diff --git a/packages/website/src/components/InheritanceText.tsx b/packages/website/src/components/InheritanceText.tsx
index fe1eb035f..f7e964890 100644
--- a/packages/website/src/components/InheritanceText.tsx
+++ b/packages/website/src/components/InheritanceText.tsx
@@ -6,7 +6,7 @@ export function InheritanceText({ data }: { data: InheritanceData }) {
 	return (
 		<Text weight={600}>
 			{'Inherited from '}
-			<Link href={data.path} passHref>
+			<Link href={data.path} passHref prefetch={false}>
 				<Anchor component="a" className="font-mono">
 					{data.parentName}
 				</Anchor>
diff --git a/packages/website/src/components/SidebarItems.tsx b/packages/website/src/components/SidebarItems.tsx
index 7396f0f21..a0bd16bb4 100644
--- a/packages/website/src/components/SidebarItems.tsx
+++ b/packages/website/src/components/SidebarItems.tsx
@@ -116,7 +116,7 @@ export function SidebarItems({
 				.map((group, idx) => (
 					<Section key={idx} title={group} icon={resolveIcon(group)}>
 						{groupItems[group].map((member, i) => (
-							<Link key={i} href={member.path} passHref>
+							<Link key={i} href={member.path} passHref prefetch={false}>
 								<NavLink
 									className={classes.link}
 									component="a"
diff --git a/packages/website/src/components/SidebarLayout.tsx b/packages/website/src/components/SidebarLayout.tsx
index a7d30461e..7c8278f02 100644
--- a/packages/website/src/components/SidebarLayout.tsx
+++ b/packages/website/src/components/SidebarLayout.tsx
@@ -195,7 +195,7 @@ export function SidebarLayout({
 	const breadcrumbs = useMemo(
 		() =>
 			asPathWithoutQueryAndAnchor.split('/').map((path, idx, original) => (
-				<Link key={idx} href={original.slice(0, idx + 1).join('/')} passHref>
+				<Link key={idx} href={original.slice(0, idx + 1).join('/')} passHref prefetch={false}>
 					<Anchor component="a" sx={(theme) => ({ color: theme.colorScheme === 'dark' ? theme.white : theme.black })}>
 						{path}
 					</Anchor>
@@ -317,7 +317,7 @@ export function SidebarLayout({
 							</MediaQuery>
 						</Box>
 						<Group>
-							<Link href="https://github.com/discordjs/discord.js" passHref>
+							<Link href="https://github.com/discordjs/discord.js" passHref prefetch={false}>
 								<ActionIcon
 									component="a"
 									target="_blank"
@@ -356,7 +356,7 @@ export function SidebarLayout({
 				>
 					<Container>
 						<Box className={classes.links}>
-							<Link href="https://vercel.com/?utm_source=discordjs&utm_campaign=oss" passHref>
+							<Link href="https://vercel.com/?utm_source=discordjs&utm_campaign=oss" prefetch={false}>
 								<a title="Vercel">
 									<Image
 										src="/powered-by-vercel.svg"
@@ -371,12 +371,12 @@ export function SidebarLayout({
 								<Stack spacing={8}>
 									<Title order={4}>Community</Title>
 									<Stack spacing={0}>
-										<Link href="https://discord.gg/djs" passHref>
+										<Link href="https://discord.gg/djs" passHref prefetch={false}>
 											<Anchor component="a" target="_blank" rel="noopener noreferrer" className={classes.link}>
 												Discord
 											</Anchor>
 										</Link>
-										<Link href="https://github.com/discordjs/discord.js/discussions" passHref>
+										<Link href="https://github.com/discordjs/discord.js/discussions" passHref prefetch={false}>
 											<Anchor component="a" target="_blank" rel="noopener noreferrer" className={classes.link}>
 												GitHub discussions
 											</Anchor>
@@ -386,17 +386,17 @@ export function SidebarLayout({
 								<Stack spacing={8}>
 									<Title order={4}>Project</Title>
 									<Stack spacing={0}>
-										<Link href="https://github.com/discordjs/discord.js" passHref>
+										<Link href="https://github.com/discordjs/discord.js" passHref prefetch={false}>
 											<Anchor component="a" target="_blank" rel="noopener noreferrer" className={classes.link}>
 												discord.js
 											</Anchor>
 										</Link>
-										<Link href="https://discordjs.guide" passHref>
+										<Link href="https://discordjs.guide" passHref prefetch={false}>
 											<Anchor component="a" target="_blank" rel="noopener noreferrer" className={classes.link}>
 												discord.js guide
 											</Anchor>
 										</Link>
-										<Link href="https://discord-api-types.dev" passHref>
+										<Link href="https://discord-api-types.dev" passHref prefetch={false}>
 											<Anchor component="a" target="_blank" rel="noopener noreferrer" className={classes.link}>
 												discord-api-types
 											</Anchor>
diff --git a/packages/website/src/components/tsdoc/TSDoc.tsx b/packages/website/src/components/tsdoc/TSDoc.tsx
index f9dc5336b..e8207b525 100644
--- a/packages/website/src/components/tsdoc/TSDoc.tsx
+++ b/packages/website/src/components/tsdoc/TSDoc.tsx
@@ -41,7 +41,7 @@ export function TSDoc({ node }: { node: AnyDocNodeJSON }): JSX.Element {
 
 					if (codeDestination) {
 						return (
-							<Link key={idx} href={codeDestination.path} passHref>
+							<Link key={idx} href={codeDestination.path} passHref prefetch={false}>
 								<Anchor component="a" className="font-mono">
 									{text ?? codeDestination.name}
 								</Anchor>
@@ -51,7 +51,7 @@ export function TSDoc({ node }: { node: AnyDocNodeJSON }): JSX.Element {
 
 					if (urlDestination) {
 						return (
-							<Link key={idx} href={urlDestination} passHref>
+							<Link key={idx} href={urlDestination} passHref prefetch={false}>
 								<Anchor component="a" className="font-mono">
 									{text ?? urlDestination}
 								</Anchor>
diff --git a/packages/website/src/pages/404.tsx b/packages/website/src/pages/404.tsx
index 16cbc0657..896cc214a 100644
--- a/packages/website/src/pages/404.tsx
+++ b/packages/website/src/pages/404.tsx
@@ -29,7 +29,7 @@ export default function FourOhFourPage() {
 				<Box className={classes.label}>404</Box>
 				<Title align="center">Not found.</Title>
 				<Group position="center">
-					<Link href="/docs/packages" passHref>
+					<Link href="/docs/packages" passHref prefetch={false}>
 						<Button component="a" variant="filled" size="md" mt="xl">
 							Take me back
 						</Button>
diff --git a/packages/website/src/pages/docs/packages/[package]/index.tsx b/packages/website/src/pages/docs/packages/[package]/index.tsx
index 27f355e11..668a6f86b 100644
--- a/packages/website/src/pages/docs/packages/[package]/index.tsx
+++ b/packages/website/src/pages/docs/packages/[package]/index.tsx
@@ -107,7 +107,7 @@ export default function VersionsRoute(props: Partial<VersionProps> & { error?: s
 					Select a version:
 				</Title>
 				{props.data?.versions.map((version) => (
-					<Link key={version} href={`/docs/packages/${props.packageName!}/${version}`} passHref>
+					<Link key={version} href={`/docs/packages/${props.packageName!}/${version}`} passHref prefetch={false}>
 						<UnstyledButton className={classes.control} component="a">
 							<Group position="apart">
 								<Group>
diff --git a/packages/website/src/pages/docs/packages/index.tsx b/packages/website/src/pages/docs/packages/index.tsx
index bc94d76a2..1412800b0 100644
--- a/packages/website/src/pages/docs/packages/index.tsx
+++ b/packages/website/src/pages/docs/packages/index.tsx
@@ -43,7 +43,7 @@ export default function PackagesRoute() {
 					Select a package:
 				</Title>
 				{PACKAGES.map((pkg) => (
-					<Link key={pkg} href={`/docs/packages/${pkg}`} passHref>
+					<Link key={pkg} href={`/docs/packages/${pkg}`} passHref prefetch={false}>
 						<UnstyledButton className={classes.control} component="a">
 							<Group position="apart">
 								<Group>
diff --git a/packages/website/src/pages/index.tsx b/packages/website/src/pages/index.tsx
index 5676322aa..cd4ffa41c 100644
--- a/packages/website/src/pages/index.tsx
+++ b/packages/website/src/pages/index.tsx
@@ -76,12 +76,12 @@ export default function IndexRoute() {
 					</Text>
 
 					<Group mt={30}>
-						<Link href="/docs" passHref>
+						<Link href="/docs" passHref prefetch={false}>
 							<Button component="a" radius="sm" size="md">
 								Docs
 							</Button>
 						</Link>
-						<Link href="https://discordjs.guide" passHref>
+						<Link href="https://discordjs.guide" passHref prefetch={false}>
 							<Button component="a" variant="default" radius="sm" size="md" rightIcon={<FiExternalLink />}>
 								Guide
 							</Button>
@@ -116,7 +116,7 @@ await client.login('token');`}
 				</Box>
 			</Box>
 			<Center>
-				<Link href="https://vercel.com/?utm_source=discordjs&utm_campaign=oss">
+				<Link href="https://vercel.com/?utm_source=discordjs&utm_campaign=oss" prefetch={false}>
 					<a title="Vercel">
 						<Image
 							src="/powered-by-vercel.svg"