From 9be471ca66db3e59c8a79fb750d3f2d71d7c51ad Mon Sep 17 00:00:00 2001
From: Lars Kemmann <lars.kemmann@bynalogic.com>
Date: Tue, 27 Feb 2024 15:29:07 -0500
Subject: [PATCH] Visual tweak for expired requirements display

---
 .../Requirements/CompletedRequirementRow.tsx  | 30 +++++++++----------
 1 file changed, 15 insertions(+), 15 deletions(-)

diff --git a/src/caretogether-pwa/src/Requirements/CompletedRequirementRow.tsx b/src/caretogether-pwa/src/Requirements/CompletedRequirementRow.tsx
index cff6ebbe..13784fb7 100644
--- a/src/caretogether-pwa/src/Requirements/CompletedRequirementRow.tsx
+++ b/src/caretogether-pwa/src/Requirements/CompletedRequirementRow.tsx
@@ -19,11 +19,11 @@ export function CompletedRequirementRow({ requirement, context }: CompletedRequi
   const userLookup = useUserLookup();
   const permissions = useFamilyIdPermissions(
     context.kind === 'Referral' ||
-    context.kind === 'Arrangement' ||
-    context.kind === 'Family Volunteer Assignment' ||
-    context.kind === 'Individual Volunteer Assignment'
-    ? context.partneringFamilyId
-    : context.volunteerFamilyId
+      context.kind === 'Arrangement' ||
+      context.kind === 'Family Volunteer Assignment' ||
+      context.kind === 'Individual Volunteer Assignment'
+      ? context.partneringFamilyId
+      : context.volunteerFamilyId
   );
 
   const dialogHandle = useDialogHandle();
@@ -33,18 +33,18 @@ export function CompletedRequirementRow({ requirement, context }: CompletedRequi
     : context.kind === 'Arrangement' ||
       context.kind === 'Family Volunteer Assignment' ||
       context.kind === 'Individual Volunteer Assignment'
-    ? permissions(Permission.EditArrangementRequirementCompletion)
-    : permissions(Permission.EditApprovalRequirementCompletion);
-  
+      ? permissions(Permission.EditArrangementRequirementCompletion)
+      : permissions(Permission.EditApprovalRequirementCompletion);
+
   const dateFormat =
     context.kind === "Arrangement" ||
-    context.kind === "Family Volunteer Assignment" ||
-    context.kind === "Individual Volunteer Assignment"
-    ? "M/d/yy h:mm a" : "M/d/yy";
+      context.kind === "Family Volunteer Assignment" ||
+      context.kind === "Individual Volunteer Assignment"
+      ? "M/d/yy h:mm a" : "M/d/yy";
 
   const familyLookup = useFamilyLookup();
   const personLookup = usePersonLookup();
-  
+
   return (
     <>
       <IconRow icon="✅" onClick={canMarkIncomplete ? dialogHandle.openDialog : undefined}>
@@ -63,14 +63,14 @@ export function CompletedRequirementRow({ requirement, context }: CompletedRequi
               <><br /><span style={{ paddingLeft: '30px' }}>
                 {requirement.expiresAtUtc > new Date()
                   ? `⏰ Expires ${format(requirement.expiresAtUtc, dateFormat)}`
-                  : <span style={{ fontWeight: 'bold'}}>❌ Expired {format(requirement.expiresAtUtc, dateFormat)}</span>}
+                  : <span style={{ fontWeight: 'bold' }}>⚠ Expired {format(requirement.expiresAtUtc, dateFormat)}</span>}
               </span></>}
             {context.kind === 'Family Volunteer Assignment' &&
-              <><br/><span style={{ paddingLeft: '30px' }}>
+              <><br /><span style={{ paddingLeft: '30px' }}>
                 <FamilyName family={familyLookup(context.assignment.familyId)} />
               </span></>}
             {context.kind === 'Individual Volunteer Assignment' &&
-              <><br/><span style={{ paddingLeft: '30px' }}>
+              <><br /><span style={{ paddingLeft: '30px' }}>
                 <PersonName person={personLookup(context.assignment.familyId, context.assignment.personId)} />
               </span></>}
           </>