[Feat] : 패치노트 페이지 위치 이동 및 타임라인 UI 적용 (#228) by GulSam00 · Pull Request #229 · GulSam00/singcode

GulSam00 · 2026-05-07T04:43:57Z

📌 PR 제목

[Feat] : 패치노트 페이지 위치 이동 및 타임라인 UI 적용

📌 변경 사항

패치노트 페이지를 /info/patch-notes 에서 /patch-notes 로 이동
사이드바에 패치노트 메뉴 항목 추가 (ScrollText 아이콘)
/info 페이지의 패치노트 메뉴 카드 제거
타임라인 형태 UI 로 개편 (날짜 · 도트 · 카드 3열 그리드)
changelog.json 각 버전 항목에 date 필드 추가
/patch-notes 경로를 auth.tsx 의 ALLOW_PATHS 에 추가하여 비로그인 접근 허용
SearchHistory 의 isHydrated 분기 로직 제거 및 빈 상태 메시지 추가
.claude/settings.json 에 bypassPermissions 기본 모드 추가

💬 추가 참고 사항

close 패치노트 페이지 추가 #228

vercel · 2026-05-07T04:44:01Z

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

Project	Deployment	Actions	Updated (UTC)
singcode	Ready	Preview, Comment	May 14, 2026 4:42pm

GulSam00 · 2026-05-07T04:44:07Z

/describe

GulSam00 · 2026-05-07T04:44:08Z

/review

qodo-code-review · 2026-05-07T04:44:09Z

Review Summary by Qodo

Add patch notes page with changelog display

✨ Enhancement

Walkthroughs

Description

• Add new patch notes page at /info/patch-notes route
• Display changelog entries in reverse chronological order with version cards
• Implement hierarchical bullet formatting for changelog messages
• Add patch notes menu item to info page with ScrollText icon

Diagram

flowchart LR
  A["Info Page"] -- "Add menu item" --> B["Patch Notes Page"]
  C["changelog.json"] -- "Import & reverse" --> B
  B -- "Render entries" --> D["Version Cards"]
  D -- "Format messages" --> E["Bullet List"]

File Changes

1. apps/web/src/app/info/page.tsx ✨ Enhancement +7/-1

Add patch notes menu item to info page

• Import ScrollText icon from lucide-react
• Add new patch notes menu item to menuItems array
• Configure menu item with id, title, description and icon

apps/web/src/app/info/page.tsx

2. apps/web/src/app/info/patch-notes/page.tsx ✨ Enhancement +59/-0

Implement patch notes page with changelog display

• Create new patch notes page component with client-side rendering
• Import and reverse changelog.json entries for display
• Render version cards with title and formatted message list
• Implement hierarchical bullet formatting with indentation for sub-items
• Add back navigation button and ScrollArea for scrollable content

apps/web/src/app/info/patch-notes/page.tsx

GulSam00 · 2026-05-07T04:44:09Z

/improve

qodo-code-review · 2026-05-07T04:44:10Z

Code Review by Qodo

🐞 Bugs (2) 📘 Rule violations (0) 📎 Requirement gaps (0)

Context used

✅ Tickets: 🎫 패치노트 페이지 추가

1. Unstable version ordering 🐞 Bug ≡ Correctness

Description

Patch notes are ordered via Object.entries(...).reverse(), which depends on JSON object insertion
order rather than semantic version ordering, so the displayed “latest first” order can become
incorrect if versions are inserted/reordered in the JSON. This can cause older releases to appear
above newer ones without any code change.

Code

apps/web/src/app/info/patch-notes/page.tsx[13]
+const entries = Object.entries(changelog as Record<string, ChangelogEntry>).reverse();

Evidence

The page reverses the object entry list instead of sorting by version; the changelog is a JSON
object keyed by version strings, so ordering correctness is tied to how keys are arranged in the
file (insertion order), not to the actual version values.

apps/web/src/app/info/patch-notes/page.tsx[11-14]
apps/web/public/changelog.json[1-20]

Agent prompt

The issue below was found during a code review. Follow the provided context and guidance below and implement a solution

## Issue description
`entries` is built using `Object.entries(changelog).reverse()`, which only reverses insertion order of object keys. This is not the same as “newest version first” and can silently break ordering when the JSON is edited.
### Issue Context
- `changelog.json` is a JSON object keyed by version strings.
- The UI intends to show the newest version first.
### Fix Focus Areas
- apps/web/src/app/info/patch-notes/page.tsx[11-14]
### Suggested fix
Replace `.reverse()` with an explicit sort comparator for version strings (e.g., split by `.` and compare numeric parts descending), or change `changelog.json` to an array already ordered newest-first and render it directly.

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools

2. Client bundles full changelog 🐞 Bug ➹ Performance

Description

PatchNotesPage is a client component and statically imports changelog.json, so the entire
changelog content is bundled into the route’s client-side JS. As changelog grows, this increases
download/parse cost unnecessarily for a read-only page.

Code

apps/web/src/app/info/patch-notes/page.tsx[R1-10]

+'use client';
+
+import { ArrowLeft } from 'lucide-react';
+import { useRouter } from 'next/navigation';
+
+import { Button } from '@/components/ui/button';
+import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
+import { ScrollArea } from '@/components/ui/scroll-area';
+import changelog from '../../../../public/changelog.json';
+

Evidence

The file is explicitly marked as a client component and imports the JSON at module scope; this
forces the JSON data into the client module graph for this route.

apps/web/src/app/info/patch-notes/page.tsx[1-10]

Agent prompt

The issue below was found during a code review. Follow the provided context and guidance below and implement a solution

## Issue description
The patch notes route ships `changelog.json` to the browser because the page is a client component and statically imports the JSON.
### Issue Context
This page appears read-only (no client-side state required besides back navigation), so it can be rendered as a server component and/or load data without bundling it into client JS.
### Fix Focus Areas
- apps/web/src/app/info/patch-notes/page.tsx[1-10]
### Suggested fix options
1) Convert to a server component (remove `'use client'`) and replace `router.back()` with a normal `<Link href="/info">` back button.
2) If you need it to stay client-side, fetch `/changelog.json` from `public` at runtime (or dynamically import on demand) to avoid embedding the entire JSON into the JS bundle.

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools

Previous review results

Review updated until commit f16ca9d

Results up to commit f16ca9d

🐞 Bugs (2) 📘 Rule violations (0) 📎 Requirement gaps (0)

Context used

✅ Tickets: 🎫 패치노트 페이지 추가

1. Unstable version ordering 🐞 Bug ≡ Correctness

Description

Patch notes are ordered via Object.entries(...).reverse(), which depends on JSON object insertion
order rather than semantic version ordering, so the displayed “latest first” order can become
incorrect if versions are inserted/reordered in the JSON. This can cause older releases to appear
above newer ones without any code change.

Code

apps/web/src/app/info/patch-notes/page.tsx[13]
+const entries = Object.entries(changelog as Record<string, ChangelogEntry>).reverse();

Evidence

The page reverses the object entry list instead of sorting by version; the changelog is a JSON
object keyed by version strings, so ordering correctness is tied to how keys are arranged in the
file (insertion order), not to the actual version values.

apps/web/src/app/info/patch-notes/page.tsx[11-14]
apps/web/public/changelog.json[1-20]

Agent prompt

The issue below was found during a code review. Follow the provided context and guidance below and implement a solution

### Issue description
`entries` is built using `Object.entries(changelog).reverse()`, which only reverses insertion order of object keys. This is not the same as “newest version first” and can silently break ordering when the JSON is edited.

### Issue Context
- `changelog.json` is a JSON object keyed by version strings.
- The UI intends to show the newest version first.

### Fix Focus Areas
- apps/web/src/app/info/patch-notes/page.tsx[11-14]

### Suggested fix
Replace `.reverse()` with an explicit sort comparator for version strings (e.g., split by `.` and compare numeric parts descending), or change `changelog.json` to an array already ordered newest-first and render it directly.

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools

2. Client bundles full changelog 🐞 Bug ➹ Performance

Description

PatchNotesPage is a client component and statically imports changelog.json, so the entire
changelog content is bundled into the route’s client-side JS. As changelog grows, this increases
download/parse cost unnecessarily for a read-only page.

Code

apps/web/src/app/info/patch-notes/page.tsx[R1-10]

+'use client';
+
+import { ArrowLeft } from 'lucide-react';
+import { useRouter } from 'next/navigation';
+
+import { Button } from '@/components/ui/button';
+import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
+import { ScrollArea } from '@/components/ui/scroll-area';
+import changelog from '../../../../public/changelog.json';
+

Evidence

The file is explicitly marked as a client component and imports the JSON at module scope; this
forces the JSON data into the client module graph for this route.

apps/web/src/app/info/patch-notes/page.tsx[1-10]

Agent prompt

The issue below was found during a code review. Follow the provided context and guidance below and implement a solution

### Issue description
The patch notes route ships `changelog.json` to the browser because the page is a client component and statically imports the JSON.

### Issue Context
This page appears read-only (no client-side state required besides back navigation), so it can be rendered as a server component and/or load data without bundling it into client JS.

