From d0d4ceb270d12e666857d5412a9687f6f196b2c8 Mon Sep 17 00:00:00 2001
From: Patrick Fic <>
Date: Mon, 27 Jun 2022 12:46:29 -0700
Subject: [PATCH] IO-1958 IO-1884 Vehicle card updates.

---
 .../jobs-detail-header.component.jsx          | 29 ++++++++++---------
 1 file changed, 16 insertions(+), 13 deletions(-)

diff --git a/client/src/components/jobs-detail-header/jobs-detail-header.component.jsx b/client/src/components/jobs-detail-header/jobs-detail-header.component.jsx
index 763246908..2fb735827 100644
--- a/client/src/components/jobs-detail-header/jobs-detail-header.component.jsx
+++ b/client/src/components/jobs-detail-header/jobs-detail-header.component.jsx
@@ -217,21 +217,24 @@ export function JobsDetailHeader({ job, bodyshop, disabled }) {
               <JobsRelatedRos jobid={job.id} job={job} />
             </DataLabel>
             {job.vehicle && job.vehicle.notes && (
-              <DataLabel label={t("vehicles.fields.notes")}>
-                <span style={{ whiteSpace: "pre" }}>{job.vehicle.notes}</span>
+              <DataLabel
+                label={t("vehicles.fields.notes")}
+                valueStyle={{ whiteSpace: "pre-wrap" }}
+              >
+                {job.vehicle.notes}
+              </DataLabel>
+            )}
+            {job.vehicle && job.vehicle.v_paint_codes && (
+              <DataLabel
+                label={t("vehicles.fields.v_paint_codes", { number: "" })}
+              >
+                <span style={{ whiteSpace: "pre" }}>
+                  {Object.keys(job.vehicle.v_paint_codes).map((key, idx) => (
+                    <Tag key={idx}>{job.vehicle.v_paint_codes[key]}</Tag>
+                  ))}
+                </span>
               </DataLabel>
             )}
-            {
-              //   job.vehicle && job.vehicle.v_paint_codes && (
-              //   <DataLabel label={t("vehicles.fields.v_paint_codes")}>
-              //     <span style={{ whiteSpace: "pre" }}>
-              //       {Object.keys(job.vehicle.v_paint_codes).map((key, idx) => (
-              //         <Tag key={idx}>{job.vehicle.v_paint_codes[key]}</Tag>
-              //       ))}
-              //     </span>
-              //   </DataLabel>
-              // )
-            }
           </div>
         </Card>
       </Col>