-
Notifications
You must be signed in to change notification settings - Fork 1
/
_document.tsx
79 lines (71 loc) · 2.41 KB
/
_document.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
import Document, {
Html,
Head,
Main,
NextScript,
DocumentContext,
DocumentInitialProps,
} from "next/document";
import { RelayEnvironmentProvider } from "relay-hooks";
import initialEnvironment from "../relay/initialEnvironment";
import RelayServerSSR from "react-relay-network-modern-ssr/lib/server";
import { RecordMap } from "relay-runtime/lib/store/RelayStoreTypes";
import environment from "../relay/environment";
interface Props {
records: RecordMap;
}
class MyDocument extends Document<Props> {
static async getInitialProps(
ctx: DocumentContext
): Promise<DocumentInitialProps & Props> {
const originalRenderPage = ctx.renderPage;
const relayServerSSR = new RelayServerSSR();
const env = initialEnvironment(relayServerSSR);
ctx.renderPage = () =>
originalRenderPage({
// useful for wrapping in a per-page basis
enhanceComponent: (Component) => (props) => {
return (
<RelayEnvironmentProvider environment={env}>
<Component {...props} />
</RelayEnvironmentProvider>
);
},
});
// Run the parent `getInitialProps`, it now includes the custom `renderPage`
await Document.getInitialProps(ctx);
await relayServerSSR.getCache();
const records = env.getStore().getSource().toJSON();
ctx.renderPage = () =>
originalRenderPage({
enhanceApp: (App) => (props) => {
return (
<App
{...props}
// @ts-expect-error
records={records}
/>
);
},
});
const initialProps = await Document.getInitialProps(ctx);
return { ...initialProps, records };
}
render() {
return (
<Html>
<Head />
<body>
<template id="relay-data">
{Buffer.from(
JSON.stringify(this.props.records)
).toString("base64")}
</template>
<Main />
<NextScript />
</body>
</Html>
);
}
}
export default MyDocument;