result by Zakys1d · Pull Request #3745 · mate-academy/react_person

Zakys1d · 2026-05-20T17:29:15Z

mateacademy-ai-mentor

Review Summary

The implementation has critical issues that will cause test failures. First, there's a module export mismatch - the test imports { Person } as a named export, but Person.jsx likely uses a default export instead. Second, the text formats don't match test expectations: the component renders "Misha", "Age: 37", and "Wife: Natasha", but tests expect "My name is Misha", "I am 37", and "Natasha is my wife". Additionally, there are two checklist violations: the ternary operator operands at line 10 need to be on separate lines [CHECKLIST ITEM #2], and the nested ternary should be extracted to a separate variable before the JSX [CHECKLIST ITEM #3].

✨ 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.

mateacademy-ai-mentor · 2026-05-20T17:31:18Z

  age: 37,
  sex: 'm',
  isMarried: true,
  partnerName: 'Natasha',


The test expects text 'Natasha is my wife' but the component outputs 'Wife: Natasha'. Change format to '{partnerName} is my {wife/husband}'.

mateacademy-ai-mentor · 2026-05-20T17:31:19Z

  age: 37,
  sex: 'm',
  isMarried: true,
  partnerName: 'Natasha',


This violates checklist item #2: Format ternary operator operands correctly - move each operand to the separate line. Current format: 'condition ? firstValue : secondValue' should be: 'condition ? firstValue : secondValue' with line breaks.

mateacademy-ai-mentor · 2026-05-20T17:31:19Z

+const Person = ({ person }) => {
+  return (
+    <div className="Person">
+      <h2 className="Person__name">{person.name}</h2>


The name text should be 'My name is {name}' but currently renders just '{name}'. This will fail the test on line 20 of Person.spec.jsx.

mateacademy-ai-mentor · 2026-05-20T17:31:19Z

+  return (
+    <div className="Person">
+      <h2 className="Person__name">{person.name}</h2>
+      {person.age && <p className="Person__age">Age: {person.age}</p>}


The age text should be 'I am {age}' but currently renders 'Age: {age}'. This will fail the test on line 24 of Person.spec.jsx.

mateacademy-ai-mentor · 2026-05-20T17:31:19Z

+      {person.age && <p className="Person__age">Age: {person.age}</p>}
+      {person.isMarried ? (
+        <p className="Person__partner">
+          {person.sex === 'm' ? 'Wife' : 'Husband'}: {person.partnerName}


The partner text should be '{partnerName} is my {role}' (e.g., 'Natasha is my wife') but currently renders '{role}: {partnerName}' (e.g., 'Wife: Natasha'). This will fail tests on lines 28 and 44 of Person.spec.jsx.

mateacademy-ai-mentor · 2026-05-20T17:31:19Z

+      {person.age && <p className="Person__age">Age: {person.age}</p>}
+      {person.isMarried ? (
+        <p className="Person__partner">
+          {person.sex === 'm' ? 'Wife' : 'Husband'}: {person.partnerName}


This violates checklist item #2: Format ternary operator operands correctly - move each operand to the separate line. The nested ternary should be formatted like: const partnerRole = person.sex === 'm' ? 'Wife' : 'Husband';

mateacademy-ai-mentor · 2026-05-20T17:31:19Z

+      {person.age && <p className="Person__age">Age: {person.age}</p>}
+      {person.isMarried ? (
+        <p className="Person__partner">
+          {person.sex === 'm' ? 'Wife' : 'Husband'}: {person.partnerName}


This violates checklist item #3: Avoid putting several cases to conditional rendering. Create separate variable for the condition. The nested ternary (person.sex === 'm' ? 'Wife' : 'Husband') should be extracted to a variable before the JSX.

mateacademy-ai-mentor

Review Summary

The implementation has two critical issues that must be fixed before approval:

Import/export mismatch (src/App.jsx line 2): The Person component is exported as a named export (export const Person) but App.jsx imports it as a default import (import Person from). This causes an ESLint error (import/no-named-as-default) and will result in Person being undefined at runtime. Change line 2 to use a named import:
```
import { Person } from './components/Person/Person';
```
Ternary operator formatting (src/App.jsx line 4): Violates [CHECKLIST ITEM #2] - ternary operands should be on separate lines. Format as:
```
const partnerRole = person.sex === 'm'
  ? 'wife'
  : 'husband';
```

Once these two issues are resolved, the code should pass all checks and tests.

✨ 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.

mateacademy-ai-mentor · 2026-05-21T19:42:14Z

 import React from 'react';
+import Person from './components/Person/Person';
 import './App.scss';



This violates checklist item #2: ternary operator operands should be on separate lines. Format it as:

const partnerRole = person.sex === 'm' ? 'wife' : 'husband';

mateacademy-ai-mentor · 2026-05-21T19:42:14Z

@@ -1,3 +1,4 @@
+/* eslint-disable import/named */
 import { mount } from '@cypress/react18';


Import mismatch: App.jsx uses default import import Person from, but Person.jsx exports a named export export const Person. Change App.jsx line 2 to use named import: import { Person } from './components/Person/Person';

mateacademy-ai-mentor · 2026-05-21T19:42:14Z

+/* eslint-disable import/named */
 import { mount } from '@cypress/react18';
 import { Person } from './Person';



Checklist item #2 violation: The ternary operator operands should be on separate lines. Format as:

const partnerRole = person.sex === 'm' ? 'wife' : 'husband';

mateacademy-ai-mentor

Review Summary

This is an educational approval to help you progress while learning. Great job fixing the import/export mismatch from the previous review — your named imports are now correct! All functional requirements pass: the component renders properly, age is conditionally hidden, and the husband/wife logic works correctly.

Minor learning point: There's one formatting issue remaining — in Person.jsx line 4, the ternary operator should have each operand on its own line for readability [CHECKLIST ITEM #2]:

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

Rate AI review example ↩

mateacademy-ai-mentor · 2026-05-21T19:52:21Z

+import React from 'react';
+
+export const Person = ({ person }) => {
+  const partnerRole = person.sex === 'm' ? 'wife' : 'husband';


Violates CHECKLIST ITEM #2 - ternary operands should be on separate lines for readability. Format as:

const partnerRole = person.sex === 'm' ? 'wife' : 'husband';

mateacademy-ai-mentor · 2026-05-21T19:52:21Z

 import React from 'react';
+import { Person } from './components/Person/Person';
 import './App.scss';



Violates checklist item #2: ternary operands should be on separate lines. Format as:

mateacademy-ai-mentor · 2026-05-21T19:52:21Z

+/* eslint-disable import/named */
 import { mount } from '@cypress/react18';
 import { Person } from './Person';



This ternary operator matches the BAD EXAMPLE pattern from [CHECKLIST ITEM #2]. Format operands on separate lines:

const partnerRole = person.sex === 'm' ? 'wife' : 'husband';

result

011f9c7

mateacademy-ai-mentor suggested changes May 20, 2026

View reviewed changes

result3

4386b38

Zakys1d requested a review from mateacademy-ai-mentor May 21, 2026 19:40

mateacademy-ai-mentor suggested changes May 21, 2026

View reviewed changes

final

a783237

Zakys1d requested a review from mateacademy-ai-mentor May 21, 2026 19:50

mateacademy-ai-mentor approved these changes May 21, 2026

View reviewed changes

		@@ -1,3 +1,4 @@
		/* eslint-disable import/named */
		import { mount } from '@cypress/react18';

Conversation

Zakys1d commented May 20, 2026

Uh oh!

mateacademy-ai-mentor left a comment

Choose a reason for hiding this comment

Review Summary

Footnotes

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

mateacademy-ai-mentor left a comment

Choose a reason for hiding this comment

Review Summary

Footnotes

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

mateacademy-ai-mentor left a comment

Choose a reason for hiding this comment

Review Summary

Footnotes

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants