import type { FC } from 'react';
import { Link as RouterLink } from 'react-router-dom';

import 'src/components/dashboard/i18n';

import Button from '@material-hu/mui/lab/LoadingButton';

import ArrowLeftIcon from 'src/icons/ArrowLeft';

export type GoBackButtonProps = {
  route?: string;
  onClick?: (any) => void;
  component?: any;
  sx?: Object;
};

const GoBackButton: FC<GoBackButtonProps> = props => {
  const {
    route,
    onClick,
    component = route ? RouterLink : undefined,
    sx = { mb: 2 },
  } = props;

  return (
    <Button
      variant="outlined"
      color="primary"
      size="small"
      component={component}
      to={route}
      onClick={onClick}
      sx={sx}
    >
      <ArrowLeftIcon fontSize="small" />
    </Button>
  );
};

export default GoBackButton;