Fix/contact message null crash #21
Open
+30
−0
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Reviewer's guide (collapsed on small PRs)Reviewer's GuideAdds a defensive early-return in the chat message renderer for null/invalid message payloads and introduces a localized fallback string for invalid or unsupported messages across all supported languages. Sequence diagram for rendering a chat message with null-guard fallbacksequenceDiagram
actor User
participant ChatUI
participant MessageList
participant MessageContent
participant I18n
User->>ChatUI: OpenConversation(conversationId)
ChatUI->>MessageList: FetchAndRenderMessages(conversationId)
loop For each message
MessageList->>MessageContent: Render(message)
alt message.message is null or undefined
MessageContent->>I18n: t(chat.message.invalidOrUnsupported)
I18n-->>MessageContent: localizedFallbackText
MessageContent-->>MessageList: RenderFallbackDiv(localizedFallbackText)
else message.message is valid
MessageContent-->>MessageList: RenderByMessageType(message.messageType)
end
end
MessageList-->>ChatUI: ConversationDOM
ChatUI-->>User: DisplayConversation()
Flow diagram for MessageContent rendering with null guardflowchart TD
A[Start render MessageContent] --> B{Is message present?}
B -->|No or message is null| C["Call t(chat.message.invalidOrUnsupported)"]
C --> D[Render fallback div with muted styling]
D --> E[End render]
B -->|Yes| F{Is message.message present?}
F -->|No| C
F -->|Yes| G[Read messageType]
G --> H[Switch on messageType and render specific message UI]
H --> E
File-Level Changes
Tips and commandsInteracting with Sourcery
Customizing Your ExperienceAccess your dashboard to:
Getting Help
|
![sourcery-ai[bot]](https://avatars.githubusercontent.com/in/48477?s=60&v=4){kind=small}
There was a problem hiding this comment.
Hey - I've found 1 issue, and left some high level feedback:
- The early
if (!message?.message)return inMessageContentchanges behavior for all message types; if the crash only affects contact messages, consider narrowing this guard (e.g. by checkingmessageTypefirst) to avoid hiding other valid-but-empty message contents. - When encountering invalid message payloads, it may be helpful to add some lightweight logging/telemetry (even just
console.warnbehind a dev flag) so malformed messages can be diagnosed rather than only showing a generic fallback in the UI.
Prompt for AI Agents
Please address the comments from this code review:
## Overall Comments
- The early `if (!message?.message)` return in `MessageContent` changes behavior for all message types; if the crash only affects contact messages, consider narrowing this guard (e.g. by checking `messageType` first) to avoid hiding other valid-but-empty message contents.
- When encountering invalid message payloads, it may be helpful to add some lightweight logging/telemetry (even just `console.warn` behind a dev flag) so malformed messages can be diagnosed rather than only showing a generic fallback in the UI.
## Individual Comments
### Comment 1
<location> `src/pages/instance/Chat/messages.tsx:146` </location>
<code_context>
+ const { t } = useTranslation();
+
+ // Early return for invalid messages
+ if (!message?.message) {
+ return (
+ <div className="text-xs text-muted-foreground bg-muted p-2 rounded max-w-xs">
</code_context>
<issue_to_address>
**issue (bug_risk):** Narrow the invalid-message check to avoid treating valid falsy values as unsupported.
`!message?.message` will mark any falsy value (empty string, `0`, `false`) as invalid/unsupported. If empty strings or other falsy values can be valid, prefer a nullish check like `if (message?.message == null)` or explicitly whitelist the valid values so you don’t misclassify legitimate content as invalid.
</issue_to_address>Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Pull Request
📋 Description
This PR fixes a frontend crash in the chat UI caused by malformed or incomplete message payloads coming from the backend.
In production, some messages arrive with
messageset tonull(or missing nested fields), while the UI assumed the presence of properties likecontactMessage, resulting in a runtime error:The fix adds proper null-guards and safe fallbacks when rendering messages, preventing the entire conversation view from breaking.
🔗 Related Issues
Cannot read properties of null (reading 'contactMessage')🧪 Type of Change
🧪 Testing
Test Environment
Test Cases
Test Instructions
📸 Screenshots
Before
Application crashes with:
After
✅ Checklist
Code Quality
npm run lintand fixed blocking issues (warnings only, pre-existing)Testing
Documentation
Internationalization
Breaking Changes
🔄 Migration Guide
Not applicable — no API or behavioral changes for consumers.
📝 Additional Notes
This issue only surfaced in production due to inconsistent message payloads.
The fix ensures the UI is resilient to malformed messages without assuming backend correctness.
🤝 Reviewer Guidelines
Focus Areas
Testing Checklist for Reviewers
Summary by Sourcery
Handle null or malformed chat messages without crashing the conversation view.
Bug Fixes:
Enhancements: