@torpor/build 0.2.0 → 0.3.1

package/src/response/permanentRedirect.ts

@@ -0,0 +1,30 @@
+import transfer from "./transfer";
+
+/**
+ * 308 Permanent Redirect
+ *
+ * The HTTP 308 Permanent Redirect redirection response status code indicates
+ * that the requested resource has been permanently moved to the URL given by
+ * the Location header.
+ *
+ * A browser receiving this status will automatically request the resource at
+ * the URL in the Location header, redirecting the user to the new page. Search
+ * engines receiving this response will attribute links to the original URL to
+ * the redirected resource, passing the SEO ranking to the new URL.
+ *
+ * The request method and the body will not be modified by the client in the
+ * redirected request. A 301 Moved Permanently requires the request method and
+ * the body to remain unchanged when redirection is performed, but this is
+ * incorrectly handled by older clients to use the GET method instead.
+ *
+ * > Note: Some Web applications may use the 308 Permanent Redirect in a
+ * > non-standard way and for different purposes. For example, Google Drive uses
+ * > a 308 Resume Incomplete response to indicate to the client when an
+ * > unfinished upload has stalled. See Perform a resumable download on the
+ * > Google Drive documentation for more information.
+ *
+ * See https://developer.mozilla.org/en-US/docs/Web/HTTP/Reference/Status/308
+ */
+export default function permanentRedirect(location: string): Response {
+	return transfer(308, location);
+}

package/src/response/seeOther.ts

