From bb897a0a0fdfb5e9c89f81bfbc1a9bde9a5cec85 Mon Sep 17 00:00:00 2001 From: Austin Chen Date: Mon, 7 Mar 2022 17:14:51 -0800 Subject: [PATCH] Fix props to be empty object --- web/hooks/use-propz.ts | 11 +++++++++-- web/pages/[username]/[contractSlug].tsx | 19 +++++++++---------- web/pages/analytics.tsx | 5 +++-- web/pages/fold/[...slugs]/index.tsx | 8 ++++---- web/pages/home.tsx | 11 +++++------ web/pages/leaderboards.tsx | 5 +++-- 6 files changed, 33 insertions(+), 26 deletions(-) diff --git a/web/hooks/use-propz.ts b/web/hooks/use-propz.ts index 60b6b142..1b3e61b1 100644 --- a/web/hooks/use-propz.ts +++ b/web/hooks/use-propz.ts @@ -11,11 +11,17 @@ type PropzProps = { // This allows us to client-side render the page for authenticated users. // TODO: Could cache the result using stale-while-revalidate: https://swr.vercel.app/ export function usePropz( + initialProps: Object, getStaticPropz: (props: PropzProps) => Promise, // Dynamic routes will need the query params from the router needParams?: boolean ) { - // Get params from router + // If props were successfully server-side generated, just use those + if (!_.isEmpty(initialProps)) { + return initialProps + } + + // Otherwise, get params from router const router = useRouter() const params = router.query @@ -29,6 +35,7 @@ export function usePropz( return propz } +// Conditionally disable SSG for private Manifold instances export function fromPropz(getStaticPropz: (props: PropzProps) => Promise) { - return IS_PRIVATE_MANIFOLD ? async () => {} : getStaticPropz + return IS_PRIVATE_MANIFOLD ? async () => ({ props: {} }) : getStaticPropz } diff --git a/web/pages/[username]/[contractSlug].tsx b/web/pages/[username]/[contractSlug].tsx index 59d68899..39142378 100644 --- a/web/pages/[username]/[contractSlug].tsx +++ b/web/pages/[username]/[contractSlug].tsx @@ -79,16 +79,15 @@ export default function ContractPage(props: { slug: string folds: Fold[] }) { - props = props ?? - usePropz(getStaticPropz, true) ?? { - contract: null, - username: '', - comments: [], - answers: [], - bets: [], - slug: '', - folds: [], - } + props = usePropz(props, getStaticPropz, true) ?? { + contract: null, + username: '', + comments: [], + answers: [], + bets: [], + slug: '', + folds: [], + } const user = useUser() const contract = useContractWithPreload(props.slug, props.contract) diff --git a/web/pages/analytics.tsx b/web/pages/analytics.tsx index cbd7b725..f9f92591 100644 --- a/web/pages/analytics.tsx +++ b/web/pages/analytics.tsx @@ -5,12 +5,13 @@ import { Col } from '../components/layout/col' import { Spacer } from '../components/layout/spacer' import { Page } from '../components/page' import { Title } from '../components/title' -import { usePropz } from '../hooks/use-propz' +import { fromPropz, usePropz } from '../hooks/use-propz' import { getDailyBets } from '../lib/firebase/bets' import { getDailyComments } from '../lib/firebase/comments' import { getDailyContracts } from '../lib/firebase/contracts' import { IS_PRIVATE_MANIFOLD } from '../lib/firebase/init' +export const getStaticProps = fromPropz(getStaticPropz) export async function getStaticPropz() { const numberOfDays = 80 const today = dayjs(dayjs().format('YYYY-MM-DD')) @@ -56,7 +57,7 @@ export default function Analytics(props: { dailyContractCounts: number[] dailyCommentCounts: number[] }) { - props = usePropz(getStaticPropz) ?? { + props = usePropz(props, getStaticPropz) ?? { startDate: 0, dailyActiveUsers: [], dailyBetCounts: [], diff --git a/web/pages/fold/[...slugs]/index.tsx b/web/pages/fold/[...slugs]/index.tsx index 9b82e1d8..6f27c3de 100644 --- a/web/pages/fold/[...slugs]/index.tsx +++ b/web/pages/fold/[...slugs]/index.tsx @@ -38,12 +38,13 @@ import FeedCreate from '../../../components/feed-create' import { SEO } from '../../../components/SEO' import { useTaggedContracts } from '../../../hooks/use-contracts' import { Linkify } from '../../../components/linkify' -import { usePropz } from '../../../hooks/use-propz' +import { fromPropz, usePropz } from '../../../hooks/use-propz' import { filterDefined } from '../../../../common/util/array' import { useRecentBets } from '../../../hooks/use-bets' import { useRecentComments } from '../../../hooks/use-comments' import { LoadingIndicator } from '../../../components/loading-indicator' +export const getStaticProps = fromPropz(getStaticPropz) export async function getStaticPropz(props: { params: { slugs: string[] } }) { const { slugs } = props.params @@ -100,7 +101,7 @@ async function toTopUsers(userScores: { [userId: string]: number }) { return topUsers.filter((user) => user) } -export async function getStaticPathz() { +export async function getStaticPaths() { return { paths: [], fallback: 'blocking' } } const foldSubpages = [undefined, 'activity', 'markets', 'leaderboards'] as const @@ -117,8 +118,7 @@ export default function FoldPage(props: { creatorScores: { [userId: string]: number } topCreators: User[] }) { - // @ts-ignore - props = usePropz(getStaticPropz, true) ?? { + props = usePropz(props, getStaticPropz, true) ?? { fold: null, curator: null, contracts: [], diff --git a/web/pages/home.tsx b/web/pages/home.tsx index 0cec2756..fb9a4a9c 100644 --- a/web/pages/home.tsx +++ b/web/pages/home.tsx @@ -43,12 +43,11 @@ const Home = (props: { folds: Fold[] recentComments: Comment[] }) => { - props = props ?? - usePropz(getStaticPropz) ?? { - contracts: [], - folds: [], - recentComments: [], - } + props = usePropz(props, getStaticPropz) ?? { + contracts: [], + folds: [], + recentComments: [], + } const { folds } = props const user = useUser() diff --git a/web/pages/leaderboards.tsx b/web/pages/leaderboards.tsx index 3e7caed2..bf202b6f 100644 --- a/web/pages/leaderboards.tsx +++ b/web/pages/leaderboards.tsx @@ -5,8 +5,9 @@ import { Leaderboard } from '../components/leaderboard' import { Page } from '../components/page' import { getTopCreators, getTopTraders, User } from '../lib/firebase/users' import { formatMoney } from '../../common/util/format' -import { usePropz } from '../hooks/use-propz' +import { fromPropz, usePropz } from '../hooks/use-propz' +export const getStaticProps = fromPropz(getStaticPropz) export async function getStaticPropz() { const [topTraders, topCreators] = await Promise.all([ getTopTraders().catch((_) => {}), @@ -27,7 +28,7 @@ export default function Leaderboards(props: { topTraders: User[] topCreators: User[] }) { - props = usePropz(getStaticPropz) ?? { + props = usePropz(props, getStaticPropz) ?? { topTraders: [], topCreators: [], }