Hide sell buttons in other people's profiles

web/components/bets-list.tsx

@@ -56,6 +56,10 @@ type BetFilter = 'open' | 'sold' | 'closed' | 'resolved' | 'all'
 
 export function BetsList(props: { user: User; hideBetsBefore?: number }) {
   const { user, hideBetsBefore } = props
+
+  const signedInUser = useUser()
+  const isYourBets = user.id === signedInUser?.id
+
   const allBets = useUserBets(user.id, { includeRedemptions: true })
   // Hide bets before 06-01-2022 if this isn't your own profile
   // NOTE: This means public profits also begin on 06-01-2022 as well.
@@ -218,11 +222,12 @@ export function BetsList(props: { user: User; hideBetsBefore?: number }) {
           <NoBets />
         ) : (
           displayedContracts.map((contract) => (
-            <MyContractBets
+            <ContractBets
               key={contract.id}
               contract={contract}
               bets={contractBets[contract.id] ?? []}
               metric={sort === 'profit' ? 'profit' : 'value'}
+              isYourBets={isYourBets}
             />
           ))
         )}
@@ -242,12 +247,13 @@ const NoBets = () => {
   )
 }
 
-function MyContractBets(props: {
+function ContractBets(props: {
   contract: Contract
   bets: Bet[]
   metric: 'profit' | 'value'
+  isYourBets: boolean
 }) {
-  const { bets, contract, metric } = props
+  const { bets, contract, metric, isYourBets } = props
   const { resolution, outcomeType } = contract
 
   const resolutionValue = (contract as NumericContract).resolutionValue
@@ -337,26 +343,32 @@ function MyContractBets(props: {
       >
         <Spacer h={8} />
 
-        <MyBetsSummary
+        <BetsSummary
           className="mr-5 flex-1 sm:mr-8"
           contract={contract}
           bets={bets}
+          isYourBets={isYourBets}
         />
 
         <Spacer h={8} />
 
-        <ContractBetsTable contract={contract} bets={bets} />
+        <ContractBetsTable
+          contract={contract}
+          bets={bets}
+          isYourBets={isYourBets}
+        />
       </div>
     </div>
   )
 }
 
-export function MyBetsSummary(props: {
+export function BetsSummary(props: {
   contract: Contract
   bets: Bet[]
+  isYourBets: boolean
   className?: string
 }) {
-  const { contract, className } = props
+  const { contract, isYourBets, className } = props
   const { resolution, outcomeType, mechanism } = contract
   const isBinary = outcomeType === 'BINARY'
   const isCpmm = mechanism === 'cpmm-1'
@@ -432,26 +444,31 @@ export function MyBetsSummary(props: {
           <div className="whitespace-nowrap text-sm text-gray-500">Profit</div>
           <div className="whitespace-nowrap">
             {formatMoney(profit)} <ProfitBadge profitPercent={profitPercent} />
-            {isCpmm && isBinary && !resolution && invested > 0 && user && (
-              <>
-                <button
-                  className="btn btn-sm ml-2"
-                  onClick={() => setShowSellModal(true)}
-                >
-                  Sell
-                </button>
-                {showSellModal && (
-                  <SellSharesModal
-                    contract={contract}
-                    user={user}
-                    userBets={bets}
-                    shares={totalShares.YES || totalShares.NO}
-                    sharesOutcome={totalShares.YES ? 'YES' : 'NO'}
-                    setOpen={setShowSellModal}
-                  />
-                )}
-              </>
-            )}
+            {isYourBets &&
+              isCpmm &&
+              isBinary &&
+              !resolution &&
+              invested > 0 &&
+              user && (
+                <>
+                  <button
+                    className="btn btn-sm ml-2"
+                    onClick={() => setShowSellModal(true)}
+                  >
+                    Sell
+                  </button>
+                  {showSellModal && (
+                    <SellSharesModal
+                      contract={contract}
+                      user={user}
+                      userBets={bets}
+                      shares={totalShares.YES || totalShares.NO}
+                      sharesOutcome={totalShares.YES ? 'YES' : 'NO'}
+                      setOpen={setShowSellModal}
+                    />
+                  )}
+                </>
+              )}
           </div>
         </Col>
       </Row>
@@ -462,9 +479,10 @@ export function MyBetsSummary(props: {
 export function ContractBetsTable(props: {
   contract: Contract
   bets: Bet[]
+  isYourBets: boolean
   className?: string
 }) {
-  const { contract, className } = props
+  const { contract, className, isYourBets } = props
 
   const bets = props.bets.filter((b) => !b.isAnte)
 
@@ -533,6 +551,7 @@ export function ContractBetsTable(props: {
               bet={bet}
               saleBet={salesDict[bet.id]}
               contract={contract}
+              isYourBet={isYourBets}
             />
           ))}
         </tbody>
@@ -541,8 +560,13 @@ export function ContractBetsTable(props: {
   )
 }
 
-function BetRow(props: { bet: Bet; contract: Contract; saleBet?: Bet }) {
-  const { bet, saleBet, contract } = props
+function BetRow(props: {
+  bet: Bet
+  contract: Contract
+  saleBet?: Bet
+  isYourBet: boolean
+}) {
+  const { bet, saleBet, contract, isYourBet } = props
   const {
     amount,
     outcome,
@@ -583,7 +607,8 @@ function BetRow(props: { bet: Bet; contract: Contract; saleBet?: Bet }) {
   return (
     <tr>
       <td className="text-neutral">
-        {!isCPMM &&
+        {isYourBet &&
+          !isCPMM &&
           !isResolved &&
           !isClosed &&
           !isSold &&

web/components/contract/contract-tabs.tsx

@@ -4,7 +4,7 @@ import { Comment } from 'web/lib/firebase/comments'
 import { User } from 'common/user'
 import { useBets } from 'web/hooks/use-bets'
 import { ContractActivity } from '../feed/contract-activity'
-import { ContractBetsTable, MyBetsSummary } from '../bets-list'
+import { ContractBetsTable, BetsSummary } from '../bets-list'
 import { Spacer } from '../layout/spacer'
 import { Tabs } from '../layout/tabs'
 import { Col } from '../layout/col'
@@ -67,13 +67,14 @@ export function ContractTabs(props: {
 
   const yourTrades = (
     <div>
-      <MyBetsSummary
+      <BetsSummary
         className="px-2"
         contract={contract}
         bets={userBets ?? []}
+        isYourBets
       />
       <Spacer h={6} />
-      <ContractBetsTable contract={contract} bets={userBets ?? []} />
+      <ContractBetsTable contract={contract} bets={userBets ?? []} isYourBets />
       <Spacer h={12} />
     </div>
   )