Skip to content

chore: 이미지 에셋 SVG 전환 및 메타데이터 업데이트 - #99

Merged
evenif99 merged 4 commits into
devfrom
chore/image-asset-update
Jun 22, 2026
Merged

chore: 이미지 에셋 SVG 전환 및 메타데이터 업데이트#99
evenif99 merged 4 commits into
devfrom
chore/image-asset-update

Conversation

@lyla-bae

@lyla-bae lyla-bae commented Jun 22, 2026

Copy link
Copy Markdown
Member

Summary

image
  • favicon, ogimg PNG → SVG로 교체
  • layout.tsx 메타데이터에 favicon, OG 이미지 경로 적용
  • 앱 타이틀 TALKY-OWL말해부엉 업데이트

Test plan

  • 브라우저 탭 favicon 표시 확인
  • 카카오/슬랙 등 링크 공유 시 OG 이미지 노출 확인

🤖 Generated with Claude Code

Summary by CodeRabbit

릴리스 노트

  • 스타일/시각 개선

    • 전반적으로 로고·캐릭터·아이콘·로딩 이미지 등 이미지 리소스를 SVG로 교체해 표시 품질과 로딩 효율을 개선했습니다.
    • 기본 아바타 썸네일도 SVG 기본값으로 변경되었습니다.
  • 메타데이터 업데이트

    • 브라우저 탭 제목과 소셜 미디어 미리보기용 메타데이터(아이콘, Open Graph)를 업데이트했습니다.

lyla-bae and others added 2 commits June 22, 2026 10:38
- favicon.png, ogimg.png를 SVG로 교체
- layout.tsx 메타데이터에 favicon, OG 이미지 경로 추가
- 앱 타이틀 말해부엉으로 업데이트

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
@vercel

vercel Bot commented Jun 22, 2026

Copy link
Copy Markdown

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

Project Deployment Actions Updated (UTC)
talky-owl Ready Ready Preview, Comment Jun 22, 2026 2:09am

@coderabbitai

coderabbitai Bot commented Jun 22, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Repository UI (base), Organization UI (inherited)

Review profile: CHILL

Plan: Pro Plus

Run ID: a505e072-07f5-4f29-ae18-1dffa342f6f8

📥 Commits

Reviewing files that changed from the base of the PR and between f0dc9d4 and bd3e231.

⛔ Files ignored due to path filters (2)
  • public/images/common/ogimg.jpg is excluded by !**/*.jpg
  • public/images/common/thumbnail-default.svg is excluded by !**/*.svg
📒 Files selected for processing (1)
  • src/app/layout.tsx
🚧 Files skipped from review as they are similar to previous changes (1)
  • src/app/layout.tsx

📝 Walkthrough

요약

앱 전반에 걸쳐 이미지 에셋을 PNG에서 SVG로 교체했습니다. layout.tsx에서 앱 메타데이터(title, icons, openGraph)를 추가했으며, 다수의 컴포넌트 파일에서 세미콜론 및 JSX 줄바꿈 등 코드 포매팅을 정리했습니다.

변경 사항

이미지 에셋 SVG 전환, 메타데이터 추가 및 코드 포매팅 정리

Layer / File(s) Summary
앱 메타데이터 및 레이아웃 업데이트
src/app/layout.tsx
metadatatitle'말해부엉'으로 변경하고 icons, openGraph(제목/설명/이미지 URL/크기/alt) 필드를 신규 추가. RootLayoutchildren 타입 선언을 인라인 형태로 정리.
공유 UI 컴포넌트 SVG 에셋 교체
src/components/ui/Avatar.tsx, src/components/ui/Spinner.tsx, src/components/layout/Header.tsx
AvatarFALLBACK_SRC, Spinner의 로딩 이미지, Header의 로고 이미지를 모두 .svg로 교체. Header의 JSX 포맷(줄바꿈, subtitle 조건부 렌더링 표기) 정리.
페이지별 이미지 SVG 교체 및 포매팅
src/app/page.tsx, src/app/(page)/login/page.tsx, src/app/(page)/join/[token]/page.tsx
홈의 character-home, 로그인의 login_character·logo, 조인 페이지의 모든 상태별 캐릭터 이미지(character-welcome, 에러/종료/만료 상태)를 SVG로 교체. JSX 포맷 정리.
홈 화면 컴포넌트 SVG 교체 및 포매팅
src/components/home/ActiveCasesSection.tsx, src/components/home/HomeServiceInfo.tsx
ActiveCasesSection의 빈 상태 이미지(character-case)와 HomeServiceInfo의 로고 이미지를 SVG로 교체. 세미콜론 기반 코드 스타일 정리.
기록 카드 및 목록 컴포넌트 SVG 교체
src/components/ui/CaseRecordCard.tsx, src/components/records/RecordListSection.tsx
아바타 fallback 및 빈 상태 이미지(character-case)를 SVG로 교체. CaseRecordCard에서 formatDate 결과를 const date로 분리. JSX 포맷 정리.
분쟁/판결 페이지 SVG 교체 및 포매팅
src/app/(page)/disputes/[id]/page.tsx, src/components/judgement/JudgmentResult.tsx
DisputePage의 참여자 아바타 fallback을 SVG로 교체하고 푸터 버튼 onClick을 조건 연산자 형태로 재작성. JudgmentResult의 선물 아이콘을 SVG로 교체하고 전반적인 포맷 정리.

코드 리뷰 노력

🎯 2 (Simple) | ⏱️ ~10 minutes

