fix: 채팅 프로필 이미지 찌그러짐 수정#531
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
1 Skipped Deployment
|
|
Warning Review limit reached
More reviews will be available in 55 minutes and 3 seconds. Learn how PR review limits work. Your organization has run out of usage credits. Purchase more in the billing tab. ⌛ How to resolve this issue?After more reviews become available, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. 🚦 How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans include higher PR review limits than trial, open-source, and free plans. In all cases, reviews become available again over time. During sustained high-volume PR review activity, CodeRabbit may temporarily slow when the next review becomes available. Please see our Fair Usage Limits Policy for further information. ℹ️ Review info⚙️ Run configurationConfiguration used: Repository UI Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (1)
🎯 Walkthrough이번 변경사항은 채팅 메시지 박스의 렌더링 레이아웃을 정교하게 조정하고 프로필 배지의 flex 동작을 개선합니다.
Estimated code review effort🎯 2 (Simple) | ⏱️ ~10 minutes Suggested reviewers
🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 63d2deeecf
ℹ️ About Codex in GitHub
Your team has set up Codex to 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 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
| <span className="text-k-500 typo-regular-4">{formatTime(message.createdAt)}</span> | ||
| <div className="rounded-b-xl rounded-tl-xl bg-primary px-3 py-2 text-white"> | ||
| <div className="flex min-w-0 justify-end"> | ||
| <div className="flex max-w-[min(80%,24rem)] min-w-0 flex-row-reverse gap-2"> |
There was a problem hiding this comment.
Avoid capping own-message row at 80%
max-w-[min(80%,24rem)] on the my-message container makes the bubble too narrow when an attachment image is present, because ChatImage is fixed at w-[200px] and the timestamp is also shrink-0; after subtracting timestamp/gap, the bubble can drop below 200px on common narrow layouts (e.g., ~360px mobile viewport once chat paddings are applied), causing horizontal overflow/compression that did not happen with the previous full-available-width behavior.
Useful? React with 👍 / 👎.
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 032ccce976
ℹ️ About Codex in GitHub
Your team has set up Codex to 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 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
| shouldForceScrollToBottomRef.current = true; | ||
| requestAnimationFrame(scrollToBottom); |
There was a problem hiding this comment.
Clear force-scroll state when outbound send is not confirmed
Setting shouldForceScrollToBottomRef.current = true during sendTextMessage leaves a sticky force-scroll state until the message list length increases. If the publish call succeeds locally but no message is appended (e.g., transient disconnect or server-side rejection), the next unrelated incoming message will still force-jump the user to bottom even when they are intentionally reading older history. This regression is introduced by the new force-scroll path and should be reset when no corresponding message append occurs.
Useful? React with 👍 / 👎.
관련 이슈
작업 내용
ProfileWithBadge에shrink-0을 추가했습니다.min-w-0,break-words를 보강해 긴 텍스트가 말풍선 내부에서 자연스럽게 줄바꿈되도록 수정했습니다.shrink-0으로 고정해 말풍선과 시간/프로필 영역이 서로 압축하지 않도록 정리했습니다.검증
pnpm --filter @solid-connect/web lint:checkpnpm --filter @solid-connect/web typecheckpnpm --filter @solid-connect/web build@solid-connect/web ci:check통과@solid-connect/web ci:check및@solid-connect/web build통과참고
v23.10.0이라engines.node: 22.x경고가 출력되지만 검증은 모두 통과했습니다.