diff --git a/web/components/contract/contracts-list.tsx b/web/components/contract/contracts-list.tsx
index f886e982..608462d9 100644
--- a/web/components/contract/contracts-list.tsx
+++ b/web/components/contract/contracts-list.tsx
@@ -19,7 +19,6 @@ export function ContractsGrid(props: {
const isBottomVisible = useIsVisible(elem)
useEffect(() => {
- console.log({ isBottomVisible, hasMore })
if (isBottomVisible) {
loadMore()
}
diff --git a/web/components/nav/nav-bar.tsx b/web/components/nav/nav-bar.tsx
index 04c8e891..987e3142 100644
--- a/web/components/nav/nav-bar.tsx
+++ b/web/components/nav/nav-bar.tsx
@@ -47,7 +47,7 @@ export function BottomNavBar() {
)}
{user !== null && (
-
+
{
}
}
-const navigation = [
- { name: 'Home', href: '/home', icon: HomeIcon },
- { name: 'Activity', href: '/activity', icon: ChatAltIcon },
- { name: 'Portfolio', href: '/portfolio', icon: PresentationChartLineIcon },
- { name: 'Charity', href: '/charity', icon: HeartIcon },
-]
+function getNavigation(userName: string) {
+ return [
+ { name: 'Home', href: '/home', icon: HomeIcon },
+ { name: 'Activity', href: '/activity', icon: ChatAltIcon },
+ {
+ name: 'Portfolio',
+ href: `/${userName}/bets`,
+ icon: PresentationChartLineIcon,
+ },
+ { name: 'Charity', href: '/charity', icon: HeartIcon },
+ ]
+}
const signedOutNavigation = [
{ name: 'Home', href: '/home', icon: HomeIcon },
@@ -119,7 +125,8 @@ export default function Sidebar(props: { className?: string }) {
folds = _.sortBy(folds, 'followCount').reverse()
const deservesDailyFreeMarket = !useHasCreatedContractToday(user)
- const navigationOptions = user === null ? signedOutNavigation : navigation
+ const navigationOptions =
+ user === null ? signedOutNavigation : getNavigation(user?.name || 'error')
const mobileNavigationOptions =
user === null ? signedOutMobileNavigation : mobileNavigation
diff --git a/web/components/user-page.tsx b/web/components/user-page.tsx
index 89750b28..9f78165c 100644
--- a/web/components/user-page.tsx
+++ b/web/components/user-page.tsx
@@ -21,6 +21,9 @@ 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
@@ -38,12 +41,13 @@ export function UserLink(props: {
)
}
+export const TAB_IDS = ['markets', 'comments', 'bets']
+
export function UserPage(props: {
user: User
currentUser?: User
- defaultTabTitle?: string
+ defaultTabTitle?: 'markets' | 'comments' | 'bets'
}) {
- const router = useRouter()
const { user, currentUser, defaultTabTitle } = props
const isCurrentUser = user.id === currentUser?.id
const bannerUrl = user.bannerUrl ?? defaultBannerUrl(user.id)
@@ -51,6 +55,7 @@ export function UserPage(props: {
const [usersContracts, setUsersContracts] = useState(
'loading'
)
+ const [usersBets, setUsersBets] = useState('loading')
const [commentsByContract, setCommentsByContract] = useState<
Map | 'loading'
>('loading')
@@ -59,6 +64,7 @@ export function UserPage(props: {
if (!user) return
getUsersComments(user.id).then(setUsersComments)
listContracts(user.id).then(setUsersContracts)
+ getUserBets(user.id).then(setUsersBets)
}, [user])
useEffect(() => {
@@ -187,17 +193,14 @@ export function UserPage(props: {
{usersContracts !== 'loading' && commentsByContract != 'loading' ? (
- router.push(
- {
- pathname: `/${user.username}`,
- query: { tab: tabName },
- },
- undefined,
- { shallow: true }
- )
- }
+ 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}`)
+ }}
tabs={[
{
title: 'Markets',
@@ -220,6 +223,24 @@ export function UserPage(props: {
{usersComments.length}
),
},
+ {
+ title: 'Bets',
+ content: (
+
+
+ {isCurrentUser &&
}
+
+ ),
+ tabIcon: (
+ {usersBets.length}
+ ),
+ },
]}
/>
) : (
@@ -242,3 +263,27 @@ 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 (
+
+ )
+}
diff --git a/web/hooks/use-sort-and-query-params.tsx b/web/hooks/use-sort-and-query-params.tsx
index 7a9abb85..776bcd4d 100644
--- a/web/hooks/use-sort-and-query-params.tsx
+++ b/web/hooks/use-sort-and-query-params.tsx
@@ -47,7 +47,6 @@ export function useInitialQueryAndSort(options?: {
}
setInitialSort(localSort ?? defaultSort)
} else {
- console.log('ready setting to ', sort ?? defaultSort)
setInitialSort(sort ?? defaultSort)
}
}
diff --git a/web/lib/firebase/bets.ts b/web/lib/firebase/bets.ts
index b55b0027..c3ca8508 100644
--- a/web/lib/firebase/bets.ts
+++ b/web/lib/firebase/bets.ts
@@ -60,6 +60,12 @@ export function listenForBets(
})
}
+export async function getUserBets(userId: string) {
+ return getValues(
+ query(collectionGroup(db, 'bets'), where('userId', '==', userId))
+ )
+}
+
export function listenForUserBets(
userId: string,
setBets: (bets: Bet[]) => void
diff --git a/web/pages/[username]/bets.tsx b/web/pages/[username]/bets.tsx
new file mode 100644
index 00000000..0403d263
--- /dev/null
+++ b/web/pages/[username]/bets.tsx
@@ -0,0 +1,5 @@
+import UserProfile from '.'
+
+export default function UserBets() {
+ return
+}
diff --git a/web/pages/[username]/comments.tsx b/web/pages/[username]/comments.tsx
new file mode 100644
index 00000000..65a53028
--- /dev/null
+++ b/web/pages/[username]/comments.tsx
@@ -0,0 +1,5 @@
+import UserProfile from '.'
+
+export default function UserBets() {
+ return
+}
diff --git a/web/pages/[username]/index.tsx b/web/pages/[username]/index.tsx
index cbc53235..eaef8471 100644
--- a/web/pages/[username]/index.tsx
+++ b/web/pages/[username]/index.tsx
@@ -6,10 +6,12 @@ import { UserPage } from 'web/components/user-page'
import { useUser } from 'web/hooks/use-user'
import Custom404 from '../404'
-export default function UserProfile() {
+export default function UserProfile(props: {
+ tab?: 'markets' | 'comments' | 'bets'
+}) {
const router = useRouter()
const [user, setUser] = useState('loading')
- const { username, tab } = router.query as { username: string; tab: string }
+ const { username } = router.query as { username: string }
useEffect(() => {
if (username) {
getUserByUsername(username).then(setUser)
@@ -24,7 +26,7 @@ export default function UserProfile() {
) : (