CEC-3519 Add car version history (#260)

* CEC-3519 Add car version history
CEC-3455 Delete button is icon and remove column
CEC-3496 Fix Issue delete

* smell

* Remove tab from issues details page

* Fix date format

src/components/Issues/Info/Details/index.jsx

@@ -2,6 +2,7 @@ import { Grid } from "@material-ui/core";
 import clsx from "clsx";
 import React, { useEffect } from "react";
 
+import { LocalDateTimeString } from "../../../../utils/dates";
 import { logger } from "../../../../services/monitoring";
 import { useStatusContext } from "../../../Contexts/StatusContext";
 import { useUserContext } from "../../../Contexts/UserContext";
@@ -11,7 +12,6 @@ import {
 } from "../../../Contexts/IssueContext";
 import useStyles from "../../../useStyles";
 
-
 const MainForm = ({ id }) => {
   const classes = useStyles();
   const { setMessage } = useStatusContext();
@@ -55,7 +55,7 @@ const MainForm = ({ id }) => {
               <b>Description</b>: {issue.description}
             </p>
             <p>
-              <b>timestamp</b>: {issue.timestamp}
+              <b>timestamp</b>: {LocalDateTimeString(issue.timestamp)}
             </p>
             {issue.images && issue.images.map((image, index) => (
               <img key={image.id} src={`data:image/png;base64, ${image.image}`} alt="Issue images" />

src/components/Issues/Info/index.jsx

@@ -1,55 +1,15 @@
-import { Box, Tab, Tabs } from "@material-ui/core";
 import clsx from "clsx";
-import React, { useEffect, useState } from "react";
+import React, { useEffect } from "react";
 import { useParams } from "react-router";
-import { useLocation } from "react-router-dom";
 
-import { hasRole } from "../../../utils/roles";
 import { useStatusContext } from "../../Contexts/StatusContext";
-import { useUserContext } from "../../Contexts/UserContext";
-import TabPanel from "../../Controls/TabPanel";
 import useStyles from "../../useStyles";
 import IssueDetailsTab from "./DetailsTab";
 
-
-const tabHashes = ["details", "updates", "filters"];
-
-const TabViews = [
-  {
-    label: "Details",
-    component: IssueDetailsTab,
-  },
-
-];
-
-const filterTabs = (data, groups, providers) => {
-  return data.reduce((result, item) => {
-    if (hasRole(groups, item.rolesPerProvider, providers)) {
-      result.push(item);
-    }
-    return result;
-  }, []);
-};
-
 const IssueInfo = () => {
   const { id } = useParams();
   const classes = useStyles();
   const { setTitle, setSitePath } = useStatusContext();
-  const { hash } = useLocation();
-  const [tabIndex, setTabIndex] = useState(0);
-  const [tabs, setTabs] = useState([]);
-  const { groups, providers } = useUserContext();
-
-  useEffect(() => {
-    const data = filterTabs(TabViews, groups, providers);
-    setTabs(data);
-  }, [groups, providers]);
-
-  useEffect(() => {
-    const key = hash.replace("#", "");
-    const index = tabHashes.findIndex((element) => element === key);
-    if (index >= 0) setTabIndex(index);
-  }, [hash]);
 
   useEffect(() => {
     const title = `Issue ${id} Details`;
@@ -66,39 +26,12 @@ const IssueInfo = () => {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [id]);
 
-  const handleTabChange = (_event, newIndex) => {
-    setTabIndex(newIndex);
-  };
-
   return (
     <div className={clsx(classes.paper, classes.tableSize)}>
-      <Box
-        className={classes.tableToolbar}
-        sx={{ borderBottom: 1, borderColor: "divider" }}
-      >
-        <Tabs
-          value={tabIndex}
-          onChange={handleTabChange}
-          aria-label="issue tabs"
-          indicatorColor="secondary">
-          {tabs.map((item, index) => <Tab key={index} label={item.label} {...tabProps(index)} />)}
-        </Tabs>
-      </Box>
-      {tabs.map((item, index) => (
-        <TabPanel key={index} value={tabIndex} index={index}>
-          <item.component id={id} />
-        </TabPanel>
-      ))}
+      <IssueDetailsTab id={id} />
     </div>
   );
 
 };
 
-function tabProps(index) {
-  return {
-    id: `tab-${index}`,
-    "aria-controls": `tabpanel-${index}`,
-  };
-}
-
 export default IssueInfo;