chore: disable prefetch for mobile

microlinkhq · Jul 21, 2024 · 97d6fbf · 97d6fbf
1 parent d9bfd9f
commit 97d6fbf
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 2 deletions.
diff --git 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
@@ -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
@@ -1,5 +1,6 @@
 /* global IntersectionObserver */
 
+import { useBreakpoint } from 'components/hook'
 import { ArrowUpRight as ExternalIcon } from 'react-feather'
 import React, { useRef, useState, useEffect } from 'react'
 import { useLocation } from '@gatsbyjs/reach-router'
@@ -110,6 +111,7 @@ export const withLink = Component => {
     icon,
     ...props
   }) => {
+    const breakpoint = useBreakpoint()
     const [isIntersecting, setIsIntersecting] = useState(false)
     const location = useLocation()
     const isInternal = isInternalLink(href)
@@ -135,6 +137,7 @@ export const withLink = Component => {
     }
 
     const isPrefetch =
+      breakpoint > 1 &&
       prefetch &&
       href !== '/' &&
       !href.startsWith('/docs') &&