From 279b139556eb7d6b516f4aa1d7be01726e7856c6 Mon Sep 17 00:00:00 2001
From: James Grugett <jahooma@gmail.com>
Date: Fri, 27 May 2022 15:51:55 -0500
Subject: [PATCH] Add 'sold' filter option in portfolio page

---
 web/components/bets-list.tsx | 13 ++++++++++---
 1 file changed, 10 insertions(+), 3 deletions(-)

diff --git a/web/components/bets-list.tsx b/web/components/bets-list.tsx
index e5165c3a..c979899f 100644
--- a/web/components/bets-list.tsx
+++ b/web/components/bets-list.tsx
@@ -50,7 +50,7 @@ import { trackLatency } from 'web/lib/firebase/tracking'
 import { NumericContract } from 'common/contract'
 
 type BetSort = 'newest' | 'profit' | 'closeTime' | 'value'
-type BetFilter = 'open' | 'closed' | 'resolved' | 'all'
+type BetFilter = 'open' | 'sold' | 'closed' | 'resolved' | 'all'
 
 export function BetsList(props: { user: User }) {
   const { user } = props
@@ -107,6 +107,7 @@ export function BetsList(props: { user: User }) {
       !FILTERS.resolved(c) && (c.closeTime ?? Infinity) < Date.now(),
     open: (c) => !(FILTERS.closed(c) || FILTERS.resolved(c)),
     all: () => true,
+    sold: () => true,
   }
   const SORTS: Record<BetSort, (c: Contract) => number> = {
     profit: (c) => contractsMetrics[c.id].profit,
@@ -122,9 +123,14 @@ export function BetsList(props: { user: User }) {
     .reverse()
     .filter(FILTERS[filter])
     .filter((c) => {
-      // TODO: Expose a user setting to toggle whether to show contracts you sold out of.
-      // Filter out contracts where you don't have shares anymore.
+      if (filter === 'all') return true
+
       const metrics = contractsMetrics[c.id]
+
+      // Filter for contracts you sold out of.
+      if (filter === 'sold') return metrics.payout === 0
+
+      // Filter for contracts where you currently have shares.
       return metrics.payout > 0
     })
 
@@ -180,6 +186,7 @@ export function BetsList(props: { user: User }) {
             onChange={(e) => setFilter(e.target.value as BetFilter)}
           >
             <option value="open">Open</option>
+            <option value="sold">Sold</option>
             <option value="closed">Closed</option>
             <option value="resolved">Resolved</option>
             <option value="all">All</option>