bug/CE-486 - update drug item fields (#285)

Co-authored-by: afwilcox <[email protected]>
bcgov · Feb 15, 2024 · 27c7397 · 27c7397
1 parent 5917c22
commit 27c7397
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 13 deletions.
diff --git a/frontend/src/app/components/containers/complaints/outcomes/animal-outcomes/add-drug.tsx b/frontend/src/app/components/containers/complaints/outcomes/animal-outcomes/add-drug.tsx
@@ -43,7 +43,7 @@ export const AddDrug: FC<props> = ({
   const drugUseMethods = useAppSelector(selectDrugUseMethods);
   const remainingDrugUse = useAppSelector(selectRemainingDrugUse);
 
-  const [showDiscarded, setShowDiscarded] = useState(true);
+  const [showDiscarded, setShowDiscarded] = useState(remainingUse === "DISC");
 
   const updateModel = (property: string, value: string | Date | number | null | undefined) => {
     const source = {

diff --git a/...src/app/components/containers/complaints/outcomes/animal-outcomes/animal-outcome-item.tsx b/...src/app/components/containers/complaints/outcomes/animal-outcomes/animal-outcome-item.tsx
@@ -148,14 +148,18 @@ export const AnimalOutcomeItem: FC<props> = ({
                   <div className="comp-margin-right-xxs">
                     <b>{animal}</b>,
                   </div>
-                  <div className="comp-margin-right-xxs">{animalSex},</div>
-                  <div className="comp-margin-right-xxs">{animalAge}</div>
-                  <div className="badge comp-status-badge-threat-level comp-margin-right-xxs">
-                    Threat level: {animalThreatLevel}
-                  </div>
-                  <div className="badge comp-status-badge-conflict-history comp-margin-right-xxs">
-                    Conflict history: {animalHistory}
-                  </div>
+                  {animalSex && <div className="comp-margin-right-xxs">{animalSex},</div>}
+                  {animalAge && <div className="comp-margin-right-xxs">{animalAge}</div>}
+                  {animalThreatLevel && (
+                    <div className="badge comp-status-badge-threat-level comp-margin-right-xxs">
+                      Threat level: {animalThreatLevel}
+                    </div>
+                  )}
+                  {animalHistory && (
+                    <div className="badge comp-status-badge-conflict-history comp-margin-right-xxs">
+                      Conflict history: {animalHistory}
+                    </div>
+                  )}
                 </div>
               </div>
             </div>

diff --git a/frontend/src/app/components/containers/complaints/outcomes/animal-outcomes/drug-item.tsx b/frontend/src/app/components/containers/complaints/outcomes/animal-outcomes/drug-item.tsx
@@ -108,15 +108,23 @@ export const DrugItem: FC<props> = ({
           <span className="comp-fake-label">Fate of remaining drug in vial</span> {remaining}
         </Col>
         <Col md={4}>
-          <span className="comp-fake-label">Amount discarded</span> {amountDiscarded}ml
+          {remainingUse === "DISC" && (
+            <>
+              <span className="comp-fake-label">Amount discarded</span> {amountDiscarded}ml
+            </>
+          )}
         </Col>
         <Col md={3}>
-          <span className="comp-fake-label">Discard method</span> {discardMethod}
+          {remainingUse === "DISC" && (
+            <>
+              <span className="comp-fake-label">Discard method</span> {discardMethod}
+            </>
+          )}
         </Col>
       </Row>
       <Row>
         <Col md={4}>
-        <span className="comp-fake-label">Officer</span>
+          <span className="comp-fake-label">Officer</span>
           <div
             data-initials-sm={getAvatarInitials(assignedOfficer())}
             className="comp-orange-avatar-sm comp-details-inner-content"
@@ -127,7 +135,7 @@ export const DrugItem: FC<props> = ({
           </div>
         </Col>
         <Col md={8}>
-        <span className="comp-fake-label">Date</span> {formatDate(date?.toString())}
+          <span className="comp-fake-label">Date</span> {formatDate(date?.toString())}
         </Col>
       </Row>
     </div>