Merge branch 'release/0.0.3'

src/components/VehicleMap/index.jsx

@@ -25,6 +25,7 @@ const Component = () => {
   const [center, setCenter] = useState([0, 0]);
   const [zoom, setZoom] = useState(2);
   const [markers, setMarkers] = useState([]);
+  const [connections, setConnections] = useState({});
 
   useEffect(() => {
     if (!token) return;
@@ -71,8 +72,6 @@ const Component = () => {
     setZoom(4.5);
   };
 
-  const [connections, setConnections] = useState({});
-
   useEffect(() => {
     if (!token) return;
     if (markers.length > 0) {
@@ -116,10 +115,19 @@ const Component = () => {
     setCarState(null);
   };
 
+  const isOnline = (vin) => {
+    return connections[vin];
+  };
+
+  const getZIndex = (vin) => {
+    if (isOnline(vin)) return 1000;
+    return 0;
+  };
+
   function getCarIcon(vin) {
     let icon = GrayMarkerIcon;
 
-    if (connections[vin]) {
+    if (isOnline(vin)) {
       icon = GreenMarkerIcon;
     }
 
@@ -151,6 +159,7 @@ const Component = () => {
           position={[marker[0], marker[1]]}
           title={marker[2]}
           opacity={0.9}
+          zIndexOffset={getZIndex(marker[2])}
         >
           <Popup>
             <div align="center">