1 import { Helmet } from "inferno-helmet";
2 import { renderToString } from "inferno-server";
3 import serialize from "serialize-javascript";
4 import sharp from "sharp";
5 import { favIconPngUrl, favIconUrl } from "../../shared/config";
6 import { ILemmyConfig, IsoDataOptionalSite } from "../../shared/interfaces";
7 import { buildThemeList } from "./build-themes-list";
8 import { fetchIconPng } from "./fetch-icon-png";
10 const customHtmlHeader = process.env["LEMMY_UI_CUSTOM_HTML_HEADER"] || "";
12 let appleTouchIcon: string | undefined = undefined;
14 export async function createSsrHtml(
16 isoData: IsoDataOptionalSite
18 const site = isoData.site_res;
20 const fallbackTheme = `<link rel="stylesheet" type="text/css" href="/css/themes/${
21 (await buildThemeList())[0]
24 if (!appleTouchIcon) {
25 appleTouchIcon = site?.site_view.site.icon
26 ? `data:image/png;base64,${sharp(
27 await fetchIconPng(site.site_view.site.icon)
35 background: "#222222",
39 .then(buf => buf.toString("base64"))}`
44 process.env["LEMMY_UI_DEBUG"] === "true"
47 <script src="//cdn.jsdelivr.net/npm/eruda"></script>
48 <script>eruda.init();</script>
53 const helmet = Helmet.renderStatic();
55 const config: ILemmyConfig = { wsHost: process.env.LEMMY_UI_LEMMY_WS_HOST };
59 <html ${helmet.htmlAttributes.toString()}>
61 <script>window.isoData = ${serialize(isoData)}</script>
62 <script>window.lemmyConfig = ${serialize(config)}</script>
64 <!-- A remote debugging utility for mobile -->
67 <!-- Custom injected script -->
70 ${helmet.title.toString()}
71 ${helmet.meta.toString()}
73 <!-- Required meta tags -->
74 <meta name="Description" content="Lemmy">
75 <meta charset="utf-8">
76 <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
81 href=${site?.site_view.site.icon ?? favIconUrl}
84 <!-- Web app manifest -->
85 <link rel="manifest" href="/manifest.webmanifest" />
86 <link rel="apple-touch-icon" href=${appleTouchIcon} />
87 <link rel="apple-touch-startup-image" href=${appleTouchIcon} />
90 <link rel="stylesheet" type="text/css" href="/static/styles/styles.css" />
92 <!-- Current theme and more -->
93 ${helmet.link.toString() || fallbackTheme}
97 <body ${helmet.bodyAttributes.toString()}>
99 <div class="alert alert-danger rounded-0" role="alert">
100 <b>Javascript is disabled. Actions will not work.</b>
104 <div id='root'>${root}</div>
105 <script defer src='/static/js/client.js'></script>