관련 가능성이 있는 PR

  • I5-Project/TALKY-OWL#52: ActiveCasesSection과 아바타/빈 상태 썸네일 에셋을 도입한 PR로, 본 PR에서 해당 이미지들을 SVG로 전환하는 변경과 직접 연관됩니다.
  • I5-Project/TALKY-OWL#90: JudgmentResult.tsx의 판결 결과 페이지를 구현한 PR로, 본 PR에서 해당 컴포넌트의 선물 아이콘을 SVG로 교체하고 포맷을 정리하는 변경과 연관됩니다.
  • I5-Project/TALKY-OWL#97: RecordListSection.tsx를 신규 API/훅 기반으로 재작성한 PR로, 본 PR에서 동일 컴포넌트의 빈 상태 이미지를 SVG로 교체하는 변경과 직접 연관됩니다.

제안 리뷰어

  • evenif99

시 🐰

🦉 부엉이가 날개를 펼치며 말하네,
PNG는 이제 안녕, SVG로 날아가!
로고도 캐릭터도 선명하게 빛나고,
세미콜론 하나하나 가지런히 놓이네.
토끼가 코드 숲을 깡총깡총 뛰어다니며
포맷을 정리하니 세상이 아름답구나! ✨

🚥 Pre-merge checks | ✅ 3 | ❌ 2

❌ Failed checks (2 warnings)

Check name Status Explanation Resolution
Description check ⚠️ Warning PR 설명이 필수 템플릿 섹션을 대부분 누락했습니다. 작업 내용, 담당 영역, 변경 사항 상세 등이 불충분하며 체크리스트 항목들도 대부분 비어있습니다. 템플릿의 1~12 섹션을 완성하세요. 특히 작업 내용, 담당 영역 선택, 변경 사항 상세, 테스트 결과, 작업 범위 및 보안 확인 체크리스트를 작성하세요.
Docstring Coverage ⚠️ Warning Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Write docstrings for the functions missing them to satisfy the coverage threshold.
✅ Passed checks (3 passed)
Check name Status Explanation
Title check ✅ Passed 제목은 PR의 주요 변경 사항인 이미지 에셋 SVG 전환과 메타데이터 업데이트를 명확하게 요약하고 있습니다.
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch chore/image-asset-update

Comment @coderabbitai help to get the list of available commands and usage tips.

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@src/app/layout.tsx`:
- Around line 22-33: The openGraph.images configuration in the layout.tsx file
uses an SVG image format (ogimg.svg) which is not reliably supported by Kakao
Talk and Slack for og:image meta tags. These platforms only officially support
raster image formats like PNG, JPEG, or GIF. Change the url value in the
openGraph.images array from the SVG file path to a raster format equivalent such
as ogimg.png or ogimg.jpg, and ensure the corresponding raster image file exists
in the public images directory to enable proper link preview functionality
across these platforms.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Repository UI (base), Organization UI (inherited)

Review profile: CHILL

Plan: Pro Plus

Run ID: 303d3d28-73ae-47f2-82a0-6fe2e3ff78e1

📥 Commits

Reviewing files that changed from the base of the PR and between 72d96d7 and f0dc9d4.

⛔ Files ignored due to path filters (24)
  • package-lock.json is excluded by !**/package-lock.json
  • public/images/characters/character-blocked.png is excluded by !**/*.png
  • public/images/characters/character-blocked.svg is excluded by !**/*.svg
  • public/images/characters/character-case.png is excluded by !**/*.png
  • public/images/characters/character-case.svg is excluded by !**/*.svg
  • public/images/characters/character-closed.png is excluded by !**/*.png
  • public/images/characters/character-closed.svg is excluded by !**/*.svg
  • public/images/characters/character-gift.png is excluded by !**/*.png
  • public/images/characters/character-gift.svg is excluded by !**/*.svg
  • public/images/characters/character-home.png is excluded by !**/*.png
  • public/images/characters/character-home.svg is excluded by !**/*.svg
  • public/images/characters/character-loading.png is excluded by !**/*.png
  • public/images/characters/character-loading.svg is excluded by !**/*.svg
  • public/images/characters/character-welcome.png is excluded by !**/*.png
  • public/images/characters/character-welcome.svg is excluded by !**/*.svg
  • public/images/common/favicon.svg is excluded by !**/*.svg
  • public/images/common/login_character.png is excluded by !**/*.png
  • public/images/common/login_character.svg is excluded by !**/*.svg
  • public/images/common/logo.png is excluded by !**/*.png
  • public/images/common/logo.svg is excluded by !**/*.svg
  • public/images/common/logo_kakao.svg is excluded by !**/*.svg
  • public/images/common/ogimg.svg is excluded by !**/*.svg
  • public/images/common/thumbnail-default.png is excluded by !**/*.png
  • public/images/common/thumbnail-default.svg is excluded by !**/*.svg
📒 Files selected for processing (13)
  • src/app/(page)/disputes/[id]/page.tsx
  • src/app/(page)/join/[token]/page.tsx
  • src/app/(page)/login/page.tsx
  • src/app/layout.tsx
  • src/app/page.tsx
  • src/components/home/ActiveCasesSection.tsx
  • src/components/home/HomeServiceInfo.tsx
  • src/components/judgement/JudgmentResult.tsx
  • src/components/layout/Header.tsx
  • src/components/records/RecordListSection.tsx
  • src/components/ui/Avatar.tsx
  • src/components/ui/CaseRecordCard.tsx
  • src/components/ui/Spinner.tsx

Comment thread src/app/layout.tsx
@evenif99
evenif99 merged commit 42e1668 into dev Jun 22, 2026
3 checks passed
@evenif99
evenif99 deleted the chore/image-asset-update branch June 25, 2026 04:13
@coderabbitai coderabbitai Bot mentioned this pull request Jun 25, 2026
4 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants