import { createProxySSGHelpers } from '@trpc/react-query/ssg'
import type { GetServerSidePropsContext } from 'next'
import { type NextPage } from 'next'
import Head from 'next/head'
import { useRouter } from 'next/router'
import superjson from 'superjson'
import { appRouter } from '../../server/api/root'
import { createInnerTRPCContext } from '../../server/api/trpc'
import { getServerAuthSession } from '../../server/auth'
import { api } from '../../utils/api'
import { formatVideoEmbedUrl, getThumbnailUrl } from '../../utils/video'
export const getServerSideProps = async (ctx: GetServerSidePropsContext) => {
const session = await getServerAuthSession(ctx)
const ssg = createProxySSGHelpers({
router: appRouter,
ctx: createInnerTRPCContext({ session }),
transformer: superjson,
})
if (typeof ctx.query.playId === 'string') {
await ssg.play.getById.fetch(ctx.query.playId)
}
return {
props: {
trpcState: ssg.dehydrate(),
},
}
}
const Home: NextPage = () => {
const { query } = useRouter()
if (typeof query.playId !== 'string') return <p>Bad ID</p>
const { data: play, isLoading: isLoadingPlay } = api.play.getById.useQuery(query.playId, {
refetchOnWindowFocus: false,
})
return (
<>
<Head>
{play && (
<>
<meta property='og:title' content={play.name} />
<meta property='og:description' content={play.description} />
</>
)}
</Head>
</>
)
}
export default Home
