2020-03-01 20:40:51 +01:00
|
|
|
import React from 'react';
|
2020-03-03 22:22:48 +01:00
|
|
|
import {
|
|
|
|
Navbar,
|
|
|
|
Button,
|
|
|
|
Spinner
|
|
|
|
} from "react-bootstrap";
|
2020-03-01 20:40:51 +01:00
|
|
|
import PropTypes from 'prop-types';
|
2020-03-03 22:22:48 +01:00
|
|
|
import { MdGpsFixed } from "react-icons/md";
|
2020-03-01 20:40:51 +01:00
|
|
|
|
|
|
|
import GasTypes from "./GasTypes";
|
|
|
|
|
|
|
|
const Footer = (props) => {
|
|
|
|
const {
|
|
|
|
selectGasType,
|
|
|
|
selectedGasType,
|
2020-03-03 10:10:00 +01:00
|
|
|
setNeedUpdateUserLocation,
|
2020-03-03 22:22:48 +01:00
|
|
|
isLocating,
|
2020-03-01 20:40:51 +01:00
|
|
|
} = props;
|
|
|
|
|
|
|
|
return (
|
|
|
|
<Navbar bg="light" variant="light" fixed="bottom">
|
|
|
|
<GasTypes selectedGasType={selectedGasType} selectGasType={selectGasType} />
|
2020-03-03 22:22:48 +01:00
|
|
|
<div style={{width: "36px", display: "flex", justifyContent: "center", paddingLeft: "1rem"}}>
|
|
|
|
{isLocating ? (
|
|
|
|
<Spinner animation="border" size="sm" role="status">
|
|
|
|
<span className="sr-only">Chargement...</span>
|
|
|
|
</Spinner>
|
|
|
|
) : (
|
|
|
|
<Button
|
|
|
|
variant="link"
|
|
|
|
onClick={() => setNeedUpdateUserLocation(true)}
|
|
|
|
onFocus={() => { }}
|
|
|
|
onBlur={() => { }}
|
|
|
|
>
|
|
|
|
<MdGpsFixed />
|
|
|
|
</Button>
|
|
|
|
)}
|
|
|
|
</div>
|
2020-03-01 20:40:51 +01:00
|
|
|
</Navbar>
|
|
|
|
);
|
|
|
|
};
|
|
|
|
|
|
|
|
Footer.propTypes = {
|
2020-03-03 22:22:48 +01:00
|
|
|
isLocating: PropTypes.bool.isRequired,
|
2020-03-01 20:40:51 +01:00
|
|
|
selectedGasType: PropTypes.string.isRequired,
|
|
|
|
selectGasType: PropTypes.func.isRequired,
|
2020-03-03 10:10:00 +01:00
|
|
|
setNeedUpdateUserLocation: PropTypes.func.isRequired,
|
2020-03-01 20:40:51 +01:00
|
|
|
};
|
|
|
|
|
|
|
|
export default Footer;
|