import fs from 'fs';
import Document, { Html, Head, Main, NextScript } from 'next/document';
import { CustomHtml, CustomJavascript, Favicon } from '~/elements';
import { googleFontUrl } from '~/util';
import favicons from '../favicon-formats';
import type { DocumentContext, DocumentInitialProps } from 'next/document';
import type { Config, ThemeConfig } from '~/types';
// Declare imported JSON type to avoid type errors when file is not present (testing).
const config = (await import('../hyperglass.json')) as unknown as Config;
interface DocumentExtra
extends DocumentInitialProps,
Pick {
customJs: string;
customHtml: string;
}
class MyDocument extends Document {
static async getInitialProps(ctx: DocumentContext): Promise {
const initialProps = await Document.getInitialProps(ctx);
let customJs = '';
let customHtml = '';
if (fs.existsSync('custom.js')) {
customJs = fs.readFileSync('custom.js').toString();
}
if (fs.existsSync('custom.html')) {
customHtml = fs.readFileSync('custom.html').toString();
}
let fonts = { body: '', mono: '' };
let defaultColorMode: 'light' | 'dark' | null = null;
// const hyperglassUrl = process.env.HYPERGLASS_URL ?? '';
// const {
// web: {
// theme: { fonts: themeFonts, defaultColorMode: themeDefaultColorMode },
// },
// } = await getHyperglassConfig(hyperglassUrl);
fonts = {
body: "https://assets.witine.com/fonts/inter.css",
mono: googleFontUrl(config.web.theme.fonts.mono),
};
defaultColorMode = config.web.theme.defaultColorMode;
return { customJs, customHtml, fonts, defaultColorMode, ...initialProps };
}
render(): JSX.Element {
return (
{favicons.map(favicon => (
))}
{this.props.customJs}
{this.props.customHtml}
);
}
}
export default MyDocument;