Update manifold copy

docs/docs/sweepstakes.md

@@ -26,6 +26,10 @@ Users may participate in a sweepstakes market by using sweepcash. It is free to
 - Completing their daily streak for a free bonus.
 - As a free gift with some purchases.
 
+### How much can I withdraw my Sweepcash winnings for?
+
+When eligible to be withdrawn, sweepcash can be redeemed at a rate of 1.00 sweepcash to 1.00 USD, minus a 5% fee.
+
 ### How do I withdraw my Sweepcash winnings?
 
 Only sweepcash won from a market resolution can be withdrawn. Sweepcash received from gifts, bonuses, or exiting a market early can not be withdrawn and you must use it to win a resolved market first. Visit your withdrawals dashboard to view how much sweepcash you have won and can withdraw. Then, fill out your bank details and request the amount of sweepcash you wish to redeem for real-money. There is a $25.00 minimum withdrawal.

web/components/explainer-panel.tsx

@@ -8,6 +8,7 @@ import { FaHandHoldingUsd, FaPercentage } from 'react-icons/fa'
 import { TbTargetArrow } from 'react-icons/tb'
 import { track } from 'web/lib/service/analytics'
 import {
+  CHARITY_FEE,
   SWEEPIES_NAME,
   TRADE_TERM,
   TRADING_TERM,
@@ -18,20 +19,25 @@ import { AboutManifold } from './about-manifold'
 import { GoGraph } from 'react-icons/go'
 import Link from 'next/link'
 import { SweepiesCoin } from 'web/public/custom-components/sweepiesCoin'
-import { SWEEPIES_MONIKER } from 'common/util/format'
+import {
+  SWEEPIES_MONIKER,
+  formatMoneyUSD,
+  formatSweepies,
+} from 'common/util/format'
+import { ManaCoin } from 'web/public/custom-components/manaCoin'
+import { CoinNumber } from './widgets/coin-number'
+import { GiTakeMyMoney } from 'react-icons/gi'
 
 export const ExplainerPanel = (props: {
   className?: string
   showWhatIsManifold?: boolean
   showAccuracy?: boolean
-  showWhyBet?: boolean
   showSweepstakes?: boolean
 }) => {
   const {
     className,
     showWhatIsManifold = true,
     showAccuracy = true,
-    showWhyBet = true,
     showSweepstakes = true,
   } = props
   const handleSectionClick = (sectionTitle: string) => {
@@ -41,7 +47,6 @@ export const ExplainerPanel = (props: {
     <Col className={clsx(className)}>
       {showWhatIsManifold && <WhatIsManifold onClick={handleSectionClick} />}
       {showAccuracy && <Accuracy onClick={handleSectionClick} />}
-      {showWhyBet && <WhyBet onClick={handleSectionClick} />}
       {showSweepstakes && TWOMBA_ENABLED && (
         <Sweepstakes onClick={handleSectionClick} />
       )}
@@ -80,50 +85,15 @@ const WhatIsManifold = ({
 }: {
   onClick: (sectionTitle: string) => void
 }) => (
-  <ExpandSection
-    title={
-      <Row className="items-start">
-        <FaPercentage className="mr-2 mt-[0.25em] flex-shrink-0 align-text-bottom" />{' '}
-        What is Manifold?
-      </Row>
-    }
-    onClick={() => onClick('What is Manifold?')}
-  >
-    <AboutManifold />
-  </ExpandSection>
-)
-
-const WhyBet = ({ onClick }: { onClick: (sectionTitle: string) => void }) => (
   <ExpandSection
     title={
       <>
-        <FaHandHoldingUsd className="mr-2" /> Why should I {TRADE_TERM}?
+        <GoGraph className="mr-2  " /> What is Manifold?
       </>
     }
-    onClick={() => onClick(`Why should I ${TRADE_TERM}?`)}
+    onClick={() => onClick('What is Manifold?')}
   >
-    <div className="pb-2">
-      {capitalize(TRADING_TERM)} contributes to accurate answers of important,
-      real-world questions and helps you stay more accountable as you make
-      predictions.
-    </div>
-    {TWOMBA_ENABLED && (
-      <>
-        <div className="pb-2">
-          {capitalize(TRADE_TERM)} with{' '}
-          <span className="coin-offset relative ml-[1.2em] whitespace-nowrap">
-            <SweepiesCoin className="absolute -left-[var(--coin-offset)] top-[var(--coin-top-offset)] min-h-[1em] min-w-[1em]" />
-            <span className=" font-semibold text-amber-700 dark:text-amber-300 ">
-              {' '}
-              {SWEEPIES_NAME} ({SWEEPIES_MONIKER})
-            </span>{' '}
-          </span>
-          for a chance to win withdrawable <b>cash prizes</b>.
-        </div>
-      </>
-    )}
-
-    <div className="pb-2">Get started for free! No credit card required.</div>
+    <AboutManifold />
   </ExpandSection>
 )
 
@@ -173,28 +143,33 @@ const Sweepstakes = ({
   <ExpandSection
     title={
       <>
-        <GoGraph className="mr-2" /> What are sweepstakes markets?
+        <GiTakeMyMoney className="mr-2" /> How do I win cash prizes?
       </>
     }
     onClick={() => onClick('Are our forecasts accurate?')}
   >
     <div className="pb-2">
-      There are two types of markets on Manifold: play money and sweepstakes.
+      Manifold offers two market types: play money and sweepstakes.
     </div>
     <div className="pb-2">
-      By default all markets are play money and use mana. These markets allow
-      you to win more mana but do not award any prizes which can be cashed out.
+      All questions include a play money market which uses mana <ManaCoin /> and
+      can't be cashed out.
     </div>
     <div className="pb-2">
-      Selected markets will have a sweepstakes toggle. These require sweepcash
-      to participate and allow winners to withdraw any sweepcash won to real
-      money.
+      Selected markets will have a sweepstakes toggle. These require sweepcash{' '}
+      <SweepiesCoin />
+      &nbsp;to participate and winners can withdraw sweepcash as a cash prize.
+      You can filter for sweepstakes markets on the browse page.
     </div>
     <div className="pb-2">
-      As play money and sweepstakes markets are independent of each other, they
-      may have different odds even though they share the same question and
-      comments.
+      Redeem your {SWEEPIES_NAME} won from markets at{' '}
+      <b>
+        <CoinNumber amount={1} coinType="sweepies" isInline={true} /> {'→'}{' '}
+        $1.00
+      </b>
+      , minus a {CHARITY_FEE * 100}% fee.
     </div>
+
     <Link
       href="https://docs.manifold.markets/sweepstakes"
       className="hover:text-primary-700 text-primary-600 hover:underline"

web/components/play-money-disclaimer.tsx

@@ -1,13 +1,19 @@
 import { SparklesIcon } from '@heroicons/react/solid'
 import { PHONE_VERIFICATION_BONUS } from 'common/economy'
 import { formatMoney } from 'common/util/format'
+import { ManaCoin } from 'web/public/custom-components/manaCoin'
+import { SweepiesCoin } from 'web/public/custom-components/sweepiesCoin'
+import { CoinNumber } from './widgets/coin-number'
+import { Row } from './layout/row'
 
 export const PlayMoneyDisclaimer = (props: { text?: string }) => {
   const { text } = props
   return (
-    <div className="text-ink-500 my-1 flex items-start justify-center gap-1.5 px-2 text-sm">
-      <SparklesIcon className="mt-0.5 h-4 w-4 shrink-0" />
-      {text ? text : `Get ${formatMoney(PHONE_VERIFICATION_BONUS)} play money`}
-    </div>
+    <Row className="text-ink-500 my-1.5 justify-center text-sm">
+      Get
+      <CoinNumber amount={1000} coinType="mana" className="mx-1" />
+      and
+      <CoinNumber amount={1} coinType="sweepies" className="ml-1" />
+    </Row>
   )
 }

web/components/profile/redeem-sweeps-buttons.tsx

@@ -3,6 +3,8 @@ import { useRouter } from 'next/router'
 import { useAPIGetter } from 'web/hooks/use-api-getter'
 import { Button } from '../buttons/button'
 import { CoinNumber } from '../widgets/coin-number'
+import { KYC_VERIFICATION_BONUS_CASH } from 'common/economy'
+import { useKYCGiftAmount } from '../twomba/toggle-verify-callout'
 
 export function RedeemSweepsButtons(props: { user: User; className?: string }) {
   const { user, className } = props
@@ -12,24 +14,37 @@ export function RedeemSweepsButtons(props: { user: User; className?: string }) {
 
   const canRedeem = redeemableCash > 0 && !blockFromSweepstakes(user)
 
+  const amount = useKYCGiftAmount(user)
+
   const onClick = () => {
     router.push('/redeem')
   }
 
   return (
     <>
-      <Button
-        onClick={onClick}
-        color={canRedeem ? 'amber' : 'gray'}
-        className={className}
-      >
-        Redeem
-        <CoinNumber
-          amount={redeemableCash}
-          className={'ml-1'}
-          coinType={'sweepies'}
-        />
-      </Button>
+      {canRedeem ? (
+        <Button onClick={onClick} color={'amber'} className={className}>
+          Redeem
+          <CoinNumber
+            amount={redeemableCash}
+            className={'ml-1'}
+            coinType={'sweepies'}
+          />
+        </Button>
+      ) : (
+        <Button onClick={onClick} color={'amber'} className={className}>
+          Claim
+          {amount == undefined ? (
+            <CoinNumber
+              amount={KYC_VERIFICATION_BONUS_CASH}
+              coinType="CASH"
+              className="ml-1"
+            />
+          ) : (
+            <CoinNumber amount={amount} coinType="CASH" className="ml-1" />
+          )}
+        </Button>
+      )}
     </>
   )
 }

web/components/twomba/us-only-disclaimer.tsx

@@ -10,7 +10,7 @@ export function UsOnlyDisclaimer(props: { className?: string }) {
         'text-ink-900 flex select-none flex-row items-center gap-1 font-semibold ',
         className
       )}
-      text="Sweepstakes are limited to 18+ in all US states except WA, MI, ID, DE"
+      text="Sweepstakes are US only and 18+. All states are eligible except WA, MI, ID, DE"
     >
       <LiaFlagUsaSolid className="text-ink-600 h-6 w-6" /> US only
     </Tooltip>

web/pages/redeem.tsx

@@ -279,27 +279,33 @@ const CashoutPage = () => {
                   </p>
                 </Col>
               </Row>
-              <Link
-                href={'/gidx/register'}
-                className={clsx(
-                  baseButtonClasses,
-                  buttonClass('lg', 'gradient-pink')
-                )}
-              >
-                Verify and get
-                <span className="ml-1">
-                  {kycAmount == undefined ? (
-                    ' a sweepcash gift!'
-                  ) : (
-                    <CoinNumber
-                      amount={kycAmount}
-                      className={'font-bold'}
-                      isInline
-                      coinType={'CASH'}
-                    />
+              <Col>
+                <Link
+                  href={'/gidx/register'}
+                  className={clsx(
+                    baseButtonClasses,
+                    buttonClass('lg', 'gradient-pink')
                   )}
-                </span>
-              </Link>
+                >
+                  Verify and get
+                  <span className="ml-1">
+                    {kycAmount == undefined ? (
+                      ' a sweepcash gift!'
+                    ) : (
+                      <CoinNumber
+                        amount={kycAmount}
+                        className={'font-bold'}
+                        isInline
+                        coinType={'CASH'}
+                      />
+                    )}
+                  </span>
+                </Link>
+                <div className="text-ink-500 mt-1 text-center text-sm">
+                  {' '}
+                  Only for eligible US residents
+                </div>
+              </Col>
             </Col>
           ) : message == USER_BLOCKED_MESSAGE ? (
             <Row className="items-center gap-4">