Cart Pickup Event Picker Changes (#232)

* Added complete and cancel buttons to PickupEvent Edit Page

Also fixed text wrap issue

Also updated Button component to take in class names

* Added buttons to admin pickup home page

* Moved complete and edit buttons to single pickup event page

Updated button styling for pickup event page

Updated common Button component styling to auto expand to content

Hide the complete/cancel buttons if the event isn't active

* Removed unnecessary CSS

* Fixed bug with linkedEventUuid not found edge case

If you clicked the select a pickup event toggle but didn't select an event, the API call wouldn't work b/c the linkedEventUuid would be '', not null.

Fixed the issue by changing value to be null when linkedEventUuid is ''

* Made admin pickup events sort by start date

* Removed console.log

(For last commit)
https://stackoverflow.com/questions/54634515/typescript-sorting-object-by-date

* Refactored code to eliminate creation of new variable

You have to specify the key name
like linkedEventUuid: linkedEventUuid || null
the shorthand only works if you pass in a single variable that’s used as the key and value like u did for title

* Added checks to make weird dates not break code

added a popup instead

* Use instanceof instead of === for error check

* Added function to parse props

for complete and cancel functions

* Make full pickup events not show on cart page

* Styled create pickup event button

* Made the border on the pickup event card in cart page not glow

https://css-tricks.com/a-complete-guide-to-data-attributes/

* Addressed nits on PR

src/components/events/EventCard/index.tsx

@@ -74,6 +74,7 @@ const EventCard = ({
       <Link
         href={`${config.eventsRoute}/${uuid}`}
         data-community={community}
+        data-disabled={borderless}
         className={`${styles.container} ${borderless ? '' : styles.bordered} ${className || ''}`}
         onClick={e => {
           e.preventDefault();

src/components/events/EventCard/style.module.scss

@@ -20,7 +20,7 @@
     border-radius: 10px;
   }
 
-  &:not([disabled]):hover {
+  &:not([data-disabled]):hover {
     outline-width: 4px;
     transform: scale(0.975);
 

src/pages/admin/store/pickup/index.tsx

@@ -25,14 +25,15 @@ const AdminPickupPage = ({ futurePickupEvents, pastPickupEvents }: AdminPickupPa
         <Typography variant="h1/bold" style={{ marginRight: 'auto' }}>
           Manage Pickup Events
         </Typography>
-
-        <button
-          type="button"
-          className={`${styles.displayButton} ${display === 'future' && styles.active}`}
-          onClick={() => router.push(`${config.admin.store.pickupCreate}`)}
-        >
-          <Typography variant="h5/bold">Create New Pickup Event</Typography>
-        </button>
+        <div className={styles.displayButtons}>
+          <button
+            type="button"
+            className={`${styles.displayButton} ${styles.active}`}
+            onClick={() => router.push(`${config.admin.store.pickupCreate}`)}
+          >
+            <Typography variant="h5/bold">Create New Pickup Event</Typography>
+          </button>
+        </div>
 
         <div className={styles.displayButtons}>
           <button

src/pages/store/cart.tsx

@@ -249,7 +249,11 @@ const getServerSidePropsFunc: GetServerSideProps = async ({ req, res }) => {
 
   const savedCartPromise = CartService.getCart({ req, res });
   const pickupEventsPromise = getFutureOrderPickupEvents(AUTH_TOKEN).then(events =>
-    events.filter(event => event.status !== 'CANCELLED')
+    events
+      .filter(event => event.status !== 'CANCELLED')
+      .filter(
+        event => !(event.orders && event.orderLimit && event.orders.length > event.orderLimit)
+      )
   );
   const userPromise = getCurrentUserAndRefreshCookie(AUTH_TOKEN, { req, res });