2022-06-22 16:35:50 +00:00
|
|
|
import router, { useRouter } from 'next/router'
|
2021-12-16 03:58:28 +00:00
|
|
|
import { useEffect, useState } from 'react'
|
2022-01-05 05:51:26 +00:00
|
|
|
import clsx from 'clsx'
|
|
|
|
import dayjs from 'dayjs'
|
2022-01-06 08:45:30 +00:00
|
|
|
import Textarea from 'react-expanding-textarea'
|
2022-05-09 13:04:36 +00:00
|
|
|
import { Spacer } from 'web/components/layout/spacer'
|
|
|
|
import { useUser } from 'web/hooks/use-user'
|
|
|
|
import { Contract, contractPath } from 'web/lib/firebase/contracts'
|
2022-07-10 22:03:15 +00:00
|
|
|
import { createMarket } from 'web/lib/firebase/api'
|
2022-07-03 23:45:52 +00:00
|
|
|
import { FIXED_ANTE } from 'common/antes'
|
2022-05-09 13:04:36 +00:00
|
|
|
import { InfoTooltip } from 'web/components/info-tooltip'
|
|
|
|
import { Page } from 'web/components/page'
|
|
|
|
import { Row } from 'web/components/layout/row'
|
2022-05-26 21:37:51 +00:00
|
|
|
import {
|
|
|
|
MAX_DESCRIPTION_LENGTH,
|
|
|
|
MAX_QUESTION_LENGTH,
|
|
|
|
outcomeType,
|
|
|
|
} from 'common/contract'
|
2022-05-09 13:04:36 +00:00
|
|
|
import { formatMoney } from 'common/util/format'
|
2022-05-23 12:35:50 +00:00
|
|
|
import { removeUndefinedProps } from 'common/util/object'
|
|
|
|
import { ChoicesToggleGroup } from 'web/components/choices-toggle-group'
|
2022-07-13 21:11:22 +00:00
|
|
|
import { setContractGroupSlugs, getGroup } from 'web/lib/firebase/groups'
|
2022-06-22 16:35:50 +00:00
|
|
|
import { Group } from 'common/group'
|
2022-06-15 21:34:34 +00:00
|
|
|
import { useTracking } from 'web/hooks/use-tracking'
|
2022-06-15 20:12:16 +00:00
|
|
|
import { useWarnUnsavedChanges } from 'web/hooks/use-warn-unsaved-changes'
|
2022-06-22 16:35:50 +00:00
|
|
|
import { track } from 'web/lib/service/analytics'
|
|
|
|
import { GroupSelector } from 'web/components/groups/group-selector'
|
2022-06-27 19:40:40 +00:00
|
|
|
import { User } from 'common/user'
|
Rich content (#620)
* Add TipTap editor and renderer components
* Change market description editor to rich text
* Type description as JSON, fix string-based logic
- Delete make-predictions.tsx
- Delete feed logic that showed descriptions
* wip Fix API validation
* fix type error
* fix extension import (backend)
In firebase, typescript compiles imports into common js imports
like `const StarterKit = require("@tiptap/starter-kit")`
Even though StarterKit is exported from the cjs file, it gets imported
as undefined. But it magically works if we import *
If you're reading this in the future, consider replacing StarterKit with
the entire list of extensions.
* Stop load on fail create market, improve warning
* Refactor editor as hook / fix infinite submit bug
Move state of editor back up to parent
We have to do this later anyways to allow parent to edit
* Add images - display, paste + uploading
* add uploading state of image
* Fix placeholder, misc styling
min height, quote
* Fix appending to description
* code review fixes: rename, refactor, chop carets
* Add hint & upload button on new lines
- bump to Tailwind 3.1 for arbitrary variants
* clean up, run prettier
* rename FileButton to FileUploadButton
* add image extension as functions dependency
2022-07-13 18:58:22 +00:00
|
|
|
import { TextEditor, useTextEditor } from 'web/components/editor'
|
2022-07-13 23:50:08 +00:00
|
|
|
import { Checkbox } from 'web/components/checkbox'
|
2022-01-21 18:33:58 +00:00
|
|
|
|
2022-07-05 23:26:58 +00:00
|
|
|
type NewQuestionParams = {
|
|
|
|
groupId?: string
|
|
|
|
q: string
|
|
|
|
type: string
|
|
|
|
description: string
|
|
|
|
closeTime: string
|
|
|
|
outcomeType: string
|
|
|
|
// Params for PSEUDO_NUMERIC outcomeType
|
|
|
|
min?: string
|
|
|
|
max?: string
|
|
|
|
isLogScale?: string
|
|
|
|
initValue?: string
|
|
|
|
}
|
|
|
|
|
2022-01-21 18:33:58 +00:00
|
|
|
export default function Create() {
|
2022-06-15 21:34:34 +00:00
|
|
|
useTracking('view create page')
|
2022-07-05 23:26:58 +00:00
|
|
|
const router = useRouter()
|
|
|
|
const params = router.query as NewQuestionParams
|
|
|
|
// TODO: Not sure why Question is pulled out as its own component;
|
|
|
|
// Maybe merge into newContract and then we don't need useEffect here.
|
|
|
|
const [question, setQuestion] = useState('')
|
|
|
|
useEffect(() => {
|
|
|
|
setQuestion(params.q ?? '')
|
|
|
|
}, [params.q])
|
2022-06-27 19:40:40 +00:00
|
|
|
|
2022-07-05 23:26:58 +00:00
|
|
|
const creator = useUser()
|
2022-06-27 19:40:40 +00:00
|
|
|
useEffect(() => {
|
|
|
|
if (creator === null) router.push('/')
|
|
|
|
}, [creator, router])
|
|
|
|
|
|
|
|
if (!router.isReady || !creator) return <div />
|
2022-06-15 21:34:34 +00:00
|
|
|
|
2022-01-21 18:33:58 +00:00
|
|
|
return (
|
|
|
|
<Page>
|
2022-02-11 18:40:22 +00:00
|
|
|
<div className="mx-auto w-full max-w-2xl">
|
2022-06-05 02:28:27 +00:00
|
|
|
<div className="rounded-lg px-6 py-4 sm:py-0">
|
2022-01-21 18:33:58 +00:00
|
|
|
<form>
|
|
|
|
<div className="form-control w-full">
|
|
|
|
<label className="label">
|
2022-05-23 12:35:50 +00:00
|
|
|
<span className="mb-1">
|
|
|
|
Question<span className={'text-red-700'}>*</span>
|
|
|
|
</span>
|
2022-01-21 18:33:58 +00:00
|
|
|
</label>
|
|
|
|
|
|
|
|
<Textarea
|
|
|
|
placeholder="e.g. Will the Democrats win the 2024 US presidential election?"
|
|
|
|
className="input input-bordered resize-none"
|
2022-04-19 16:04:07 +00:00
|
|
|
autoFocus
|
2022-05-26 21:37:51 +00:00
|
|
|
maxLength={MAX_QUESTION_LENGTH}
|
2022-01-21 18:33:58 +00:00
|
|
|
value={question}
|
|
|
|
onChange={(e) => setQuestion(e.target.value || '')}
|
|
|
|
/>
|
|
|
|
</div>
|
|
|
|
</form>
|
2022-06-05 02:28:27 +00:00
|
|
|
<Spacer h={6} />
|
2022-07-05 23:26:58 +00:00
|
|
|
<NewContract question={question} params={params} creator={creator} />
|
2022-01-21 18:33:58 +00:00
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</Page>
|
|
|
|
)
|
|
|
|
}
|
2021-12-14 01:07:28 +00:00
|
|
|
|
2021-12-10 17:54:16 +00:00
|
|
|
// Allow user to create a new contract
|
2022-06-27 19:40:40 +00:00
|
|
|
export function NewContract(props: {
|
|
|
|
creator: User
|
|
|
|
question: string
|
2022-07-05 23:26:58 +00:00
|
|
|
params?: NewQuestionParams
|
2022-06-27 19:40:40 +00:00
|
|
|
}) {
|
2022-07-05 23:26:58 +00:00
|
|
|
const { creator, question, params } = props
|
|
|
|
const { groupId, initValue } = params ?? {}
|
|
|
|
const [outcomeType, setOutcomeType] = useState<outcomeType>(
|
|
|
|
(params?.outcomeType as outcomeType) ?? 'BINARY'
|
|
|
|
)
|
2022-06-09 20:26:46 +00:00
|
|
|
const [initialProb] = useState(50)
|
2022-07-05 23:26:58 +00:00
|
|
|
const [minString, setMinString] = useState(params?.min ?? '')
|
|
|
|
const [maxString, setMaxString] = useState(params?.max ?? '')
|
|
|
|
const [isLogScale, setIsLogScale] = useState<boolean>(!!params?.isLogScale)
|
|
|
|
const [initialValueString, setInitialValueString] = useState(initValue)
|
2022-07-02 19:37:59 +00:00
|
|
|
|
2022-06-22 16:35:50 +00:00
|
|
|
useEffect(() => {
|
|
|
|
if (groupId && creator)
|
|
|
|
getGroup(groupId).then((group) => {
|
|
|
|
if (group && group.memberIds.includes(creator.id)) {
|
|
|
|
setSelectedGroup(group)
|
|
|
|
setShowGroupSelector(false)
|
|
|
|
}
|
|
|
|
})
|
|
|
|
}, [creator, groupId])
|
2022-06-13 04:42:41 +00:00
|
|
|
const [ante, _setAnte] = useState(FIXED_ANTE)
|
2022-04-28 23:01:50 +00:00
|
|
|
|
2022-07-05 23:26:58 +00:00
|
|
|
// If params.closeTime is set, extract out the specified date and time
|
2022-01-21 18:33:58 +00:00
|
|
|
// By default, close the market a week from today
|
2022-05-25 17:54:28 +00:00
|
|
|
const weekFromToday = dayjs().add(7, 'day').format('YYYY-MM-DD')
|
2022-07-05 23:26:58 +00:00
|
|
|
const timeInMs = Number(params?.closeTime ?? 0)
|
|
|
|
const initDate = timeInMs
|
|
|
|
? dayjs(timeInMs).format('YYYY-MM-DD')
|
|
|
|
: weekFromToday
|
|
|
|
const initTime = timeInMs ? dayjs(timeInMs).format('HH:mm') : '23:59'
|
|
|
|
const [closeDate, setCloseDate] = useState<undefined | string>(initDate)
|
|
|
|
const [closeHoursMinutes, setCloseHoursMinutes] = useState<string>(initTime)
|
|
|
|
|
2022-05-25 17:54:28 +00:00
|
|
|
const [marketInfoText, setMarketInfoText] = useState('')
|
2021-12-14 01:07:28 +00:00
|
|
|
const [isSubmitting, setIsSubmitting] = useState(false)
|
2022-06-22 16:35:50 +00:00
|
|
|
const [selectedGroup, setSelectedGroup] = useState<Group | undefined>(
|
|
|
|
undefined
|
|
|
|
)
|
|
|
|
const [showGroupSelector, setShowGroupSelector] = useState(true)
|
2022-01-03 05:21:25 +00:00
|
|
|
|
2022-05-25 17:54:28 +00:00
|
|
|
const closeTime = closeDate
|
|
|
|
? dayjs(`${closeDate}T${closeHoursMinutes}`).valueOf()
|
|
|
|
: undefined
|
2022-01-05 05:51:26 +00:00
|
|
|
|
2022-01-15 23:30:48 +00:00
|
|
|
const balance = creator?.balance || 0
|
2022-01-03 05:21:25 +00:00
|
|
|
|
2022-05-19 17:42:03 +00:00
|
|
|
const min = minString ? parseFloat(minString) : undefined
|
|
|
|
const max = maxString ? parseFloat(maxString) : undefined
|
2022-07-02 19:37:59 +00:00
|
|
|
const initialValue = initialValueString
|
|
|
|
? parseFloat(initialValueString)
|
|
|
|
: undefined
|
|
|
|
|
2022-05-25 17:54:28 +00:00
|
|
|
// get days from today until the end of this year:
|
|
|
|
const daysLeftInTheYear = dayjs().endOf('year').diff(dayjs(), 'day')
|
2022-05-19 17:42:03 +00:00
|
|
|
|
2022-01-03 05:21:25 +00:00
|
|
|
const isValid =
|
2022-05-25 17:54:28 +00:00
|
|
|
(outcomeType === 'BINARY' ? initialProb >= 5 && initialProb <= 95 : true) &&
|
2022-01-03 05:21:25 +00:00
|
|
|
question.length > 0 &&
|
2022-01-14 23:39:17 +00:00
|
|
|
ante !== undefined &&
|
2022-02-06 01:02:13 +00:00
|
|
|
ante !== null &&
|
2022-06-23 18:00:14 +00:00
|
|
|
ante <= balance &&
|
2022-01-24 22:33:02 +00:00
|
|
|
// closeTime must be in the future
|
2022-01-12 05:40:41 +00:00
|
|
|
closeTime &&
|
2022-05-19 17:42:03 +00:00
|
|
|
closeTime > Date.now() &&
|
2022-07-02 19:37:59 +00:00
|
|
|
(outcomeType !== 'PSEUDO_NUMERIC' ||
|
2022-05-19 17:42:03 +00:00
|
|
|
(min !== undefined &&
|
|
|
|
max !== undefined &&
|
2022-07-02 19:37:59 +00:00
|
|
|
initialValue !== undefined &&
|
2022-05-19 17:42:03 +00:00
|
|
|
isFinite(min) &&
|
|
|
|
isFinite(max) &&
|
|
|
|
min < max &&
|
2022-07-02 19:37:59 +00:00
|
|
|
max - min > 0.01 &&
|
|
|
|
min < initialValue &&
|
|
|
|
initialValue < max))
|
2021-12-14 01:07:28 +00:00
|
|
|
|
Rich content (#620)
* Add TipTap editor and renderer components
* Change market description editor to rich text
* Type description as JSON, fix string-based logic
- Delete make-predictions.tsx
- Delete feed logic that showed descriptions
* wip Fix API validation
* fix type error
* fix extension import (backend)
In firebase, typescript compiles imports into common js imports
like `const StarterKit = require("@tiptap/starter-kit")`
Even though StarterKit is exported from the cjs file, it gets imported
as undefined. But it magically works if we import *
If you're reading this in the future, consider replacing StarterKit with
the entire list of extensions.
* Stop load on fail create market, improve warning
* Refactor editor as hook / fix infinite submit bug
Move state of editor back up to parent
We have to do this later anyways to allow parent to edit
* Add images - display, paste + uploading
* add uploading state of image
* Fix placeholder, misc styling
min height, quote
* Fix appending to description
* code review fixes: rename, refactor, chop carets
* Add hint & upload button on new lines
- bump to Tailwind 3.1 for arbitrary variants
* clean up, run prettier
* rename FileButton to FileUploadButton
* add image extension as functions dependency
2022-07-13 18:58:22 +00:00
|
|
|
const descriptionPlaceholder =
|
|
|
|
outcomeType === 'BINARY'
|
|
|
|
? `e.g. This question resolves to "YES" if they receive the majority of votes...`
|
|
|
|
: `e.g. I will choose the answer according to...`
|
|
|
|
|
|
|
|
const { editor, upload } = useTextEditor({
|
|
|
|
max: MAX_DESCRIPTION_LENGTH,
|
|
|
|
placeholder: descriptionPlaceholder,
|
|
|
|
disabled: isSubmitting,
|
|
|
|
})
|
|
|
|
|
|
|
|
const isEditorFilled = editor != null && !editor.isEmpty
|
|
|
|
useWarnUnsavedChanges(!isSubmitting && (Boolean(question) || isEditorFilled))
|
|
|
|
|
2022-05-23 12:35:50 +00:00
|
|
|
function setCloseDateInDays(days: number) {
|
2022-05-25 17:54:28 +00:00
|
|
|
const newCloseDate = dayjs().add(days, 'day').format('YYYY-MM-DD')
|
2022-05-23 12:35:50 +00:00
|
|
|
setCloseDate(newCloseDate)
|
|
|
|
}
|
|
|
|
|
2021-12-14 01:07:28 +00:00
|
|
|
async function submit() {
|
2022-01-03 05:21:25 +00:00
|
|
|
// TODO: Tell users why their contract is invalid
|
|
|
|
if (!creator || !isValid) return
|
2021-12-14 01:07:28 +00:00
|
|
|
setIsSubmitting(true)
|
2022-05-19 22:04:34 +00:00
|
|
|
try {
|
2022-06-06 19:46:06 +00:00
|
|
|
const result = await createMarket(
|
2022-05-19 22:04:34 +00:00
|
|
|
removeUndefinedProps({
|
|
|
|
question,
|
|
|
|
outcomeType,
|
Rich content (#620)
* Add TipTap editor and renderer components
* Change market description editor to rich text
* Type description as JSON, fix string-based logic
- Delete make-predictions.tsx
- Delete feed logic that showed descriptions
* wip Fix API validation
* fix type error
* fix extension import (backend)
In firebase, typescript compiles imports into common js imports
like `const StarterKit = require("@tiptap/starter-kit")`
Even though StarterKit is exported from the cjs file, it gets imported
as undefined. But it magically works if we import *
If you're reading this in the future, consider replacing StarterKit with
the entire list of extensions.
* Stop load on fail create market, improve warning
* Refactor editor as hook / fix infinite submit bug
Move state of editor back up to parent
We have to do this later anyways to allow parent to edit
* Add images - display, paste + uploading
* add uploading state of image
* Fix placeholder, misc styling
min height, quote
* Fix appending to description
* code review fixes: rename, refactor, chop carets
* Add hint & upload button on new lines
- bump to Tailwind 3.1 for arbitrary variants
* clean up, run prettier
* rename FileButton to FileUploadButton
* add image extension as functions dependency
2022-07-13 18:58:22 +00:00
|
|
|
description: editor?.getJSON(),
|
2022-05-19 22:04:34 +00:00
|
|
|
initialProb,
|
|
|
|
ante,
|
|
|
|
closeTime,
|
|
|
|
min,
|
|
|
|
max,
|
2022-07-02 19:37:59 +00:00
|
|
|
initialValue,
|
|
|
|
isLogScale: (min ?? 0) < 0 ? false : isLogScale,
|
2022-06-22 16:35:50 +00:00
|
|
|
groupId: selectedGroup?.id,
|
2022-05-19 22:04:34 +00:00
|
|
|
})
|
|
|
|
)
|
2022-06-15 03:00:36 +00:00
|
|
|
track('create market', {
|
|
|
|
slug: result.slug,
|
|
|
|
initialProb,
|
2022-06-22 16:35:50 +00:00
|
|
|
selectedGroup: selectedGroup?.id,
|
2022-06-23 18:00:14 +00:00
|
|
|
isFree: false,
|
2022-06-15 03:00:36 +00:00
|
|
|
})
|
2022-06-22 16:35:50 +00:00
|
|
|
if (result && selectedGroup) {
|
2022-07-13 21:11:22 +00:00
|
|
|
await setContractGroupSlugs(selectedGroup, result.id)
|
2022-06-22 16:35:50 +00:00
|
|
|
}
|
2022-06-15 03:00:36 +00:00
|
|
|
|
2022-05-20 21:58:14 +00:00
|
|
|
await router.push(contractPath(result as Contract))
|
2022-05-19 22:04:34 +00:00
|
|
|
} catch (e) {
|
Rich content (#620)
* Add TipTap editor and renderer components
* Change market description editor to rich text
* Type description as JSON, fix string-based logic
- Delete make-predictions.tsx
- Delete feed logic that showed descriptions
* wip Fix API validation
* fix type error
* fix extension import (backend)
In firebase, typescript compiles imports into common js imports
like `const StarterKit = require("@tiptap/starter-kit")`
Even though StarterKit is exported from the cjs file, it gets imported
as undefined. But it magically works if we import *
If you're reading this in the future, consider replacing StarterKit with
the entire list of extensions.
* Stop load on fail create market, improve warning
* Refactor editor as hook / fix infinite submit bug
Move state of editor back up to parent
We have to do this later anyways to allow parent to edit
* Add images - display, paste + uploading
* add uploading state of image
* Fix placeholder, misc styling
min height, quote
* Fix appending to description
* code review fixes: rename, refactor, chop carets
* Add hint & upload button on new lines
- bump to Tailwind 3.1 for arbitrary variants
* clean up, run prettier
* rename FileButton to FileUploadButton
* add image extension as functions dependency
2022-07-13 18:58:22 +00:00
|
|
|
console.error('error creating contract', e, (e as any).details)
|
|
|
|
setIsSubmitting(false)
|
2022-01-05 05:51:26 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2021-12-16 03:58:28 +00:00
|
|
|
if (!creator) return <></>
|
|
|
|
|
2021-12-10 17:54:16 +00:00
|
|
|
return (
|
2022-01-23 00:38:34 +00:00
|
|
|
<div>
|
2022-06-05 02:28:27 +00:00
|
|
|
<label className="label">
|
|
|
|
<span className="mb-1">Answer type</span>
|
2022-02-17 23:00:19 +00:00
|
|
|
</label>
|
2022-05-25 17:54:28 +00:00
|
|
|
<ChoicesToggleGroup
|
|
|
|
currentChoice={outcomeType}
|
|
|
|
setChoice={(choice) => {
|
2022-06-02 19:27:01 +00:00
|
|
|
if (choice === 'FREE_RESPONSE')
|
2022-05-25 17:54:28 +00:00
|
|
|
setMarketInfoText(
|
|
|
|
'Users can submit their own answers to this market.'
|
|
|
|
)
|
|
|
|
else setMarketInfoText('')
|
2022-06-02 19:27:01 +00:00
|
|
|
setOutcomeType(choice as 'BINARY' | 'FREE_RESPONSE')
|
2022-05-25 17:54:28 +00:00
|
|
|
}}
|
|
|
|
choicesMap={{
|
|
|
|
'Yes / No': 'BINARY',
|
|
|
|
'Free response': 'FREE_RESPONSE',
|
2022-07-02 19:37:59 +00:00
|
|
|
Numeric: 'PSEUDO_NUMERIC',
|
2022-05-25 17:54:28 +00:00
|
|
|
}}
|
|
|
|
isSubmitting={isSubmitting}
|
|
|
|
className={'col-span-4'}
|
|
|
|
/>
|
|
|
|
{marketInfoText && (
|
2022-06-05 02:28:27 +00:00
|
|
|
<div className="mt-3 ml-1 text-sm text-indigo-700">
|
2022-05-25 17:54:28 +00:00
|
|
|
{marketInfoText}
|
|
|
|
</div>
|
|
|
|
)}
|
2022-06-05 02:28:27 +00:00
|
|
|
|
|
|
|
<Spacer h={6} />
|
2022-01-30 21:51:30 +00:00
|
|
|
|
2022-07-02 19:37:59 +00:00
|
|
|
{outcomeType === 'PSEUDO_NUMERIC' && (
|
|
|
|
<>
|
|
|
|
<div className="form-control mb-2 items-start">
|
|
|
|
<label className="label gap-2">
|
|
|
|
<span className="mb-1">Range</span>
|
|
|
|
<InfoTooltip text="The minimum and maximum numbers across the numeric range." />
|
|
|
|
</label>
|
|
|
|
|
|
|
|
<Row className="gap-2">
|
|
|
|
<input
|
|
|
|
type="number"
|
|
|
|
className="input input-bordered"
|
|
|
|
placeholder="MIN"
|
|
|
|
onClick={(e) => e.stopPropagation()}
|
|
|
|
onChange={(e) => setMinString(e.target.value)}
|
|
|
|
min={Number.MIN_SAFE_INTEGER}
|
|
|
|
max={Number.MAX_SAFE_INTEGER}
|
|
|
|
disabled={isSubmitting}
|
|
|
|
value={minString ?? ''}
|
|
|
|
/>
|
|
|
|
<input
|
|
|
|
type="number"
|
|
|
|
className="input input-bordered"
|
|
|
|
placeholder="MAX"
|
|
|
|
onClick={(e) => e.stopPropagation()}
|
|
|
|
onChange={(e) => setMaxString(e.target.value)}
|
|
|
|
min={Number.MIN_SAFE_INTEGER}
|
|
|
|
max={Number.MAX_SAFE_INTEGER}
|
|
|
|
disabled={isSubmitting}
|
|
|
|
value={maxString}
|
|
|
|
/>
|
|
|
|
</Row>
|
|
|
|
|
|
|
|
{!(min !== undefined && min < 0) && (
|
2022-07-13 23:50:08 +00:00
|
|
|
<Checkbox
|
|
|
|
className="my-2 text-sm"
|
|
|
|
label="Log scale"
|
|
|
|
checked={isLogScale}
|
|
|
|
toggle={() => setIsLogScale(!isLogScale)}
|
|
|
|
disabled={isSubmitting}
|
|
|
|
/>
|
2022-07-02 19:37:59 +00:00
|
|
|
)}
|
|
|
|
|
|
|
|
{min !== undefined && max !== undefined && min >= max && (
|
|
|
|
<div className="mt-2 mb-2 text-sm text-red-500">
|
|
|
|
The maximum value must be greater than the minimum.
|
|
|
|
</div>
|
|
|
|
)}
|
|
|
|
</div>
|
|
|
|
<div className="form-control mb-2 items-start">
|
|
|
|
<label className="label gap-2">
|
|
|
|
<span className="mb-1">Initial value</span>
|
|
|
|
<InfoTooltip text="The starting value for this market. Should be in between min and max values." />
|
|
|
|
</label>
|
|
|
|
|
|
|
|
<Row className="gap-2">
|
|
|
|
<input
|
|
|
|
type="number"
|
|
|
|
className="input input-bordered"
|
|
|
|
placeholder="Initial value"
|
|
|
|
onClick={(e) => e.stopPropagation()}
|
|
|
|
onChange={(e) => setInitialValueString(e.target.value)}
|
|
|
|
max={Number.MAX_SAFE_INTEGER}
|
|
|
|
disabled={isSubmitting}
|
|
|
|
value={initialValueString ?? ''}
|
|
|
|
/>
|
|
|
|
</Row>
|
|
|
|
|
|
|
|
{initialValue !== undefined &&
|
|
|
|
min !== undefined &&
|
|
|
|
max !== undefined &&
|
|
|
|
min < max &&
|
|
|
|
(initialValue <= min || initialValue >= max) && (
|
|
|
|
<div className="mt-2 mb-2 text-sm text-red-500">
|
|
|
|
Initial value must be in between {min} and {max}.{' '}
|
|
|
|
</div>
|
|
|
|
)}
|
|
|
|
</div>
|
|
|
|
</>
|
2022-05-19 17:42:03 +00:00
|
|
|
)}
|
|
|
|
|
2022-06-22 16:35:50 +00:00
|
|
|
<div className={'mt-2'}>
|
|
|
|
<GroupSelector
|
|
|
|
selectedGroup={selectedGroup}
|
|
|
|
setSelectedGroup={setSelectedGroup}
|
|
|
|
creator={creator}
|
|
|
|
showSelector={showGroupSelector}
|
|
|
|
/>
|
|
|
|
</div>
|
|
|
|
|
2022-06-05 02:28:27 +00:00
|
|
|
<Spacer h={6} />
|
2022-02-06 23:14:07 +00:00
|
|
|
|
2022-02-11 18:40:22 +00:00
|
|
|
<div className="form-control mb-1 items-start">
|
|
|
|
<label className="label mb-1 gap-2">
|
2022-06-05 02:28:27 +00:00
|
|
|
<span>Question closes in</span>
|
2022-05-25 17:54:28 +00:00
|
|
|
<InfoTooltip text="Betting will be halted after this time (local timezone)." />
|
2022-01-21 18:33:58 +00:00
|
|
|
</label>
|
2022-05-23 12:35:50 +00:00
|
|
|
<Row className={'w-full items-center gap-2'}>
|
|
|
|
<ChoicesToggleGroup
|
2022-05-25 17:54:28 +00:00
|
|
|
currentChoice={dayjs(`${closeDate}T23:59`).diff(dayjs(), 'day')}
|
|
|
|
setChoice={(choice) => {
|
|
|
|
setCloseDateInDays(choice as number)
|
|
|
|
}}
|
|
|
|
choicesMap={{
|
|
|
|
'A day': 1,
|
|
|
|
'A week': 7,
|
|
|
|
'30 days': 30,
|
|
|
|
'This year': daysLeftInTheYear,
|
|
|
|
}}
|
2022-05-23 12:35:50 +00:00
|
|
|
isSubmitting={isSubmitting}
|
2022-05-25 17:54:28 +00:00
|
|
|
className={'col-span-4 sm:col-span-2'}
|
2022-05-23 12:35:50 +00:00
|
|
|
/>
|
|
|
|
</Row>
|
2022-05-25 17:54:28 +00:00
|
|
|
<Row>
|
2022-05-23 12:35:50 +00:00
|
|
|
<input
|
|
|
|
type={'date'}
|
|
|
|
className="input input-bordered mt-4"
|
|
|
|
onClick={(e) => e.stopPropagation()}
|
2022-07-18 21:01:50 +00:00
|
|
|
onChange={(e) => setCloseDate(e.target.value)}
|
2022-05-23 12:35:50 +00:00
|
|
|
min={Date.now()}
|
|
|
|
disabled={isSubmitting}
|
2022-07-18 21:01:50 +00:00
|
|
|
value={closeDate}
|
2022-05-23 12:35:50 +00:00
|
|
|
/>
|
2022-05-25 17:54:28 +00:00
|
|
|
<input
|
|
|
|
type={'time'}
|
|
|
|
className="input input-bordered mt-4 ml-2"
|
|
|
|
onClick={(e) => e.stopPropagation()}
|
|
|
|
onChange={(e) => setCloseHoursMinutes(e.target.value)}
|
|
|
|
min={'00:00'}
|
|
|
|
disabled={isSubmitting}
|
|
|
|
value={closeHoursMinutes}
|
|
|
|
/>
|
|
|
|
</Row>
|
2022-01-21 18:33:58 +00:00
|
|
|
</div>
|
2022-01-16 01:02:01 +00:00
|
|
|
|
2022-06-05 02:28:27 +00:00
|
|
|
<Spacer h={6} />
|
2022-01-16 01:02:01 +00:00
|
|
|
|
Rich content (#620)
* Add TipTap editor and renderer components
* Change market description editor to rich text
* Type description as JSON, fix string-based logic
- Delete make-predictions.tsx
- Delete feed logic that showed descriptions
* wip Fix API validation
* fix type error
* fix extension import (backend)
In firebase, typescript compiles imports into common js imports
like `const StarterKit = require("@tiptap/starter-kit")`
Even though StarterKit is exported from the cjs file, it gets imported
as undefined. But it magically works if we import *
If you're reading this in the future, consider replacing StarterKit with
the entire list of extensions.
* Stop load on fail create market, improve warning
* Refactor editor as hook / fix infinite submit bug
Move state of editor back up to parent
We have to do this later anyways to allow parent to edit
* Add images - display, paste + uploading
* add uploading state of image
* Fix placeholder, misc styling
min height, quote
* Fix appending to description
* code review fixes: rename, refactor, chop carets
* Add hint & upload button on new lines
- bump to Tailwind 3.1 for arbitrary variants
* clean up, run prettier
* rename FileButton to FileUploadButton
* add image extension as functions dependency
2022-07-13 18:58:22 +00:00
|
|
|
<div className="form-control mb-1 items-start gap-1">
|
|
|
|
<label className="label gap-2">
|
2022-06-05 02:28:27 +00:00
|
|
|
<span className="mb-1">Description</span>
|
|
|
|
<InfoTooltip text="Optional. Describe how you will resolve this question." />
|
2022-01-21 18:33:58 +00:00
|
|
|
</label>
|
Rich content (#620)
* Add TipTap editor and renderer components
* Change market description editor to rich text
* Type description as JSON, fix string-based logic
- Delete make-predictions.tsx
- Delete feed logic that showed descriptions
* wip Fix API validation
* fix type error
* fix extension import (backend)
In firebase, typescript compiles imports into common js imports
like `const StarterKit = require("@tiptap/starter-kit")`
Even though StarterKit is exported from the cjs file, it gets imported
as undefined. But it magically works if we import *
If you're reading this in the future, consider replacing StarterKit with
the entire list of extensions.
* Stop load on fail create market, improve warning
* Refactor editor as hook / fix infinite submit bug
Move state of editor back up to parent
We have to do this later anyways to allow parent to edit
* Add images - display, paste + uploading
* add uploading state of image
* Fix placeholder, misc styling
min height, quote
* Fix appending to description
* code review fixes: rename, refactor, chop carets
* Add hint & upload button on new lines
- bump to Tailwind 3.1 for arbitrary variants
* clean up, run prettier
* rename FileButton to FileUploadButton
* add image extension as functions dependency
2022-07-13 18:58:22 +00:00
|
|
|
<TextEditor editor={editor} upload={upload} />
|
2022-01-21 18:33:58 +00:00
|
|
|
</div>
|
2022-01-16 01:02:01 +00:00
|
|
|
|
2022-06-05 02:28:27 +00:00
|
|
|
<Spacer h={6} />
|
|
|
|
|
|
|
|
<Row className="items-end justify-between">
|
|
|
|
<div className="form-control mb-1 items-start">
|
|
|
|
<label className="label mb-1 gap-2">
|
|
|
|
<span>Cost</span>
|
2022-06-23 18:00:14 +00:00
|
|
|
<InfoTooltip
|
|
|
|
text={`Cost to create your question. This amount is used to subsidize betting.`}
|
|
|
|
/>
|
2022-06-05 02:28:27 +00:00
|
|
|
</label>
|
2022-06-23 18:00:14 +00:00
|
|
|
|
|
|
|
<div className="label-text text-neutral pl-1">
|
|
|
|
{formatMoney(ante)}
|
|
|
|
</div>
|
|
|
|
|
|
|
|
{ante > balance && (
|
|
|
|
<div className="mb-2 mt-2 mr-auto self-center whitespace-nowrap text-xs font-medium tracking-wide">
|
|
|
|
<span className="mr-2 text-red-500">Insufficient balance</span>
|
|
|
|
<button
|
|
|
|
className="btn btn-xs btn-primary"
|
|
|
|
onClick={() => (window.location.href = '/add-funds')}
|
|
|
|
>
|
|
|
|
Get M$
|
|
|
|
</button>
|
2022-06-05 02:28:27 +00:00
|
|
|
</div>
|
|
|
|
)}
|
|
|
|
</div>
|
2022-01-21 18:33:58 +00:00
|
|
|
|
|
|
|
<button
|
|
|
|
type="submit"
|
|
|
|
className={clsx(
|
2022-06-05 02:28:27 +00:00
|
|
|
'btn btn-primary normal-case',
|
2022-01-21 18:33:58 +00:00
|
|
|
isSubmitting && 'loading disabled'
|
|
|
|
)}
|
Rich content (#620)
* Add TipTap editor and renderer components
* Change market description editor to rich text
* Type description as JSON, fix string-based logic
- Delete make-predictions.tsx
- Delete feed logic that showed descriptions
* wip Fix API validation
* fix type error
* fix extension import (backend)
In firebase, typescript compiles imports into common js imports
like `const StarterKit = require("@tiptap/starter-kit")`
Even though StarterKit is exported from the cjs file, it gets imported
as undefined. But it magically works if we import *
If you're reading this in the future, consider replacing StarterKit with
the entire list of extensions.
* Stop load on fail create market, improve warning
* Refactor editor as hook / fix infinite submit bug
Move state of editor back up to parent
We have to do this later anyways to allow parent to edit
* Add images - display, paste + uploading
* add uploading state of image
* Fix placeholder, misc styling
min height, quote
* Fix appending to description
* code review fixes: rename, refactor, chop carets
* Add hint & upload button on new lines
- bump to Tailwind 3.1 for arbitrary variants
* clean up, run prettier
* rename FileButton to FileUploadButton
* add image extension as functions dependency
2022-07-13 18:58:22 +00:00
|
|
|
disabled={isSubmitting || !isValid || upload.isLoading}
|
2022-01-21 18:33:58 +00:00
|
|
|
onClick={(e) => {
|
|
|
|
e.preventDefault()
|
|
|
|
submit()
|
|
|
|
}}
|
|
|
|
>
|
2022-05-25 17:54:28 +00:00
|
|
|
{isSubmitting ? 'Creating...' : 'Create question'}
|
2022-01-21 18:33:58 +00:00
|
|
|
</button>
|
2022-06-05 02:28:27 +00:00
|
|
|
</Row>
|
2022-01-23 00:38:34 +00:00
|
|
|
</div>
|
2021-12-10 17:54:16 +00:00
|
|
|
)
|
|
|
|
}
|