CEC-5431: increase concurrency (#487)

* increase concurrency

* fix unmounted component leak

src/components/Fleets/Status/Vehicles/Table/index.jsx

@@ -12,7 +12,7 @@ import {
 } from "@material-ui/core";
 import AddCircleIcon from "@material-ui/icons/AddCircle";
 import clsx from "clsx";
-import React, { useEffect, useState } from "react";
+import React, { useEffect, useState, useRef } from "react";
 import { Link } from "react-router-dom";
 
 import { logger } from "../../../../../services/monitoring";
@@ -70,6 +70,7 @@ const MainForm = ({ name }) => {
   const [order, setOrder] = useState("desc");
   const [search, setSearch] = useState("");
   const [selected, setSelected] = useState([]);
+  const componentMounted = useRef(true);
   const classes = useStyles();
   const { setMessage } = useStatusContext();
   const {
@@ -103,7 +104,9 @@ const MainForm = ({ name }) => {
           },
           token
         );
-        watchFleetVehicles.start({ token });
+        if (componentMounted.current) {
+          watchFleetVehicles.start({ token });
+        }
       } catch (e) {
         setMessage(e.message);
         logger.warn(e.stack);
@@ -111,6 +114,7 @@ const MainForm = ({ name }) => {
       }
     })();
     return () => {
+      componentMounted.current = false;
       watchFleetVehicles.end();
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps