add task solution - #4413
Conversation
mateacademy-ai-mentor
left a comment
mateacademy-ai-mentor
left a comment
There was a problem hiding this comment.
Review Summary
I am requesting changes because there are critical requirement violations that block the task completion. In src/App.jsx, the task requires using Sum with omitted props so the component’s defaults handle them, but lines 11-13 explicitly pass 0 values instead of omitting the props. Specifically: change <Sum a={10} b={0} /> (line 11) to <Sum a={10} />, <Sum a={0} b={5} /> (line 12) to <Sum b={5} />, and <Sum a={0} b={0} /> (line 13) to <Sum />. Also, in src/components/Sum/Sum.jsx, [CHECKLIST ITEM #2] requires using a single template literal for the content; replace the current concatenation/separate expressions with string interpolation like {Sum of ${a} and ${b} is ${a + b}}. These corrections ensure the component meets the exact usage requirements and adheres to the checklist. Once updated, everything else looks solid—defaults and named export are in place.
✨ 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 = () => (); | ||
| export const Sum = ({ a = 0, b = 0 }) => ( | ||
| <p> | ||
| Sum of {a} and {b} is {a + b} |
There was a problem hiding this comment.
This violates checklist item #2: Use string interpolation inside tag content. Replace with template literal syntax: {Sum of ${a} and ${b} is ${a + b}}
mateacademy-ai-mentor
left a comment
mateacademy-ai-mentor
left a comment
There was a problem hiding this comment.
Review Summary
Your implementation has one critical violation of an explicit checklist requirement. In src/components/Sum/Sum.jsx, you must use template literal syntax (string interpolation) for the paragraph content as required by Checklist Item #2. Replace the multiple JSX expressions with: {`Sum of ${a} and ${b} is ${a + b}`}. The rest of your implementation is correct—default prop handling, all 5 Sum variations, and named exports are all properly implemented. Once you update Sum.jsx to use template literals, your solution will meet all requirements.
✨ 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
| import './App.scss'; | ||
| import { Sum } from './components/Sum/Sum'; |
There was a problem hiding this comment.
This violates Checklist Item #2: Use string interpolation inside tag content. Replace the current separate expressions with a template literal: {Sum of ${a} and ${b} is ${a + b}}
| <p> | ||
| Sum of {a} and {b} is {a + b} |
There was a problem hiding this comment.
[CHECKLIST ITEM #2] Use string interpolation (template literals) inside tag content. Replace the separate JSX expressions with: {Sum of ${a} and ${b} is ${a + b}}
mateacademy-ai-mentor
left a comment
mateacademy-ai-mentor
left a comment
There was a problem hiding this comment.
Review Summary
Educational Override Approved — This is an intentional approval to help you progress while learning.
Your implementation correctly meets all the core requirements: the Sum component uses template literal syntax as specified, handles default props properly, and your App component contains all 5 required instances with correct props. Great work on that!
However, there is one issue to be aware of that caused the test failures: there's an extra leading space before the "Sum" text in your paragraph. The tests expect Sum of 7 and 10 is 17 but the component renders Sum of 7 and 10 is 17 (note the leading space). This is a common issue — double-check your JSX return statement to ensure there's no space before "Sum" in the <p> tag. This is a simple whitespace formatting fix that won't affect functionality but will make the output match the expected format.
Overall, your code is functionally correct and follows the checklist requirements well. Keep up the good work!
✨ 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
3 participants
DEMO LINK