mirror of
https://github.com/D4M13N-D3V/comissions-app-ui.git
synced 2025-03-14 08:15:08 +00:00
71 lines
1.9 KiB
TypeScript
71 lines
1.9 KiB
TypeScript
|
// ** React Import
|
||
|
|
import { Children } from 'react'
|
||
|
|
|
||
|
|
// ** Next Import
|
||
|
|
import Document, { Html, Head, Main, NextScript } from 'next/document'
|
||
|
|
|
||
|
|
// ** Emotion Imports
|
||
|
|
import createEmotionServer from '@emotion/server/create-instance'
|
||
|
|
|
||
|
|
// ** Utils Imports
|
||
|
|
import { createEmotionCache } from '../core/utils/create-emotion-cache'
|
||
|
|
|
||
|
|
class CustomDocument extends Document {
|
||
|
|
render() {
|
||
|
|
return (
|
||
|
|
<Html lang='en'>
|
||
|
|
<Head>
|
||
|
|
<link rel='preconnect' href='https://fonts.googleapis.com' />
|
||
|
|
<link rel='preconnect' href='https://fonts.gstatic.com' />
|
||
|
|
<link
|
||
|
|
rel='stylesheet'
|
||
|
|
href='https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap'
|
||
|
|
/>
|
||
|
|
<link rel='apple-touch-icon' sizes='180x180' href='/images/apple-touch-icon.png' />
|
||
|
|
<link rel='shortcut icon' href='/images/favicon.png' />
|
||
|
|
</Head>
|
||
|
|
<body>
|
||
|
|
<Main />
|
||
|
|
<NextScript />
|
||
|
|
</body>
|
||
|
|
</Html>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
CustomDocument.getInitialProps = async ctx => {
|
||
|
|
const originalRenderPage = ctx.renderPage
|
||
|
|
const cache = createEmotionCache()
|
||
|
|
const { extractCriticalToChunks } = createEmotionServer(cache)
|
||
|
|
|
||
|
|
ctx.renderPage = () =>
|
||
|
|
originalRenderPage({
|
||
|
|
enhanceApp: App => props =>
|
||
|
|
(
|
||
|
|
<App
|
||
|
|
{...props} // @ts-ignore
|
||
|
|
emotionCache={cache}
|
||
|
|
/>
|
||
|
|
)
|
||
|
|
})
|
||
|
|
|
||
|
|
const initialProps = await Document.getInitialProps(ctx)
|
||
|
|
const emotionStyles = extractCriticalToChunks(initialProps.html)
|
||
|
|
const emotionStyleTags = emotionStyles.styles.map(style => {
|
||
|
|
return (
|
||
|
|
<style
|
||
|
|
key={style.key}
|
||
|
|
dangerouslySetInnerHTML={{ __html: style.css }}
|
||
|
|
data-emotion={`${style.key} ${style.ids.join(' ')}`}
|
||
|
|
/>
|
||
|
|
)
|
||
|
|
})
|
||
|
|
|
||
|
|
return {
|
||
|
|
...initialProps,
|
||
|
|
styles: [...Children.toArray(initialProps.styles), ...emotionStyleTags]
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
export default CustomDocument
|