Show a fake balance involving transactions

This commit is contained in:
Austin Chen 2022-04-01 08:10:12 -07:00
parent 77c9d40751
commit 3b1a01f2f8
2 changed files with 28 additions and 8 deletions

View File

@ -3,6 +3,7 @@ import { formatMoney } from '../../../common/util/format'
import { Avatar } from '../avatar'
import { IS_PRIVATE_MANIFOLD } from '../../../common/envs/constants'
import { Row } from '../layout/row'
import { loadFakeBalance } from '../../pages/leaderboards'
export function getNavigationOptions(user?: User | null) {
if (IS_PRIVATE_MANIFOLD) {
@ -34,7 +35,7 @@ export function ProfileSummary(props: { user: User | undefined }) {
<div className="truncate text-left">
<div>{user?.name}</div>
<div className="text-sm">
{user ? formatMoney(Math.floor(user.balance)) : ' '}
{user ? formatMoney(Math.floor(loadFakeBalance())) : ' '}
</div>
</div>
</Row>

View File

@ -8,7 +8,7 @@ import { formatMoney } from '../../common/util/format'
import { fromPropz, usePropz } from '../hooks/use-propz'
import { Manaboard } from '../components/manaboard'
import { Title } from '../components/title'
import { useTransactions } from '../hooks/use-transactions'
import { saveFakeBalance, useTransactions } from '../hooks/use-transactions'
import { SlotData, Transaction } from '../lib/firebase/transactions'
import { Grid, _ as r } from 'gridjs-react'
@ -120,9 +120,10 @@ function Explanation() {
}
// TODOs
// [ ] Deduct amount from user's balance, either in UX or for real
// [ ] Expandable text for explainer
// [ ] Draw attention to leaderboard
// [ ] Show total returned to Manifold
// [ ] Restrict buying to your fake balance
// [ ] Restrict to at most buying one slot per user?
export default function Manaboards(props: {
topTraders: User[]
@ -141,9 +142,9 @@ export default function Manaboards(props: {
const createdTimes = new Array(topTraders.length).fill(0)
// Find the most recent purchases of each slot, and replace the entries in topTraders
const transactions = useTransactions() ?? []
const txns = useTransactions() ?? []
// Iterate from oldest to newest transactions, so recent purchases overwrite older ones
const sortedTxns = _.sortBy(transactions, 'createdTime')
const sortedTxns = _.sortBy(txns, 'createdTime')
for (const txn of sortedTxns) {
if (txn.category === 'BUY_LEADERBOARD_SLOT') {
const buyer = userFromBuy(txn)
@ -173,6 +174,9 @@ export default function Manaboards(props: {
}
const MANIFOLD_ID = 'IPTOzEqrpkWmEzh6hwvAyY9PqFb2'
if (user?.balance) {
saveFakeBalance(userProfits(user.id, txns) + user.balance)
}
return (
<Page margin rightSidebar={<Explanation />}>
@ -202,8 +206,12 @@ export default function Manaboards(props: {
<div className="text-sm">
<Title text={'Transaction history'} />
{user && <p>Your balance: {userProfits(user.id, transactions)}</p>}
<p>Manifold's earnings: {userProfits(MANIFOLD_ID, transactions)}</p>
{user && (
<p>Your earnings: {formatMoney(userProfits(user.id, txns))}</p>
)}
<p>
Manafold's earnings: {formatMoney(userProfits(MANIFOLD_ID, txns))}
</p>
<TransactionsTable txns={_.reverse(sortedTxns)} />
</div>
</Col>
@ -216,7 +224,18 @@ function userProfits(userId: string, txns: Transaction[]) {
const loss = _.sumBy(losses, (txn) => txn.amount)
const profits = txns.filter((txn) => txn.toId === userId)
const profit = _.sumBy(profits, (txn) => txn.amount)
return formatMoney(profit - loss)
return profit - loss
}
// Cache user's transaction profits to localStorage
const FAKE_BALANCE_KEY = 'fake-balance'
export function saveFakeBalance(profit: number) {
localStorage.setItem(FAKE_BALANCE_KEY, JSON.stringify(profit))
}
export function loadFakeBalance() {
const profit = localStorage.getItem(FAKE_BALANCE_KEY)
return profit ? JSON.parse(profit) : 0
}
function TransactionsTable(props: { txns: Transaction[] }) {