use next/link

safe-global · Apr 2, 2024 · bf078e0 · bf078e0
1 parent 6a65a0b
commit bf078e0
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 7 deletions.
diff --git a/src/components/Blog/FeaturedPost/index.tsx b/src/components/Blog/FeaturedPost/index.tsx
@@ -1,6 +1,6 @@
 import Image from 'next/image'
 import Tags from '@/components/Blog/Tags'
-import { Box, Grid, Link, Typography } from '@mui/material'
+import { Box, Grid, Typography } from '@mui/material'
 import css from './styles.module.css'
 import blogCss from '../styles.module.css'
 import { formatBlogDate } from '@/components/Blog/utils/formatBlogDate'
@@ -10,6 +10,7 @@ import { isAsset } from '@/lib/typeGuards'
 import CategoryIcon from '@/public/images/Blog/category-icon.svg'
 import { AppRoutes } from '@/config/routes'
 import { containsTag, PRESS_RELEASE_TAG } from '@/lib/containsTag'
+import NextLink from 'next/link'
 
 const FeaturedPost = (props: BlogPostEntry) => {
   const { slug, coverImage, category, date, title, excerpt, tags, content } = props.fields
@@ -26,15 +27,15 @@ const FeaturedPost = (props: BlogPostEntry) => {
       <Grid container columnSpacing="60px" rowGap={3}>
         <Grid item md={7}>
           {isAsset(coverImage) && coverImage.fields.file?.url ? (
-            <Link href={`/blog/${slug}`}>
+            <NextLink href={`/blog/${slug}`}>
               <Image
                 src={coverImage.fields.file.url}
                 alt={coverImage.fields.title ?? ''}
                 width={coverImage.fields.file.details.image?.width}
                 height={coverImage.fields.file.details.image?.height}
                 className={css.image}
               />
-            </Link>
+            </NextLink>
           ) : undefined}
         </Grid>
 
@@ -50,7 +51,7 @@ const FeaturedPost = (props: BlogPostEntry) => {
             <Typography variant="caption">{formatBlogDate(date)}</Typography>
           </div>
           <Typography variant="h3" className={css.title}>
-            <Link href={`${AppRoutes.blog.index}/${slug}`}>{title}</Link>
+            <NextLink href={`${AppRoutes.blog.index}/${slug}`}>{title}</NextLink>
           </Typography>
           <Typography className={css.excerpt}>{excerpt}</Typography>
 

diff --git a/src/pages/blog/[slug].tsx b/src/pages/blog/[slug].tsx
@@ -4,7 +4,7 @@ import { client, previewClient } from '@/lib/contentful'
 import { useRouter } from 'next/router'
 import { useEffect, useState } from 'react'
 
-const fetchDraftContent = async (slug: string, isPreview: boolean) => {
+const fetchContent = async (slug: string, isPreview: boolean) => {
   const cfClient = isPreview ? previewClient : client
 
   const content = await cfClient.getEntries<TypePostSkeleton>({
@@ -18,12 +18,11 @@ const fetchDraftContent = async (slug: string, isPreview: boolean) => {
 const Page = () => {
   const router = useRouter()
   const { slug, secret } = router.query as { slug: any; secret: string }
-  console.log('router query', router.query)
   const [blogPost, setBlogPost] = useState<BlogPostEntry | null>(null)
 
   useEffect(() => {
     if (slug) {
-      fetchDraftContent(slug, !!secret).then((content) => {
+      fetchContent(slug, !!secret).then((content) => {
         setBlogPost(content)
       })
     }