_sum of numbers- react_#3867
Conversation
mateacademy-ai-mentor
left a comment
mateacademy-ai-mentor
left a comment
There was a problem hiding this comment.
Review Summary
Decision: Request Changes — There’s one critical checklist violation that must be fixed before approval.
- Critical issue (blocker): In
src/components/Sum/Sum.jsx, the paragraph content violates checklist item #2: “Use string interpolation inside tag content.” Currently, the line constructs the sentence with multiple JSX nodes:Sum of {a} and {b} is {a + b}(likely around the line where the<p>is rendered). The requirement is for the entire sentence to be a single text node produced by one interpolation. - Why this matters: The project’s checklist marks this as a required style rule, not an optional preference. Submissions must meet all explicit checklist items.
- How to fix: Replace the paragraph content with a single template literal interpolation, for example:
<p>{Sum of ${a} and ${b} is ${a + b}}</p>.
Minor notes (non-blockers): Everything else looks good — named export is correct, defaults for a and b are set to 0, and App.jsx renders the five required instances correctly. Nice work on meeting the functional requirements; once you make this small formatting change, you should be all set.
✨ Please rate this review in the Platform's notification center1. I will be grateful for your feedback! ✨
Important
Fix the issues, commit the changes, and then re-request my review using the Re-request review button2 in the Reviewers tab.
Tip
If you have any comments about this review, please leave a message in the Add a comment section below and mention me with the @mateacademy-ai-mentor tag3.
I will read your message during my next review of your pull request. Please do not reply directly to my comments, as that feature is not supported yet.
Caution
Do not close the pull request until the review is complete. Closing it early can lead to unexpected behavior and disrupt the review process.
Footnotes
| export const Sum = ({ a = 0, b = 0 }) => { | ||
| return ( | ||
| <p> | ||
| Sum of {a} and {b} is {a + b} |
There was a problem hiding this comment.
This violates checklist item #2: "2. [CODE STYLE] - Use string interpolation inside tag content"
The paragraph currently mixes text nodes and separate JSX expressions (Sum of {a} and {b} is {a + b}). The checklist requires using a single interpolation expression so the whole sentence is one text node. Change the paragraph content to a single expression, for example:
<p>{`Sum of ${a} and ${b} is ${a + b}`}</p>This will satisfy the checklist requirement.
mateacademy-ai-mentor
left a comment
mateacademy-ai-mentor
left a comment
There was a problem hiding this comment.
Review Summary
Decision: APPROVE
You met all core requirements and style checklist items. The Sum component uses a named export, defaults a and b to 0, and renders the exact sentence via a single template literal. In App.jsx, you correctly render the five required cases: a=2, b=3, a=-5, b=5, a=10 only, b=5 only, and no props; each tag is on a single line as requested. Imports/exports are consistent, and the JSX is valid, so functionality will work as intended.
Minor, non-blocking suggestions: consider adding PropTypes (e.g., a: number, b: number) and a small test to guard against regressions. Also ensure your PR description contains the demo link in the required format: https://<your_account>.github.io/react_sum/.
Nice work—clear, concise, and compliant with the task.
✨ Please rate this review in the Platform's notification center1. I will be grateful for your feedback! ✨
Footnotes
2 participants
DEMO LINK