import React, { useState, useEffect } from 'react';

// Redux part
import { useSelector, useDispatch } from 'react-redux';
import { StoreState } from 'store/rootReducer';

// Import actions here

import classNames from 'classnames/bind';
import TextItem from 'components/items/TextItem';
import { AiOutlineLeft } from 'react-icons/ai';
import { withRouter } from 'react-router-dom';
import styleIdentifiers from './BackButton.module.scss';

const styles = classNames.bind(styleIdentifiers);

export interface BackButtonProps {}

const BackButton = (props: BackButtonProps) => {
  const { history, className, action } = props;
  // mapStateToProps
  const lg = useSelector((state: StoreState) => state.content.lg);
  // Allow to dispatch actions
  const dispatch = useDispatch();

  const goBack = () => {
    if (action) action();
    else history.goBack();
  };

  return (
    <div className={styles('back-button', className)} onClick={goBack}>
      <AiOutlineLeft className={styles('icon')} />
      <TextItem path="Retour" />
    </div>
  );
};

export default withRouter(BackButton);
