diff --git a/src/App.jsx b/src/App.jsx index dcf8509c8..378e161d2 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -1,5 +1,6 @@ import React from 'react'; import './App.scss'; +import { Person } from './components/Person/Person'; export const misha = { name: 'Misha', @@ -26,20 +27,15 @@ export const alex = { export const App = () => (
-

My name is Misha

-

I am 37

-

Natasha is my wife

+
-

My name is Olya

-

Maksym is my husband

+
-

My name is Alex

-

I am 25

-

I am not married

+
); diff --git a/src/components/Person/Person.jsx b/src/components/Person/Person.jsx index eccf156a3..b29d93270 100644 --- a/src/components/Person/Person.jsx +++ b/src/components/Person/Person.jsx @@ -1 +1,16 @@ -// export const Person = ({ person }) => (); +export const Person = (props) => { + const { name, age, partnerName, sex, isMarried } = props.person; + + const partnerRole = sex === 'm' ? 'wife' : 'husband'; + + return ( + <> +

{`My name is ${name}`}

+ {age &&

{`I am ${age}`}

} + {isMarried + ? (

{`${partnerName} is my ${partnerRole}`}

) + : (

I am not married

) + } + + ); +};