Review-tn-test-task-card-game

review.md

• https://test-task-card-game.vercel.app/
• https://github.com/tn/test-task-card-game

Замечания

Мутабельное изменение данных в redux

// https://github.com/tn/test-task-card-game/blob/main/store/reducers.ts#L23
if (card.suit === data.suit && card.value === data.value) {
        card.open = true
}

// https://github.com/tn/test-task-card-game/blob/main/store/reducers.ts#L36
nextCards: state.nextCards.map(card => {
if (card.suit === data.suit && card.value === data.value) {
  card.open = false
}
  
// https://github.com/tn/test-task-card-game/blob/main/store/reducers.ts#L56
if ((card.suit === state.pair[0].suit && card.value === state.pair[0].value) || (card.suit === state.pair[1].suit && card.value === state.pair[1].value)) {
  card.off = true
  card.open = false
}

// https://github.com/tn/test-task-card-game/blob/main/store/reducers.ts#L71
if ((card.suit === state.pair[0].suit && card.value === state.pair[0].value) || (card.suit === state.pair[1].suit && card.value === state.pair[1].value)) {
  card.open = false
}

Слабо-типизированы actions.

// https://github.com/tn/test-task-card-game/blob/main/store/store.ts#L21
const reducer = (state: GameState = initialState, action: AnyAction) => {

При такой типизации теряется смысл в default значениях, тк типы обязывают прописать пропсы

// https://github.com/tn/test-task-card-game/blob/main/components/stats/stats.tsx
interface StatsProps {
  steps: number
  duration: string
}
export const Stats: FC<StatsProps> = props => {
  return (
    <div className={styles.container}>
      <div className={styles.item}>
        <strong>Game duration:</strong> {props.duration}
      </div>
      <div className={styles.item}>
        <strong>Steps:</strong> {props.steps}
      </div>
    </div>
  )
}

Stats.defaultProps = {
  duration: '00:00:00',
  steps: 0
}

Типизация с any для onFlip, явно не самое лучшее решение

// https://github.com/tn/test-task-card-game/blob/main/components/card/card.tsx#L11
interface CardProps {
  suit: Figures
  value: number
  open?: boolean
  off?: boolean
  onFlip: (card: any) => void
}

Итерация по циклу с 1, не ошибка но наводит на мысли

// https://github.com/tn/test-task-card-game/blob/main/helpers/helpers.ts#L7
const makeCards = (suit: Figures, max: number) => {
  const cards: Card[] = []

  for(let i = 1; i <= max; i++) {

Код явно не проверялся чем-либо вроде ts-lint или es-lint