added receipt sidebar in pantry checkout, fixed dietary restrictions …

components/orderForm/DeliveryDetails.js

@@ -39,6 +39,22 @@ export default function DeliveryDetails(props) {
           <span>I will be picking up in person at the Food Pantry.</span>
         </label>
 
+        {/* Delivery Time */}
+        <div className="form-group mb-4">
+          <div className="mb-2">
+            <label 
+              className="block uppercase tracking-wide text-gray-600 text-xs font-bold" 
+              htmlFor="deliveryTimes" data-required="T"
+            >
+              What times will you be available to accept a delivery next week?
+            </label>
+          <p className="text-gray-500 text-xs italic">Please select all that work, we will send an email for a final confirmation.</p>
+          </div>
+          <Select options={deliveryTimeOptions} isMulti isClearable isSearchable value={delivery.deliveryTimes}
+            onChange={(selections) => cartDispatch({ type: 'UPDATE_DELIVERY', payload: {deliveryTimes: selections} })}
+            className={(props.showMissing && (delivery.deliveryTimes.length == 0)) ? "border rounded" + errorAppearance : "border border-transparent"}/>
+        </div>
+
         {delivery.pickup &&
           <>
             <div className='mb-2'>
@@ -166,22 +182,6 @@ export default function DeliveryDetails(props) {
             }}
             />
         </div>
-
-        {/* Delivery Time */}
-        <div className="form-group mb-4">
-          <div className="mb-2">
-            <label 
-              className="block uppercase tracking-wide text-gray-600 text-xs font-bold" 
-              htmlFor="deliveryTimes" data-required="T"
-            >
-              What times will you be available to accept a delivery next week?
-            </label>
-          <p className="text-gray-500 text-xs italic">Please select all that work, we will send an email for a final confirmation.</p>
-          </div>
-          <Select options={deliveryTimeOptions} isMulti isClearable isSearchable value={delivery.deliveryTimes}
-            onChange={(selections) => cartDispatch({ type: 'UPDATE_DELIVERY', payload: {deliveryTimes: selections} })}
-            className={(props.showMissing && (delivery.deliveryTimes.length == 0)) ? "border rounded" + errorAppearance : "border border-transparent"}/>
-        </div>
 
         {/* Delivery Notes */}
         <div className="form-group mb-4">

components/orderForm/OrderDetails.js

@@ -120,6 +120,7 @@ export default function OrderDetails({children}) {
   return (
     <>
       <h2 className="h-10 text-lg mb-2 block tracking-wide text-gray-600 font-bold">Order Details</h2>
+      {/* why is the below div here?? what is it doing it just says "pantry checkout info" at the top for no reason*/}
       <div className="flex flex-row mb-3 space-x-5"> 
         {inventoryInfo.map(infoStr => <ReactMarkdown className="mb-4 text-zinc-900 flex-grow border p-2 border-black rounded" components={smallMarkdownStyle} children={infoStr}></ReactMarkdown>)}
       </div>

components/orderForm/ReviewOrder.js

@@ -100,6 +100,13 @@ export default function ReviewOrder({updatePersonalInfo, updateDeliveryDetails,
             <div className='mb-2'>
               You have elected to pick up in person at the Food Pantry.
             </div>
+            {/* THIS IS THE DELIVERY TIMES COMPONENT IN THE PICKUP DETAILS REVIEW THINGY*/}
+            <div className='mb-2'>
+                <div className='font-semibold'>Delivery Time(s):</div>
+                <div className='list-disc'>
+                  {delivery.deliveryTimes?.map((element) => <li className='pl-2' key={element.value}>{element.label}</li>)}
+                </div>
+              </div>
             {delivery.pickup && <div>
               <span className='font-semibold tracking-wide text-gray-600'>Pickup Notes: </span>
               {delivery.pickupNotes}