@@ -3,10 +3,16 @@ import transfer from "./transfer";
 /**
  * 303 See Other
  *
- * The server sent this response to direct the client to get the requested
- * resource at another URI with a GET request.
+ * The HTTP 303 See Other redirection response status code indicates that the
+ * browser should redirect to the URL in the Location header instead of
+ * rendering the requested resource.
  *
- * See https://developer.mozilla.org/en-US/docs/Web/HTTP/Status/303
+ * This response code is often sent back as a result of PUT or POST methods so
+ * the client may retrieve a confirmation, or view a representation of a
+ * real-world object (see HTTP range-14). The method to retrieve the redirected
+ * resource is always GET.
+ *
+ * See https://developer.mozilla.org/en-US/docs/Web/HTTP/Reference/Status/303
  */
 export default function seeOther(location: string): Response {
 	return transfer(303, location);

package/src/response/serverError.ts

@@ -3,9 +3,21 @@ import response from "./response";
 /**
  * 500 Server Error
  *
- * The server has encountered a situation it does not know how to handle.
+ * The HTTP 500 Internal Server Error server error response status code
+ * indicates that the server encountered an unexpected condition that prevented
+ * it from fulfilling the request. This error is a generic "catch-all" response
+ * to server issues, indicating that the server cannot find a more appropriate
+ * 5XX error to respond with.
  *
- * See https://developer.mozilla.org/en-US/docs/Web/HTTP/Status/500
+ * If you're a visitor seeing 500 errors on a web page, these issues require
+ * investigation by server owners or administrators. There are many possible
+ * causes of 500 errors, including: improper server configuration, out-of-memory
+ * (OOM) issues, unhandled exceptions, improper file permissions, or other
+ * complex factors. Server administrators may proactively log occurrences of
+ * server error responses, like the 500 status code, with details about the
+ * initiating requests to improve the stability of a service in the future.
+ *
+ * See https://developer.mozilla.org/en-US/docs/Web/HTTP/Reference/Status/500
  */
 export default function serverError(body?: object | string): Response {
 	return response(500, body ?? "Server error");

package/src/response/temporaryRedirect.ts

@@ -0,0 +1,31 @@
+import transfer from "./transfer";
+
+/**
+ * 307 Temporary Redirect
+ *
+ * The HTTP 307 Temporary Redirect redirection response status code indicates
+ * that the resource requested has been temporarily moved to the URL in the
+ * Location header.
+ *
+ * A browser receiving this status will automatically request the resource at
+ * the URL in the Location header, redirecting the user to the new page. Search
+ * engines receiving this response will not attribute links to the original URL
+ * to the new resource, meaning no SEO value is transferred to the new URL.
+ *
+ * The method and the body of the original request are reused to perform the
+ * redirected request. In the cases where you want the request method to be
+ * changed to GET, use 303 See Other instead. This is useful when you want to
+ * give an answer to a successful PUT request that is not the uploaded resource,
+ * but a status monitor or confirmation message like "You have successfully
+ * uploaded XYZ".
+ *
+ * The difference between 307 and 302 is that 307 guarantees that the client
+ * will not change the request method and body when the redirected request is
+ * made. With 302, older clients incorrectly changed the method to GET. 307 and
+ * 302 responses are identical when the request method is GET.
+ *
+ * See https://developer.mozilla.org/en-US/docs/Web/HTTP/Reference/Status/307
+ */
+export default function temporaryRedirect(location: string): Response {
+	return transfer(307, location);
+}

package/src/response/unauthorized.ts

@@ -3,11 +3,18 @@ import response from "./response";
 /**
  * 401 Unauthorized
  *
- * Although the HTTP standard specifies "unauthorized", semantically this
- * response means "unauthenticated". That is, the client must authenticate
- * itself to get the requested response.
+ * The HTTP 401 Unauthorized client error response status code indicates that a
+ * request was not successful because it lacks valid authentication credentials
+ * for the requested resource. This status code is sent with an HTTP
+ * WWW-Authenticate response header that contains information on the
+ * authentication scheme the server expects the client to include to make the
+ * request successfully.
  *
- * See https://developer.mozilla.org/en-US/docs/Web/HTTP/Status/401
+ * A 401 Unauthorized is similar to the 403 Forbidden response, except that a
+ * 403 is returned when a request contains valid credentials, but the client
+ * does not have permissions to perform a certain action.
+ *
+ * See https://developer.mozilla.org/en-US/docs/Web/HTTP/Reference/Status/401
  */
 export default function unauthorized(body?: object | string): Response {
 	return response(401, body ?? "Unauthorized");

package/src/response/unprocessable.ts

@@ -3,9 +3,15 @@ import response from "./response";
 /**
  * 422 Unprocessable Content
  *
- * The request was well-formed but was unable to be followed due to semantic errors.
+ * The HTTP 422 Unprocessable Content client error response status code
+ * indicates that the server understood the content type of the request content,
+ * and the syntax of the request content was correct, but it was unable to
+ * process the contained instructions.
  *
- * See https://developer.mozilla.org/en-US/docs/Web/HTTP/Status/422
+ * Clients that receive a 422 response should expect that repeating the request
+ * without modification will fail with the same error.
+ *
+ * See https://developer.mozilla.org/en-US/docs/Web/HTTP/Reference/Status/422
  */
 export default function unprocessable(body?: object | string): Response {
 	return response(422, body ?? "Unprocessable");

package/src/response.ts

@@ -1,15 +1,17 @@
 import badRequest from "./response/badRequest";
 import created from "./response/created";
 import forbidden from "./response/forbidden";
+import found from "./response/found";
 import methodNotAllowed from "./response/methodNotAllowed";
-import moved from "./response/moved";
+import movedPermanently from "./response/movedPermanently";
 import notFound from "./response/notFound";
 import notModified from "./response/notModified";
 import ok from "./response/ok";
-import redirect from "./response/redirect";
+import permanentRedirect from "./response/permanentRedirect";
 import response from "./response/response";
 import seeOther from "./response/seeOther";
 import serverError from "./response/serverError";
+import temporaryRedirect from "./response/temporaryRedirect";
 import transfer from "./response/transfer";
 import unauthorized from "./response/unauthorized";
 import unprocessable from "./response/unprocessable";
@@ -19,10 +21,12 @@ export {
 	ok,
 	created,
 	transfer,
+	movedPermanently,
+	found,
 	seeOther,
 	notModified,
-	redirect,
-	moved,
+	temporaryRedirect,
+	permanentRedirect,
 	badRequest,
 	unauthorized,
 	forbidden,

package/src/{site → run}/prepareTemplate.ts

@@ -11,7 +11,7 @@ export default function prepareTemplate(template: string, clientScript: string):
 
 	// Put %COMPONENT_BODY% inside <div id="app"></div>
 	// This is where the component's HTML will go
-	let bodyStart = regexIndexOf(result, /\<div\s+id=("app"|'app'|app)\s+/);
+	let bodyStart = regexIndexOf(result, /<div\s+id=("app"|'app'|app)\s+/);
 	bodyStart = result.indexOf(">", bodyStart) + 1;
 	let bodyEnd = result.indexOf("</div>", bodyStart);
 	if (bodyStart === -1 || bodyEnd === -1) {

package/src/{site → run}/run.ts

@@ -1,7 +1,7 @@
 import fs from "node:fs";
 import path from "node:path";
 import { transformWithEsbuild } from "vite";
-import Site from "./Site";
+import Site from "../site/Site";
 import runBuild from "./runBuild";
 import runDev from "./runDev";
 import runPreview from "./runPreview";

package/src/{site → run}/runBuild.ts

@@ -2,8 +2,8 @@ import torpor from "@torpor/unplugin/vite";
 import { existsSync, promises as fs } from "node:fs";
 import path from "node:path";
 import { build, defineConfig } from "vite";
-import Site from "./Site.ts";
-import manifest from "./manifest.ts";
+import Site from "../site/Site";
+import manifest from "../site/manifest.ts";
 
 // TODO: Don't cache index.html in dev?
 // TODO: Multiple hook.server locations

package/src/{site → run}/runDev.ts

@@ -7,8 +7,8 @@ import { createServer as createViteServer } from "vite";
 import { serverError } from "../response.ts";
 import Server from "../server/Server.ts";
 import connectMiddleware from "../server/connect/connectMiddleware.ts";
-import Site from "./Site.ts";
-import manifest from "./manifest.ts";
+import Site from "../site/Site.ts";
+import manifest from "../site/manifest.ts";
 import prepareTemplate from "./prepareTemplate.ts";
 
 export default async function runDev(site: Site): Promise<void> {

package/src/{site → run}/runPreview.ts

@@ -4,7 +4,7 @@ import path from "node:path";
 import { serverError } from "../response.ts";
 import Server from "../server/Server.ts";
 import contentType from "../server/contentType.ts";
-import Site from "./Site";
+import Site from "../site/Site";
 import prepareTemplate from "./prepareTemplate.ts";
 import runBuild from "./runBuild";
 

package/src/run.ts

@@ -1,6 +1,6 @@
-import run from "./site/run";
-import runBuild from "./site/runBuild";
-import runDev from "./site/runDev";
-import runPreview from "./site/runPreview";
+import run from "./run/run";
+import runBuild from "./run/runBuild";
+import runDev from "./run/runDev";
+import runPreview from "./run/runPreview";
 
 export { run, runDev, runBuild, runPreview };

package/src/server/Routerx.ts

@@ -1,4 +1,4 @@
-import pathToRegex from "../site/pathToRegex";
+import pathToRegex from "../utils/pathToRegex";
 import type HttpMethod from "./types/HttpMethod";
 import type MiddlewareFunction from "./types/MiddlewareFunction";
 import type ServerFunction from "./types/ServerFunction";
@@ -66,7 +66,7 @@ class MiddlewareHandler {
 	}
 }
 
-type Match = {
+interface Match {
 	fn: ServerFunction;
 	params?: Record<string, string>;
-};
+}

package/src/server/Server.ts

@@ -1,4 +1,4 @@
-import pathToRegex from "../site/pathToRegex";
+import pathToRegex from "../utils/pathToRegex";
 import ServerEvent from "./ServerEvent";
 import type MiddlewareFunction from "./types/MiddlewareFunction";
 import type ServerFunction from "./types/ServerFunction";
@@ -138,7 +138,7 @@ class RouteHandler {
 //	}
 //}
 
-type Match = {
+interface Match {
 	fn: ServerFunction;
 	params?: Record<string, string>;
-};
+}

package/src/server/connect/connectMiddleware.ts

@@ -38,6 +38,7 @@ export default function connectMiddleware(
 
 			const cnext = async (error?: unknown) => {
 				if (error) {
+					// eslint-disable-next-line no-base-to-string
 					reject(error instanceof Error ? error : new Error(String(error)));
 				} else {
 					// TODO: Can we nest the next functions less? This is a bit weird
@@ -53,7 +54,7 @@ export default function connectMiddleware(
 					resolve();
 				}
 			} catch (e) {
-				cnext(e);
+				await cnext(e);
 			}
 		});
 	};

package/src/server/connect/nodeMessageToNodeResponse.ts

@@ -81,9 +81,9 @@ export default function nodeMessageToNodeResponse(
 	};
 }
 
-type ServerResponseResponse = {
+interface ServerResponseResponse {
 	res: ServerResponse;
 	onReadable: (
 		cb: (result: { readable: Readable; headers: OutgoingHttpHeaders; status: number }) => void,
 	) => void;
-};
+}

package/src/site/Router.ts

@@ -1,7 +1,7 @@
 import type LayoutHandler from "../types/LayoutHandler";
 import type ManifestRoute from "../types/ManifestRoute";
 import type RouteHandler from "../types/RouteHandler";
-import pathToRegex from "./pathToRegex";
+import pathToRegex from "../utils/pathToRegex";
 
 /**
  * A router that handles file routes with layouts, hooks, etc.
@@ -158,8 +158,8 @@ class Route {
 	}
 }
 
-type Match = {
+interface Match {
 	handler: RouteHandler;
 	params?: Record<string, string>;
 	query: URLSearchParams;
-};
+}

package/src/site/clientEntry.ts

@@ -1,32 +1,21 @@
 import manifest from "@torpor/build/manifest";
-// @ts-ignore This errors in the Cloudflare build?
-import { $page } from "@torpor/build/state";
-import { clearLayoutSlot, fillLayoutSlot, hydrate } from "@torpor/view";
-import { type Component, type SlotRender } from "@torpor/view";
-import { mount } from "@torpor/view";
-import type PageEndPoint from "../types/PageEndPoint.ts";
-import type PageServerEndPoint from "../types/PageServerEndPoint.ts";
-import type RouteHandler from "../types/RouteHandler.ts";
+import loadData from "../nav/loadData.ts";
+import navigate from "../nav/navigate.ts";
+import $page from "../state/$page.ts";
+import client from "../state/client";
+import type LayoutPath from "../types/LayoutPath";
+import type PageEndPoint from "../types/PageEndPoint";
+import type PageServerEndPoint from "../types/PageServerEndPoint";
 import Router from "./Router.ts";
 
 // Build the router from the Site object created by the user
 const router = new Router();
 router.addPages(manifest.routes);
 
-// Store the current layout stack, so that we can re-use parts of it as necessary
-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 */
-	slotRange: any;
-}
-let layoutStack: LayoutPath[] = [];
-
-// TODO: Probably expire after 30 seconds or something?
-let prefetchedData: Record<string, any> = {};
+// Put it in client state so that it can be accessed from navigate. We can't
+// just import it to navigate because that gets built by tsdown, without Vite
+// and the manifest
+client.router = router;
 
 // Intercept clicks on links
 window.addEventListener("click", async (e) => {
@@ -108,254 +97,12 @@ window.addEventListener("popstate", async () => {
 });
 
 // Do the initial navigation and hydration
-navigateToLocation(document.location, true);
+await navigateToLocation(document.location, true);
 
 async function navigateToLocation(location: Location, firstTime = false) {
-	return await navigate(new URL(location.toString()), firstTime);
-}
-
-async function navigate(url: URL, firstTime = false): Promise<boolean> {
-	let parent = document.getElementById("app");
-	if (!parent) {
-		// TODO: 500
-		console.log("500");
-		return false;
-	}
-
-	const path = url.pathname;
-	const query = url.searchParams;
-
-	console.log(`navigating to '${path}'${query.size ? ` with ${query}` : ""}`);
-
-	const route = router.match(path, query);
-	if (!route) {
-		// TODO: 404
-		console.log("404");
-		return false;
-	}
-
-	// Update $page before building the components
-	$page.url = url;
-	if (path.endsWith("/_error")) {
-		$page.status = parseInt(query.get("status") ?? "404");
-		$page.error.message = query.get("message") ?? "";
-		// Make it look a bit classier by removing the query
-		window.history.replaceState({}, "", url.toString().split("?")[0]);
-	} else {
-		$page.status = 200;
-	}
-
-	const handler = route.handler;
-	const params = route.params || {};
-
-	// There must be a client endpoint with a component
-	const clientEndPoint: PageEndPoint | undefined = (await handler.endPoint()).default;
-	if (!clientEndPoint?.component) {
-		// TODO: 404
-		console.log("404");
-		return false;
-	}
-
-	// There may be a server endpoint
-	const serverEndPoint: PageServerEndPoint | undefined =
-		handler.serverEndPoint && (await handler.serverEndPoint())?.default;
-
-	let newLayoutStack: LayoutPath[] = [];
-
-	// Pass the data into $props
-	// TODO: Don't load if this is the first time -- it should have been passed to us, somehow...
-	const data = await loadData(
-		handler,
-		params,
-		path,
-		newLayoutStack,
-		clientEndPoint,
-		serverEndPoint,
-	);
-	const $props: Record<string, any> = { data };
-
-	layoutStack.push({ path: route.handler.path, data: {}, reuse: false, slotRange: null });
-	layoutStack = newLayoutStack;
-
-	// If there are layouts, work our way upwards, pushing each component into
-	// the default slot of its parent
-	// TODO: There's probably a nicer way to do this with reducers or something
-	let component = clientEndPoint.component as Component;
-	let slots: Record<string, SlotRender> | undefined = undefined;
-	if (handler.layouts) {
-		let slotFunctions: SlotRender[] = [];
-		// The last slot function will render the client component
-		slotFunctions[handler.layouts.length] = function clientComponent(parent, anchor, _, $context) {
-			let i = layoutStack.length - 1;
-			layoutStack[i].slotRange = fillLayoutSlot(
-				clientEndPoint.component!,
-				slotFunctions[i + 1],
-				parent,
-				anchor,
-				$props,
-				$context,
-			);
-		};
-
-		// Each earlier slot function will render a layout
-		for (let i = handler.layouts.length - 1; i >= 0; i--) {
-			const layoutEndPoint: PageEndPoint | undefined = (await handler.layouts[i].endPoint())
-				?.default;
-			if (layoutEndPoint?.component) {
-				if (layoutStack[i].reuse) {
-					// Set the parent to add the new content to (from the old
-					// content), clear the range under this point, and set the
-					// component to the slot function within this layout
-					parent = layoutStack[i].slotRange.startNode.parentNode as HTMLElement;
-					clearLayoutSlot(layoutStack[i].slotRange);
-					component = slotFunctions[i + 1];
-					break;
-				} else if (i === 0) {
-					component = layoutEndPoint.component as Component;
-					slots = { _: slotFunctions[i + 1] };
-				} else {
-					slotFunctions[i] = function layoutComponent(parent, anchor, _, $context) {
-						layoutStack[i - 1].slotRange = fillLayoutSlot(
-							layoutEndPoint.component!,
-							slotFunctions[i + 1],
-							parent,
-							anchor,
-							$props,
-							$context,
-						);
-					};
-				}
-			}
-		}
-	}
-
-	if (firstTime) {
-		hydrate(parent, component, $props, slots);
-	} else {
-		try {
-			mount(parent, component, $props, slots);
-		} catch (error) {
-			// TODO: Show a proper Error component
-			parent.innerHTML = '<span style="color: red">Script syntax error</span><p>' + error + "</p>";
-			console.log(error);
-		}
-	}
-
-	// Reset prefetched data on each navigation
-	prefetchedData = {};
-
-	return true;
-}
+	// Reset $page on submit and link navigation
+	// TODO: Should we put data in $page.data??
+	$page.form = undefined;
 
-async function loadData(
-	handler: RouteHandler,
-	params: Record<string, string>,
-	path: string,
-	newLayoutStack: LayoutPath[],
-	clientEndPoint: PageEndPoint | undefined,
-	serverEndPoint: PageServerEndPoint | undefined,
-	prefetch = false,
-) {
-	let data = {};
-	if (handler.layouts) {
-		for (let [i, layout] of handler.layouts.entries()) {
-			let layoutPath = layout.path;
-			for (let key in params) {
-				layoutPath = layoutPath.replace(`[${key}]`, params[key]);
-			}
-			if (layoutStack.at(i)?.path === layoutPath) {
-				// We've already loaded this layout, we can just re-use its data and UI
-				if (!prefetch) {
-					layoutStack[i].reuse = true;
-				}
-				newLayoutStack[i] = layoutStack[i];
-				Object.assign(data, layoutStack[i].data);
-			} else {
-				const stackLayout = { path: layoutPath, data: {}, reuse: false, slotRange: null };
-				const layoutEndPoint: PageEndPoint | undefined = (await layout.endPoint())?.default;
-				const layoutServerEndPoint: PageServerEndPoint | undefined =
-					layout.serverEndPoint && (await layout.serverEndPoint())?.default;
-				const layoutResponse = await loadClientAndServerData(
-					stackLayout.data,
-					document.location.origin + layoutPath,
-					params,
-					layoutEndPoint,
-					layoutServerEndPoint,
-				);
-				if (layoutResponse?.ok === false) {
-					return false;
-				}
-				Object.assign(data, stackLayout.data);
-				newLayoutStack.push(stackLayout);
-			}
-		}
-	}
-	let endPointResponse = await loadClientAndServerData(
-		data,
-		document.location.origin + path,
-		params,
-		clientEndPoint,
-		serverEndPoint,
-	);
-	if (endPointResponse?.ok === false) {
-		return false;
-	}
-	return data;
-}
-
-async function loadClientAndServerData(
-	data: Record<string, any>,
-	location: string,
-	params: Record<string, string>,
-	clientEndPoint?: PageEndPoint,
-	serverEndPoint?: PageServerEndPoint,
-): Promise<Response | undefined | void> {
-	if (clientEndPoint?.load) {
-		if (prefetchedData[location]) {
-			Object.assign(data, prefetchedData[location]);
-		} else {
-			const clientUrl = new URL(document.location.href);
-			const clientParams = buildClientParams(clientUrl, params, data);
-			const clientResponse = await clientEndPoint.load(clientParams);
-			if (clientResponse) {
-				if (clientResponse.ok) {
-					if (clientResponse.headers.get("Content-Type")?.includes("application/json")) {
-						const clientData = await clientResponse.json();
-						Object.assign(data, clientData);
-						prefetchedData[location] = clientData;
-					}
-				} else {
-					return clientResponse;
-				}
-			}
-		}
-	}
-	if (serverEndPoint?.load) {
-		const serverUrl = location.replace(/\/$/, "") + "/~server";
-
-		if (prefetchedData[serverUrl]) {
-			Object.assign(data, prefetchedData[serverUrl]);
-		} else {
-			const serverResponse = await fetch(serverUrl);
-			if (serverResponse) {
-				if (serverResponse.ok) {
-					if (serverResponse.headers.get("Content-Type")?.includes("application/json")) {
-						const serverData = await serverResponse.json();
-						Object.assign(data, serverData);
-						prefetchedData[serverUrl] = serverData;
-					}
-				} else {
-					return serverResponse;
-				}
-			}
-		}
-	}
-}
-
-function buildClientParams(url: URL, params: Record<string, string>, data: Record<string, any>) {
-	return {
-		url,
-		params,
-		data,
-	};
+	return await navigate(new URL(location.toString()), firstTime);
 }

package/src/site/defaultAdapter.ts

@@ -1,4 +1,4 @@
-import Adapter from "../types/Adapter";
+import type Adapter from "../types/Adapter";
 
 // TODO: This should be an adapter-auto package that conditionally loads other packages...