Задание React Hooks

По ссылке находиться проект написанный с помощью классовых компонентов (stateful). Его необходимо переписать на функциональные компоненты с использованием хуков.

Пример:

1. Исходный компонент (stateful component):

import React, { Component } from "react";
import { CommonLinkBtn } from "./CommonLinkBtn";

class Checkout extends Component {
  componentDidMount() {
    this.props.flushCartHandler();
  }
  render() {
    return (
      <div className="page-body">
        <div className="page-element">
          <div className="checkout-page">
            <h2>Successful!</h2>
            <CommonLinkBtn linkTo={"/"} linkName={"Back to shop"} />
          </div>
        </div>
      </div>
    );
  }
}

export default Checkout;

2. Компонент после изменения:

import React, { useEffect } from "react";
import { CommonLinkBtn } from "./CommonLinkBtn";

const Checkout = ({ flushCartHandler }) => {
  useEffect(() => {
    flushCartHandler();
  }, []);

  return (
    <div className="page-body">
      <div className="page-element">
        <div className="checkout-page">
          <h2>Successful!</h2>
          <CommonLinkBtn linkTo={"/"} linkName={"Back to shop"} />
        </div>
      </div>
    </div>
  );
};

export default Checkout;

П.с. проект уже переписан на функциональные компоненты, и если что-то не понятно можно переключиться на ветку react-stateless , посмотреть и протестировать уже готовый пример.