Fix found bugs during demo

client/src/pages/scoreboard/scoreboard.page.container.jsx

@@ -1,9 +1,12 @@
 import Icon, { FieldTimeOutlined } from "@ant-design/icons";
 import { Tabs } from "antd";
+import queryString from "query-string";
 import React, { useEffect } from "react";
 import { useTranslation } from "react-i18next";
 import { FaShieldAlt } from "react-icons/fa";
 import { connect } from "react-redux";
+import { useNavigate, useLocation } from "react-router-dom";
+import { createStructuredSelector } from "reselect";
 import FeatureWrapper from "../../components/feature-wrapper/feature-wrapper.component";
 import RbacWrapper from "../../components/rbac-wrapper/rbac-wrapper.component";
 import ScoreboardDisplay from "../../components/scoreboard-display/scoreboard-display.component";
@@ -14,9 +17,6 @@ import {
   setSelectedHeader,
 } from "../../redux/application/application.actions";
 import { selectBodyshop } from "../../redux/user/user.selectors";
-import { useNavigate, useLocation } from "react-router-dom";
-import {createStructuredSelector} from "reselect";
-import queryString from "query-string";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -29,9 +29,9 @@ const mapDispatchToProps = (dispatch) => ({
 
 export function ScoreboardContainer({ setBreadcrumbs, setSelectedHeader }) {
   const { t } = useTranslation();
-    const searchParams = queryString.parse(useLocation().search);
-    const { tab } = searchParams;
-  const navigate = useNavigate();
+  const searchParams = queryString.parse(useLocation().search);
+  const { tab } = searchParams;
+  const history = useNavigate();
   useEffect(() => {
     document.title = t("titles.scoreboard");
     setSelectedHeader("scoreboard");
@@ -44,58 +44,60 @@ export function ScoreboardContainer({ setBreadcrumbs, setSelectedHeader }) {
   }, [t, setBreadcrumbs, setSelectedHeader]);
 
   return (
-      <FeatureWrapper featureName="scoreboard">
-        <RbacWrapper action="scoreboard:view">
-          <Tabs
-              activeKey={tab || "sb"}
-              destroyInactiveTabPane
-              onChange={(key) => {
-                searchParams.set("tab", key);
-                navigate({ search: searchParams.toString() });
-              }}
-          >
-            <Tabs.TabPane
-                tab={
-                  <span>
+    <FeatureWrapper featureName="scoreboard">
+      <RbacWrapper action="scoreboard:view">
+        <Tabs
+          activeKey={tab || "sb"}
+          destroyInactiveTabPane
+          onChange={(key) => {
+            searchParams.tab = key;
+            history({
+              search: queryString.stringify(searchParams),
+            });
+          }}
+        >
+          <Tabs.TabPane
+            tab={
+              <span>
                 <Icon component={FaShieldAlt} />
-                    {t("scoreboard.labels.jobs")}
+                {t("scoreboard.labels.jobs")}
               </span>
-                }
-                destroyInactiveTabPane
-                key="sb"
-            >
-              <ScoreboardDisplay />
-            </Tabs.TabPane>
-            <Tabs.TabPane
-                tab={
-                  <span>
+            }
+            destroyInactiveTabPane
+            key="sb"
+          >
+            <ScoreboardDisplay />
+          </Tabs.TabPane>
+          <Tabs.TabPane
+            tab={
+              <span>
                 <FieldTimeOutlined />
-                    {t("scoreboard.labels.timeticketsemployee")}
+                {t("scoreboard.labels.timeticketsemployee")}
               </span>
-                }
-                destroyInactiveTabPane
-                key="tickets"
-            >
-              <ScoreboardTimeTickets />
-            </Tabs.TabPane>
-            <Tabs.TabPane
-                tab={
-                  <span>
+            }
+            destroyInactiveTabPane
+            key="tickets"
+          >
+            <ScoreboardTimeTickets />
+          </Tabs.TabPane>
+          <Tabs.TabPane
+            tab={
+              <span>
                 <FieldTimeOutlined />
-                    {t("scoreboard.labels.allemployeetimetickets")}
+                {t("scoreboard.labels.allemployeetimetickets")}
               </span>
-                }
-                destroyInactiveTabPane
-                key="ticketsstats"
-            >
-              <ScoreboardTimeTicketsStats />
-            </Tabs.TabPane>
-          </Tabs>
-        </RbacWrapper>
-      </FeatureWrapper>
+            }
+            destroyInactiveTabPane
+            key="ticketsstats"
+          >
+            <ScoreboardTimeTicketsStats />
+          </Tabs.TabPane>
+        </Tabs>
+      </RbacWrapper>
+    </FeatureWrapper>
   );
 }
 export default connect(
-    mapStateToProps,
-    mapDispatchToProps
-)(ScoreboardContainer);
+  mapStateToProps,
+  mapDispatchToProps
+)(ScoreboardContainer);