diff --git a/web/components/user-page.tsx b/web/components/user-page.tsx
index d97cdade..f75981da 100644
--- a/web/components/user-page.tsx
+++ b/web/components/user-page.tsx
@@ -8,6 +8,7 @@ import { BetsList } from './bets-list'
import { Spacer } from './layout/spacer'
import Link from 'next/link'
import clsx from 'clsx'
+import { SEO } from './SEO'
export function UserLink(props: { displayName: string; className?: string }) {
const { displayName, className } = props
@@ -28,8 +29,8 @@ export function UserLink(props: { displayName: string; className?: string }) {
)
}
-function UserCard(props: { user: User }) {
- const { user } = props
+function UserCard(props: { user: User; showPrivateInfo?: boolean }) {
+ const { user, showPrivateInfo } = props
return (
@@ -43,41 +44,60 @@ function UserCard(props: { user: User }) {
)}
-
-
{user?.email}
-
{formatMoney(user?.balance)}
-
-
-
+
{user.name}
+
+ {showPrivateInfo && (
+ <>
+
{user?.email}
+
{formatMoney(user?.balance)}
+
+
+
+ >
+ )}
)
}
-export function UserPage(props: { user: User }) {
- const { user } = props
+export function UserPage(props: { user: User; currentUser?: User }) {
+ const { user, currentUser } = props
+
+ const isCurrentUser = user.id === currentUser?.id
+
+ const possesive = isCurrentUser ? 'Your ' : `${user.username}'s `
+
return (
+
+
+
-
+
+
+
-
-
-
+ {isCurrentUser && (
+ <>
+
+
+ >
+ )}
diff --git a/web/pages/[username]/index.tsx b/web/pages/[username]/index.tsx
index 0ff086ac..2fd0d529 100644
--- a/web/pages/[username]/index.tsx
+++ b/web/pages/[username]/index.tsx
@@ -1,26 +1,32 @@
import { useRouter } from 'next/router'
import React, { useEffect, useState } from 'react'
+import Error from 'next/error'
+
import { getUserByUsername, User } from '../../lib/firebase/users'
import { UserPage } from '../../components/user-page'
-import Error from 'next/error'
+import { useUser } from '../../hooks/use-user'
export default function UserProfile() {
const router = useRouter()
- const [user, setUser] = useState('loading')
const atUsername = router.query.username as string | undefined
const username = atUsername?.substring(1) || '' // Remove the initial @
+
+ const [user, setUser] = useState('loading')
+
useEffect(() => {
if (username) {
getUserByUsername(username).then(setUser)
}
}, [username])
+ const currentUser = useUser()
+
const errorMessage = `Who is this "${username}" you speak of..`
if (user === 'loading') return <>>
return user ? (
-
+
) : (
)
diff --git a/web/pages/account.tsx b/web/pages/account.tsx
index e0d0d57b..298c05e3 100644
--- a/web/pages/account.tsx
+++ b/web/pages/account.tsx
@@ -30,5 +30,5 @@ function SignInCard() {
export default function Account() {
const user = useUser()
- return user ? :
+ return user ? :
}