import {DateTime} from 'luxon' import Head from 'next/head' import Router from 'next/router' import Link from 'next/link' import Table from '~/components/table' import useUser from '~/hooks/useUser' import redirect from '~/utils/redirectGetInitialProps' AccountPage.getInitialProps = async function({ctx, user}) { const {axios} = ctx; if(!user) return redirect(ctx, 302, '/login') if(!user.email_confirmed) return redirect(ctx, 302, '/account/email/confirm') const {data} = await axios.get(`/api/orders`) return {orders: data.sort(sortOrders)} } export default function AccountPage({orders}) { const user = useUser() return ( <> Account | Society of Socks

Account

{/* TODO: Red is kind of intimidating. Should we change this to a yellow or blue info style? */} {!user.email_confirmed && (

Confirm your email address
Confirming your email address allows it to be used for password recovery.

)}

Email and Password

Email: {user.email} {/* Change */}

{/* TODO: Store date password was set so we can show "Set on [date]"? */}

Password: { !user.password_hash ? 'Unset' : <>Last changed {DateTime.fromISO(user.time_password_changed).toFormat('LLLL dd yyyy, h:mm a')}. Change }

Your Orders

} ]} rows={orders} />

) } function getPurchaseTime(order){ const mostRecentTransaction = order.transactions.sort(sortTransactions)[0] const time = parsePaymentTime(mostRecentTransaction) return time.setZone('local').toFormat('LLLL dd, h:mm a') } function getNumberItems(order){ return order.transactions.map(transaction => transaction.cart.items.map(item => item.count) ).reduce((a,b)=>(a+b)) } function getItemPrice(order){ return formatMoney(order.transactions.map(transaction => transaction.item_total_price) .reduce((a,b)=>(a+b))) } function getShippingEstimate(order){ return formatMoney(order.transactions.map(transaction => transaction.shipping_price) .reduce((a,b)=>(a+b))) } function getAmountPaid(order){ return formatMoney(order.transactions.map(({payments}) => payments.map(payment => payment.value_cents)) .flat() .reduce((a,b)=>(a+b))) } function parsePaymentTime({payments}){ for(const payment of payments) { if(typeof payment.time === 'string') payment.time = DateTime.fromISO(payment.time) } payments.sort((a,b) => b.time.diff(a.time)) return payments[0].time } function sortTransactions(a,b){ const timeA = parsePaymentTime(a) const timeB = parsePaymentTime(b) return timeB.diff(timeA).as('seconds') } function sortOrders(a,b){ const timePaidA = parsePaymentTime(a.transactions.sort(sortTransactions)[0]) const timePaidB = parsePaymentTime(b.transactions.sort(sortTransactions)[0]) return timePaidB.diff(timePaidA).as('seconds') } const formatMoney = money => { if (money === undefined || money === null) return null; return '$' + (money / 100).toFixed(2) }