From dfa62c952f633179fee30a4b94b6717b614cf3c4 Mon Sep 17 00:00:00 2001
From: Kiko Beats <josefrancisco.verdu@gmail.com>
Date: Sun, 21 Jul 2024 13:45:02 +0200
Subject: [PATCH] chore: avoid to prefetch docs links (#1731)

* chore: avoid to prefetch docs links

* chore: disable prefetch for mobile
---
 src/components/hook/use-breakpoint.js |  2 +-
 src/components/patterns/Layout.js     |  2 +-
 src/helpers/hoc/with-link.js          | 10 +++++++++-
 3 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/src/components/hook/use-breakpoint.js b/src/components/hook/use-breakpoint.js
index ac8184169..2e5b66ac4 100644
--- a/src/components/hook/use-breakpoint.js
+++ b/src/components/hook/use-breakpoint.js
@@ -5,7 +5,7 @@ import { useWindowSize } from './use-window-size'
 
 const rawBreakpoints = breakpoints.map(toRaw)
 
-export function useBreakpoint (mediaBreakpoints) {
+export function useBreakpoint (mediaBreakpoints = [0, 1, 2, 3]) {
   const { width } = useWindowSize()
 
   const index = useMemo(() => {
diff --git a/src/components/patterns/Layout.js b/src/components/patterns/Layout.js
index 8b6d4114a..59bd01379 100644
--- a/src/components/patterns/Layout.js
+++ b/src/components/patterns/Layout.js
@@ -31,7 +31,7 @@ const Layout = ({
   component = Box,
   ...props
 }) => {
-  const breakpoint = useBreakpoint([0, 1, 2, 3])
+  const breakpoint = useBreakpoint()
   const toolbarHeight = TOOLBAR_HEIGHTS[breakpoint]
 
   useEffect(() => {
diff --git a/src/helpers/hoc/with-link.js b/src/helpers/hoc/with-link.js
index d213a2c07..419144eb4 100644
--- a/src/helpers/hoc/with-link.js
+++ b/src/helpers/hoc/with-link.js
@@ -1,5 +1,6 @@
 /* global IntersectionObserver */
 
+import { useBreakpoint } from '../../components/hook/use-breakpoint'
 import { ArrowUpRight as ExternalIcon } from 'react-feather'
 import React, { useRef, useState, useEffect } from 'react'
 import { useLocation } from '@gatsbyjs/reach-router'
@@ -134,7 +135,14 @@ export const withLink = Component => {
       return { className: 'active' }
     }
 
-    if (prefetch && (!href || isInternal)) {
+    const isPrefetch =
+      useBreakpoint() > 1 &&
+      prefetch &&
+      href !== '/' &&
+      !href.startsWith('/docs') &&
+      (!href || isInternal)
+
+    if (isPrefetch) {
       return (
         <Component {...props}>
           <PrefetchLink