continue-reading.tsx

概述

"继续阅读"功能组件，根据用户上次保存的书签显示一个快速返回阅读位置的按钮。

组件

ContinueReadingButton

显示用户上次阅读章节的快速入口按钮。

功能特性：

• 检测本地存储中的阅读书签
• 自动获取并显示章节标题（支持多语言翻译）
• 提供一键跳转按钮
• 仅在存在书签时渲染

行为：

• 如果没有书签，组件返回 null（不渲染）
• 如果书签对应的章节不存在，组件返回 null
• 优先显示翻译后的章节标题，回退到原始标题

视觉样式：

• 使用主题色强调背景（bg-primary/5）
• 边框强调（border-primary/20）
• 书签图标带填充效果
• 圆角卡片布局

示例：

import { ContinueReadingButton } from "@/components/book/continue-reading";

export default function BookHomePage() {
  return (
    <div className="container">
      <h1>提示工程书籍</h1>
      
      {/* 显示继续阅读按钮（如果有书签） */}
      <ContinueReadingButton />
      
      <div className="book-content">
        {/* 其他内容 */}
      </div>
    </div>
  );
}

依赖

依赖	用途
next/link	导航链接
next-intl	国际化翻译
lucide-react	书签和箭头图标
@/components/ui/button	按钮组件
./sidebar	复用 useBookmark Hook
@/lib/book/chapters	章节数据查询

与侧边栏的协作

该组件与 sidebar.tsx 共享书签系统：

sidebar.tsx          continue-reading.tsx
    │                        │
    ├── saveBookmark() ──────┤
    │                        │
    └── useBookmark() ◄──────┘
            │
    localStorage (book-reading-progress)

当用户在 BookSidebar 中点击书签图标时，ContinueReadingButton 会自动显示对应的章节。