Add matcher slot description, reformat match solver

csmberkeley · Sep 4, 2024 · e2d11f8 · e2d11f8
1 parent 1a9740f
commit e2d11f8
Show file tree

Hide file tree

Showing 11 changed files with 142 additions and 34 deletions.
diff --git a/csm_web/frontend/src/components/enrollment_automation/EnrollmentAutomationTypes.tsx b/csm_web/frontend/src/components/enrollment_automation/EnrollmentAutomationTypes.tsx
@@ -9,6 +9,7 @@ export interface Time {
 export interface Slot {
   id?: number;
   times: Time[];
+  description?: string;
   [key: string]: any;
 }
 

diff --git a/csm_web/frontend/src/components/enrollment_automation/MentorSectionPreferences.tsx b/csm_web/frontend/src/components/enrollment_automation/MentorSectionPreferences.tsx
@@ -67,7 +67,8 @@ export function MentorSectionPreferences({
         id: slot.id,
         // replace single quotes for JSON
         times: times,
-        preference: 0
+        preference: 0,
+        description: slot.description
       };
       newSlots.push(parsed_slot);
     }
@@ -169,7 +170,7 @@ export function MentorSectionPreferences({
     const event = selectedEvents[0];
     sidebarContents = (
       <div className="matcher-sidebar-selected">
-        <div className="mathcer-sidebar-selected-top">
+        <div className="matcher-sidebar-selected-top">
           {selectedEvents.length === 1 ? (
             // exactly one selected event
             <React.Fragment>
@@ -188,6 +189,14 @@ export function MentorSectionPreferences({
             // multiple selected events
             <div className="matcher-sidebar-header">Multiple selected events</div>
           )}
+          <div className="matcher-sidebar-metadata-container">
+            {event.description !== "" && (
+              <>
+                <div className="matcher-sidebar-subheader">Description:</div>
+                <div className="matcher-description-text">{event.description}</div>
+              </>
+            )}
+          </div>
           <label className="matcher-pref-input-label">
             Preference:
             <input

diff --git a/csm_web/frontend/src/components/enrollment_automation/coordinator/CoordinatorMatcherForm.tsx b/csm_web/frontend/src/components/enrollment_automation/coordinator/CoordinatorMatcherForm.tsx
@@ -61,7 +61,7 @@ export function CoordinatorMatcherForm({
     }
 
     // convert times to numbers
-    const new_slots: Slot[] = jsonSlots.slots.map((slot: { id: number; times: StrTime[] }) => {
+    const new_slots: Slot[] = jsonSlots.slots.map((slot: { id: number; times: StrTime[]; description: string }) => {
       const new_times: Time[] = slot.times.map((time: StrTime) => {
         return {
           interval: Interval.fromDateTimes(parseTime(time.startTime), parseTime(time.endTime)),
@@ -71,7 +71,8 @@ export function CoordinatorMatcherForm({
       });
       return {
         id: slot.id,
-        times: new_times
+        times: new_times,
+        description: slot.description
       };
     });
 

diff --git a/csm_web/frontend/src/components/enrollment_automation/coordinator/CreateStage.tsx b/csm_web/frontend/src/components/enrollment_automation/coordinator/CreateStage.tsx
@@ -67,6 +67,8 @@ export function CreateStage({ profile, initialSlots, nextStage }: CreateStagePro
     length: Duration.fromObject({ hours: 1 })
   });
 
+  const [curSlotDescription, setCurSlotDescription] = useState<string>("");
+
   /**
    * Whether or not anything has been edited
    */
@@ -275,6 +277,7 @@ export function CreateStage({ profile, initialSlots, nextStage }: CreateStagePro
     } else {
       setCurCreatedTimes([]);
     }
+    setCurSlotDescription("");
     setCreatingTiledEvents(checked);
   };
 
@@ -325,7 +328,7 @@ export function CreateStage({ profile, initialSlots, nextStage }: CreateStagePro
     const newSlots = [];
     for (let t = tileDetails.start; t <= tileDetails.end.minus(tileDetails.length); t = t.plus(tileDetails.length)) {
       if (tileDetails.daysLinked) {
-        const newEvent: CalendarEvent = { times: [] };
+        const newEvent: CalendarEvent = { times: [], description: curSlotDescription };
         for (const day of tileDetails.days) {
           newEvent.times.push({
             day: day,
@@ -337,7 +340,14 @@ export function CreateStage({ profile, initialSlots, nextStage }: CreateStagePro
       } else {
         for (const day of tileDetails.days) {
           newSlots.push({
-            times: [{ day: day, interval: Interval.fromDateTimes(t, t.plus(tileDetails.length)), isLinked: false }]
+            times: [
+              {
+                day: day,
+                interval: Interval.fromDateTimes(t, t.plus(tileDetails.length)),
+                isLinked: false
+              }
+            ],
+            description: curSlotDescription
           });
         }
       }
@@ -352,8 +362,9 @@ export function CreateStage({ profile, initialSlots, nextStage }: CreateStagePro
    * Save the newly created event and times
    */
   const saveEvent = () => {
-    const newEvent = { times: curCreatedTimes };
+    const newEvent = { times: curCreatedTimes, description: curSlotDescription };
     setSlots([...slots, newEvent]);
+    setCurSlotDescription("");
     setCurCreatedTimes([]);
     setSavedExistingEvent(null);
     setSelectedEvents([]);
@@ -379,6 +390,7 @@ export function CreateStage({ profile, initialSlots, nextStage }: CreateStagePro
     setCurCreatedTimes([]);
     setSelectedEvents([]);
     setSelectedEventIndices([]);
+    setCurSlotDescription("");
   };
 
   /**
@@ -389,6 +401,7 @@ export function CreateStage({ profile, initialSlots, nextStage }: CreateStagePro
       const event = selectedEvents[0];
       // copy event
       setCurCreatedTimes(_.cloneDeep(event.times));
+      setCurSlotDescription(event.description);
       setSavedExistingEvent(_.cloneDeep(event)); // duplicate event
       // delete event
       deleteSelectedEvent();
@@ -619,6 +632,17 @@ export function CreateStage({ profile, initialSlots, nextStage }: CreateStagePro
                 mins
               </div>
             </div>
+            <div className="matcher-tiling-metadata-container">
+              <div className="matcher-tiling-subheader">Description:</div>
+              <div className="matcher-tiling-description-input-container">
+                <input
+                  className="matcher-tiling-description-input form-input light"
+                  type="text"
+                  value={curSlotDescription}
+                  onChange={e => setCurSlotDescription(e.target.value)}
+                />
+              </div>
+            </div>
           </div>
         </div>
         <div className="matcher-sidebar-tiling-bottom">
@@ -677,6 +701,17 @@ export function CreateStage({ profile, initialSlots, nextStage }: CreateStagePro
             ))}
           </div>
         </div>
+        <div className="matcher-sidebar-metadata-container">
+          <div className="matcher-sidebar-subheader">Description:</div>
+          <div className="matcher-sidebar-description-input-container">
+            <input
+              className="matcher-sidebar-description-input form-input light"
+              type="text"
+              value={curSlotDescription}
+              onChange={e => setCurSlotDescription(e.target.value)}
+            />
+          </div>
+        </div>
         <div className="matcher-sidebar-create-bottom">
           <div className="matcher-sidebar-create-bottom-row">
             <button className="secondary-btn" onClick={cancelEvent}>
@@ -713,6 +748,14 @@ export function CreateStage({ profile, initialSlots, nextStage }: CreateStagePro
                   </li>
                 ))}
               </ul>
+              <div className="matcher-sidebar-metadata-container">
+                {selectedEvents[0].description !== "" && (
+                  <>
+                    <div className="matcher-sidebar-subheader">Description:</div>
+                    <div className="matcher-sidebar-description-text">{selectedEvents[0].description}</div>
+                  </>
+                )}
+              </div>
             </React.Fragment>
           ) : (
             // multiple selected events

diff --git a/csm_web/frontend/src/css/enrollment_matcher.scss b/csm_web/frontend/src/css/enrollment_matcher.scss
@@ -361,7 +361,8 @@
   color: $csm-danger-darkened;
 }
 
-.matcher-tiling-subheader {
+.matcher-tiling-subheader,
+.matcher-sidebar-subheader {
   /* font-style: italic; */
   font-weight: 600;
 }
@@ -432,6 +433,19 @@
   max-width: 250px;
 }
 
+.matcher-tiling-metadata-container,
+.matcher-sidebar-metadata-container {
+  padding-top: 5px;
+}
+
+.matcher-description-text {
+  max-width: 350px;
+  margin-top: 5px;
+  margin-left: 5px;
+
+  overflow-wrap: break-word;
+}
+
 .matcher-unsaved-changes-container {
   height: fit-content;
   margin-right: 15px;
@@ -620,6 +634,7 @@
   gap: 8px;
   align-items: center;
   margin-top: 8px;
+  font-weight: bold;
 }
 
 /* ConfigureStage.tsx */

diff --git a/csm_web/frontend/src/utils/queries/matcher.tsx b/csm_web/frontend/src/utils/queries/matcher.tsx
@@ -35,6 +35,7 @@ interface MatcherSlotsResponse {
   slots: Array<{
     id: number;
     times: MatcherSlotsResponseTime[];
+    description: string;
   }>;
 }
 

diff --git a/csm_web/scheduler/migrations/0033_matcherslot_description.py b/csm_web/scheduler/migrations/0033_matcherslot_description.py
@@ -0,0 +1,17 @@
+# Generated by Django 4.2.7 on 2024-08-12 04:12
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+    dependencies = [
+        ("scheduler", "0032_word_of_the_day"),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name="matcherslot",
+            name="description",
+            field=models.TextField(blank=True, default=""),
+        ),
+    ]
diff --git a/csm_web/scheduler/models.py b/csm_web/scheduler/models.py
@@ -260,19 +260,15 @@ def save(self, *args, **kwargs):
             ):
                 if settings.DJANGO_ENV != settings.DEVELOPMENT:
                     logger.info(
-                        (
-                            "<SectionOccurrence> SO automatically created for student"
-                            " %s in course %s for date %s"
-                        ),
+                        "<SectionOccurrence> SO automatically created for student"
+                        " %s in course %s for date %s",
                         self.user.email,
                         course.name,
                         now.date(),
                     )
                     logger.info(
-                        (
-                            "<Attendance> Attendance automatically created for student"
-                            " %s in course %s for date %s"
-                        ),
+                        "<Attendance> Attendance automatically created for student"
+                        " %s in course %s for date %s",
                         self.user.email,
                         course.name,
                         now.date(),
@@ -575,6 +571,7 @@ class MatcherSlot(ValidatingModel):
     times = models.JSONField()
     min_mentors = models.PositiveSmallIntegerField()
     max_mentors = models.PositiveSmallIntegerField()
+    description = models.TextField(default="", blank=True)
 
     def clean(self):
         super().clean()

diff --git a/csm_web/scheduler/serializers.py b/csm_web/scheduler/serializers.py
@@ -386,7 +386,7 @@ class Meta:
 class MatcherSlotSerializer(serializers.ModelSerializer):
     class Meta:
         model = MatcherSlot
-        fields = ["id", "matcher", "times"]
+        fields = ["id", "matcher", "times", "description"]
 
 
 class MatcherPreferenceSerializer(serializers.ModelSerializer):