mirror of
https://github.com/bewcloud/bewcloud.git
synced 2026-03-11 08:54:49 +00:00
This implements a huge change, where Fresh is removed as a framework and serving files, allowing more control over importing, bundling, and serving files and components. The biggest challenge was to continue making sure that there weren't too many places to look into for import versions, and `PasswordlessPasskeyLogin.tsx` became a prototype in migrating a component to fully SSR, no need for frontend parsing (via Babel) or bundling (via a custom-script, downloading frontend dependencies from esm.sh). Still, there are too many components to migrate like that, and it's all working, so I likely won't even attempt it unless there's some bug, new feature, or security vulnerability to address that warrants a rewrite of those. This also updates all dependencies (except `@libs/xml` because that still causes some breaking in DAV endpoints), including Deno! All other advantages can be seen in the related issues, and the breaking change this (v4.0.0) introduces is related simply to `config.email.tlsMode` (which had a deprecation warning throughout v3), and because, while I tested many things exhaustively, it's not impossible something broke that I didn't see. Closes #141 Closes #132
91 lines
3.3 KiB
TypeScript
91 lines
3.3 KiB
TypeScript
import { renderToString } from 'preact-render-to-string';
|
|
|
|
import denoConfig from '/deno.json' with { type: 'json' };
|
|
import { RequestHandlerParams } from '/lib/page.ts';
|
|
import { AppConfig } from '/lib/config.ts';
|
|
import { escapeHtml, html } from '/public/ts/utils/misc.ts';
|
|
|
|
import Header from '/components/Header.tsx';
|
|
|
|
interface BasicLayoutOptions
|
|
extends Pick<RequestHandlerParams, 'user' | 'session' | 'request' | 'match' | 'isRunningLocally'> {
|
|
currentPath: string;
|
|
titlePrefix: string;
|
|
description?: string;
|
|
}
|
|
|
|
async function basicLayout(
|
|
htmlContent: string,
|
|
{ currentPath, titlePrefix, description, user }: BasicLayoutOptions,
|
|
) {
|
|
const config = await AppConfig.getConfig();
|
|
|
|
const defaultTitle = config.visuals.title || 'bewCloud is a modern and simpler alternative to Nextcloud and ownCloud';
|
|
const defaultDescription = config.visuals.description || `Have your files under your own control.`;
|
|
const enabledApps = config.core.enabledApps;
|
|
|
|
let title = defaultTitle;
|
|
|
|
if (titlePrefix) {
|
|
title = `${titlePrefix} - bewCloud`;
|
|
}
|
|
|
|
const headerReactNode = <Header route={currentPath} user={user} enabledApps={enabledApps} />;
|
|
|
|
const headerHtml = renderToString(headerReactNode);
|
|
|
|
return html`
|
|
<!DOCTYPE html>
|
|
<html lang="en" dir="ltr" class="h-full bg-slate-800">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>${escapeHtml(title)}</title>
|
|
<meta name="description" content="${escapeHtml(description || defaultDescription)}">
|
|
<meta name="author" content="Bruno Bernardino">
|
|
<meta property="og:title" content="${escapeHtml(defaultTitle)}" />
|
|
<link rel="icon" href="/public/images/favicon-dark.png" type="image/png" />
|
|
<link rel="apple-touch-icon" href="/public/images/favicon-dark.png" />
|
|
<link rel="manifest" href="/public/manifest.json" />
|
|
<link rel="stylesheet" href="/public/scss/style.scss" />
|
|
<link rel="stylesheet" href="/public/css/tailwind.css" />
|
|
</head>
|
|
|
|
<script type="importmap">
|
|
${JSON.stringify(importMap)}
|
|
</script>
|
|
|
|
<body class="h-full">
|
|
${headerHtml} ${htmlContent}
|
|
</body>
|
|
</html>
|
|
`;
|
|
}
|
|
|
|
const importMap = denoConfig.frontendImports.reduce(
|
|
(importsObject: { imports: Record<string, string> }, importName: string) => {
|
|
const url = new URL(denoConfig.imports[importName as keyof typeof denoConfig.imports]).toString();
|
|
let fileName = url.replace('https://esm.sh/', '').split('?')[0].trim();
|
|
if (!fileName.endsWith('.mjs')) {
|
|
fileName = `${fileName}.mjs`;
|
|
}
|
|
importsObject.imports[importName] = `/public/js/${fileName}`;
|
|
return importsObject;
|
|
},
|
|
{ imports: {} },
|
|
);
|
|
|
|
export async function basicLayoutResponse(htmlContent: string, options: BasicLayoutOptions) {
|
|
const headers: HeadersInit = {
|
|
'content-type': 'text/html; charset=utf-8',
|
|
'content-security-policy':
|
|
`default-src 'self'; child-src 'none'; img-src 'self' data:; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline'`,
|
|
'x-frame-options': 'DENY',
|
|
'x-content-type-options': 'nosniff',
|
|
'strict-transport-security': 'max-age=31536000; includeSubDomains; preload',
|
|
};
|
|
|
|
return new Response(await basicLayout(htmlContent, options), {
|
|
headers,
|
|
});
|
|
}
|