Revert "Show every user's bets on their profile (#170)"

This reverts commit d50cc39c27.

web/components/contract/contracts-list.tsx

@@ -19,6 +19,7 @@ export function ContractsGrid(props: {
   const isBottomVisible = useIsVisible(elem)
 
   useEffect(() => {
+    console.log({ isBottomVisible, hasMore })
     if (isBottomVisible) {
       loadMore()
     }

web/components/nav/nav-bar.tsx

@@ -47,7 +47,7 @@ export function BottomNavBar() {
       )}
 
       {user !== null && (
-        <Link href={`${user}/bets`}>
+        <Link href="/portfolio">
           <a className="block w-full py-1 px-3 text-center hover:bg-indigo-200 hover:text-indigo-700">
             <PresentationChartLineIcon
               className="my-1 mx-auto h-6 w-6"

web/components/nav/sidebar.tsx

@@ -28,18 +28,12 @@ function IconFromUrl(url: string): React.ComponentType<{ className?: string }> {
   }
 }
 
-function getNavigation(userName: string) {
-  return [
+const navigation = [
   { name: 'Home', href: '/home', icon: HomeIcon },
   { name: 'Activity', href: '/activity', icon: ChatAltIcon },
-    {
-      name: 'Portfolio',
-      href: `/${userName}/bets`,
-      icon: PresentationChartLineIcon,
-    },
+  { name: 'Portfolio', href: '/portfolio', icon: PresentationChartLineIcon },
   { name: 'Charity', href: '/charity', icon: HeartIcon },
-  ]
-}
+]
 
 const signedOutNavigation = [
   { name: 'Home', href: '/home', icon: HomeIcon },
@@ -125,8 +119,7 @@ export default function Sidebar(props: { className?: string }) {
   folds = _.sortBy(folds, 'followCount').reverse()
   const deservesDailyFreeMarket = !useHasCreatedContractToday(user)
 
-  const navigationOptions =
-    user === null ? signedOutNavigation : getNavigation(user?.name || 'error')
+  const navigationOptions = user === null ? signedOutNavigation : navigation
   const mobileNavigationOptions =
     user === null ? signedOutMobileNavigation : mobileNavigation
 

web/components/user-page.tsx

@@ -21,9 +21,6 @@ import { getContractFromId, listContracts } from 'web/lib/firebase/contracts'
 import { LoadingIndicator } from './loading-indicator'
 import { useRouter } from 'next/router'
 import _ from 'lodash'
-import { BetsList } from './bets-list'
-import { Bet } from 'common/bet'
-import { getUserBets } from 'web/lib/firebase/bets'
 
 export function UserLink(props: {
   name: string
@@ -41,13 +38,12 @@ export function UserLink(props: {
   )
 }
 
-export const TAB_IDS = ['markets', 'comments', 'bets']
-
 export function UserPage(props: {
   user: User
   currentUser?: User
-  defaultTabTitle?: 'markets' | 'comments' | 'bets'
+  defaultTabTitle?: string
 }) {
+  const router = useRouter()
   const { user, currentUser, defaultTabTitle } = props
   const isCurrentUser = user.id === currentUser?.id
   const bannerUrl = user.bannerUrl ?? defaultBannerUrl(user.id)
@@ -55,7 +51,6 @@ export function UserPage(props: {
   const [usersContracts, setUsersContracts] = useState<Contract[] | 'loading'>(
     'loading'
   )
-  const [usersBets, setUsersBets] = useState<Bet[] | 'loading'>('loading')
   const [commentsByContract, setCommentsByContract] = useState<
     Map<Contract, Comment[]> | 'loading'
   >('loading')
@@ -64,7 +59,6 @@ export function UserPage(props: {
     if (!user) return
     getUsersComments(user.id).then(setUsersComments)
     listContracts(user.id).then(setUsersContracts)
-    getUserBets(user.id).then(setUsersBets)
   }, [user])
 
   useEffect(() => {
@@ -193,14 +187,17 @@ export function UserPage(props: {
         {usersContracts !== 'loading' && commentsByContract != 'loading' ? (
           <Tabs
             className={'pb-2 pt-1 '}
-            defaultIndex={TAB_IDS.indexOf(defaultTabTitle || 'markets')}
-            onClick={(tabName) => {
-              const tabId = tabName.toLowerCase()
-              const subpath = tabId === 'markets' ? '' : '/' + tabId
-              // BUG: if you start on `/Bob/bets`, then click on Markets, use-query-and-sort-params
-              // rewrites the url incorrectly to `/Bob/bets` instead of `/Bob`
-              window.history.replaceState('', '', `/${user.username}${subpath}`)
-            }}
+            defaultIndex={defaultTabTitle === 'Comments' ? 1 : 0}
+            onClick={(tabName) =>
+              router.push(
+                {
+                  pathname: `/${user.username}`,
+                  query: { tab: tabName },
+                },
+                undefined,
+                { shallow: true }
+              )
+            }
             tabs={[
               {
                 title: 'Markets',
@@ -223,24 +220,6 @@ export function UserPage(props: {
                   <div className="px-0.5 font-bold">{usersComments.length}</div>
                 ),
               },
-              {
-                title: 'Bets',
-                content: (
-                  <div>
-                    <AlertBox
-                      title="Bets are becoming publicly visible on 2022-06-01"
-                      text="Bettor identities have always been traceable through the Manifold API.
-                      However, our interface implied that they were private.
-                      As we develop new features such as leaderboards and bet history, it won't be technically feasible to keep this info private.
-                      For more context, or if you'd like to wipe your bet history, see: https://manifold.markets/Austin/will-all-bets-on-manifold-be-public"
-                    />
-                    {isCurrentUser && <BetsList user={user} />}
-                  </div>
-                ),
-                tabIcon: (
-                  <div className="px-0.5 font-bold">{usersBets.length}</div>
-                ),
-              },
             ]}
           />
         ) : (
@@ -263,27 +242,3 @@ export function defaultBannerUrl(userId: string) {
   ]
   return defaultBanner[genHash(userId)() % defaultBanner.length]
 }
-
-import { ExclamationIcon } from '@heroicons/react/solid'
-
-function AlertBox(props: { title: string; text: string }) {
-  const { title, text } = props
-  return (
-    <div className="rounded-md bg-yellow-50 p-4">
-      <div className="flex">
-        <div className="flex-shrink-0">
-          <ExclamationIcon
-            className="h-5 w-5 text-yellow-400"
-            aria-hidden="true"
-          />
-        </div>
-        <div className="ml-3">
-          <h3 className="text-sm font-medium text-yellow-800">{title}</h3>
-          <div className="mt-2 text-sm text-yellow-700">
-            <Linkify text={text} />
-          </div>
-        </div>
-      </div>
-    </div>
-  )
-}

web/hooks/use-sort-and-query-params.tsx

@@ -47,6 +47,7 @@ export function useInitialQueryAndSort(options?: {
         }
         setInitialSort(localSort ?? defaultSort)
       } else {
+        console.log('ready setting to ', sort ?? defaultSort)
         setInitialSort(sort ?? defaultSort)
       }
     }

web/lib/firebase/bets.ts

@@ -60,12 +60,6 @@ export function listenForBets(
   })
 }
 
-export async function getUserBets(userId: string) {
-  return getValues<Bet>(
-    query(collectionGroup(db, 'bets'), where('userId', '==', userId))
-  )
-}
-
 export function listenForUserBets(
   userId: string,
   setBets: (bets: Bet[]) => void

web/pages/[username]/bets.tsx

@@ -1,5 +0,0 @@
-import UserProfile from '.'
-
-export default function UserBets() {
-  return <UserProfile tab="bets" />
-}

web/pages/[username]/comments.tsx

@@ -1,5 +0,0 @@
-import UserProfile from '.'
-
-export default function UserBets() {
-  return <UserProfile tab="comments" />
-}

web/pages/[username]/index.tsx

@@ -6,12 +6,10 @@ import { UserPage } from 'web/components/user-page'
 import { useUser } from 'web/hooks/use-user'
 import Custom404 from '../404'
 
-export default function UserProfile(props: {
-  tab?: 'markets' | 'comments' | 'bets'
-}) {
+export default function UserProfile() {
   const router = useRouter()
   const [user, setUser] = useState<User | null | 'loading'>('loading')
-  const { username } = router.query as { username: string }
+  const { username, tab } = router.query as { username: string; tab: string }
   useEffect(() => {
     if (username) {
       getUserByUsername(username).then(setUser)
@@ -26,7 +24,7 @@ export default function UserProfile(props: {
     <UserPage
       user={user}
       currentUser={currentUser || undefined}
-      defaultTabTitle={props.tab}
+      defaultTabTitle={tab}
     />
   ) : (
     <Custom404 />