@torpor/build 0.4.10 → 0.4.12

package/src/test/runTest.ts

@@ -0,0 +1,350 @@
+import { type ServerComponent, type ServerSlotRender } from "@torpor/view/ssr";
+import path from "node:path";
+import notFound from "../response/notFound.ts";
+import ok from "../response/ok.ts";
+import seeOther from "../response/seeOther.ts";
+import ServerEvent from "../server/ServerEvent.ts";
+import Router from "../site/Router.ts";
+import Site from "../site/Site";
+import $page from "../state/$page.ts";
+import type PageEndPoint from "../types/PageEndPoint.ts";
+import type PageServerEndPoint from "../types/PageServerEndPoint.ts";
+import type RouteHandler from "../types/RouteHandler.ts";
+import {
+	HOOK_ROUTE,
+	HOOK_SERVER_ROUTE,
+	LAYOUT_ROUTE,
+	LAYOUT_SERVER_ROUTE,
+	PAGE_ROUTE,
+	PAGE_SERVER_ROUTE,
+	SERVER_ROUTE,
+} from "../types/RouteType";
+import type ServerEndPoint from "../types/ServerEndPoint.ts";
+import type ServerHook from "../types/ServerHook.ts";
+import type ServerLoadEvent from "../types/ServerLoadEvent.ts";
+
+/**
+ * Runs a site route in test mode
+ * @param site The site configuration, with routing configured
+ * @param route The route path e.g. `/home`
+ * @param ev An optional ServerEvent, which you can use to set test cookies and headers
+ * @returns An HTTP response containing the requested data, HTML, or error status
+ */
+export default async function runTest(
+	site: Site,
+	route: string,
+	ev?: ServerEvent,
+): Promise<Response> {
+	if (!route.startsWith("/")) route += "/";
+	if (!ev) {
+		const req = new Request(`http://localhost${route}`);
+		ev = new ServerEvent(req);
+	}
+
+	// Build the router from the Site object created by the user
+	const router = new Router();
+	router.addPages(
+		site.routes.map((r) => ({
+			path: r.path,
+			type: r.type,
+			endPoint: () => import(/* @vite-ignore */ path.join(site.root, r.file)),
+			subFolder: r.subFolder,
+		})),
+	);
+
+	return await load(router, ev, "%COMPONENT_BODY%");
+}
+
+// HACK: This is a copy of serverEntry
+// TODO: Make it shared instead!
+async function load(router: Router, ev: ServerEvent, template: string): Promise<Response> {
+	//const url = new URL(`http://${process.env.HOST ?? "localhost"}${ev.request.url}`);
+	const url = new URL(ev.request.url);
+	const path = url.pathname;
+	const query = url.searchParams;
+
+	//console.log(`handling ${ev.request.method} for '${path}'${query.size ? ` with ${query}` : ""}`);
+
+	const route = router.match(path, query);
+	if (!route) {
+		return notFound();
+	}
+
+	// Update $page before building the components
+	// TODO: Find somewhere better to put this
+	$page.url = url;
+
+	const handler = route.handler;
+	const params = route.params || {};
+
+	// TODO: Hit the server hook out here
+	// We could maybe set data loading up as middleware on a route??????
+
+	switch (handler.type) {
+		case PAGE_ROUTE:
+		case LAYOUT_ROUTE: {
+			// It's a /+page.ts or /_layout.ts endpoint
+			if (ev.request.method === "GET") {
+				return await loadView(ev, url, handler, params, template);
+			} else if (ev.request.method === "POST") {
+				return await runAction(ev, url, handler, params, query);
+			}
+			break;
+		}
+		case PAGE_SERVER_ROUTE:
+		case LAYOUT_SERVER_ROUTE: {
+			// It's a /+page.server.ts or /_layout.server.ts endpoint
+			if (ev.request.method === "GET") {
+				return await loadData(ev, url, handler, "load", params);
+			}
+			break;
+		}
+		case SERVER_ROUTE: {
+			// It's a /+server.ts endpoint
+			const functionName = ev.request.method.toLowerCase().replace("delete", "del");
+			return await loadData(ev, url, handler, functionName, params);
+		}
+		case HOOK_ROUTE:
+		case HOOK_SERVER_ROUTE: {
+			break;
+		}
+	}
+
+	return notFound();
+}
+
+async function loadData(
+	ev: ServerEvent,
+	url: URL,
+	handler: RouteHandler,
+	functionName: string,
+	params: Record<string, string>,
+) {
+	const serverEndPoint: ServerEndPoint | undefined = (await handler.endPoint()).default;
+	if (serverEndPoint && serverEndPoint[functionName]) {
+		const serverParams = buildServerParams(ev, url, params);
+
+		if (handler.serverHook) {
+			const serverHook: ServerHook | undefined = (await handler.serverHook()).default;
+			if (serverHook?.handle) {
+				await serverHook.handle(serverParams);
+			}
+		}
+
+		const result = await serverEndPoint[functionName](serverParams);
+
+		// If there was no response returned from load (such as errors or a
+		// redirect), send an ok response
+		return result || ok();
+	}
+
+	return notFound();
+}
+
+async function loadView(
+	ev: ServerEvent,
+	url: URL,
+	handler: RouteHandler,
+	params: Record<string, string>,
+	template: string,
+) {
+	// There must be a client endpoint with a component
+	const clientEndPoint: PageEndPoint | undefined = (await handler.endPoint()).default;
+	if (!clientEndPoint?.component) {
+		return notFound();
+	}
+
+	// There may be a server endpoint
+	const serverEndPoint: PageServerEndPoint | undefined =
+		handler.serverEndPoint && (await handler.serverEndPoint())?.default;
+
+	// Maybe hit the server hook
+	const serverParams = buildServerParams(ev, url, params);
+	if (handler.serverHook) {
+		const serverHook: ServerHook | undefined = (await handler.serverHook()).default;
+		if (serverHook?.handle) {
+			await serverHook.handle(serverParams);
+		}
+	}
+
+	// Pass the data into $props
+	// TODO: Promise.all
+	// NOTE: We're loading data from top to bottom, overriding as we go, and I'm not sure if this is the best way to go
+	let data = {};
+	if (handler.layouts) {
+		for (let layout of handler.layouts) {
+			const layoutEndPoint: PageEndPoint | undefined = (await layout.endPoint())?.default;
+			const layoutServerEndPoint: PageServerEndPoint | undefined =
+				layout.serverEndPoint && (await layout.serverEndPoint())?.default;
+			const layoutResponse = await loadClientAndServerData(
+				url,
+				params,
+				serverParams,
+				data,
+				layoutEndPoint,
+				layoutServerEndPoint,
+			);
+			if (layoutResponse?.ok === false) {
+				return layoutResponse;
+			}
+		}
+	}
+	let endPointResponse = await loadClientAndServerData(
+		url,
+		params,
+		serverParams,
+		data,
+		clientEndPoint,
+		serverEndPoint,
+	);
+	if (endPointResponse?.ok === false) {
+		return endPointResponse;
+	}
+	let $props: Record<string, any> = { data };
+
+	let styles = "";
+
+	// If there are layouts, work our way upwards, pushing each component into
+	// the default slot of its parent
+	// TODO: Also handle layout server data
+	// TODO: There's probably a nicer way to do this with reducers or something
+	let component = clientEndPoint.component as ServerComponent;
+	let slots: Record<string, ServerSlotRender> | undefined = undefined;
+	if (handler.layouts) {
+		let slotFunctions: ServerSlotRender[] = [];
+		slotFunctions[handler.layouts.length] = (_, $context) => {
+			let { body, head } = (clientEndPoint.component as ServerComponent)($props, $context);
+			styles += head;
+			return body;
+		};
+		for (let i = handler.layouts.length - 1; i >= 0; i--) {
+			const layoutEndPoint: PageEndPoint | undefined = (await handler.layouts[i].endPoint())
+				?.default;
+			if (layoutEndPoint?.component) {
+				if (i === 0) {
+					component = layoutEndPoint.component as ServerComponent;
+					slots = { _: slotFunctions[i + 1] };
+				} else {
+					slotFunctions[i] = (_, $context) => {
+						let { body, head } = (layoutEndPoint.component as ServerComponent)($props, $context, {
+							_: slotFunctions[i + 1],
+						});
+						styles += head;
+						return body;
+					};
+				}
+			}
+		}
+	}
+
+	let html;
+	try {
+		let { body, head } = component($props, undefined, slots);
+		styles += head;
+		html = template.replace("%COMPONENT_BODY%", body).replace("%COMPONENT_HEAD", styles);
+	} catch (error) {
+		// TODO: Show a proper Error component
+		html = '<span style="color: red">Script syntax error</span><p>' + error + "</p>";
+		console.log(error);
+	}
+
+	return new Response(html, {
+		status: 200,
+		headers: {
+			"Content-Type": "text/html",
+		},
+	});
+}
+
+async function runAction(
+	ev: ServerEvent,
+	url: URL,
+	handler: RouteHandler,
+	params: Record<string, string>,
+	query: URLSearchParams,
+) {
+	const actionName = (Array.from(query.keys())[0] || "default").replace(/^\//, "");
+	const serverEndPoint: PageServerEndPoint | undefined =
+		handler.serverEndPoint && (await handler.serverEndPoint()).default;
+	if (serverEndPoint?.actions) {
+		const action = serverEndPoint.actions[actionName];
+		if (action) {
+			// TODO: form.errors etc
+			const serverParams = buildServerParams(ev, url, params);
+
+			if (handler.serverHook) {
+				const serverHook: ServerHook | undefined = (await handler.serverHook()).default;
+				if (serverHook?.handle) {
+					await serverHook.handle(serverParams);
+				}
+			}
+
+			const result = await action(serverParams); // <--
+
+			// If there was no response returned from the action (such as errors
+			// or a redirect), reload the page by redirecting
+			return result || seeOther(url.pathname);
+		}
+	}
+
+	return notFound();
+}
+
+async function loadClientAndServerData(
+	url: URL,
+	params: Record<string, string>,
+	serverParams: ServerLoadEvent,
+	data: Record<string, any>,
+	clientEndPoint?: PageEndPoint,
+	serverEndPoint?: PageServerEndPoint,
+) {
+	if (clientEndPoint?.load) {
+		const clientParams = buildClientParams(url, data, params);
+		const clientResponse = await clientEndPoint.load(clientParams);
+		if (clientResponse) {
+			if (clientResponse.ok) {
+				if (clientResponse.headers.get("Content-Type")?.includes("application/json")) {
+					Object.assign(data, await clientResponse.json());
+				}
+			} else {
+				return clientResponse;
+			}
+		}
+	}
+	if (serverEndPoint?.load) {
+		const serverResponse = await serverEndPoint.load(serverParams);
+		if (serverResponse) {
+			if (serverResponse.ok) {
+				if (serverResponse.headers.get("Content-Type")?.includes("application/json")) {
+					Object.assign(data, await serverResponse.json());
+				}
+			} else {
+				return serverResponse;
+			}
+		}
+	}
+}
+
+function buildClientParams(url: URL, params: Record<string, string>, data: Record<string, any>) {
+	return {
+		url,
+		params,
+		data,
+	};
+}
+
+function buildServerParams(
+	ev: ServerEvent,
+	url: URL,
+	params: Record<string, string>,
+): ServerLoadEvent {
+	return {
+		url,
+		params,
+		appData: {},
+		request: ev.request,
+		cookies: ev.cookies,
+		headers: ev.headers,
+		adapter: ev.adapter,
+	};
+}

package/src/test.ts

@@ -0,0 +1,3 @@
+import runTest from "./test/runTest";
+
+export { runTest };

package/src/types/Adapter.ts

@@ -0,0 +1,8 @@
+import Server from "../server/Server";
+import Site from "../site/Site";
+
+export default interface Adapter {
+	prebuild?: (site: Site) => Promise<void> | void;
+	postbuild?: (site: Site) => Promise<void> | void;
+	serve: (server: Server, site: Site) => void;
+}

package/src/types/ClientState.ts

@@ -0,0 +1,8 @@
+import Router from "../site/Router";
+import type LayoutPath from "./LayoutPath";
+
+export default interface ClientState {
+	router: Router;
+	layoutStack: LayoutPath[];
+	prefetchedData: Record<string, any>;
+}

package/src/types/InternalState.ts

@@ -0,0 +1,7 @@
+import type ClientState from "./ClientState";
+import type PageState from "./PageState";
+
+export default interface InternalState {
+	$page: PageState;
+	client: ClientState;
+}

package/src/types/LayoutHandler.ts

@@ -0,0 +1,5 @@
+export default interface LayoutHandler {
+	path: string;
+	endPoint: () => Promise<any>;
+	serverEndPoint?: () => Promise<any>;
+}

package/src/types/LayoutPath.ts

@@ -0,0 +1,10 @@
+// Store the current layout stack, so that we can re-use parts of it as necessary
+export default interface LayoutPath {
+	path: string;
+	/** Whether to re-use this layout */
+	reuse: boolean;
+	/** Data loaded from endpoints that should be re-used */
+	data: any;
+	/** The range of the UI in this layout's slot */
+	slotRegion: any;
+}

package/src/types/ManifestRoute.ts

@@ -0,0 +1,6 @@
+export default interface ManifestRoute {
+	path: string;
+	type: number;
+	endPoint: () => Promise<any>;
+	subFolder: string | undefined;
+}

package/src/types/PageEndPoint.ts

@@ -0,0 +1,39 @@
+import { type Component } from "@torpor/view";
+import type PageLoadEvent from "./PageLoadEvent";
+
+/**
+ * For +page.
+ */
+export default interface PageEndPoint {
+	/**
+	 * Builds the route path for the page in a type-safe manner.
+	 * TODO: Not sure this is actually the best way to do it...
+	 */
+	route?: (...args: any[]) => string;
+	/**
+	 * Loads data for the page.
+	 */
+	load?: (
+		event: PageLoadEvent,
+	) => Response | undefined | void | Promise<Response | undefined | void>;
+	/**
+	 * The component that is displayed for the page.
+	 */
+	component?: Component;
+	// TODO: Better typing
+	/**
+	 * The head element data for the page, which may include a <title> and <meta> elements.
+	 */
+	head?: HeadElement[] | ((event: PageLoadEvent) => HeadElement[]);
+}
+
+type HeadElement = TitleElement | MetaElement;
+
+interface TitleElement {
+	title: string;
+}
+
+interface MetaElement {
+	name: string;
+	content: string;
+}

package/src/types/PageLoadEvent.ts

@@ -0,0 +1,14 @@
+export default interface PageLoadEvent {
+	/**
+	 * The URL for the server function.
+	 */
+	url: URL;
+	/**
+	 * Route params from the URL and route path.
+	 */
+	params: Record<string, string>;
+	/**
+	 * Data that is (optionally) loaded from the load function and passed into the page as $props.data.
+	 */
+	data: Record<string, any>;
+}

package/src/types/PageServerAction.ts

@@ -0,0 +1,7 @@
+import type ServerLoadEvent from "./ServerLoadEvent";
+
+type PageServerAction = (
+	event: ServerLoadEvent,
+) => Response | undefined | void | Promise<Response | undefined | void>;
+
+export default PageServerAction;

package/src/types/PageServerEndPoint.ts

@@ -0,0 +1,16 @@
+import type PageServerAction from "./PageServerAction";
+import type PageServerLoad from "./PageServerLoad";
+
+/**
+ * For +page.server.
+ */
+export default interface PageServerEndPoint {
+	/**
+	 * Loads data from the server for a page.
+	 */
+	load?: PageServerLoad;
+	/**
+	 * A map of actions that can be performed on the server for a page, generally from a form submit.
+	 */
+	actions?: Record<string, PageServerAction>;
+}

package/src/types/PageServerLoad.ts

@@ -0,0 +1,7 @@
+import type ServerLoadEvent from "./ServerLoadEvent";
+
+type PageServerLoad = (
+	event: ServerLoadEvent,
+) => Response | undefined | void | Promise<Response | undefined | void>;
+
+export default PageServerLoad;

package/src/types/PageState.ts

@@ -0,0 +1,8 @@
+export default interface PageState {
+	status: number;
+	url: URL;
+	form?: Record<string, string | number>;
+	error?: {
+		message: string;
+	};
+}

package/src/types/Route.ts

@@ -0,0 +1,11 @@
+import { type RouteType } from "./RouteType";
+
+/**
+ * A route that is added to the Site.
+ */
+export default interface Route {
+	path: string;
+	file: string;
+	type: RouteType;
+	subFolder?: string;
+}

package/src/types/RouteHandler.ts

@@ -0,0 +1,16 @@
+import type RouteLayoutHandler from "./RouteLayoutHandler";
+
+/**
+ * A handler for a route in the Router.
+ */
+export default interface RouteHandler {
+	path: string;
+	type: number;
+	endPoint: () => Promise<any>;
+	subFolder?: string;
+
+	loaded?: boolean;
+	layouts?: RouteLayoutHandler[];
+	serverEndPoint?: () => Promise<any>;
+	serverHook?: () => Promise<any>;
+}

package/src/types/RouteLayoutHandler.ts

@@ -0,0 +1,5 @@
+export default interface RouteLayoutHandler {
+	path: string;
+	endPoint: () => Promise<any>;
+	serverEndPoint?: () => Promise<any>;
+}

package/src/types/RouteMatchResult.ts

@@ -0,0 +1,7 @@
+import type RouteHandler from "./RouteHandler";
+
+export default interface RouteMatchResult {
+	handler: RouteHandler;
+	params?: Record<string, string>;
+	query?: Record<string, string>;
+}

package/src/types/RouteType.ts

@@ -0,0 +1,19 @@
+export const PAGE_ROUTE = 0;
+export const PAGE_SERVER_ROUTE = 1;
+export const SERVER_ROUTE = 3;
+export const LAYOUT_ROUTE = 4;
+export const LAYOUT_SERVER_ROUTE = 5;
+export const HOOK_ROUTE = 6;
+export const HOOK_SERVER_ROUTE = 7;
+export const ERROR_ROUTE = 8;
+
+export type RouteType =
+	| typeof PAGE_ROUTE
+	| typeof PAGE_SERVER_ROUTE
+	| typeof SERVER_ROUTE
+	| typeof LAYOUT_ROUTE
+	| typeof LAYOUT_SERVER_ROUTE
+	| typeof HOOK_ROUTE
+	| typeof HOOK_SERVER_ROUTE
+	| typeof ERROR_ROUTE
+	| -1;

package/src/types/ServerEndPoint.ts

@@ -0,0 +1,37 @@
+import type ServerRequest from "./ServerRequest";
+
+/**
+ * For +server.
+ */
+type ServerEndPoint = { [key: string]: ServerRequest } & {
+	/**
+	 * Performs a GET.
+	 */
+	get?: ServerRequest;
+	/**
+	 * Performs a POST.
+	 */
+	post?: ServerRequest;
+	/**
+	 * Performs a PATCH.
+	 */
+	patch?: ServerRequest;
+	/**
+	 * Performs a PUT.
+	 */
+	put?: ServerRequest;
+	/**
+	 * Performs a DELETE.
+	 */
+	del?: ServerRequest;
+	/**
+	 * Performs an OPTIONS request.
+	 */
+	options?: ServerRequest;
+	/**
+	 * Performs a HEAD request.
+	 */
+	head?: ServerRequest;
+};
+
+export default ServerEndPoint;

package/src/types/ServerHook.ts

@@ -0,0 +1,11 @@
+import type ServerLoadEvent from "./ServerLoadEvent";
+
+/**
+ * For _hook.server.
+ */
+export default interface ServerHook {
+	/**
+	 * Called on each server request.
+	 */
+	handle?: (event: ServerLoadEvent) => Promise<void> | void;
+}

package/src/types/ServerLoadEvent.ts

@@ -0,0 +1,37 @@
+import CookieHelper from "../server/CookieHelper";
+import HeaderHelper from "../server/HeaderHelper";
+
+export default interface ServerLoadEvent {
+	/**
+	 * The URL for the server function.
+	 */
+	url: URL;
+	/**
+	 * Route params from the URL and route path.
+	 */
+	params: Record<string, string>;
+	// TODO: Maybe we should find a better name for the data that is set set in
+	// pages, and just call this data?
+	/**
+	 * Data that is available to functions in +server hooks, layouts, endpoints
+	 * and pages. It flows down in that order.
+	 */
+	appData: Record<string, any>;
+	/**
+	 * The server request.
+	 */
+	request: Request;
+	//response: ServerResponse;
+	/**
+	 * A helper for getting and setting cookie data.
+	 */
+	cookies: CookieHelper;
+	/**
+	 * A helper for getting and setting headers.
+	 */
+	headers: HeaderHelper;
+	/**
+	 * An optional adapter object, containing adapter-specific functionality.
+	 */
+	adapter: Record<PropertyKey, any>;
+}

package/src/types/ServerRequest.ts

@@ -0,0 +1,7 @@
+import type ServerLoadEvent from "./ServerLoadEvent";
+
+type ServerRequest = (
+	event: ServerLoadEvent,
+) => Response | undefined | void | Promise<Response | undefined | void>;
+
+export default ServerRequest;

package/src/utils/pathToRegex.ts

@@ -0,0 +1,15 @@
+export default function pathToRegex(path: string): RegExp {
+	const pattern =
+		path
+			.split("/")
+			// Replace `[slug]` with a grouped match so we can pull out params
+			.map((p) => {
+				return p.replace(/\[([^/]+?)\]/, "(?<$1>[^\\/]+?)");
+			})
+			.join("\\/")
+			// Replace globs with regex syntax
+			.replaceAll("*", ".*") +
+		// Ignore trailing slashes -- `/path` should be treated the same as `/path/`
+		"/*";
+	return new RegExp(`^${pattern}/*$`);
+}