Switch to SSR for user page
This commit is contained in:
parent
c718b396e0
commit
d29fe3f3d2
|
@ -5,6 +5,7 @@ import { LinkIcon } from '@heroicons/react/solid'
|
||||||
import { PencilIcon } from '@heroicons/react/outline'
|
import { PencilIcon } from '@heroicons/react/outline'
|
||||||
|
|
||||||
import { User } from 'web/lib/firebase/users'
|
import { User } from 'web/lib/firebase/users'
|
||||||
|
import { useUser } from 'web/hooks/use-user'
|
||||||
import { CreatorContractsList } from './contract/contracts-grid'
|
import { CreatorContractsList } from './contract/contracts-grid'
|
||||||
import { SEO } from './SEO'
|
import { SEO } from './SEO'
|
||||||
import { Page } from './page'
|
import { Page } from './page'
|
||||||
|
@ -50,9 +51,10 @@ export function UserLink(props: {
|
||||||
|
|
||||||
export const TAB_IDS = ['markets', 'comments', 'bets', 'groups']
|
export const TAB_IDS = ['markets', 'comments', 'bets', 'groups']
|
||||||
|
|
||||||
export function UserPage(props: { user: User; currentUser?: User }) {
|
export function UserPage(props: { user: User }) {
|
||||||
const { user, currentUser } = props
|
const { user } = props
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
|
const currentUser = useUser()
|
||||||
const isCurrentUser = user.id === currentUser?.id
|
const isCurrentUser = user.id === currentUser?.id
|
||||||
const bannerUrl = user.bannerUrl ?? defaultBannerUrl(user.id)
|
const bannerUrl = user.bannerUrl ?? defaultBannerUrl(user.id)
|
||||||
const [showConfetti, setShowConfetti] = useState(false)
|
const [showConfetti, setShowConfetti] = useState(false)
|
||||||
|
|
|
@ -1,48 +1,38 @@
|
||||||
import { useRouter } from 'next/router'
|
import { useRouter } from 'next/router'
|
||||||
import React from 'react'
|
import React from 'react'
|
||||||
|
|
||||||
import { getUserByUsername, User } from 'web/lib/firebase/users'
|
import {
|
||||||
|
getUserByUsername,
|
||||||
|
getUserAndPrivateUser,
|
||||||
|
User,
|
||||||
|
UserAndPrivateUser,
|
||||||
|
} from 'web/lib/firebase/users'
|
||||||
import { UserPage } from 'web/components/user-page'
|
import { UserPage } from 'web/components/user-page'
|
||||||
import { useUser } from 'web/hooks/use-user'
|
|
||||||
import Custom404 from '../404'
|
import Custom404 from '../404'
|
||||||
import { useTracking } from 'web/hooks/use-tracking'
|
import { useTracking } from 'web/hooks/use-tracking'
|
||||||
import { fromPropz, usePropz } from 'web/hooks/use-propz'
|
import { GetServerSideProps } from 'next'
|
||||||
|
import { authenticateOnServer } from 'web/lib/firebase/server-auth'
|
||||||
export const getStaticProps = fromPropz(getStaticPropz)
|
|
||||||
export async function getStaticPropz(props: { params: { username: string } }) {
|
|
||||||
const { username } = props.params
|
|
||||||
const user = await getUserByUsername(username)
|
|
||||||
|
|
||||||
|
export const getServerSideProps: GetServerSideProps = async (ctx) => {
|
||||||
|
const creds = await authenticateOnServer(ctx)
|
||||||
|
const [auth, user] = (await Promise.all([
|
||||||
|
creds != null ? getUserAndPrivateUser(creds.user.uid) : null,
|
||||||
|
getUserByUsername(ctx.params!.username as string),
|
||||||
|
])) as [UserAndPrivateUser | null, User | null]
|
||||||
return {
|
return {
|
||||||
props: {
|
props: { auth, user },
|
||||||
user,
|
|
||||||
},
|
|
||||||
|
|
||||||
revalidate: 60, // regenerate after a minute
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function getStaticPaths() {
|
|
||||||
return { paths: [], fallback: 'blocking' }
|
|
||||||
}
|
|
||||||
|
|
||||||
export default function UserProfile(props: { user: User | null }) {
|
export default function UserProfile(props: { user: User | null }) {
|
||||||
props = usePropz(props, getStaticPropz) ?? { user: undefined }
|
|
||||||
const { user } = props
|
const { user } = props
|
||||||
|
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
const { username } = router.query as {
|
const { username } = router.query as {
|
||||||
username: string
|
username: string
|
||||||
}
|
}
|
||||||
const currentUser = useUser()
|
|
||||||
|
|
||||||
useTracking('view user profile', { username })
|
useTracking('view user profile', { username })
|
||||||
|
|
||||||
if (user === undefined) return <div />
|
return user ? <UserPage user={user} /> : <Custom404 />
|
||||||
|
|
||||||
return user ? (
|
|
||||||
<UserPage user={user} currentUser={currentUser || undefined} />
|
|
||||||
) : (
|
|
||||||
<Custom404 />
|
|
||||||
)
|
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue
Block a user