add task solution

[N3m0o]

https://n3m0o.github.io/react_sum/

[mateacademy-ai-mentor]

Review Summary

Decision: Request changes because a required checklist item is violated.

Critical issue (must fix):

• src/components/Sum/Sum.jsx — The <p> content is constructed from multiple fragments (Sum of {a} and {b} is {a + b}), which violates checklist item #2: “Use string interpolation inside tag content.” This is a required style rule, not cosmetic, and may be enforced by tests or linters. Please change it to a single template-literal expression inside the tag, for example: <p>{Sum of ${a} and ${b} is ${a + b}}</p>.

What you did well:

• Named export for Sum, correct default props for a and b, and App renders all five required cases using concise single-line JSX. Functional output is otherwise correct.

Minor note:

• After the change, run tests to confirm everything passes.

You’re very close—fixing the interpolation will bring the submission to full compliance. ✅

---

✨ 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 content is built from separate text nodes and expression fragments: Sum of {a} and {b} is {a + b}. The checklist requires a single interpolation expression (template literal) inside the tag, e.g.

<p>{Sum of ${a} and ${b} is ${a + b}}</p>

Please replace the current paragraph contents with a single template-literal expression so it matches the checklist's GOOD EXAMPLE.

[mateacademy-ai-mentor]

Review Summary

Decision: APPROVE

Your implementation meets all core requirements. The Sum component is a named export, defaults missing a or b to 0, and renders the exact sentence using a single interpolation inside one <p> (see src/components/Sum/Sum.jsx). In src/App.jsx, you render the five required cases: <Sum a={2} b={3} />, <Sum a={-5} b={5} />, <Sum a={10} />, <Sum b={5} />, and <Sum />, using clean single-line JSX for the short tags. There are no critical blockers or checklist violations.

Minor suggestions (non-blocking): run npm test to confirm everything passes and ensure Prettier/format-on-save is enabled. Also verify the demo link in the PR description is updated per instructions. Nicely done—clear, concise, and correct.

---

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

Footnotes

1. Rate AI review example ↩