Pass both user and private user through SSR to auth context
This commit is contained in:
parent
3cc7bd2135
commit
17fcf67653
|
@ -1,7 +1,7 @@
|
||||||
import { ReactNode, createContext, useEffect } from 'react'
|
import { ReactNode, createContext, useEffect } from 'react'
|
||||||
import { User, PrivateUser } from 'common/user'
|
|
||||||
import { onIdTokenChanged } from 'firebase/auth'
|
import { onIdTokenChanged } from 'firebase/auth'
|
||||||
import {
|
import {
|
||||||
|
UserAndPrivateUser,
|
||||||
auth,
|
auth,
|
||||||
listenForUser,
|
listenForUser,
|
||||||
listenForPrivateUser,
|
listenForPrivateUser,
|
||||||
|
@ -14,8 +14,6 @@ import { randomString } from 'common/util/random'
|
||||||
import { identifyUser, setUserProperty } from 'web/lib/service/analytics'
|
import { identifyUser, setUserProperty } from 'web/lib/service/analytics'
|
||||||
import { useStateCheckEquality } from 'web/hooks/use-state-check-equality'
|
import { useStateCheckEquality } from 'web/hooks/use-state-check-equality'
|
||||||
|
|
||||||
type UserAndPrivateUser = { user: User; privateUser: PrivateUser }
|
|
||||||
|
|
||||||
// Either we haven't looked up the logged in user yet (undefined), or we know
|
// Either we haven't looked up the logged in user yet (undefined), or we know
|
||||||
// the user is not logged in (null), or we know the user is logged in.
|
// the user is not logged in (null), or we know the user is logged in.
|
||||||
type AuthUser = undefined | null | UserAndPrivateUser
|
type AuthUser = undefined | null | UserAndPrivateUser
|
||||||
|
|
|
@ -43,6 +43,8 @@ export const privateUsers = coll<PrivateUser>('private-users')
|
||||||
|
|
||||||
export type { User }
|
export type { User }
|
||||||
|
|
||||||
|
export type UserAndPrivateUser = { user: User; privateUser: PrivateUser }
|
||||||
|
|
||||||
export type Period = 'daily' | 'weekly' | 'monthly' | 'allTime'
|
export type Period = 'daily' | 'weekly' | 'monthly' | 'allTime'
|
||||||
|
|
||||||
export const auth = getAuth(app)
|
export const auth = getAuth(app)
|
||||||
|
@ -64,7 +66,7 @@ export async function getUserAndPrivateUser(userId: string) {
|
||||||
getDoc(doc(privateUsers, userId))!, // eslint-disable-line @typescript-eslint/no-non-null-assertion
|
getDoc(doc(privateUsers, userId))!, // eslint-disable-line @typescript-eslint/no-non-null-assertion
|
||||||
])
|
])
|
||||||
).map((d) => d.data()) as [User, PrivateUser]
|
).map((d) => d.data()) as [User, PrivateUser]
|
||||||
return { user, privateUser }
|
return { user, privateUser } as UserAndPrivateUser
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function getUserByUsername(username: string) {
|
export async function getUserByUsername(username: string) {
|
||||||
|
|
|
@ -79,7 +79,7 @@ function MyApp({ Component, pageProps }: AppProps) {
|
||||||
content="width=device-width, initial-scale=1, maximum-scale=1"
|
content="width=device-width, initial-scale=1, maximum-scale=1"
|
||||||
/>
|
/>
|
||||||
</Head>
|
</Head>
|
||||||
<AuthProvider serverUser={pageProps.user}>
|
<AuthProvider serverUser={pageProps.authUser}>
|
||||||
<QueryClientProvider client={queryClient}>
|
<QueryClientProvider client={queryClient}>
|
||||||
<Welcome {...pageProps} />
|
<Welcome {...pageProps} />
|
||||||
<Component {...pageProps} />
|
<Component {...pageProps} />
|
||||||
|
|
|
@ -4,7 +4,7 @@ import clsx from 'clsx'
|
||||||
import dayjs from 'dayjs'
|
import dayjs from 'dayjs'
|
||||||
import Textarea from 'react-expanding-textarea'
|
import Textarea from 'react-expanding-textarea'
|
||||||
import { Spacer } from 'web/components/layout/spacer'
|
import { Spacer } from 'web/components/layout/spacer'
|
||||||
import { getUser } from 'web/lib/firebase/users'
|
import { getUserAndPrivateUser } from 'web/lib/firebase/users'
|
||||||
import { Contract, contractPath } from 'web/lib/firebase/contracts'
|
import { Contract, contractPath } from 'web/lib/firebase/contracts'
|
||||||
import { createMarket } from 'web/lib/firebase/api'
|
import { createMarket } from 'web/lib/firebase/api'
|
||||||
import { FIXED_ANTE } from 'common/antes'
|
import { FIXED_ANTE } from 'common/antes'
|
||||||
|
@ -34,8 +34,7 @@ import { SEO } from 'web/components/SEO'
|
||||||
import { MultipleChoiceAnswers } from 'web/components/answers/multiple-choice-answers'
|
import { MultipleChoiceAnswers } from 'web/components/answers/multiple-choice-answers'
|
||||||
|
|
||||||
export const getServerSideProps = redirectIfLoggedOut('/', async (_, creds) => {
|
export const getServerSideProps = redirectIfLoggedOut('/', async (_, creds) => {
|
||||||
const user = await getUser(creds.user.uid)
|
return { props: { auth: await getUserAndPrivateUser(creds.user.uid) } }
|
||||||
return { props: { user } }
|
|
||||||
})
|
})
|
||||||
|
|
||||||
type NewQuestionParams = {
|
type NewQuestionParams = {
|
||||||
|
@ -52,9 +51,9 @@ type NewQuestionParams = {
|
||||||
initValue?: string
|
initValue?: string
|
||||||
}
|
}
|
||||||
|
|
||||||
export default function Create(props: { user: User }) {
|
export default function Create(props: { auth: { user: User } }) {
|
||||||
useTracking('view create page')
|
useTracking('view create page')
|
||||||
const { user } = props
|
const { user } = props.auth
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
const params = router.query as NewQuestionParams
|
const params = router.query as NewQuestionParams
|
||||||
// TODO: Not sure why Question is pulled out as its own component;
|
// TODO: Not sure why Question is pulled out as its own component;
|
||||||
|
|
|
@ -10,19 +10,18 @@ import { Contract } from 'common/contract'
|
||||||
import { User } from 'common/user'
|
import { User } from 'common/user'
|
||||||
import { ContractPageContent } from './[username]/[contractSlug]'
|
import { ContractPageContent } from './[username]/[contractSlug]'
|
||||||
import { getContractFromSlug } from 'web/lib/firebase/contracts'
|
import { getContractFromSlug } from 'web/lib/firebase/contracts'
|
||||||
import { getUser } from 'web/lib/firebase/users'
|
import { getUserAndPrivateUser } from 'web/lib/firebase/users'
|
||||||
import { useTracking } from 'web/hooks/use-tracking'
|
import { useTracking } from 'web/hooks/use-tracking'
|
||||||
import { track } from 'web/lib/service/analytics'
|
import { track } from 'web/lib/service/analytics'
|
||||||
import { redirectIfLoggedOut } from 'web/lib/firebase/server-auth'
|
import { redirectIfLoggedOut } from 'web/lib/firebase/server-auth'
|
||||||
import { useSaveReferral } from 'web/hooks/use-save-referral'
|
import { useSaveReferral } from 'web/hooks/use-save-referral'
|
||||||
|
|
||||||
export const getServerSideProps = redirectIfLoggedOut('/', async (_, creds) => {
|
export const getServerSideProps = redirectIfLoggedOut('/', async (_, creds) => {
|
||||||
const user = await getUser(creds.user.uid)
|
return { props: { auth: await getUserAndPrivateUser(creds.user.uid) } }
|
||||||
return { props: { user } }
|
|
||||||
})
|
})
|
||||||
|
|
||||||
const Home = (props: { user: User }) => {
|
const Home = (props: { auth: { user: User } }) => {
|
||||||
const { user } = props
|
const { user } = props.auth
|
||||||
const [contract, setContract] = useContractPage()
|
const [contract, setContract] = useContractPage()
|
||||||
|
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
|
|
|
@ -11,7 +11,7 @@ import { Page } from 'web/components/page'
|
||||||
import { SEO } from 'web/components/SEO'
|
import { SEO } from 'web/components/SEO'
|
||||||
import { Title } from 'web/components/title'
|
import { Title } from 'web/components/title'
|
||||||
import { Subtitle } from 'web/components/subtitle'
|
import { Subtitle } from 'web/components/subtitle'
|
||||||
import { getUser } from 'web/lib/firebase/users'
|
import { getUserAndPrivateUser } from 'web/lib/firebase/users'
|
||||||
import { useUserManalinks } from 'web/lib/firebase/manalinks'
|
import { useUserManalinks } from 'web/lib/firebase/manalinks'
|
||||||
import { useUserById } from 'web/hooks/use-user'
|
import { useUserById } from 'web/hooks/use-user'
|
||||||
import { ManalinkTxn } from 'common/txn'
|
import { ManalinkTxn } from 'common/txn'
|
||||||
|
@ -31,16 +31,15 @@ import { SiteLink } from 'web/components/site-link'
|
||||||
const LINKS_PER_PAGE = 24
|
const LINKS_PER_PAGE = 24
|
||||||
|
|
||||||
export const getServerSideProps = redirectIfLoggedOut('/', async (_, creds) => {
|
export const getServerSideProps = redirectIfLoggedOut('/', async (_, creds) => {
|
||||||
const user = await getUser(creds.user.uid)
|
return { props: { auth: await getUserAndPrivateUser(creds.user.uid) } }
|
||||||
return { props: { user } }
|
|
||||||
})
|
})
|
||||||
|
|
||||||
export function getManalinkUrl(slug: string) {
|
export function getManalinkUrl(slug: string) {
|
||||||
return `${location.protocol}//${location.host}/link/${slug}`
|
return `${location.protocol}//${location.host}/link/${slug}`
|
||||||
}
|
}
|
||||||
|
|
||||||
export default function LinkPage(props: { user: User }) {
|
export default function LinkPage(props: { auth: { user: User } }) {
|
||||||
const { user } = props
|
const { user } = props.auth
|
||||||
const links = useUserManalinks(user.id ?? '')
|
const links = useUserManalinks(user.id ?? '')
|
||||||
// const manalinkTxns = useManalinkTxns(user?.id ?? '')
|
// const manalinkTxns = useManalinkTxns(user?.id ?? '')
|
||||||
const [highlightedSlug, setHighlightedSlug] = useState('')
|
const [highlightedSlug, setHighlightedSlug] = useState('')
|
||||||
|
|
|
@ -13,7 +13,7 @@ import {
|
||||||
MANIFOLD_USERNAME,
|
MANIFOLD_USERNAME,
|
||||||
PrivateUser,
|
PrivateUser,
|
||||||
} from 'common/user'
|
} from 'common/user'
|
||||||
import { getPrivateUser } from 'web/lib/firebase/users'
|
import { getUserAndPrivateUser } from 'web/lib/firebase/users'
|
||||||
import clsx from 'clsx'
|
import clsx from 'clsx'
|
||||||
import { RelativeTimestamp } from 'web/components/relative-timestamp'
|
import { RelativeTimestamp } from 'web/components/relative-timestamp'
|
||||||
import { Linkify } from 'web/components/linkify'
|
import { Linkify } from 'web/components/linkify'
|
||||||
|
@ -46,12 +46,13 @@ const MULTIPLE_USERS_KEY = 'multipleUsers'
|
||||||
const HIGHLIGHT_CLASS = 'bg-indigo-50'
|
const HIGHLIGHT_CLASS = 'bg-indigo-50'
|
||||||
|
|
||||||
export const getServerSideProps = redirectIfLoggedOut('/', async (_, creds) => {
|
export const getServerSideProps = redirectIfLoggedOut('/', async (_, creds) => {
|
||||||
const privateUser = await getPrivateUser(creds.user.uid)
|
return { props: { auth: await getUserAndPrivateUser(creds.user.uid) } }
|
||||||
return { props: { privateUser } }
|
|
||||||
})
|
})
|
||||||
|
|
||||||
export default function Notifications(props: { privateUser: PrivateUser }) {
|
export default function Notifications(props: {
|
||||||
const { privateUser } = props
|
auth: { privateUser: PrivateUser }
|
||||||
|
}) {
|
||||||
|
const { privateUser } = props.auth
|
||||||
const local = safeLocalStorage()
|
const local = safeLocalStorage()
|
||||||
let localNotifications = [] as Notification[]
|
let localNotifications = [] as Notification[]
|
||||||
const localSavedNotificationGroups = local?.getItem('notification-groups')
|
const localSavedNotificationGroups = local?.getItem('notification-groups')
|
||||||
|
|
|
@ -13,8 +13,7 @@ import { Col } from 'web/components/layout/col'
|
||||||
import { Row } from 'web/components/layout/row'
|
import { Row } from 'web/components/layout/row'
|
||||||
import { User, PrivateUser } from 'common/user'
|
import { User, PrivateUser } from 'common/user'
|
||||||
import {
|
import {
|
||||||
getUser,
|
getUserAndPrivateUser,
|
||||||
getPrivateUser,
|
|
||||||
updateUser,
|
updateUser,
|
||||||
updatePrivateUser,
|
updatePrivateUser,
|
||||||
} from 'web/lib/firebase/users'
|
} from 'web/lib/firebase/users'
|
||||||
|
@ -24,11 +23,7 @@ import Textarea from 'react-expanding-textarea'
|
||||||
import { redirectIfLoggedOut } from 'web/lib/firebase/server-auth'
|
import { redirectIfLoggedOut } from 'web/lib/firebase/server-auth'
|
||||||
|
|
||||||
export const getServerSideProps = redirectIfLoggedOut('/', async (_, creds) => {
|
export const getServerSideProps = redirectIfLoggedOut('/', async (_, creds) => {
|
||||||
const [user, privateUser] = await Promise.all([
|
return { props: { auth: await getUserAndPrivateUser(creds.user.uid) } }
|
||||||
getUser(creds.user.uid),
|
|
||||||
getPrivateUser(creds.user.uid),
|
|
||||||
])
|
|
||||||
return { props: { user, privateUser } }
|
|
||||||
})
|
})
|
||||||
|
|
||||||
function EditUserField(props: {
|
function EditUserField(props: {
|
||||||
|
@ -69,10 +64,9 @@ function EditUserField(props: {
|
||||||
}
|
}
|
||||||
|
|
||||||
export default function ProfilePage(props: {
|
export default function ProfilePage(props: {
|
||||||
user: User
|
auth: { user: User; privateUser: PrivateUser }
|
||||||
privateUser: PrivateUser
|
|
||||||
}) {
|
}) {
|
||||||
const { user, privateUser } = props
|
const { user, privateUser } = props.auth
|
||||||
const [avatarUrl, setAvatarUrl] = useState(user.avatarUrl || '')
|
const [avatarUrl, setAvatarUrl] = useState(user.avatarUrl || '')
|
||||||
const [avatarLoading, setAvatarLoading] = useState(false)
|
const [avatarLoading, setAvatarLoading] = useState(false)
|
||||||
const [name, setName] = useState(user.name)
|
const [name, setName] = useState(user.name)
|
||||||
|
|
Loading…
Reference in New Issue
Block a user