From 262183e0e66e09bf19261524ddb94ef26ec7e07a Mon Sep 17 00:00:00 2001 From: ingawei <46611122+ingawei@users.noreply.github.com> Date: Thu, 29 Sep 2022 18:53:36 -0500 Subject: [PATCH 001/101] Inga/quick toggle fix (#964) getting rid of unused component --- .../portfolio/portfolio-value-section.tsx | 32 ------------------- 1 file changed, 32 deletions(-) diff --git a/web/components/portfolio/portfolio-value-section.tsx b/web/components/portfolio/portfolio-value-section.tsx index 688dbf10..d7fff6ef 100644 --- a/web/components/portfolio/portfolio-value-section.tsx +++ b/web/components/portfolio/portfolio-value-section.tsx @@ -4,7 +4,6 @@ import { last } from 'lodash' import { memo, useRef, useState } from 'react' import { usePortfolioHistory } from 'web/hooks/use-portfolio-history' import { Period } from 'web/lib/firebase/users' -import { PillButton } from '../buttons/pill-button' import { Col } from '../layout/col' import { Row } from '../layout/row' import { PortfolioValueGraph } from './portfolio-value-graph' @@ -147,34 +146,3 @@ export function PortfolioPeriodSelection(props: { ) } - -export function GraphToggle(props: { - setGraphMode: (mode: 'profit' | 'value') => void - graphMode: string -}) { - const { setGraphMode, graphMode } = props - return ( - - { - setGraphMode('value') - }} - xs={true} - className="z-50" - > - Value - - { - setGraphMode('profit') - }} - xs={true} - className="z-50" - > - Profit - - - ) -} From 2625ab1549808287357a506afc89ca70a9f1ba54 Mon Sep 17 00:00:00 2001 From: Ian Philips Date: Thu, 29 Sep 2022 18:13:33 -0600 Subject: [PATCH 002/101] Portfolio email ux --- .../weekly-portfolio-update.html | 2 +- functions/src/emails.ts | 8 ++--- functions/src/weekly-portfolio-emails.ts | 29 +++++++------------ 3 files changed, 16 insertions(+), 23 deletions(-) diff --git a/functions/src/email-templates/weekly-portfolio-update.html b/functions/src/email-templates/weekly-portfolio-update.html index fd99837f..921a58e5 100644 --- a/functions/src/email-templates/weekly-portfolio-update.html +++ b/functions/src/email-templates/weekly-portfolio-update.html @@ -320,7 +320,7 @@ style="line-height: 24px; margin: 10px 0; margin-top: 20px; margin-bottom: 20px;" data-testid="4XoHRGw1Y"> - And here's some of the biggest changes in your portfolio: + And here's some recent changes in your investments:

diff --git a/functions/src/emails.ts b/functions/src/emails.ts index 6888cfb1..993fac81 100644 --- a/functions/src/emails.ts +++ b/functions/src/emails.ts @@ -643,13 +643,13 @@ export const sendWeeklyPortfolioUpdateEmail = async ( templateData[`question${i + 1}Title`] = investment.questionTitle templateData[`question${i + 1}Url`] = investment.questionUrl templateData[`question${i + 1}Prob`] = investment.questionProb - templateData[`question${i + 1}Change`] = formatMoney(investment.difference) - templateData[`question${i + 1}ChangeStyle`] = investment.questionChangeStyle + templateData[`question${i + 1}Change`] = formatMoney(investment.profit) + templateData[`question${i + 1}ChangeStyle`] = investment.profitStyle }) await sendTemplateEmail( - // privateUser.email, - 'iansphilips@gmail.com', + privateUser.email, + // 'iansphilips@gmail.com', `Here's your weekly portfolio update!`, investments.length === 0 ? 'portfolio-update-no-movers' diff --git a/functions/src/weekly-portfolio-emails.ts b/functions/src/weekly-portfolio-emails.ts index 198fa7ca..0167be35 100644 --- a/functions/src/weekly-portfolio-emails.ts +++ b/functions/src/weekly-portfolio-emails.ts @@ -195,15 +195,13 @@ export async function sendPortfolioUpdateEmailsToAllUsers() { contract, betsInLastWeek ).profit - const marketChange = - currentMarketProbability - marketProbabilityAWeekAgo const profit = betsMadeInLastWeekProfit + (currentBetsMadeAWeekAgoValue - betsMadeAWeekAgoValue) return { currentValue: currentBetsMadeAWeekAgoValue, pastValue: betsMadeAWeekAgoValue, - difference: profit, + profit, contractSlug: contract.slug, marketProbAWeekAgo: marketProbabilityAWeekAgo, questionTitle: contract.question, @@ -211,17 +209,13 @@ export async function sendPortfolioUpdateEmailsToAllUsers() { questionProb: cpmmContract.resolution ? cpmmContract.resolution : Math.round(cpmmContract.prob * 100) + '%', - questionChange: - (marketChange > 0 ? '+' : '') + - Math.round(marketChange * 100) + - '%', - questionChangeStyle: `color: ${ + profitStyle: `color: ${ profit > 0 ? 'rgba(0,160,0,1)' : '#a80000' };`, } as PerContractInvestmentsData }) ), - (differences) => Math.abs(differences.difference) + (differences) => Math.abs(differences.profit) ).reverse() log( @@ -233,12 +227,10 @@ export async function sendPortfolioUpdateEmailsToAllUsers() { const [winningInvestments, losingInvestments] = partition( investmentValueDifferences.filter( - (diff) => - diff.pastValue > 0.01 && - Math.abs(diff.difference / diff.pastValue) > 0.01 // difference is greater than 1% + (diff) => diff.pastValue > 0.01 && Math.abs(diff.profit) > 1 ), (investmentsData: PerContractInvestmentsData) => { - return investmentsData.difference > 0 + return investmentsData.profit > 0 } ) // pick 3 winning investments and 3 losing investments @@ -251,7 +243,9 @@ export async function sendPortfolioUpdateEmailsToAllUsers() { worstInvestments.length === 0 && usersToContractsCreated[privateUser.id].length === 0 ) { - log('No bets in last week, no market movers, no markets created') + log( + 'No bets in last week, no market movers, no markets created. Not sending an email.' + ) await firestore.collection('private-users').doc(privateUser.id).update({ weeklyPortfolioUpdateEmailSent: true, }) @@ -268,7 +262,7 @@ export async function sendPortfolioUpdateEmailsToAllUsers() { }) log('Sent weekly portfolio update email to', privateUser.email) count++ - log('sent out emails to user count:', count) + log('sent out emails to users:', count) }) ) } @@ -277,11 +271,10 @@ export type PerContractInvestmentsData = { questionTitle: string questionUrl: string questionProb: string - questionChange: string - questionChangeStyle: string + profitStyle: string currentValue: number pastValue: number - difference: number + profit: number } export type OverallPerformanceData = { From 5b5a919ed7a483c3c5789bfeb5914f5392924a5e Mon Sep 17 00:00:00 2001 From: Marshall Polaris Date: Thu, 29 Sep 2022 20:18:33 -0700 Subject: [PATCH 003/101] Expose `onMouseOver` chart event to hook into from outside (#967) --- web/components/charts/contract/binary.tsx | 13 ++++---- web/components/charts/contract/choice.tsx | 4 ++- web/components/charts/contract/numeric.tsx | 4 ++- .../charts/contract/pseudo-numeric.tsx | 4 ++- web/components/charts/generic-charts.tsx | 32 ++++++++----------- 5 files changed, 29 insertions(+), 28 deletions(-) diff --git a/web/components/charts/contract/binary.tsx b/web/components/charts/contract/binary.tsx index 55cf4e88..a5740a3e 100644 --- a/web/components/charts/contract/binary.tsx +++ b/web/components/charts/contract/binary.tsx @@ -46,20 +46,20 @@ export const BinaryContractChart = (props: { contract: BinaryContract bets: Bet[] height?: number + onMouseOver?: (p: HistoryPoint | undefined) => void }) => { - const { contract, bets } = props + const { contract, bets, onMouseOver } = props const [startDate, endDate] = getDateRange(contract) const startP = getInitialProbability(contract) const endP = getProbability(contract) const betPoints = useMemo(() => getBetPoints(bets), [bets]) - const data = useMemo( - () => [ + const data = useMemo(() => { + return [ { x: startDate, y: startP }, ...betPoints, { x: endDate ?? new Date(Date.now() + DAY_MS), y: endP }, - ], - [startDate, startP, endDate, endP, betPoints] - ) + ] + }, [startDate, startP, endDate, endP, betPoints]) const rightmostDate = getRightmostVisibleDate( endDate, @@ -84,6 +84,7 @@ export const BinaryContractChart = (props: { yScale={yScale} data={data} color="#11b981" + onMouseOver={onMouseOver} Tooltip={BinaryChartTooltip} pct /> diff --git a/web/components/charts/contract/choice.tsx b/web/components/charts/contract/choice.tsx index d5d0d09e..05d3255e 100644 --- a/web/components/charts/contract/choice.tsx +++ b/web/components/charts/contract/choice.tsx @@ -125,8 +125,9 @@ export const ChoiceContractChart = (props: { contract: FreeResponseContract | MultipleChoiceContract bets: Bet[] height?: number + onMouseOver?: (p: MultiPoint | undefined) => void }) => { - const { contract, bets } = props + const { contract, bets, onMouseOver } = props const [start, end] = getDateRange(contract) const answers = useMemo( () => getTrackedAnswers(contract, CATEGORY_COLORS.length), @@ -194,6 +195,7 @@ export const ChoiceContractChart = (props: { yScale={yScale} data={data} colors={CATEGORY_COLORS} + onMouseOver={onMouseOver} Tooltip={ChoiceTooltip} pct /> diff --git a/web/components/charts/contract/numeric.tsx b/web/components/charts/contract/numeric.tsx index 3c14149a..dd031ab8 100644 --- a/web/components/charts/contract/numeric.tsx +++ b/web/components/charts/contract/numeric.tsx @@ -33,8 +33,9 @@ const NumericChartTooltip = (props: TooltipProps) => { export const NumericContractChart = (props: { contract: NumericContract height?: number + onMouseOver?: (p: DistributionPoint | undefined) => void }) => { - const { contract } = props + const { contract, onMouseOver } = props const { min, max } = contract const data = useMemo(() => getNumericChartData(contract), [contract]) const isMobile = useIsMobile(800) @@ -54,6 +55,7 @@ export const NumericContractChart = (props: { yScale={yScale} data={data} color={NUMERIC_GRAPH_COLOR} + onMouseOver={onMouseOver} Tooltip={NumericChartTooltip} /> )} diff --git a/web/components/charts/contract/pseudo-numeric.tsx b/web/components/charts/contract/pseudo-numeric.tsx index fb88b15a..385e56dd 100644 --- a/web/components/charts/contract/pseudo-numeric.tsx +++ b/web/components/charts/contract/pseudo-numeric.tsx @@ -58,8 +58,9 @@ export const PseudoNumericContractChart = (props: { contract: PseudoNumericContract bets: Bet[] height?: number + onMouseOver?: (p: HistoryPoint | undefined) => void }) => { - const { contract, bets } = props + const { contract, bets, onMouseOver } = props const { min, max, isLogScale } = contract const [startDate, endDate] = getDateRange(contract) const scaleP = useMemo( @@ -102,6 +103,7 @@ export const PseudoNumericContractChart = (props: { xScale={xScale} yScale={yScale} data={data} + onMouseOver={onMouseOver} Tooltip={PseudoNumericChartTooltip} color={NUMERIC_GRAPH_COLOR} /> diff --git a/web/components/charts/generic-charts.tsx b/web/components/charts/generic-charts.tsx index 344ae061..5ae30ad4 100644 --- a/web/components/charts/generic-charts.tsx +++ b/web/components/charts/generic-charts.tsx @@ -38,6 +38,7 @@ export const DistributionChart =

(props: { color: string xScale: ScaleContinuousNumeric yScale: ScaleContinuousNumeric + onMouseOver?: (p: P | undefined) => void Tooltip?: TooltipComponent

}) => { const { color, data, yScale, w, h, Tooltip } = props @@ -71,12 +72,9 @@ export const DistributionChart =

(props: { const onMouseOver = useEvent((mouseX: number) => { const queryX = xScale.invert(mouseX) const item = data[xBisector.left(data, queryX) - 1] - if (item == null) { - // this can happen if you are on the very left or right edge of the chart, - // so your queryX is out of bounds - return - } - return { ...item, x: queryX } + const result = item ? { ...item, x: queryX } : undefined + props.onMouseOver?.(result) + return result }) return ( @@ -108,6 +106,7 @@ export const MultiValueHistoryChart =

(props: { colors: readonly string[] xScale: ScaleTime yScale: ScaleContinuousNumeric + onMouseOver?: (p: P | undefined) => void Tooltip?: TooltipComponent

pct?: boolean }) => { @@ -156,12 +155,9 @@ export const MultiValueHistoryChart =

(props: { const onMouseOver = useEvent((mouseX: number) => { const queryX = xScale.invert(mouseX) const item = data[xBisector.left(data, queryX) - 1] - if (item == null) { - // this can happen if you are on the very left or right edge of the chart, - // so your queryX is out of bounds - return - } - return { ...item, x: queryX } + const result = item ? { ...item, x: queryX } : undefined + props.onMouseOver?.(result) + return result }) return ( @@ -196,10 +192,11 @@ export const SingleValueHistoryChart =

(props: { color: string xScale: ScaleTime yScale: ScaleContinuousNumeric + onMouseOver?: (p: P | undefined) => void Tooltip?: TooltipComponent

pct?: boolean }) => { - const { color, data, pct, yScale, w, h, Tooltip } = props + const { color, data, yScale, w, h, Tooltip, pct } = props const [viewXScale, setViewXScale] = useState>() const xScale = viewXScale ?? props.xScale @@ -235,12 +232,9 @@ export const SingleValueHistoryChart =

(props: { const onMouseOver = useEvent((mouseX: number) => { const queryX = xScale.invert(mouseX) const item = data[xBisector.left(data, queryX) - 1] - if (item == null) { - // this can happen if you are on the very left or right edge of the chart, - // so your queryX is out of bounds - return - } - return { ...item, x: queryX } + const result = item ? { ...item, x: queryX } : undefined + props.onMouseOver?.(result) + return result }) return ( From 715bae57e09a72286be89f94b6a35ebd3643dea2 Mon Sep 17 00:00:00 2001 From: Marshall Polaris Date: Thu, 29 Sep 2022 21:35:20 -0700 Subject: [PATCH 004/101] Fix date memoization in charts (#972) * Memoize on numbers, not dates * Use numbers instead of dates to calculate visible range --- web/components/charts/contract/binary.tsx | 16 ++++++++-------- web/components/charts/contract/choice.tsx | 8 ++++---- .../charts/contract/pseudo-numeric.tsx | 16 ++++++++-------- web/components/charts/helpers.tsx | 10 +++++----- 4 files changed, 25 insertions(+), 25 deletions(-) diff --git a/web/components/charts/contract/binary.tsx b/web/components/charts/contract/binary.tsx index a5740a3e..a6ba9bee 100644 --- a/web/components/charts/contract/binary.tsx +++ b/web/components/charts/contract/binary.tsx @@ -49,24 +49,24 @@ export const BinaryContractChart = (props: { onMouseOver?: (p: HistoryPoint | undefined) => void }) => { const { contract, bets, onMouseOver } = props - const [startDate, endDate] = getDateRange(contract) + const [start, end] = getDateRange(contract) const startP = getInitialProbability(contract) const endP = getProbability(contract) const betPoints = useMemo(() => getBetPoints(bets), [bets]) const data = useMemo(() => { return [ - { x: startDate, y: startP }, + { x: new Date(start), y: startP }, ...betPoints, - { x: endDate ?? new Date(Date.now() + DAY_MS), y: endP }, + { x: new Date(end ?? Date.now() + DAY_MS), y: endP }, ] - }, [startDate, startP, endDate, endP, betPoints]) + }, [start, startP, end, endP, betPoints]) const rightmostDate = getRightmostVisibleDate( - endDate, - last(betPoints)?.x, - new Date(Date.now()) + end, + last(betPoints)?.x?.getTime(), + Date.now() ) - const visibleRange = [startDate, rightmostDate] + const visibleRange = [start, rightmostDate] const isMobile = useIsMobile(800) const containerRef = useRef(null) const width = useElementWidth(containerRef) ?? 0 diff --git a/web/components/charts/contract/choice.tsx b/web/components/charts/contract/choice.tsx index 05d3255e..127e7d9c 100644 --- a/web/components/charts/contract/choice.tsx +++ b/web/components/charts/contract/choice.tsx @@ -136,10 +136,10 @@ export const ChoiceContractChart = (props: { const betPoints = useMemo(() => getBetPoints(answers, bets), [answers, bets]) const data = useMemo( () => [ - { x: start, y: answers.map((_) => 0) }, + { x: new Date(start), y: answers.map((_) => 0) }, ...betPoints, { - x: end ?? new Date(Date.now() + DAY_MS), + x: new Date(end ?? Date.now() + DAY_MS), y: answers.map((a) => getOutcomeProbability(contract, a.id)), }, ], @@ -147,8 +147,8 @@ export const ChoiceContractChart = (props: { ) const rightmostDate = getRightmostVisibleDate( end, - last(betPoints)?.x, - new Date(Date.now()) + last(betPoints)?.x?.getTime(), + Date.now() ) const visibleRange = [start, rightmostDate] const isMobile = useIsMobile(800) diff --git a/web/components/charts/contract/pseudo-numeric.tsx b/web/components/charts/contract/pseudo-numeric.tsx index 385e56dd..1232a96c 100644 --- a/web/components/charts/contract/pseudo-numeric.tsx +++ b/web/components/charts/contract/pseudo-numeric.tsx @@ -62,7 +62,7 @@ export const PseudoNumericContractChart = (props: { }) => { const { contract, bets, onMouseOver } = props const { min, max, isLogScale } = contract - const [startDate, endDate] = getDateRange(contract) + const [start, end] = getDateRange(contract) const scaleP = useMemo( () => getScaleP(min, max, isLogScale), [min, max, isLogScale] @@ -72,18 +72,18 @@ export const PseudoNumericContractChart = (props: { const betPoints = useMemo(() => getBetPoints(bets, scaleP), [bets, scaleP]) const data = useMemo( () => [ - { x: startDate, y: startP }, + { x: new Date(start), y: startP }, ...betPoints, - { x: endDate ?? new Date(Date.now() + DAY_MS), y: endP }, + { x: new Date(end ?? Date.now() + DAY_MS), y: endP }, ], - [betPoints, startDate, startP, endDate, endP] + [betPoints, start, startP, end, endP] ) const rightmostDate = getRightmostVisibleDate( - endDate, - last(betPoints)?.x, - new Date(Date.now()) + end, + last(betPoints)?.x?.getTime(), + Date.now() ) - const visibleRange = [startDate, rightmostDate] + const visibleRange = [start, rightmostDate] const isMobile = useIsMobile(800) const containerRef = useRef(null) const width = useElementWidth(containerRef) ?? 0 diff --git a/web/components/charts/helpers.tsx b/web/components/charts/helpers.tsx index 35c8a335..ea436213 100644 --- a/web/components/charts/helpers.tsx +++ b/web/components/charts/helpers.tsx @@ -259,19 +259,19 @@ export const getDateRange = (contract: Contract) => { const { createdTime, closeTime, resolutionTime } = contract const isClosed = !!closeTime && Date.now() > closeTime const endDate = resolutionTime ?? (isClosed ? closeTime : null) - return [new Date(createdTime), endDate ? new Date(endDate) : null] as const + return [createdTime, endDate ?? null] as const } export const getRightmostVisibleDate = ( - contractEnd: Date | null | undefined, - lastActivity: Date | null | undefined, - now: Date + contractEnd: number | null | undefined, + lastActivity: number | null | undefined, + now: number ) => { if (contractEnd != null) { return contractEnd } else if (lastActivity != null) { // client-DB clock divergence may cause last activity to be later than now - return new Date(Math.max(lastActivity.getTime(), now.getTime())) + return Math.max(lastActivity, now) } else { return now } From 13b3613460d56f9c1b086f202e485ca338c16137 Mon Sep 17 00:00:00 2001 From: James Grugett Date: Thu, 29 Sep 2022 23:57:45 -0500 Subject: [PATCH 005/101] Show number of limit orders --- web/components/limit-bets.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/web/components/limit-bets.tsx b/web/components/limit-bets.tsx index 606bc7e0..bd9ed246 100644 --- a/web/components/limit-bets.tsx +++ b/web/components/limit-bets.tsx @@ -182,7 +182,7 @@ export function OrderBookButton(props: { size="xs" color="blue" > - Order book + {limitBets.length} Limit orders From b83e5db56370b6992ce0d556a39354a501eda633 Mon Sep 17 00:00:00 2001 From: ingawei <46611122+ingawei@users.noreply.github.com> Date: Fri, 30 Sep 2022 00:41:22 -0500 Subject: [PATCH 006/101] getting rid of daisy buttons (#969) * getting rid of daisy buttons so bet button does not turn black on mobile --- web/components/answers/answer-bet-panel.tsx | 6 +-- .../answers/answer-resolve-panel.tsx | 32 +++++++------ web/components/bet-panel.tsx | 14 ++---- web/components/bets-list.tsx | 3 +- web/components/button.tsx | 28 +++++++----- web/components/confirmation-button.tsx | 34 +++++++++----- web/components/groups/create-group-button.tsx | 7 +-- web/components/numeric-resolution-panel.tsx | 4 +- web/components/resolution-panel.tsx | 32 +++++-------- .../warning-confirmation-button.tsx | 45 ++++++++----------- web/components/yes-no-selector.tsx | 4 +- web/pages/profile.tsx | 5 ++- 12 files changed, 107 insertions(+), 107 deletions(-) diff --git a/web/components/answers/answer-bet-panel.tsx b/web/components/answers/answer-bet-panel.tsx index 85f61034..9867abab 100644 --- a/web/components/answers/answer-bet-panel.tsx +++ b/web/components/answers/answer-bet-panel.tsx @@ -184,16 +184,14 @@ export function AnswerBetPanel(props: { {user ? ( ) : ( diff --git a/web/components/answers/answer-resolve-panel.tsx b/web/components/answers/answer-resolve-panel.tsx index ddb7942c..57871cb8 100644 --- a/web/components/answers/answer-resolve-panel.tsx +++ b/web/components/answers/answer-resolve-panel.tsx @@ -85,17 +85,6 @@ export function AnswerResolvePanel(props: { setIsSubmitting(false) } - const resolutionButtonClass = - resolveOption === 'CANCEL' - ? 'bg-yellow-400 hover:bg-yellow-500' - : resolveOption === 'CHOOSE' && answers.length - ? 'btn-primary' - : resolveOption === 'CHOOSE_MULTIPLE' && - answers.length > 1 && - answers.every((answer) => chosenAnswers[answer] > 0) - ? 'bg-blue-400 hover:bg-blue-500' - : 'btn-disabled' - return ( @@ -129,11 +118,28 @@ export function AnswerResolvePanel(props: { Clear )} + 1 && + answers.every((answer) => chosenAnswers[answer] > 0) + ? 'blue' + : 'indigo' + } + disabled={ + !resolveOption || + (resolveOption === 'CHOOSE' && !answers.length) || + (resolveOption === 'CHOOSE_MULTIPLE' && + (!(answers.length > 1) || + !answers.every((answer) => chosenAnswers[answer] > 0))) + } onResolve={onResolve} isSubmitting={isSubmitting} - openModalButtonClass={resolutionButtonClass} - submitButtonClass={resolutionButtonClass} /> diff --git a/web/components/bet-panel.tsx b/web/components/bet-panel.tsx index 5d908937..e93c0e62 100644 --- a/web/components/bet-panel.tsx +++ b/web/components/bet-panel.tsx @@ -395,22 +395,16 @@ export function BuyPanel(props: { )} ) } @@ -84,18 +91,25 @@ export function ResolveConfirmationButton(props: { isSubmitting: boolean openModalButtonClass?: string submitButtonClass?: string + color?: ColorType + disabled?: boolean }) { - const { onResolve, isSubmitting, openModalButtonClass, submitButtonClass } = - props + const { + onResolve, + isSubmitting, + openModalButtonClass, + submitButtonClass, + color, + disabled, + } = props return ( ) diff --git a/web/components/resolution-panel.tsx b/web/components/resolution-panel.tsx index 7ef6e4f3..b3237eb4 100644 --- a/web/components/resolution-panel.tsx +++ b/web/components/resolution-panel.tsx @@ -57,17 +57,6 @@ export function ResolutionPanel(props: { setIsSubmitting(false) } - const submitButtonClass = - outcome === 'YES' - ? 'btn-primary' - : outcome === 'NO' - ? 'bg-red-400 hover:bg-red-500' - : outcome === 'CANCEL' - ? 'bg-yellow-400 hover:bg-yellow-500' - : outcome === 'MKT' - ? 'bg-blue-400 hover:bg-blue-500' - : 'btn-disabled' - return ( {isAdmin && !isCreator && ( @@ -76,18 +65,14 @@ export function ResolutionPanel(props: { )}

Resolve market
-
Outcome
- - -
{outcome === 'YES' ? ( <> @@ -123,16 +108,23 @@ export function ResolutionPanel(props: { <>Resolving this market will immediately pay out {BETTORS}. )}
- - {!!error &&
{error}
} - ) diff --git a/web/components/warning-confirmation-button.tsx b/web/components/warning-confirmation-button.tsx index 7c546c3b..abdf443e 100644 --- a/web/components/warning-confirmation-button.tsx +++ b/web/components/warning-confirmation-button.tsx @@ -5,17 +5,18 @@ import { Row } from './layout/row' import { ConfirmationButton } from './confirmation-button' import { ExclamationIcon } from '@heroicons/react/solid' import { formatMoney } from 'common/util/format' +import { Button, ColorType, SizeType } from './button' export function WarningConfirmationButton(props: { amount: number | undefined - outcome?: 'YES' | 'NO' | undefined marketType: 'freeResponse' | 'binary' warning?: string onSubmit: () => void - disabled?: boolean + disabled: boolean isSubmitting: boolean openModalButtonClass?: string - submitButtonClassName?: string + color: ColorType + size: SizeType }) { const { amount, @@ -24,53 +25,43 @@ export function WarningConfirmationButton(props: { disabled, isSubmitting, openModalButtonClass, - submitButtonClassName, - outcome, - marketType, + size, + color, } = props + if (!warning) { return ( - + ) } return ( diff --git a/web/components/yes-no-selector.tsx b/web/components/yes-no-selector.tsx index f73cdef2..10a58a42 100644 --- a/web/components/yes-no-selector.tsx +++ b/web/components/yes-no-selector.tsx @@ -213,7 +213,7 @@ export function NumberCancelSelector(props: { return ( + Date: Fri, 30 Sep 2022 08:48:33 -0600 Subject: [PATCH 015/101] Remove green circle from resolution prob input --- web/components/probability-selector.tsx | 14 ++------- web/components/resolution-panel.tsx | 41 ++++++++++++++----------- 2 files changed, 26 insertions(+), 29 deletions(-) diff --git a/web/components/probability-selector.tsx b/web/components/probability-selector.tsx index 2fc03787..b13dcfd9 100644 --- a/web/components/probability-selector.tsx +++ b/web/components/probability-selector.tsx @@ -8,12 +8,12 @@ export function ProbabilitySelector(props: { const { probabilityInt, setProbabilityInt, isSubmitting } = props return ( - - ) } From adb8bc476f25a4c555d59cb433fdb493ed968b85 Mon Sep 17 00:00:00 2001 From: Ian Philips Date: Mon, 3 Oct 2022 09:36:49 -0600 Subject: [PATCH 097/101] Show whether market is unlisted --- .../contract/contract-info-dialog.tsx | 49 ++++++++++--------- web/components/widgets/short-toggle.tsx | 21 +++++--- 2 files changed, 39 insertions(+), 31 deletions(-) diff --git a/web/components/contract/contract-info-dialog.tsx b/web/components/contract/contract-info-dialog.tsx index 1cae98f9..306b2587 100644 --- a/web/components/contract/contract-info-dialog.tsx +++ b/web/components/contract/contract-info-dialog.tsx @@ -40,8 +40,9 @@ export function ContractInfoDialog(props: { const isAdmin = useAdmin() const isCreator = user?.id === contract.creatorId const isUnlisted = contract.visibility === 'unlisted' - const wasUnlistedByCreator = - contract.unlistedById && contract.unlistedById === contract.creatorId + const wasUnlistedByCreator = contract.unlistedById + ? contract.unlistedById === contract.creatorId + : true const formatTime = (dt: number) => dayjs(dt).format('MMM DD, YYYY hh:mm a') @@ -173,32 +174,34 @@ export function ContractInfoDialog(props: { [ADMIN] Featured )} - {user && - (isAdmin || - (isCreator && - (isUnlisted ? wasUnlistedByCreator : true))) && ( - - {isAdmin ? '[ADMIN]' : ''} Unlisted - - - updateContract(id, { - visibility: b ? 'unlisted' : 'public', - unlistedById: b ? user.id : '', - }) - } - /> - - - )} + {user && ( + + {isAdmin ? '[ADMIN]' : ''} Unlisted + + + updateContract(id, { + visibility: b ? 'unlisted' : 'public', + unlistedById: b ? user.id : '', + }) + } + /> + + + )} diff --git a/web/components/widgets/short-toggle.tsx b/web/components/widgets/short-toggle.tsx index 339de361..d8baeebe 100644 --- a/web/components/widgets/short-toggle.tsx +++ b/web/components/widgets/short-toggle.tsx @@ -3,22 +3,27 @@ import { Switch } from '@headlessui/react' import clsx from 'clsx' export default function ShortToggle(props: { - enabled: boolean - setEnabled: (enabled: boolean) => void + on: boolean + setOn: (enabled: boolean) => void + disabled?: boolean onChange?: (enabled: boolean) => void }) { - const { enabled, setEnabled } = props + const { on, setOn, disabled } = props return ( { - setEnabled(e) + setOn(e) if (props.onChange) { props.onChange(e) } }} - className="group relative inline-flex h-5 w-10 flex-shrink-0 cursor-pointer items-center justify-center rounded-full focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2" + className={clsx( + 'group relative inline-flex h-5 w-10 flex-shrink-0 items-center justify-center rounded-full focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2', + !disabled ? 'cursor-pointer' : 'cursor-not-allowed opacity-50' + )} > Use setting