[feat/api/chat/FLOW-35] 메시지 불러오기, 전송중, 전송, 참여 멤버 리슽 다이얼로그, 멘션 추가(각각, everyone) by xeunnie · Pull Request #69 · ChatFlowProject/chatter

xeunnie · 2025-07-11T13:02:36Z

💡 PR 제목

✅ 요구사항

메시지 불러오기, 전송 중, 전송, 참여 멤버 리스트 다이얼로그 추가, 멘션 기능 추가

⭐ 시연

✅ 기능1

✅ 리뷰어가 알아야할 사항

✅ 체크리스트

자신의 코드에 대한 리뷰를 진행했습니다
실행 후 심각한 버그나 경고문이 없음을 확인했습니다
이해하기 어려운 부분에 적절한 주석을 첨부했습니다
요구사항 변경, 레이아웃 변경 등 변경사항을 문서에 반영했습니다

netlify · 2025-07-11T13:02:45Z

✅ Deploy Preview for chatflow-project ready!

Name	Link
🔨 Latest commit	`b1a9774`
🔍 Latest deploy log	https://app.netlify.com/projects/chatflow-project/deploys/68710d09921ccd0008dc07a2
😎 Deploy Preview	https://deploy-preview-69--chatflow-project.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

github-actions · 2025-07-11T13:02:45Z

🛠 PR 검사를 시작합니다. 잠시만 기다려 주세요!

github-actions · 2025-07-11T13:03:43Z

CI Status Report

검사 결과

Lint: ❌ failure
Format: ❌ failure
Build: ✅ success

❌ 일부 검사가 실패했습니다.

Copilot

Pull Request Overview

This PR adds messaging features including fetching message history, displaying send status indicators, a member list dialog, and support for @-mentions.

Enhanced ChatMessageItem to parse and highlight mentions and show pending/error status.
Added ChatMembersDialog and integrated it via the Users icon in ChannelHeader.
Refactored ChatInput to trigger and insert @-mentions, and updated ChatPage to handle mentions in outgoing messages.

Reviewed Changes

Copilot reviewed 19 out of 20 changed files in this pull request and generated 10 comments.

Show a summary per file

File	Description
src/view/pages/chat/components/message/ChatMessageItem.tsx	Added `mentions` prop, `parseMentions` helper, and revamped status indicator UI
src/view/pages/chat/components/layout/ChatView.tsx	Updated props to include categories, passed empty mentions array (placeholder)
src/view/pages/chat/components/layout/ChatMembersDialog.tsx	New component for displaying and searching channel members
src/view/pages/chat/components/layout/ChatInput.tsx	Refactored input to support @-mention dropdown and mapping
src/view/pages/chat/components/layout/ChannelHeader.tsx	Integrated `ChatMembersDialog` and added channel icon display
src/view/pages/chat/ChatPage.tsx	Wired up mentions flow end-to-end, improved loading/error states
src/service/feature/chat/type/messages.ts	Introduced new `Chat` interface
src/service/feature/chat/api/chatAPI.ts	Adjusted API return handling, added logging
src/service/feature/common/axios/axiosInstance.ts	Switched base domain to HTTP URL

Comments suppressed due to low confidence (2)

src/service/feature/chat/type/messages.ts:1

The Chat interface doesn't include a mentions field. You may want to add mentions?: string[]; to align with the schema and component props.

export interface Chat {

src/view/pages/chat/components/message/ChatMessageItem.tsx:118

There appears to be an extra closing tag, which can break the JSX structure. Please remove the redundant closing tag.

