manifold/web/components/sell-modal.tsx
mantikoros 1a6afaf44f
Pseudo numeric market (#609)
* create pseudo-numeric contracts

* graph and bet panel for pseudo numeric

* pseudo numeric market layout, quick betting

* Estimated value

* sell panel

* fix graph

* pseudo numeric resolution

* bets tab

* redemption for pseudo numeric markets

* create log scale market, validation

* log scale

* create: initial value can't be min or max

* don't allow log scale for ranges with negative values (b/c of problem with graph library)

* prettier delenda est

* graph: handle min value of zero

* bet labeling

* validation

* prettier

* pseudo numeric embeds

* update disclaimer

* validation

* validation
2022-07-02 14:37:59 -05:00

58 lines
1.5 KiB
TypeScript

import { CPMMBinaryContract, PseudoNumericContract } from 'common/contract'
import { Bet } from 'common/bet'
import { User } from 'common/user'
import { Modal } from './layout/modal'
import { Col } from './layout/col'
import { Title } from './title'
import { formatWithCommas } from 'common/util/format'
import { OutcomeLabel } from './outcome-label'
import { SellPanel } from './bet-panel'
import clsx from 'clsx'
export function SellSharesModal(props: {
className?: string
contract: CPMMBinaryContract | PseudoNumericContract
userBets: Bet[]
shares: number
sharesOutcome: 'YES' | 'NO'
user: User
setOpen: (open: boolean) => void
}) {
const {
className,
contract,
shares,
sharesOutcome,
userBets,
user,
setOpen,
} = props
return (
<Modal open={true} setOpen={setOpen}>
<Col className={clsx('rounded-md bg-white px-8 py-6', className)}>
<Title className="!mt-0" text={'Sell shares'} />
<div className="mb-6">
You have {formatWithCommas(Math.floor(shares))}{' '}
<OutcomeLabel
outcome={sharesOutcome}
contract={contract}
truncate={'short'}
/>{' '}
shares
</div>
<SellPanel
contract={contract}
shares={shares}
sharesOutcome={sharesOutcome}
user={user}
userBets={userBets ?? []}
onSellSuccess={() => setOpen(false)}
/>
</Col>
</Modal>
)
}