import useStyles from "../../useStyles";
import clsx from "clsx";
import Typography from "@material-ui/core/Typography";
import SendCommand from "../../Controls/SendCommand";
import PropTypes from "prop-types";
import {VehicleProvider} from "../../Contexts/VehicleContext";

const RemoteCommandsTab = (props) => {
  const { vin } = props;
  const classes = useStyles();

  return (
    <div className={clsx(classes.paper, classes.tableSize)}>
      <Typography variant="h6">Vehicle Commands</Typography>
      <VehicleProvider>
        <SendCommand vins={[vin]}></SendCommand>
      </VehicleProvider>
    </div>
  )
}

RemoteCommandsTab.propTypes = {
  vin: PropTypes.string,
}

export default RemoteCommandsTab