Add day of the week to room booking details

CHANGES.rst

@@ -25,6 +25,8 @@ Improvements
 - Allow searching for contributions by author in the management area (:pr:`5742`)
 - Include start/end dates of the whole booking in the timeline tooltip of recurring
   room bookings (:issue:`5730`, :pr:`5740`)
+- Add day of the week to room booking details modal and timeline (:issue:`5718`,
+  :pr:`5743`)
 
 Bugfixes
 ^^^^^^^^

indico/modules/rb/client/js/common/bookings/BookingDetails.jsx

@@ -292,7 +292,7 @@ class BookingDetails extends React.Component {
         rejections: rejections[day] || [],
         other: other[day] || [],
       },
-      label: moment(day).format('L'),
+      label: moment(day).format('ddd. L'),
       key: day,
       room,
     });

indico/modules/rb/client/js/components/TimeInformation.jsx

@@ -49,11 +49,25 @@ function TimeInformation({
             <Icon name="calendar outline" />
             {mEndDate && !mStartDate.isSame(mEndDate, 'day') ? (
               <Translate>
-                <Param name="startDate" wrapper={<strong />} value={mStartDate.format('L')} /> to{' '}
+                <Param
+                  name="startDateDay"
+                  wrapper={<span styleName="booking-times-weekday" />}
+                  value={mStartDate.format('ddd.')}
+                />{' '}
+                <Param name="startDate" wrapper={<strong />} value={mStartDate.format('L')} />
+                {' — '}
+                <Param
+                  name="endDateDay"
+                  wrapper={<span styleName="booking-times-weekday" />}
+                  value={mEndDate.format('ddd.')}
+                />{' '}
                 <Param name="endDate" wrapper={<strong />} value={mEndDate.format('L')} />
               </Translate>
             ) : (
-              <strong>{mStartDate.format('L')}</strong>
+              <strong>
+                <span styleName="booking-times-weekday">{mStartDate.format('ddd.')}</span>{' '}
+                {mStartDate.format('L')}
+              </strong>
             )}
           </div>
         </Segment>

indico/modules/rb/client/js/components/TimeInformation.module.scss

@@ -5,6 +5,8 @@
 // modify it under the terms of the MIT License; see the
 // LICENSE file for more details.
 
+@import 'rb:styles/palette';
+
 .booking-time-info {
   margin-top: 10px;
 }
@@ -14,3 +16,8 @@
   justify-content: space-between;
   align-items: center;
 }
+
+.booking-times-weekday {
+  color: $dark-gray;
+  font-weight: bold;
+}