From f0f08a91edab017a204f9998c41d3c7f9f608223 Mon Sep 17 00:00:00 2001
From: memeriau <manuel.emeriau@mappy.com>
Date: Sat, 16 Apr 2022 15:34:21 +0200
Subject: [PATCH] display dayWishes in team candidates

---
 .../TeamAssignment/TeamWithCandidates.tsx     | 19 ++++++++++++++-----
 .../TeamAssignment/styles.module.scss         | 13 +++++++++++++
 2 files changed, 27 insertions(+), 5 deletions(-)

diff --git a/src/components/TeamAssignment/TeamWithCandidates.tsx b/src/components/TeamAssignment/TeamWithCandidates.tsx
index d5d7ce6..a916904 100644
--- a/src/components/TeamAssignment/TeamWithCandidates.tsx
+++ b/src/components/TeamAssignment/TeamWithCandidates.tsx
@@ -31,6 +31,16 @@ const selectTeamsWithVolunteersCandidates = createSelector(
         })
 )
 
+type PropsDaysDisplay = {
+    dayWishes: string[]
+}
+
+const DaysDisplay: FC<PropsDaysDisplay> = ({ dayWishes }): JSX.Element => (
+    <span className={styles.daysDisplay}>
+        {dayWishes.map((day) => (day === "S" || day === "D" ? <strong>{day}</strong> : day))}
+    </span>
+)
+
 type Props = {
     teamId: number
 }
@@ -51,12 +61,11 @@ const TeamWithCandidates: FC<Props> = ({ teamId }): JSX.Element | null => {
                 Equipe {team.name} ({team.volunteers.length}) :
             </div>
             <ul>
-                {team.volunteers.map(({ id, lastname, firstname, teamWishes }) => (
+                {team.volunteers.map(({ id, lastname, firstname, teamWishes, dayWishes }) => (
                     <li key={id}>
-                        <b>
-                            {firstname} {lastname}
-                        </b>{" "}
-                        :
+                        <span className={styles.volunteerName}>
+                            {firstname} {lastname} (<DaysDisplay dayWishes={dayWishes} />)
+                        </span>
                         {teamWishes.map((teamWish) => {
                             const active = false
                             return (
diff --git a/src/components/TeamAssignment/styles.module.scss b/src/components/TeamAssignment/styles.module.scss
index 9f4cf6c..dfa6758 100755
--- a/src/components/TeamAssignment/styles.module.scss
+++ b/src/components/TeamAssignment/styles.module.scss
@@ -35,3 +35,16 @@
         background-color: #fb0;
     }
 }
+
+.volunteerName {
+    font-weight: bold;
+}
+
+.daysDisplay {
+    font-weight: normal;
+    color: $color-grey-medium;
+
+    strong {
+        color: $color-green;
+    }
+}