add Solution

[thmoro]

https://thmoro.github.io/react_sum/

[mateacademy-ai-mentor]

Review Summary

Changes are needed before this solution can be accepted because one of the explicitly required checklist style items is not followed. Functionally, your implementation looks good: Sum is a named export with default values for a and b, and App renders the five required Sum usages correctly. However, in src/components/Sum/Sum.jsx (around the <p> tag) the text is rendered as Sum of {a} and {b} is {a + b}, which violates [CHECKLIST ITEM #2] that requires using a single template string inside the JSX content. Similarly, in src/App.jsx the paragraph with the same content is written using separate text and JSX expressions instead of one interpolated string. To fix this, update each paragraph to something like:

• {"Sum of " + a + " and " + b + " is " + (a + b)} is not acceptable here, but {Sum of ${a} and ${b} is ${a + b}} matches the required interpolation style. Once you adjust both occurrences to use a template literal inside the JSX braces, your solution will align with the checklist requirements and will be ready for approval.

---

✨ Please rate this review in the Platform's notification center¹. 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 button² 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 tag³.
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

1. Rate AI review example ↩

2. Re-request AI review example ↩

3. Add AI review comments example ↩

[mateacademy-ai-mentor]

This violates checklist item #2: "2. [CODE STYLE] - Use string interpolation inside tag content". The paragraph currently renders text and JS expressions separately (Sum of {a} and {b} is {a + b}); please use a template string inside JSX, e.g. {Sum of ${a} and ${b} is ${a + b}}.

[mateacademy-ai-mentor]

This violates checklist item #2: 'Use string interpolation inside tag content'. The paragraph currently uses separate expressions (Sum of {a} and {b} is {a + b}); consider using a template literal inside JSX like {Sum of ${a} and ${b} is ${a + b}} to match the required style.

[mateacademy-ai-mentor]

Review Summary

Your solution is approved because it cleanly meets all the functional and checklist requirements for this task. The Sum component is a named export, uses default values of 0 for both a and b, and renders the paragraph via a single template literal like Sum of ${a} and ${b} is ${a + b}, which matches the specification. In App.jsx, you correctly render the five required Sum usages: with a=2, b=3, a=-5, b=5, a=10 only, b=5 only, and with no props so the defaults are used. Your JSX style also follows the checklist (short props kept on one line, no unnecessary concatenation), so there are no blocking style issues. As a final polish, make sure you run npm test locally and keep Prettier/VSCode format-on-save enabled so future tasks also stay consistent. Nicely done implementing the requirements in a concise and readable way.

---

✨ Please rate this review in the Platform's notification center¹. I will be grateful for your feedback! ✨

Footnotes

1. Rate AI review example ↩