From 328e4dc122df8b3d7b60ad00c1264beba42fb9b3 Mon Sep 17 00:00:00 2001
From: Eduard Voronkin <evoronkin@fiskerinc.com>
Date: Tue, 10 Oct 2023 10:29:57 -0700
Subject: [PATCH] CEC-5205 display DTC snapshots. (#463)

* CEC-5205 display DTC snapshots.

* Apply suggestions from code review

* Update src/components/DTCTimeline/DTCTimeline/index.jsx
---
 .../DTCTimeline/__snapshots__/index.test.jsx.snap           | 6 ++++++
 src/components/DTCTimeline/DTCTimeline/index.jsx            | 6 ++++++
 2 files changed, 12 insertions(+)

diff --git a/src/components/DTCTimeline/DTCTimeline/__snapshots__/index.test.jsx.snap b/src/components/DTCTimeline/DTCTimeline/__snapshots__/index.test.jsx.snap
index 0fee44a..92d29b9 100644
--- a/src/components/DTCTimeline/DTCTimeline/__snapshots__/index.test.jsx.snap
+++ b/src/components/DTCTimeline/DTCTimeline/__snapshots__/index.test.jsx.snap
@@ -607,6 +607,12 @@ exports[`Render Render 1`] = `
                       </svg>
                     </span>
                   </th>
+                  <th
+                    class="MuiTableCell-root MuiTableCell-head MuiTableCell-alignCenter"
+                    scope="col"
+                  >
+                    DTC Snapshot
+                  </th>
                 </tr>
               </thead>
               <tbody
diff --git a/src/components/DTCTimeline/DTCTimeline/index.jsx b/src/components/DTCTimeline/DTCTimeline/index.jsx
index 8c88c98..6406391 100644
--- a/src/components/DTCTimeline/DTCTimeline/index.jsx
+++ b/src/components/DTCTimeline/DTCTimeline/index.jsx
@@ -69,6 +69,11 @@ const MainForm = ({ vin }) => {
       id: "created_at",
       label: "Cloud Time",
     },
+    {
+      id: "snapshot",
+      label: "DTC Snapshot",
+      no_sort: true,
+    },
   ];
 
   const handleSort = (_event, property) => {
@@ -304,6 +309,7 @@ const MainForm = ({ vin }) => {
                   {(dtc.voltage || dtc.voltage === 0) && <TableCell>{dtc.voltage + " V"}</TableCell>}
                   <TableCell>{formatDate(dtc.epoch_usec)}</TableCell>
                   <TableCell>{formatDate(dtc.created_at)}</TableCell>
+                  {dtc.snapshot && <TableCell style={{ wordBreak: "break-all" }}>{dtc.snapshot}</TableCell>}
                 </TableRow>
               ))}
             </TableBody>