{"size": 1067, "ext": "js", "max_stars_repo_path": "client/components/ConfirmationPage.js", "max_stars_repo_name": "beemak789/grounded", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "client/components/ConfirmationPage.js", "max_issues_repo_name": "beemak789/grounded", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "client/components/ConfirmationPage.js", "max_forks_repo_name": "beemak789/grounded", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 28.0789473684, "max_line_length": 77, "alphanum_fraction": 0.5988753515}
import React from 'react';
import { Button } from '@mui/material';
import { fetchCheckoutItems } from '../store/cartReducer';
import { useSelector, useDispatch } from 'react-redux';

const ConfirmationPage = (props) => {
  const user = useSelector((state) => state.auth);
  const cart = useSelector((state) => state.thisCart);
  const userProducts = useSelector((state) => state.thisCart.products) || [];
  const dispatch = useDispatch();

  const confirmOrderHandler = () => {
    props.history.push('/products');
  };

  return (
    <div className='checkout-confirmation'>
      <div className='conf-container'>
        <p className='order-confirmed-text'>Order confirmed!</p>
        <p>You'll be able to brew that coffee really soon!</p>
        <Button
          style={{
            backgroundColor: '#EE3B3B',
            color: 'white',
            fontSize: '12px',
          }}
          onClick={confirmOrderHandler}
        >
          {' '}
          Continue Shopping
        </Button>
      </div>
    </div>
  );
};

export default ConfirmationPage;
