Morozow PR#3
Conversation
|
Прежде чем делать коммит, убедись что у тебя линтеры не ругаются. Я взял репозиторий в текущем состоянии и мне высыпалось 2 ворнинга. Называй файлы компонентов в формате, например Итого по общим правкам:
|
| import React from 'react'; | ||
| import styled from 'styled-components'; | ||
| import AddPersonsForm from '../AddPersonsForm/AddPersonsForm'; | ||
| const AddPersonsContainer = styled.div` |
There was a problem hiding this comment.
в LeaderBord используются почти идентичные элементы (контейнер, хедер, тайтл). Тебе нужно создать папку /components/common/ и в ней создать файлы с "общими" компонентами. То есть тебе нужно вынести PersonsContainer, PageHeader и PageHeaderTitle в отдельные компоненты, которые потом импортировать здесь и в LeaderBord.
Естественно, при необходимости можно и нужно здесь модифицировать их (например добавить нужные background-color для PageHeader)
| @@ -0,0 +1,101 @@ | |||
| import React, {Fragment} from 'react'; | |||
| import styled from 'styled-components'; | |||
| import {Trophy} from 'styled-icons/fa-solid/Trophy'; | |||
There was a problem hiding this comment.
этот пакет позволяет импортировать иконки таким образом: import {Anchor, Star, Trophy} from 'styled-icons/fa-solid';. Чище и короче
| <PageHeaderTitle>Лидеры</PageHeaderTitle> | ||
| </PageHeader> | ||
| <LeaderBordContent> | ||
| <LeaderBordBlank name="Петр Иванов" score="8901 очков" picture={rank1}/> |
There was a problem hiding this comment.
Но кол-чо очков лучше передавать просто числом. Это удобнее и так чаще будет встречаться в реальных условиях )
| const paginationButtons = () => { | ||
| return ( | ||
| <PagintionButtonsContainer> | ||
| <PaginationButtonsList> |
There was a problem hiding this comment.
Попробуй здесь вывести кнопки циклом
| justify-content: space-between; | ||
| `; | ||
|
|
||
| const pagecontainer = () => { |
There was a problem hiding this comment.
Старайся поменьше грязи делать. Здесь камелКейс не учёл, местами точки с запятой в конце строки забываешь и прочие мелочи
| @@ -0,0 +1,47 @@ | |||
| const redux = require('redux'); | |||
| const createStore = redux.createStore; | |||
There was a problem hiding this comment.
Надо использовать ES6 импорт:
import { createStore } from 'redux';
| <LeaderBordBlank name="Иван Иванов" score="8701 очков" picture={rank3}/> | ||
| <LeaderBordBlank name="Петр Петров" score="8601 очков" picture=""/> | ||
| <LeaderBordBlank name="Петр Петров" score="8501 очков" picture=""/> | ||
| <LeaderBordBlank name={this.props.name} score={this.props.score} picture={rank1}/> |
There was a problem hiding this comment.
Лучше объявить переменные name и score через деструктуризацию
|
|
||
| const pageHeader = (props) => { | ||
| return ( | ||
| <PageHeader> |
There was a problem hiding this comment.
чтобы работало условие нужно этот prop прокинуть в
ex: <PageHeader color={false}>
2 participants
No description provided.