bets list: show message if no active bets

This commit is contained in:
mantikoros 2022-02-22 16:55:06 -06:00
parent 39cc2026f1
commit c24007012c

View File

@ -35,6 +35,7 @@ import { ConfirmationButton } from './confirmation-button'
import { OutcomeLabel, YesLabel, NoLabel } from './outcome-label' import { OutcomeLabel, YesLabel, NoLabel } from './outcome-label'
import { filterDefined } from '../../common/util/array' import { filterDefined } from '../../common/util/array'
import { LoadingIndicator } from './loading-indicator' import { LoadingIndicator } from './loading-indicator'
import { SiteLink } from './site-link'
type BetSort = 'newest' | 'profit' | 'resolved' | 'value' type BetSort = 'newest' | 'profit' | 'resolved' | 'value'
@ -67,17 +68,7 @@ export function BetsList(props: { user: User }) {
return <LoadingIndicator /> return <LoadingIndicator />
} }
if (bets.length === 0) if (bets.length === 0) return <NoBets />
return (
<div>
You have not made any bets yet.{' '}
<Link href="/">
<a className="text-green-500 hover:underline hover:decoration-2">
Find a prediction market!
</a>
</Link>
</div>
)
// Decending creation time. // Decending creation time.
bets.sort((bet1, bet2) => bet2.createdTime - bet1.createdTime) bets.sort((bet1, bet2) => bet2.createdTime - bet1.createdTime)
@ -174,17 +165,32 @@ export function BetsList(props: { user: User }) {
</select> </select>
</Col> </Col>
{displayedContracts.map((contract) => ( {displayedContracts.length === 0 ? (
<NoBets />
) : (
displayedContracts.map((contract) => (
<MyContractBets <MyContractBets
key={contract.id} key={contract.id}
contract={contract} contract={contract}
bets={contractBets[contract.id] ?? []} bets={contractBets[contract.id] ?? []}
/> />
))} ))
)}
</Col> </Col>
) )
} }
const NoBets = () => {
return (
<div className="mx-4 text-gray-500">
You have not made any bets yet.{' '}
<SiteLink href="/" className="underline">
Find a prediction market!
</SiteLink>
</div>
)
}
function MyContractBets(props: { contract: Contract; bets: Bet[] }) { function MyContractBets(props: { contract: Contract; bets: Bet[] }) {
const { bets, contract } = props const { bets, contract } = props
const { resolution, outcomeType } = contract const { resolution, outcomeType } = contract