fix(sitemap): fix sitemap for in site image links (#161)

Author: ZL-Asica

CHANGELOG.md

@@ -1,5 +1,11 @@
 # SuzuBlog Changelog
 
+## 1.8.2 (2025-04-21)
+
+### Patch Changes
+
+- Fix sitemap for in site image links
+
 ## 1.8.1 (2025-04-20)
 
 ### Patch Changes

package.json

@@ -1,6 +1,6 @@
 {
   "name": "suzu-blog",
-  "version": "1.8.1",
+  "version": "1.8.2",
   "private": true,
   "packageManager": "[email protected]",
   "author": {

src/app/sitemap.ts

@@ -2,52 +2,59 @@ import type { MetadataRoute } from 'next'
 
 import { getConfig } from '@/services/config'
 import { getAllPosts } from '@/services/content'
+import { generateImageUrl } from '@/services/utils'
 
 async function sitemap(): Promise<MetadataRoute.Sitemap> {
   const config = getConfig()
   const siteUrl = config.siteUrl
   const updateDate = new Date()
 
-  // Load posts data from JSON file
+  // Load posts data
   const posts = await getAllPosts()
 
-  // Generate sitemap entries for each post
-  const postUrls = posts.map(post => ({
-    url: `${siteUrl}/${post.slug}`,
-    lastModified: post.lastModified || updateDate,
-    changeFrequency: 'weekly' as const,
-    priority: 0.5,
-    images: post.frontmatter.showThumbnail && post.frontmatter.thumbnail !== undefined
-      ? [post.frontmatter.thumbnail]
-      : [],
-  }))
-
-  // Pages settings
-  const showAnime = config.anilist_username === undefined || config.anilist_username !== null || config.anilist_username !== ''
-
-  const pages = [`${siteUrl}/posts`, `${siteUrl}/about`, `${siteUrl}/friends`]
-
-  if (showAnime) {
-    pages.push(`${siteUrl}/about/anime`)
-  }
-
-  const pagesSitemap = pages.map(page => ({
-    url: page,
+  const makeSitemapItem = (
+    url: string,
+    options?: Partial<MetadataRoute.Sitemap[number]>,
+  ): MetadataRoute.Sitemap[number] => ({
+    url,
     lastModified: updateDate,
-    changeFrequency: 'monthly' as const,
+    changeFrequency: 'monthly',
+    priority: 0.8,
+    ...options,
+  })
+
+  // Generate sitemap entries for each post
+  const postUrls = posts.map(post =>
+    makeSitemapItem(`${siteUrl}/${post.slug}`, {
+      changeFrequency: 'weekly',
+      priority: 0.5,
+      images: post.frontmatter.showThumbnail
+        ? generateImageUrl(siteUrl, post.frontmatter.thumbnail)
+        : undefined,
+    }),
+  )
+  const homepage = makeSitemapItem(siteUrl, {
+    changeFrequency: 'yearly',
+    priority: 1,
+  })
+
+  const aboutPage = makeSitemapItem(`${siteUrl}/about`, {
     priority: 0.8,
-  }))
-
-  return [
-    {
-      url: siteUrl,
-      lastModified: updateDate,
-      changeFrequency: 'yearly',
-      priority: 1,
-    },
-    ...pagesSitemap, // Static page
-    ...postUrls, // Dynamic post URLs
+    images: generateImageUrl(siteUrl, config.avatar),
+  })
+
+  const showAnime = Boolean(config.anilist_username?.trim())
+  const staticPages = [
+    { path: '/posts', priority: 0.6 },
+    { path: '/friends', priority: 0.4 },
+    ...(showAnime ? [{ path: '/about/anime', priority: 0.5 }] : []),
   ]
+
+  const staticSitemap = staticPages.map(({ path, priority }) =>
+    makeSitemapItem(`${siteUrl}${path}`, { priority }),
+  )
+
+  return [homepage, aboutPage, ...staticSitemap, ...postUrls]
 }
 
 export default sitemap

src/components/article/TOC.tsx

@@ -1,7 +1,7 @@
 'use client'
 
 import { useTOCLogic } from '@/hooks'
-import { useIsTop } from '@zl-asica/react'
+import { useIsBottom, useIsTop } from '@zl-asica/react'
 import { List } from 'lucide-react'
 
 import TOCLink from './TOCLink'
@@ -20,7 +20,13 @@ const TOC = ({
   showThumbnail = true,
 }: TOCProps) => {
   const { activeSlug, isOpen, toggleOpen, handleLinkClick, tocReference } = useTOCLogic()
-  const isVisible = !useIsTop(showThumbnail ? 150 : 50)
+  const isTop = !useIsTop(showThumbnail ? 150 : 50)
+  const isBottom = !useIsBottom(50)
+  const isVisible = isTop && isBottom
+
+  if (items.length === 0) {
+    return null
+  }
 
   return (
     <div

src/services/utils/generateImageUrl.ts

@@ -0,0 +1,15 @@
+const generateImageUrl = (
+  siteUrl: string,
+  image?: string,
+): string[] | undefined => {
+  if (image === undefined || image === null || image.trim() === '') {
+    return undefined
+  }
+  if (image.startsWith('http')) {
+    return [image]
+  }
+  const normalizedPath = image.startsWith('/') ? image : `/images/${image}`
+  return [`${siteUrl}${normalizedPath}`]
+}
+
+export default generateImageUrl

src/services/utils/index.ts

@@ -2,4 +2,5 @@ export {
   default as generateHierarchicalSlug,
   slugPrefix,
 } from './generateHierarchicalSlug'
+export { default as generateImageUrl } from './generateImageUrl'
 export { sanitizeQuery, validateParameters } from './searchUtils'