Preorder: Updates user and admin UIs to reflect pre-order status

components/orderSummary/orderSummary.js

@@ -84,6 +84,19 @@ function formatTime(time){
 }
 
 function ShippingStatus({order, totalShipping, delivery, isAdmin}) {
+  const preorderDates = order.transactions.filter(t => t.has_preorder).map(t => DateTime.fromISO(t.preorder_fulfill_date))
+  preorderDates.sort((b, a) => a < b ? -1 : a > b ? 1 : 0)
+  const latestPreorder = preorderDates[0]?.toLocaleString(DateTime.DATE_FULL)
+
+  if(!delivery && latestPreorder)
+    return (
+      <>
+        {isAdmin && (<p>{formatMoney(totalShipping)} charged to customer</p>)}
+        <p>Preorder - awaiting stock.</p>
+        <p>Expected to be in stock {latestPreorder}</p>
+      </>
+    )
+
   if(!delivery)
     return (
       <>

pages/account/index.js

@@ -61,6 +61,7 @@ export default function AccountPage({orders}) {
           {name: 'Item Price', extractor: getItemPrice},
           {name: 'Shipping', extractor: getShippingEstimate},
           {name: 'Total', extractor: getAmountPaid},
+          {name: 'Status', extractor: getStatus},
           {name: '', extractor: order =>
             <button className="buttonLink" onClick={() => Router.push(`/account/orders/${order.number}`)}>Details</button>
           }
@@ -104,6 +105,21 @@ function getAmountPaid(order){
     .reduce((a,b)=>(a+b)))
 }
 
+function getStatus(order) {
+  if (order.delivery && order.delivery.type == "hand_delivered")
+    return 'Delivered in person'
+
+  if (order.delivery)
+    return `Shipped ${DateTime.fromISO(order.delivery.date_shipped).toLocaleString(DateTime.DATE_SHORT)}`
+
+  const hasPreorder = order.transactions.some(t => t.has_preorder && !t.preorder_ready_to_ship)
+
+  if (!hasPreorder)
+    return 'Awaiting Shipment'
+
+  return 'Preorder'
+}
+
 function parsePaymentTime({payments}){
   for(const payment of payments) {
     if(typeof payment.time === 'string')

pages/admin/orders/index.js

@@ -10,7 +10,8 @@ Orders.getInitialProps = async ({ctx}) => {
 }
 
 export default function Orders({orders}){
-  const unshippedOrders = orders.filter(order => !order.delivery)
+  const unshippedPreOrders = orders.filter(order => !order.delivery && order.transactions.some(t => t.has_preorder && !t.preorder_ready_to_ship))
+  const unshippedAndShippableOrders = orders.filter(order => !order.delivery && !order.transactions.some(t => t.has_preorder && !t.preorder_ready_to_ship))
   const shippedOrders = orders.filter(order => order.delivery).reverse()
 
   return (
@@ -18,7 +19,7 @@ export default function Orders({orders}){
       <ActionBar title="Orders" actions={[
         {label: 'Add Manual Order', url: `/admin/orders/new`}
       ]}/>
-      <h4>Unsent:</h4>
+      <h4>Unsent (sendable):</h4>
       <Table
         columns={[
           {name: 'Purchased', extractor: getPurchaseTime},
@@ -30,7 +31,23 @@ export default function Orders({orders}){
             <button className="buttonLink" onClick={() => Router.push(`/admin/orders/${row.id}`)}>Details</button>
           }
         ]}
-        rows={unshippedOrders.map(order => ({id: order.uuid, ...order}))}
+        rows={unshippedAndShippableOrders.map(order => ({id: order.uuid, ...order}))}
+      />
+
+      <h4>Unsent (pre-orders):</h4>
+      <Table
+        columns={[
+          {name: 'Purchased', extractor: getPurchaseTime},
+          {name: 'Items', extractor: getNumberItems},
+          {name: 'Price', extractor: getItemPrice},
+          {name: 'Shipping', extractor: getShippingEstimate},
+          {name: 'Amount Paid', extractor: getAmountPaid},
+          {name: 'Estimated availability', extractor: getPreorderEstimate},
+          {name: '', extractor: row =>
+            <button className="buttonLink" onClick={() => Router.push(`/admin/orders/${row.id}`)}>Details</button>
+          }
+        ]}
+        rows={unshippedPreOrders.map(order => ({id: order.uuid, ...order}))}
       />
 
       <h4>Sent:</h4>
@@ -88,6 +105,12 @@ function getAmountPaid(order){
     .reduce((a,b)=>(a+b), 0))
 }
 
+function getPreorderEstimate(order) {
+  const preorderDates = order.transactions.filter(t => t.has_preorder).map(t => DateTime.fromISO(t.preorder_fulfill_date))
+  preorderDates.sort((b, a) => a < b ? -1 : a > b ? 1 : 0)
+  return preorderDates[0]?.toLocaleString(DateTime.DATE_FULL)
+}
+
 function parsePaymentTime({payments}){
   for(const payment of payments) {
     if(typeof payment.time === 'string')

pages/store/checkout/complete.js

@@ -16,9 +16,9 @@ export default function CheckoutComplete({order}){
   const items = order.transactions.map(transaction => transaction.cart.items).flat()
   const latestTransaction = order.transactions.sort(sortTransactions)[0]
 
-  const preorderItems = items.filter(({item}) => item.number_in_stock < 0 && item.preorder_availability_date).map(({item}) => DateTime.fromISO(item.preorder_availability_date)) || []
+  const preorderDates = order.transactions.filter(t => t.has_preorder).map(t => DateTime.fromISO(t.preorder_fulfill_date))
-  preorderItems.sort((b, a) => a < b ? -1 : a > b ? 1 : 0)
+  preorderDates.sort((b, a) => a < b ? -1 : a > b ? 1 : 0)
-  const latestPreorder = preorderItems[0]?.toLocaleString(DateTime.DATE_FULL)
+  const latestPreorder = preorderDates[0]?.toLocaleString(DateTime.DATE_FULL)
 
   let shippingEstimate = 'Orders typically are shipped within 3-5 business days of purchase.'