[FEAT/#24] 공용 divider 구현 완료

[taegeon2]

📝 요약

• 공통 컴포넌트 divider을 구현했습니다.

⚙️ 작업 내용

• src/shared/ui/divider/ 폴더 생성
• Divider.tsx 컴포넌트 구현
• src/shared/ui/index.ts에 divider export 추가
• 메인 페이지 src/app/(tabs)/index.tsx에 Divider 컴포넌트 추가

🔗 관련 이슈

• Closes [FEAT/#24] 공통 컴포넌트 divider 구현 #24

✅ 체크리스트

• 코딩 컨벤션(Biome/Lint)을 준수하였습니다.
• 모든 타입 에러를 해결하였습니다. (Typecheck)
• 변경 사항에 대한 테스트를 마쳤습니다.
• 불필요한 로그(console.log)를 제거하였습니다.

💬 리뷰어에게

[gemini-code-assist]

Summary of Changes

Hello @taegeon2, I'm Gemini Code Assist¹! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

이 PR은 애플리케이션 전반에 걸쳐 일관된 UI를 제공하기 위한 공용 Divider 컴포넌트를 도입합니다. 이 컴포넌트는 재사용성을 높이고 개발자가 UI 요소를 구분하는 데 필요한 노력을 줄여줍니다. 또한, 여러 파일에서 코드 가독성을 개선하기 위한 포맷팅 변경이 포함되어 있습니다.

Highlights

• 공용 Divider 컴포넌트 구현: 애플리케이션 전반에 걸쳐 재사용 가능한 공용 Divider 컴포넌트가 새로 구현되었습니다.
• Divider 컴포넌트 전역 내보내기: Divider 컴포넌트가 src/shared/ui 모듈을 통해 전역적으로 내보내져 다른 컴포넌트에서 쉽게 사용할 수 있습니다.
• 메인 페이지에 Divider 예시 추가: 메인 페이지 (src/app/(tabs)/index.tsx)에 새로 구현된 Divider 컴포넌트의 사용 예시가 추가되었습니다.
• 코드 포맷팅 개선: 여러 기존 파일에서 코드 가독성을 높이기 위한 포맷팅 변경 (예: 임포트 및 props 구조 분해 할당)이 적용되었습니다.

Changelog

• src/app/(tabs)/index.tsx
  • Divider 컴포넌트를 임포트했습니다.
  • 메인 화면에 Divider 컴포넌트 예시를 추가했습니다.
• src/entities/chat/index.ts
  • 타입 내보내기 구문을 여러 줄로 포맷팅했습니다.
• src/entities/chat/ui/ChatRoomItem.tsx
  • Text 컴포넌트의 className prop 포맷팅을 조정했습니다.
• src/entities/chat/ui/MessageItem.tsx
  • MessageItem 컴포넌트의 props 구조 분해 할당 포맷팅을 조정했습니다.
• src/features/send-message/ui/ChatBar.tsx
  • ChatBar 컴포넌트의 props 구조 분해 할당 포맷팅을 조정했습니다.
• src/shared/ui/divider/Divider.tsx
  • 새로운 Divider 컴포넌트를 구현했습니다.
• src/shared/ui/divider/index.ts
  • Divider 컴포넌트를 내보내는 인덱스 파일을 추가했습니다.
• src/shared/ui/index.ts
  • divider 모듈을 전역 ui 모듈에서 내보내도록 추가했습니다.
• src/shared/ui/profile/ProfileAvatar.tsx
  • expo-image 임포트 순서를 조정했습니다.

Activity

• 작성자가 코딩 컨벤션 준수, 타입 에러 해결, 테스트 완료, 불필요한 로그 제거 등 PR 체크리스트를 모두 완료했습니다.
• PR 설명에 변경 사항을 시각적으로 보여주는 이미지가 첨부되었습니다.

Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature	Command	Description
Code Review	/gemini review	Performs a code review for the current pull request in its current state.
Pull Request Summary	/gemini summary	Provides a summary of the current pull request in its current state.
Comment	@gemini-code-assist	Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help	/gemini help	Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.

Footnotes

1. Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩

[gemini-code-assist]

Code Review

안녕하세요. 공용 Divider 컴포넌트 구현 PR 잘 보았습니다. 전반적으로 깔끔하게 구현되었지만, HomeScreen에 추가된 예시 코드는 별도로 관리하는 것이 좋아 보입니다. 자세한 내용은 파일에 남긴 주석을 확인해주세요.

[gemini-code-assist]

안녕하세요! Divider 컴포넌트의 예시 코드가 HomeScreen에 추가된 것을 확인했습니다. 일반적으로 스토리북이나 별도의 데모 화면에서 컴포넌트 사용 예시를 관리하는 것이 좋습니다. 프로덕션 화면에 직접 예시 코드를 추가하면, 나중에 불필요한 코드가 남게 될 수 있습니다. 이 예시 코드는 기능 확인 후 제거하거나, 스토리북으로 옮기는 것을 고려해 주세요.

[ahcgnoej]

엄.. 저희 인덱스에 ui 추가하는 거 때문에 충돌이 나는 것 같네요 index.tsx는 구현 캡쳐 용도로 사용하고 올리는 건 하지말아야하나 싶네욥