open.source/manifold
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Tweak interface

Browse Source
This commit is contained in:
Austin Chen 2022-06-10 09:12:44 -07:00
parent 4cd35c8742
commit 3898ec95ed
1 changed files with 34 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

53
web/pages/swap.tsx
View File

@ -150,13 +150,14 @@ export default function Swap() {
const [minTick, setMinTick] = useState(0) const [minTick, setMinTick] = useState(0)
const [maxTick, setMaxTick] = useState(0) const [maxTick, setMaxTick] = useState(0)
const [deltaL, setDeltaL] = useState(100)
const [buyAmount, setBuyAmount] = useState(0) const [buyAmount, setBuyAmount] = useState(0)
const { requiredN, requiredY } = calculateLPCost( const { requiredN, requiredY } = calculateLPCost(
pool.tick, pool.tick,
minTick, minTick,
maxTick, maxTick,
100 // deltaL deltaL
) )
const { newPoolTick, yesPurchased } = buyYes(pool, buyAmount) const { newPoolTick, yesPurchased } = buyYes(pool, buyAmount)
@ -182,25 +183,34 @@ export default function Swap() {
/> />
<Col> <Col>
Alice: Add liquidity <h2 className="my-2 text-xl">Add liquidity</h2>
{/* <input className="input" placeholder="Amount" type="number" /> */} {/* <input className="input" placeholder="Amount" type="number" /> */}
<input <Row className="gap-2">
className="input" <input
placeholder="Min%" className="input"
type="number" placeholder="Min%"
onChange={(e) => setMinTick(inputPercentToTick(e))} type="number"
/> onChange={(e) => setMinTick(inputPercentToTick(e))}
Min Tick: {minTick} />
<input {/* Min Tick: {minTick} */}
className="input" <input
placeholder="Max%" className="input"
type="number" placeholder="Max%"
onChange={(e) => setMaxTick(inputPercentToTick(e))} type="number"
/> onChange={(e) => setMaxTick(inputPercentToTick(e))}
Max Tick: {maxTick} />
{/* Max Tick: {maxTick} */}
<input
className="input"
placeholder="delta Liquidity"
type="number"
value={deltaL}
onChange={(e) => setDeltaL(parseFloat(e.target.value))}
/>
</Row>
<Row className="gap-2 py-2"> <Row className="gap-2 py-2">
<div>Y required: {requiredY}</div> <div>Y required: {requiredY.toFixed(2)}</div>
<div>N required: {requiredN}</div>{' '} <div>N required: {requiredN.toFixed(2)}</div>{' '}
</Row> </Row>
<button <button
className="btn" className="btn"
@ -215,7 +225,12 @@ export default function Swap() {
</Col> </Col>
<Col> <Col>
Bob: Buy Tokens <h2 className="my-2 text-xl">Limit Order</h2>
TODO
</Col>
<Col>
<h2 className="my-2 text-xl">Buy Shares</h2>
{/* <input className="input" placeholder="User" type="text" /> */} {/* <input className="input" placeholder="User" type="text" /> */}
<input <input
className="input" className="input"