2021-12-14 01:07:28 +00:00
|
|
|
import router from 'next/router'
|
|
|
|
import { useState } from 'react'
|
|
|
|
|
2021-12-10 17:54:16 +00:00
|
|
|
import { ContractsList } from '../../components/contracts-list'
|
|
|
|
import { Header } from '../../components/header'
|
2021-12-11 00:06:51 +00:00
|
|
|
import { Spacer } from '../../components/layout/spacer'
|
2021-12-11 03:35:21 +00:00
|
|
|
import { Title } from '../../components/title'
|
2021-12-10 17:54:16 +00:00
|
|
|
import { useUser } from '../../hooks/use-user'
|
2021-12-14 01:07:28 +00:00
|
|
|
import { createContract } from '../../lib/service/create-contract'
|
|
|
|
|
2021-12-10 17:54:16 +00:00
|
|
|
|
|
|
|
// Allow user to create a new contract
|
|
|
|
export default function NewContract() {
|
|
|
|
const creator = useUser()
|
|
|
|
|
2021-12-14 01:07:28 +00:00
|
|
|
const [initialProb, setInitialProb] = useState(50)
|
|
|
|
const [question, setQuestion] = useState('')
|
|
|
|
const [description, setDescription] = useState('')
|
|
|
|
const [isSubmitting, setIsSubmitting] = useState(false)
|
|
|
|
|
|
|
|
async function submit() {
|
|
|
|
// TODO: add more rigorous error handling for question, description
|
|
|
|
if (!creator || !question || !description) return
|
|
|
|
|
|
|
|
setIsSubmitting(true)
|
|
|
|
|
|
|
|
const contract = await createContract(question, description, initialProb, creator)
|
|
|
|
await router.push(`contract/${contract.id}`)
|
2021-12-10 17:54:16 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
const descriptionPlaceholder = `e.g. This market will resolve to “Yes” if, by June 2, 2021, 11:59:59 PM ET, Paxlovid (also known under PF-07321332)...`
|
|
|
|
|
|
|
|
return (
|
|
|
|
<div>
|
|
|
|
<Header />
|
2021-12-14 01:07:28 +00:00
|
|
|
|
2021-12-11 00:06:51 +00:00
|
|
|
<div className="max-w-4xl py-12 lg:mx-auto px-4">
|
2021-12-11 03:35:21 +00:00
|
|
|
<Title text="Create a new prediction market" />
|
2021-12-14 01:07:28 +00:00
|
|
|
|
2021-12-11 03:35:21 +00:00
|
|
|
<div className="w-full bg-gray-200 rounded-lg shadow-xl p-6">
|
2021-12-10 17:54:16 +00:00
|
|
|
{/* Create a Tailwind form that takes in all the fields needed for a new contract */}
|
|
|
|
{/* When the form is submitted, create a new contract in the database */}
|
|
|
|
<form>
|
|
|
|
<div className="form-control">
|
|
|
|
<label className="label">
|
|
|
|
<span className="label-text">Question</span>
|
|
|
|
</label>
|
2021-12-14 01:07:28 +00:00
|
|
|
|
2021-12-10 17:54:16 +00:00
|
|
|
<input
|
|
|
|
type="text"
|
|
|
|
placeholder="e.g. Will the FDA approve Paxlovid before Jun 2nd, 2022?"
|
|
|
|
className="input"
|
2021-12-14 01:07:28 +00:00
|
|
|
value={question}
|
|
|
|
onChange={e => setQuestion(e.target.value || '')}
|
2021-12-10 17:54:16 +00:00
|
|
|
/>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div className="form-control">
|
|
|
|
<label className="label">
|
|
|
|
<span className="label-text">Description</span>
|
|
|
|
</label>
|
2021-12-14 01:07:28 +00:00
|
|
|
|
2021-12-10 17:54:16 +00:00
|
|
|
<textarea
|
|
|
|
className="textarea h-24 textarea-bordered"
|
|
|
|
placeholder={descriptionPlaceholder}
|
2021-12-14 01:07:28 +00:00
|
|
|
value={description}
|
|
|
|
onChange={e => setDescription(e.target.value || '')}
|
2021-12-10 17:54:16 +00:00
|
|
|
></textarea>
|
|
|
|
</div>
|
|
|
|
|
2021-12-14 01:07:28 +00:00
|
|
|
<div className="form-control">
|
|
|
|
<label className="label">
|
|
|
|
<span className="label-text">Initial probability: {initialProb}%</span>
|
|
|
|
</label>
|
2021-12-10 17:54:16 +00:00
|
|
|
|
2021-12-14 01:07:28 +00:00
|
|
|
<input
|
|
|
|
type="range"
|
|
|
|
className="range-primary"
|
|
|
|
min="1"
|
|
|
|
max={99}
|
|
|
|
value={initialProb}
|
|
|
|
onChange={e => setInitialProb(parseInt(e.target.value))}
|
|
|
|
/>
|
|
|
|
</div>
|
2021-12-10 17:54:16 +00:00
|
|
|
|
|
|
|
<div className="flex justify-end mt-6">
|
|
|
|
<button
|
|
|
|
type="submit"
|
|
|
|
className="btn btn-primary"
|
2021-12-14 01:07:28 +00:00
|
|
|
disabled={isSubmitting}
|
2021-12-10 17:54:16 +00:00
|
|
|
onClick={(e) => {
|
|
|
|
e.preventDefault()
|
2021-12-14 01:07:28 +00:00
|
|
|
submit()
|
2021-12-10 17:54:16 +00:00
|
|
|
}}
|
|
|
|
>
|
|
|
|
Create market
|
|
|
|
</button>
|
|
|
|
</div>
|
|
|
|
</form>
|
|
|
|
</div>
|
|
|
|
|
2021-12-11 00:06:51 +00:00
|
|
|
<Spacer h={10} />
|
|
|
|
|
2021-12-11 03:35:21 +00:00
|
|
|
<Title text="Your markets" />
|
2021-12-14 01:07:28 +00:00
|
|
|
|
|
|
|
<ContractsList />
|
2021-12-10 17:54:16 +00:00
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
)
|
|
|
|
}
|