Solution#4288
Conversation
mateacademy-ai-mentor
left a comment
mateacademy-ai-mentor
left a comment
There was a problem hiding this comment.
Review Summary
Your implementation has two critical violations that must be fixed:
-
Explicit prop values instead of omitted props: In
App.jsx, you're passingb={0}for thea={10}case,a={0}for theb={5}case, and both props for the empty case. The task explicitly requires these three usages without those extra props:<Sum a={10} />,<Sum b={5} />, and<Sum />. Passing0explicitly is not the same as omitting the prop—it defeats the purpose of testing default value handling. -
Template literals not used: In
src/components/Sum/Sum.jsx, replaceSum of {a} and {b} is {a + b}with the template literal syntax {Sum of ${a} and ${b} is ${a + b}} as required by [CHECKLIST ITEM #2].
These are blocking issues because they violate explicit task requirements and checklist items.
✨ 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
| <div> | ||
| <Sum a={2} b={3} /> | ||
| <Sum a={-5} b={5} /> | ||
| <Sum a={10} b={0} /> |
There was a problem hiding this comment.
This violates the requirement 'just a = 10'. The code should be <Sum a={10} /> without the b prop. The task explicitly requires these 5 different component usages, and passing b={0} explicitly is not the same as omitting the prop.
| <Sum a={2} b={3} /> | ||
| <Sum a={-5} b={5} /> | ||
| <Sum a={10} b={0} /> | ||
| <Sum a={0} b={5} /> |
There was a problem hiding this comment.
This violates the requirement 'just b = 5'. The code should be <Sum b={5} /> without the a prop.
| <Sum a={-5} b={5} /> | ||
| <Sum a={10} b={0} /> | ||
| <Sum a={0} b={5} /> | ||
| <Sum a={0} b={0} /> |
There was a problem hiding this comment.
This violates the requirement 'no params at all'. The code should be <Sum /> without any props.
| @@ -1,14 +1,13 @@ | |||
| import React from 'react'; | |||
| 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'. Use a template literal like: {Sum of ${a} and ${b} is ${a + b}} instead of multiple inline expressions.
| // 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.
Checklist item #2: Use template literals inside tag content. Replace Sum of {a} and {b} is {a + b} 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
The Sum.jsx component has a critical violation of [CHECKLIST ITEM #2] which explicitly requires template literal syntax for string interpolation. Currently, the component uses plain variable interpolation: ```jsx
Sum of {a} and {b} is {a + b}
``` This must be changed to template literal syntax: ```jsx{`Sum of ${a} and ${b} is ${a + b}`}
``` All other requirements pass successfully — the component accepts props correctly, defaults work as expected, named export is implemented, and `App.jsx` renders all 5 Sum instances with proper prop omissions. However, the explicit checklist requirement for template literal syntax must be satisfied before approval.✨ 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 React from 'react'; | ||
| import './App.scss'; | ||
| import { Sum } from './components/Sum/Sum'; |
There was a problem hiding this comment.
Replace plain variable interpolation with template literal syntax as required by checklist item #2. Change {a}, {b}, and {a + b} to ${a}, ${b}, and ${a + b} wrapped in backticks.
| <p> | ||
| Sum of {a} and {b} is {a + b} |
There was a problem hiding this comment.
This violates checklist item #2 which requires template literal syntax for string interpolation. Replace 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
Your solution is approved. Both Sum.jsx and App.jsx are implemented correctly with proper template literal syntax for the string interpolation as required by the checklist. The Sum component properly accepts a and b props with default values of 0, and App.jsx renders exactly 5 instances with the specified prop combinations. Great job on getting the named export working and maintaining consistent single-line formatting for components with fewer than 3 attributes. All tests pass, so you're ready to move forward!
✨ Please rate this review in the Platform's notification center1. I will be grateful for your feedback! ✨
Footnotes
2 participants
DEMO LINK