Allow adding in batches of m250

web/components/contract/add-comment-bounty.tsx

@@ -3,42 +3,27 @@ import { useUser } from 'web/hooks/use-user'
 import { useState } from 'react'
 import { addCommentBounty } from 'web/lib/firebase/api'
 import { track } from 'web/lib/service/analytics'
-import { InfoTooltip } from 'web/components/info-tooltip'
-import { BETTORS, PRESENT_BET } from 'common/user'
 import { Row } from 'web/components/layout/row'
-import { AmountInput } from 'web/components/amount-input'
 import clsx from 'clsx'
 import { formatMoney } from 'common/util/format'
+import { COMMENT_BOUNTY_AMOUNT } from 'common/economy'
+import { Button } from 'web/components/button'
 
 export function AddCommentBountyPanel(props: { contract: Contract }) {
   const { contract } = props
   const { id: contractId, slug } = contract
 
   const user = useUser()
-
+  const amount = COMMENT_BOUNTY_AMOUNT
-  const [amount, setAmount] = useState<number | undefined>(undefined)
   const [error, setError] = useState<string | undefined>(undefined)
   const [isSuccess, setIsSuccess] = useState(false)
   const [isLoading, setIsLoading] = useState(false)
 
-  const onAmountChange = (amount: number | undefined) => {
-    setIsSuccess(false)
-    setAmount(amount)
-
-    // Check for errors.
-    if (amount !== undefined) {
-      if (user && user.balance < amount) {
-        setError('Insufficient balance')
-      } else if (amount < 1) {
-        setError('Minimum amount: ' + formatMoney(1))
-      } else {
-        setError(undefined)
-      }
-    }
-  }
-
   const submit = () => {
-    if (!amount) return
+    if ((user?.balance ?? 0) < amount) {
+      setError('Insufficient balance')
+      return
+    }
 
     setIsLoading(true)
     setIsSuccess(false)
@@ -57,28 +42,20 @@ export function AddCommentBountyPanel(props: { contract: Contract }) {
   return (
     <>
       <div className="mb-4 text-gray-500">
-        Contribute your M$ to make this market more accurate.{' '}
+        Add a {formatMoney(amount)} bounty for good comments that the creator
-        <InfoTooltip
+        can award.
-          text={`More liquidity stabilizes the market, encouraging ${BETTORS} to ${PRESENT_BET}. You can withdraw your subsidy at any time.`}
-        />
       </div>
 
-      <Row>
+      <Row className={'items-center gap-2'}>
-        <AmountInput
+        <Button
-          amount={amount}
+          className={clsx('ml-2', isLoading && 'btn-disabled')}
-          onChange={onAmountChange}
-          label="M$"
-          error={error}
-          disabled={isLoading}
-          inputClassName="w-28"
-        />
-        <button
-          className={clsx('btn btn-primary ml-2', isLoading && 'btn-disabled')}
           onClick={submit}
           disabled={isLoading}
+          color={'blue'}
         >
-          Add
+          Add {formatMoney(amount)} bounty
-        </button>
+        </Button>
+        <span className={'text-error'}>{error}</span>
       </Row>
 
       {isSuccess && amount && (

web/components/contract/contract-tabs.tsx

@@ -28,6 +28,7 @@ import { formatMoney } from 'common/util/format'
 import { Button } from 'web/components/button'
 import { MINUTE_MS } from 'common/util/time'
 import { useUser } from 'web/hooks/use-user'
+import { COMMENT_BOUNTY_AMOUNT } from 'common/economy'
 
 export function ContractTabs(props: {
   contract: Contract
@@ -53,7 +54,9 @@ export function ContractTabs(props: {
           : ''
       }`,
       tooltip: openCommentBounties
-        ? 'The creator of this market will award bounties to good comments'
+        ? `The creator of this market will award bounties of ${formatMoney(
+            COMMENT_BOUNTY_AMOUNT
+          )} to good comments`
         : undefined,
       content: <CommentsTabContent contract={contract} />,
     },

web/components/contract/liquidity-bounty-panel.tsx

@@ -41,6 +41,10 @@ export function LiquidityBountyPanel(props: { contract: Contract }) {
   return (
     <Tabs
       tabs={buildArray(
+        {
+          title: 'Bounty Comments',
+          content: <AddCommentBountyPanel contract={contract} />,
+        },
         (isCreator || isAdmin) &&
           isCPMM && {
             title: (isAdmin ? '[Admin] ' : '') + 'Subsidize',
@@ -56,10 +60,7 @@ export function LiquidityBountyPanel(props: { contract: Contract }) {
               />
             ),
           },
-        {
+
-          title: 'Bounty Comments',
-          content: <AddCommentBountyPanel contract={contract} />,
-        },
         isCPMM && {
           title: 'Pool',
           content: <ViewLiquidityPanel contract={contract} />,