 </div>

Copilot · 2025-07-11T13:05:06Z


-export const ChatMessageItem = ({ msg, isMine, showMeta }: Props) => {
+const parseMentions = (text: string, mentions: string[]) => {
+ return text.split(/(\@[^\s]+)/g).map((part, index) => {


[nitpick] The parseMentions function returns a mix of React elements and plain strings without keys for string parts, which can cause key warnings. Consider wrapping string parts in a with a key.

Copilot · 2025-07-11T13:05:06Z

+ messages: Chat[];
 myId: string;
+ categories: CategoryView
 }) => {


The categories prop is declared in the type but not destructured from the component's parameters, so it will always be undefined. Include categories in the destructuring pattern.

Copilot · 2025-07-11T13:05:07Z

+import {CategoryView} from "@service/feature/channel/types/channel.ts";

 export const ChatView = ({messages = [], myId }: {
- messages: ChatMessage[];
+ messages: Chat[];
 myId: string;
+ categories: CategoryView


The CategoryView import isn't used in this file. Consider removing it or using it in the component.

Copilot · 2025-07-11T13:05:07Z

 msg: ChatMessage;
 isMine: boolean;
 showMeta: boolean;
+ mentions: string[];


The mentions prop is defined as an array of usernames, but ChatPage currently populates msg.mentions with IDs. Consider aligning the prop type or passing usernames so parseMentions can match correctly.

Copilot · 2025-07-11T13:05:08Z


 const API_CONFIG = {
- BASE_DOMAIN: 'https://flowchat.shop:30200',
+ BASE_DOMAIN: 'http://flowchat.shop:30100',


Using HTTP for the base API domain may expose data in transit. Consider switching to HTTPS for production endpoints.
Suggested change
BASE_DOMAIN: 'http://flowchat.shop:30100',
BASE_DOMAIN: process.env.API_BASE_URL||'http://localhost:30100',

Copilot · 2025-07-11T13:05:08Z

 const messageList = Array.isArray(messages) ? messages : [];
+ console.log("messageList", messageList);

 const shouldShowDateDivider = (currentMsg: ChatMessage, prevMsg?: ChatMessage) => {


The shouldShowDateDivider callback refers to ChatMessage but your ChatView is consuming the Chat type. Update the parameter types to use Chat.
Suggested change
constshouldShowDateDivider=(currentMsg: ChatMessage,prevMsg?: ChatMessage)=>{
constshouldShowDateDivider=(currentMsg: Chat,prevMsg?: Chat)=>{

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

github-actions · 2025-07-11T13:09:01Z

🛠 PR 검사를 시작합니다. 잠시만 기다려 주세요!

github-actions · 2025-07-11T13:09:10Z

🛠 PR 검사를 시작합니다. 잠시만 기다려 주세요!

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

github-actions · 2025-07-11T13:09:32Z

🛠 PR 검사를 시작합니다. 잠시만 기다려 주세요!

github-actions · 2025-07-11T13:09:39Z

🛠 PR 검사를 시작합니다. 잠시만 기다려 주세요!

github-actions · 2025-07-11T13:09:56Z

CI Status Report

검사 결과

Lint: ❌ failure
Format: ❌ failure
Build: ✅ success

❌ 일부 검사가 실패했습니다.

github-actions · 2025-07-11T13:10:04Z

CI Status Report

검사 결과

Lint: ❌ failure
Format: ❌ failure
Build: ✅ success

❌ 일부 검사가 실패했습니다.

github-actions · 2025-07-11T13:10:28Z

CI Status Report

검사 결과

Lint: ❌ failure
Format: ❌ failure
Build: ✅ success

❌ 일부 검사가 실패했습니다.

github-actions · 2025-07-11T13:10:36Z

CI Status Report

검사 결과

Lint: ❌ failure
Format: ❌ failure
Build: ✅ success

❌ 일부 검사가 실패했습니다.

xeunnie added 4 commits June 28, 2025 22:48

FLOW-35: 메시지 전송 오류 수정, 두번 저장 수정
03bd958

FLOW-35: 멘션 완료
22e80aa

feat(chat): 메시지 불러오기, 전송중, 전송, 참여 멤버 리슽 다이얼로그, 멘션 추가(각각, everyone)
f20d10b

Merge remote-tracking branch 'origin/develop' into feat/api/chat/FLOW-35
7717604

xeunnie added this to the API milestone Jul 11, 2025

xeunnie requested review from Copilot and dbswl701 July 11, 2025 13:02

xeunnie self-assigned this Jul 11, 2025

xeunnie added the API 백엔드 연결 label Jul 11, 2025

CopilotAI reviewed Jul 11, 2025
View reviewed changes

xeunnieand others added 2 commits July 11, 2025 22:08

Update src/view/pages/chat/components/layout/ChatView.tsx
75451e2
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

Update src/view/pages/chat/components/layout/ChatView.tsx
c5a0e7c
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

xeunnieand others added 2 commits July 11, 2025 22:09

Update src/service/feature/chat/api/chatAPI.ts
ac7c407
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

Update src/view/pages/chat/components/layout/ChatView.tsx
b1a9774
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

xeunnie merged commit 2a5e88d into developJul 11, 2025
4 of 5 checks passed

	BASE_DOMAIN: 'http://flowchat.shop:30100',
	BASE_DOMAIN: process.env.API_BASE_URL\|\|'http://localhost:30100',

	constshouldShowDateDivider=(currentMsg: ChatMessage,prevMsg?: ChatMessage)=>{
	constshouldShowDateDivider=(currentMsg: Chat,prevMsg?: Chat)=>{

Uh oh!

Conversation

xeunnie commented Jul 11, 2025

💡 PR 제목

✅ 요구사항

⭐ 시연

✅ 기능1

✅ 리뷰어가 알아야할 사항

✅ 체크리스트

Uh oh!

netlifyBot commented Jul 11, 2025• edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

✅ Deploy Preview for chatflow-project ready!

Uh oh!

github-actionsBot commented Jul 11, 2025

Uh oh!

github-actionsBot commented Jul 11, 2025

CI Status Report

검사 결과

Uh oh!

CopilotAI left a comment

Choose a reason for hiding this comment

Pull Request Overview

Reviewed Changes

Uh oh!

CopilotAIJul 11, 2025

Choose a reason for hiding this comment

Uh oh!

CopilotAIJul 11, 2025

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

CopilotAIJul 11, 2025

Choose a reason for hiding this comment

Uh oh!

Uh oh!

CopilotAIJul 11, 2025

Choose a reason for hiding this comment

Uh oh!

Uh oh!

CopilotAIJul 11, 2025

Choose a reason for hiding this comment

Uh oh!

CopilotAIJul 11, 2025

Choose a reason for hiding this comment

Uh oh!

github-actionsBot commented Jul 11, 2025

Uh oh!

github-actionsBot commented Jul 11, 2025

Uh oh!

github-actionsBot commented Jul 11, 2025

Uh oh!

github-actionsBot commented Jul 11, 2025

Uh oh!

github-actionsBot commented Jul 11, 2025

CI Status Report

검사 결과

Uh oh!

github-actionsBot commented Jul 11, 2025

CI Status Report

검사 결과

Uh oh!

github-actionsBot commented Jul 11, 2025

CI Status Report

검사 결과

Uh oh!

github-actionsBot commented Jul 11, 2025

CI Status Report

검사 결과

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

netlifyBot commented Jul 11, 2025•
edited
Loading