import { useQuery } from '@apollo/client' import PageLoading from '../../components/page-loading' import { ME_REWARDS } from '../../fragments/rewards' import { CenterLayout } from '../../components/layout' import dynamic from 'next/dynamic' import { useRouter } from 'next/router' import { getGetServerSideProps } from '../../api/ssrApollo' import { fixedDecimal } from '../../lib/format' import Trophy from '../../svgs/trophy-fill.svg' const GrowthPieChart = dynamic(() => import('../../components/charts').then(mod => mod.GrowthPieChart), { loading: () =>
Loading...
}) export const getServerSideProps = getGetServerSideProps(ME_REWARDS, null, (data, params) => data.rewards.total === 0 || new Date(data.rewards.time) > new Date()) const timeString = when => new Date(when).toISOString().slice(0, 10) export default function Rewards ({ ssrData }) { const router = useRouter() const { data } = useQuery(ME_REWARDS, { variables: { ...router.query } }) if (!data && !ssrData) return const { rewards: { total, sources, time }, meRewards } = data || ssrData const when = router.query.when return (

{when &&
On {timeString(time)} at 12a CT
} {total} sats were rewarded

{meRewards && <>

you earned {meRewards.total} sats ({fixedDecimal(meRewards.total * 100 / total, 2)}%)

{meRewards.rewards?.map((r, i) => )}
}
) } function Reward ({ rank, type, sats }) { if (!rank) return null const color = rank <= 3 ? 'text-primary' : 'text-muted' let category = type switch (type) { case 'TIP_POST': category = 'in post zapping' break case 'TIP_COMMENT': category = 'in comment zapping' break case 'POST': category = 'among posts' break case 'COMMENT': category = 'among comments' break } return (
#{rank} {category} for {sats} sats
) }