### Fix Focus Areas
- apps/web/src/app/info/patch-notes/page.tsx[1-10]

### Suggested fix options
1) Convert to a server component (remove `'use client'`) and replace `router.back()` with a normal `<Link href="/info">` back button.
2) If you need it to stay client-side, fetch `/changelog.json` from `public` at runtime (or dynamically import on demand) to avoid embedding the entire JSON into the JS bundle.

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools

qodo-code-review · 2026-05-07T06:02:27Z

Code Review by Qodo

New Review Started

This review has been superseded by a new analysis

qodo-code-review · 2026-05-07T06:02:28Z

Persistent review updated to latest commit f16ca9d

qodo-code-review · 2026-05-07T06:02:33Z

PR Description updated to latest commit (f16ca9d)

Copy walkthrough table to "Files Changed" Tab

GulSam00 · 2026-05-14T16:41:25Z

/describe

qodo-code-review · 2026-05-14T16:41:29Z

Qodo reviews are paused for this user.

Troubleshooting steps vary by plan Learn more →

On a Teams plan?
Reviews resume once this user has a paid seat and their Git account is linked in Qodo.
Link Git account →

Using GitHub Enterprise Server, GitLab Self-Managed, or Bitbucket Data Center?
These require an Enterprise plan - Contact us
Contact us →

GulSam00 · 2026-05-14T16:41:31Z

/review

qodo-code-review · 2026-05-14T16:41:34Z

Qodo reviews are paused for this user.

Troubleshooting steps vary by plan Learn more →

On a Teams plan?
Reviews resume once this user has a paid seat and their Git account is linked in Qodo.
Link Git account →

Using GitHub Enterprise Server, GitLab Self-Managed, or Bitbucket Data Center?
These require an Enterprise plan - Contact us
Contact us →

GulSam00 · 2026-05-14T16:41:35Z

/improve

qodo-code-review · 2026-05-14T16:41:38Z

Qodo reviews are paused for this user.

Troubleshooting steps vary by plan Learn more →

On a Teams plan?
Reviews resume once this user has a paid seat and their Git account is linked in Qodo.
Link Git account →

Using GitHub Enterprise Server, GitLab Self-Managed, or Bitbucket Data Center?
These require an Enterprise plan - Contact us
Contact us →

GulSam00 · 2026-05-14T16:51:04Z

/describe

qodo-code-review · 2026-05-14T16:51:09Z

Qodo reviews are paused for this user.

Troubleshooting steps vary by plan Learn more →

On a Teams plan?
Reviews resume once this user has a paid seat and their Git account is linked in Qodo.
Link Git account →

Using GitHub Enterprise Server, GitLab Self-Managed, or Bitbucket Data Center?
These require an Enterprise plan - Contact us
Contact us →

GulSam00 · 2026-05-14T16:51:10Z

/review

qodo-code-review · 2026-05-14T16:51:14Z

Qodo reviews are paused for this user.

Troubleshooting steps vary by plan Learn more →

On a Teams plan?
Reviews resume once this user has a paid seat and their Git account is linked in Qodo.
Link Git account →

Using GitHub Enterprise Server, GitLab Self-Managed, or Bitbucket Data Center?
These require an Enterprise plan - Contact us
Contact us →

GulSam00 · 2026-05-14T16:51:15Z

/improve

qodo-code-review · 2026-05-14T16:51:18Z

Qodo reviews are paused for this user.

Troubleshooting steps vary by plan Learn more →

On a Teams plan?
Reviews resume once this user has a paid seat and their Git account is linked in Qodo.
Link Git account →

Using GitHub Enterprise Server, GitLab Self-Managed, or Bitbucket Data Center?
These require an Enterprise plan - Contact us
Contact us →

feat : 패치노트 페이지 추가 (#228)

f16ca9d

GulSam00 added 3 commits May 15, 2026 01:39

feat : 패치노트 페이지를 /patch-notes 로 이동하고 타임라인 UI 적용 (#228)

8f4b0c7

refactor : SearchHistory 의 hydration 분기 로직 제거 및 빈 상태 메시지 추가 (#228)

c3c7dac

chore : claude settings 에 bypassPermissions 기본 모드 추가 (#228)

1f5047d

GulSam00 changed the title ~~[Feat] : 패치노트 페이지 추가 (#228)~~ [Feat] : 패치노트 페이지 위치 이동 및 타임라인 UI 적용 (#228) May 14, 2026

vercel Bot deployed to Preview May 14, 2026 16:42 View deployment

Conversation

GulSam00 commented May 7, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

📌 PR 제목