Merge branch 'sean/hover-collection-second-image' of https://github.c…

…om/acmucsd/membership-portal-ui-v2 into sean/hover-collection-second-image
acmucsd · Apr 29, 2024 · 8d173a4 · 8d173a4
2 parents 5328f4f + fe44934
commit 8d173a4
Show file tree

Hide file tree

Showing 5 changed files with 36 additions and 22 deletions.
diff --git a/src/components/events/EventBadges/style.module.scss b/src/components/events/EventBadges/style.module.scss
@@ -23,30 +23,35 @@
         animation: pulse 1s ease-in-out infinite alternate;
 
         @keyframes pulse {
-          0% { opacity: 0 }
-          100% {opacity: 1 }
+          0% {
+            opacity: 0;
+          }
+
+          100% {
+            opacity: 1;
+          }
         }
       }
 
       &::before {
-        animation: pulse2 2s ease-out forwards infinite;
+        animation: pulse2 2s ease-out reverse infinite;
         border: 2px solid vars.$danger-1;
         border-radius: 5px;
         content: '';
         position: absolute;
 
         @keyframes pulse2 {
           0% {
-            filter: blur(0);
-            inset: 0;
-            opacity: 1;
-          }
-
-          100% {
             filter: blur(2px);
             inset: -0.75rem;
             opacity: 0;
           }
+
+          100% {
+            filter: blur(0);
+            inset: 0;
+            opacity: 1;
+          }
         }
       }
     }

diff --git a/src/components/store/OrderCard/index.tsx b/src/components/store/OrderCard/index.tsx
@@ -46,6 +46,7 @@ const OrderCard = ({ order, futurePickupEvents }: OrderCardProps) => {
   const [pickupEvent, setPickupEvent] = useState<PublicOrderPickupEvent>(order.pickupEvent);
   const [orderStatus, setOrderStatus] = useState<OrderStatus>(order.status);
   const orderOpen = open && orderData !== null;
+  const [statusName, setStatusName] = useState<string>(orderStatusName[orderStatus]);
 
   useEffect(() => {
     if (open && orderData === null) {
@@ -57,8 +58,10 @@ const OrderCard = ({ order, futurePickupEvents }: OrderCardProps) => {
           reportError('Error loading order!', e);
           setOrderData(null);
         });
+    } else if (open) {
+      setStatusName(orderStatusName[orderStatus]);
     }
-  }, [open, order.uuid, orderData]);
+  }, [open, order.uuid, orderData, pickupEvent, orderStatus]);
 
   const cancelOrder = async () => {
     await StoreManager.cancelMerchOrder(order.uuid);
@@ -68,10 +71,10 @@ const OrderCard = ({ order, futurePickupEvents }: OrderCardProps) => {
   const rescheduleOrderPickup = async (pickup: PublicOrderPickupEvent) => {
     await StoreManager.rescheduleOrderPickup(order.uuid, pickup.uuid);
     setPickupEvent(pickup);
+    setOrderStatus(OrderStatus.PLACED);
   };
 
   const statusColor = orderStatusColor[orderStatus];
-  const statusName = orderStatusName[orderStatus];
 
   return (
     <div className={styles.card}>

diff --git a/src/components/store/OrderSummary/index.tsx b/src/components/store/OrderSummary/index.tsx
@@ -30,7 +30,11 @@ const isOrderActionable = (status: OrderStatus, pickupEvent: PublicOrderPickupEv
   const now = new Date();
   const eventStart = new Date(pickupEvent.start);
   eventStart.setDate(eventStart.getDate() - 2);
-  if (now > eventStart) {
+  if (
+    now > eventStart &&
+    status !== OrderStatus.PICKUP_MISSED &&
+    status !== OrderStatus.PICKUP_CANCELLED
+  ) {
     return false;
   }
   return true;

diff --git a/src/components/store/PickupEventDetail/index.tsx b/src/components/store/PickupEventDetail/index.tsx
@@ -29,7 +29,7 @@ const PickupEventDetail = ({ pickupEvent }: PickupEventDetailProps) => {
             {title}
           </Typography>
           <Typography variant="h2/regular" className={styles.title} suppressHydrationWarning>
-            {formatEventDate(start, end)}
+            {formatEventDate(start, end, true)}
           </Typography>
           {hasLinkedEvent ? (
             <Typography variant="h3/regular">{linkedEvent?.location}</Typography>

diff --git a/src/components/store/PickupEventPicker/index.tsx b/src/components/store/PickupEventPicker/index.tsx
@@ -23,15 +23,17 @@ const PickupEventPicker = ({ events, eventIndex, setEventIndex, active }: EventP
             className={styles.slider}
             style={{ transform: `translateX(calc(-1 * var(--width) * ${eventIndex}))` }}
           >
-            {events.map(event => (
-              <EventCard
-                key={event.uuid}
-                event={event}
-                attended={false}
-                borderless
-                showYear={false}
-              />
-            ))}
+            {events
+              .sort((a, b) => new Date(a.start).getTime() - new Date(b.start).getTime())
+              .map(event => (
+                <EventCard
+                  key={event.uuid}
+                  event={event}
+                  attended={false}
+                  borderless
+                  showYear={false}
+                />
+              ))}
           </div>
         ) : (
           <div className={styles.noEvents}>