Conversation
mateacademy-ai-mentor
left a comment
mateacademy-ai-mentor
left a comment
There was a problem hiding this comment.
Review Summary
Great job on implementing the core functionality! The logic for selecting and clearing goods works perfectly. However, this solution requires a few changes to meet the project's coding standards. The main issue is the use of inline arrow functions for onClick events, which violates a key requirement from the checklist [CHECKLIST ITEM #2]. Please refactor these into separate methods defined within the component. For instance, you could create a handleSelectGood(good) function and a handleClearSelection() function, and then pass their references to the onClick props. Addressing this will bring your code in line with the project's best practices.
✨ 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
src/App.tsx
Outdated
| data-cy="ClearButton" | ||
| type="button" | ||
| className="delete ml-3" | ||
| onClick={() => setSelectedGood('')} |
There was a problem hiding this comment.
This violates checklist item #2: 'Create separate methods instead of creating inline event handlers'. Please define a separate handler function for clearing the selection and pass its reference to the onClick prop.
src/App.tsx
Outdated
| data-cy="AddButton" | ||
| type="button" | ||
| className="button" | ||
| onClick={() => setSelectedGood(good)} |
There was a problem hiding this comment.
This violates checklist item #2: 'Create separate methods instead of creating inline event handlers'. Consider creating a handler function that accepts the good as an argument, like handleSelectGood = (goodName) => { ... }, and then call it from here.
src/App.tsx
Outdated
| data-cy="RemoveButton" | ||
| type="button" | ||
| className="button is-info" | ||
| onClick={() => setSelectedGood('')} |
There was a problem hiding this comment.
This violates checklist item #2: 'Create separate methods instead of creating inline event handlers'. You can reuse the same handler function created for the ClearButton here.
mateacademy-ai-mentor
left a comment
mateacademy-ai-mentor
left a comment
There was a problem hiding this comment.
Review Summary
Excellent work on this iteration! I am approving your solution as you've successfully addressed the feedback from the previous review. Refactoring the inline event handlers into separate methods has made the code much cleaner and more maintainable. Your implementation now fully meets all project requirements and best practices outlined in the checklist. Great job!
✨ Please rate this review in the Platform's notification center1. I will be grateful for your feedback! ✨
Footnotes
2 participants
No description provided.