feat: Claude Code 작업 환경 검증용 404 페이지 이스터에그 게임 구현

[INSANE-P]

작업 내용

올클 404 페이지에 Chrome dino 오마주 미니 점프 게임 추가:

• 픽셀-아트 SVG 에셋 (선인장 3종, 구름, 지면 패턴, 다시시작 아이콘, X눈 비활성 로고)
• FSD 패턴 따른 모듈 분리 (lib/jumpGameConfig, model/types + useJumpGame, ui/JumpGame + ObstacleShape)
• 404 페이지 레이아웃에 통합

변경 사항 및 리뷰 포인트

리뷰 포인트:

• useJumpGame 훅 안의 ref 다수 사용 — 게임 루프(raf)가 매 프레임 mutate 해야 하는 값이라 state 대신 ref. React 외부에서 state 추적하는 패턴.
• keydown listener 의 ref 패턴 (useJumpGame.ts:64-77) — useCallback 메모 대신 handleActionRef 로 stale closure 회피. 마운트 1회만 등록.
• raw <button> 사용 (JumpGame.tsx:105) — 디자인 시스템 Button 대신. pixel-art 톤 일관성 + pointer-events-auto 커스텀 필요. .claude/rules/allcll-ui.md 의 "단발성 화면 전용 raw element" 케이스.
• 물리 검증 — SPEED_INITIAL=2.5, JUMP_VELOCITY=8, GRAVITY=0.5, 캐릭터 36×36, 장애물 최대 32×32. 가장 빡빡한 케이스 마진 ~12% 확보, SPEED_MAX=6 까지 가속해도 클리어 가능.

[sonarqubecloud]

Quality Gate failed

Failed conditions
4 Security Hotspots
B Reliability Rating on New Code (required ≥ A)

See analysis details on SonarQube Cloud

Catch issues before they fail your Quality Gate with our IDE extension SonarQube for IDE

[github-actions]

🚀 Preview Deployment

• Client: https://dev.allcll.kr/pr-353/
• Admin: https://dev-admin.allcll.kr/pr-353/

This preview is automatically updated on each push.

[INSANE-P]

/review 결과

변경 파일 (벤치마크: develop 기준, easter-egg 작업분):

• packages/client/src/pages/notfound/NotFound.tsx (수정)
• packages/client/src/pages/notfound/{lib,model,ui}/*.{ts,tsx} (5 신규)
• packages/client/src/assets/notfound/*.svg (6 신규)
• packages/client/src/assets/logo/ci-dead.svg (1 신규)

절대 규칙

	항목	결과
✅	1. fetch() 직접 호출	diff 검색 결과 0건
✅	2. barrel index.ts 신규 생성	packages/client/src/**/index.ts 추가 0건
✅	3. packages/{allcll-ui,sejong-ui}/ 미수정	디자인 시스템 패키지 변경 0건
✅	4. FSD 레이어 import 방향	모든 import 가 @/pages/notfound/ 슬라이스 내부 또는 @/assets/. 역방향 import 없음
ℹ️	5. 빌드 검증	packages/client/src/**/*.ts(x) 변경 있음. push 시점 husky pre-push 자동 검증 (이미 /pr-ready 에서 통과 확인됨)
✅	6. simulation UI 격리	widgets/simulation/ pages/simulation/ 변경 없음 (해당 없음)

보조 점검

	항목	결과
⚠️	디자인 시스템 우선 사용	diff 라인 152 의 + <button 신규 추가 — packages/client/src/pages/notfound/ui/JumpGame.tsx:105 다시시작 아이콘 버튼. 의도된 예외: pixel-art 톤 일관성 + pointer-events-auto 커스텀 + 이스터에그 단발 UI. .claude/rules/allcll-ui.md 의 "단발성 화면 전용" 케이스
✅	Mutation onSuccess invalidate	신규 useMutation 0건 (해당 없음)
✅	persist store name 충돌	신규 persist({...}) 0건 (해당 없음)
✅	cleanup 누락	신규 setInterval/setTimeout/EventSource 0건. addEventListener/requestAnimationFrame 은 모두 cleanup 짝 갖춤
✅	SimulationStatusType	shared/model/types.ts 변경 없음 (해당 없음)

다음 단계

• ❌ 항목 없음
• ⚠️ raw <button> 1건은 의도된 예외라 OK 판단 — 리뷰어가 컨센서스 확인하면 됨
• 빌드는 이미 통과, 다음은 push → PR 본문 채워서 gh pr create

[chatgpt-codex-connector]

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 9bc39f3dd7

ℹ️ About Codex in GitHub

Codex has been enabled to automatically review pull requests in this repo. Reviews are triggered when you

• Open a pull request for review
• Mark a draft as ready
• Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

When you sign up for Codex through ChatGPT, Codex can also answer questions or update the PR, like "@codex address that feedback".

[chatgpt-codex-connector]

Don't skip first-push builds on short branches

When a developer pushes a new branch with no upstream and fewer than five commits, HEAD~5..HEAD fails and the fallback git diff --name-only HEAD only compares the working tree against HEAD; on a clean push that yields no changed files, so client/admin source changes are treated as absent and the pre-push build is skipped. This defeats the hook in the exact “first push” case described by the comment; use a valid base such as the merge-base with the target branch or git diff-tree --name-only over the pushed commits instead.

Useful? React with 👍 / 👎.

[hyunwoo0081]

위험

버그, 런타임 에러, 빌드 실패 가능성이 있는 항목. 반드시 이번 PR에서 수정.

• 없음.

중간

컨벤션 위반, 관심사 미분리, allcll-ui 미적용 등. 이번 PR에서 수정 권장.

• [packages/client/src/pages/notfound/ui/ObstacleShape.tsx:6] Props 타입 정의 컨벤션

  • 이유: 팀 컨벤션 상 props 타입은 \interface\를 사용하고 \I\ 접두사를 붙여야 합니다.
  • 수정 방향: \interface IObstacleShapeProps { type: ObstacleType; }\ 로 수정 권장합니다.

• [packages/client/src/pages/notfound/ui/JumpGame.tsx:105] raw <button>\ 태그 사용

  • 이유: 디자인 시스템 컴포넌트(\IconButton\ 등)를 사용하지 않고 직접 <button>\을 구현했습니다.
  • 수정 방향: 픽셀 아트 테마를 위해 raw element를 사용한 것으로 보이나, \�llcll-ui\의 \IconButton\에 \�sChild\를 사용하여 \RefreshSvg\를 렌더링하거나, 스타일 커스텀을 통해 일관성을 유지할 수 있는지 검토 바랍니다.

낮음

네이밍 개선, 리팩토링 제안 등. 추후 작업으로 미뤄도 무방.

• [FSD 레이어 배치] \JumpGame\ 컴포넌트 위치
  • 이유: 사용자 행동이 포함된 독립적인 게임 기능이므로 \pages\ 레이어보다는 \eatures\ 또는 \widgets\ 레이어가 더 적절해 보입니다.
  • 수정 방향: 현재는 404 전용 이스터에그이므로 수용 가능하나, 추후 다른 곳에서도 사용될 여지가 있다면 \eatures/jump-game\ 등으로의 이동을 제안합니다.