admin/ota-admin-portal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

CEC-4206-ecu-page-cut-off (#321)

Browse Source 
* CEC-4206-ecu-page-cut-off

* fix test

* Update snapshots

* Fix tooltip title warning

---------

Co-authored-by: jwu-fisker <jwu@fiskerinc.com>
Co-authored-by: John Wu <76966357+jwu-fisker@users.noreply.github.com>
This commit is contained in:
das31
2023-04-25 17:25:22 -04:00
committed by GitHub
parent bd1f6f632c
commit 7b061c0282
3 changed files with 145 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

170
src/components/Cars/Status/__snapshots__/ECUsTab.test.jsx.snap
View File

@@ -273,49 +273,94 @@ exports[`ECUsTab Render 1`] = `
class="MuiTableRow-root"
>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
>
ECUA
<span
class=""
title="ECUA"
>
ECUA
</span>
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
>
SWVERSION
<span
class=""
title="SWVERSION"
>
SWVERSION
</span>
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
>
HWVERSION
<span
class=""
title="HWVERSION"
>
HWVERSION
</span>
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
>
VENDOR
<span
class=""
title="VENDOR"
>
VENDOR
</span>
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
>
SUPPLIER_SW_VERSION
<span
class=""
title="SUPPLIER_SW_VERSION"
>
SUPPLIER_SW_VERSION
</span>
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
>
SERIAL_NUMBER
<span
class=""
title="SERIAL_NUMBER"
>
SERIAL_NUMBER
</span>
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
>
BOOT_LOADER
<span
class=""
title="BOOT_LOADER"
>
BOOT_LOADER
</span>
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
>
CONFIG
<span
class=""
title="CONFIG"
>
CONFIG
</span>
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
>
FINGERPRINT
<span
class=""
title="FINGERPRINT"
>
FINGERPRINT
</span>
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
@@ -327,40 +372,85 @@ exports[`ECUsTab Render 1`] = `
class="MuiTableRow-root"
>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
>
ECUB
<span
class=""
title="ECUB"
>
ECUB
</span>
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
>
SWVERSION
<span
class=""
title="SWVERSION"
>
SWVERSION
</span>
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
>
HWVERSION
<span
class=""
title="HWVERSION"
>
HWVERSION
</span>
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
/>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
/>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
/>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
/>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
>
CONFIG
<span
class=""
title="none"
/>
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
/>
class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
>
<span
class=""
title="none"
/>
</td>
<td
class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
>
<span
class=""
title="none"
/>
</td>
<td
class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
>
<span
class=""
title="none"
/>
</td>
<td
class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
>
<span
class=""
title="CONFIG"
>
CONFIG
</span>
</td>
<td
class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
>
<span
class=""
title="none"
/>
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
>

11
src/components/Controls/CarECUsTable/index.jsx
View File

@@ -4,7 +4,8 @@ import {
TableCell,
TableFooter,
TablePagination,
TableRow
TableRow,
Tooltip
} from "@material-ui/core";
import clsx from "clsx";
import React, { useEffect, useState } from "react";
@@ -136,7 +137,13 @@ const CarECUsTable = ({ vin, token, classes }) => {
{tableColumns.map((column, j) => {
const key = `${row.ecu + i}${column.id}`
if (column.id === "updated_at") return (<TableCell key={key} align="center">{LocalDateTimeString(row.updated)}</TableCell>);
return (<TableCell key={key} align="center">{row[column.id]}</TableCell>);
return (
<TableCell key={key} align="center" className={classes.limitWidthTableCell}>
<Tooltip title={`${row[column.id] || 'none'}`}>
<span>{row[column.id]}</span>
</Tooltip>
</TableCell>
);
})}
</TableRow>
))}

7
src/components/useStyles.jsx
View File

@@ -288,7 +288,12 @@ const useStyles = makeStyles((theme) => ({
tableHeader: {
textDecorationStyle: "solid",
fontWeight:500,
}
},
limitWidthTableCell: {
maxWidth: "200px",
whiteSpace: "normal",
wordWrap: "break-word",
},
}));
export default useStyles;