✨ feat: Add sorting functionality and improve responsive layout for book entries

[james20140802]

📝 Summary

This PR introduces sorting and filtering capabilities for the book entries on the Book Detail page, while significantly improving the layout and UI across both desktop and mobile environments. It also addresses a hydration error caused by invalid HTML nesting.

✨ Key Changes

• Sorting & Filtering Functionality:
  • Implemented real-time dropdown and tab filtering functionality for entries (All, Public, Private).
  • Added sorting logic to display entries by asc (oldest) or desc (newest).
• Responsive UI Improvements:
  • Revamped BookDetailContent layout: On desktop, the title, filters, and action buttons align smoothly on a single line. On mobile, components stack dynamically for a more compact and mobile-friendly view.
  • Refined the style of filter tabs and the sorting dropdown button so heights and paddings are fully uniform.
  • The "기록 추가하기" (Add Entry) button's text correctly adjusts its length on smaller screens to prevent visual clutter.
• Bug Fix: Resolves a React hydration error caused by a nested anchor (<a>) tag inside components/books/BookList.tsx

✅ Review Notes

• The visibility filters (Public/Private) are now correctly hidden when viewing a friend's profile, as only public entries are loaded for social viewing anyway.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
readiary	Ready	Preview, Comment	Mar 8, 2026 5:01am