@spirobel/mininext 0.6.1 → 0.7.1

package/dist/mininext.d.ts

@@ -1,5 +1,11 @@
 /// <reference types="bun-types" />
 /// <reference types="bun-types" />
+/// <reference types="bun-types" />
+/// <reference types="bun-types" />
+/// <reference types="bun-types" />
+/// <reference types="bun-types" />
+/// <reference types="bun-types" />
+/// <reference types="bun-types" />
 import { url, Mini, has, type HtmlHandler } from "./url";
 import { isError, HtmlString, BasedHtml, head, commonHead, cssReset, basedHtml as html } from "./html";
 import { type Server, type WebSocketHandler } from "bun";

package/dist/mininext.js

@@ -66,22 +66,35 @@ const nodeHttpsPlugin = {
     },
 };
 async function buildBackend(backendPath = "backend/backend.ts") {
-    global.FrontendScriptUrls = [];
-    global.FrontendScripts = [];
+    global.bundledFrontends = {};
     global.bundledSVGs = {};
     const i = await import(path.resolve(projectRoot(), backendPath));
     for (const frontend of url.getFrontends()) {
-        const firstPlaceToLook = path.resolve(path.dirname(frontend.callerPath), `frontend/${frontend.path}`);
-        const secondPlaceToLook = path.resolve(projectRoot(), `frontend/${frontend.path}`);
+        const firstPlaceToLook = path.resolve(path.dirname(frontend.callerPath), `frontend/${frontend.frontendFilePath}`);
+        const secondPlaceToLook = path.resolve(projectRoot(), `frontend/${frontend.frontendFilePath}`);
         const frontEndPath = (await Bun.file(firstPlaceToLook).exists())
             ? firstPlaceToLook
             : secondPlaceToLook;
         try {
-            const f = await $ `bun run build.ts frontend ${frontEndPath}`.json();
-            FrontendScriptUrls.push("/" + f.url);
-            FrontendScripts.push(f.script);
+            const frontendResult = await $ `bun run build.ts frontend ${frontEndPath}`.json();
+            bundledFrontends[`/${frontendResult.url}`] = {
+                frontendContent: frontendResult.script,
+                frontendFilePath: frontend.frontendFilePath,
+                position: frontend.position,
+            };
         }
         catch (error) {
+            if (error &&
+                typeof error === "object" &&
+                "exitCode" in error &&
+                "stdout" in error &&
+                "stderr" in error &&
+                error.stdout instanceof Buffer &&
+                error.stderr instanceof Buffer) {
+                console.error(`Failed with exit code: ${error.exitCode}`);
+                console.error("Standard Output:", error.stdout.toString());
+                console.error("Standard Error:", error.stderr.toString());
+            }
             console.log(await $ `bun run build.ts frontend ${frontEndPath}`.text());
         }
     }
@@ -98,6 +111,7 @@ async function buildBackend(backendPath = "backend/backend.ts") {
         bundledSVGs[svgUrl] = {
             svgContent: await svgContent.text(),
             svgFilePath: svg.svgFilePath,
+            position: svg.position,
             options: svg.options,
         };
     }
@@ -108,8 +122,7 @@ async function buildBackend(backendPath = "backend/backend.ts") {
         minify: Bun.argv[2] === "dev" ? false : true, //production
         target: "bun",
         define: {
-            FrontendScripts: JSON.stringify(FrontendScripts),
-            FrontendScriptUrls: JSON.stringify(FrontendScriptUrls),
+            bundledFrontends: JSON.stringify(bundledFrontends),
             bundledSVGs: JSON.stringify(bundledSVGs),
         },
     });

package/dist/url.d.ts

@@ -1,8 +1,22 @@
 /// <reference types="bun-types" />
 /// <reference types="bun-types" />
-import type { Server, WebSocketHandler } from "bun";
+/// <reference types="bun-types" />
+/// <reference types="bun-types" />
+/// <reference types="bun-types" />
+/// <reference types="bun-types" />
+/// <reference types="bun-types" />
+/// <reference types="bun-types" />
+import type { Server, WebSocketHandler, RouterTypes, BunRequest } from "bun";
 import { html, json, dangerjson, HtmlString } from "./html";
 import { BasedHtml, type DangerJsonInHtml, type JsonString, type JsonStringValues } from "./html";
+export type HTTPMethod = "GET" | "POST" | "PUT" | "DELETE" | "PATCH" | "HEAD" | "OPTIONS";
+export type MiniNextRouteHandlerObject<T extends string> = {
+    [K in HTTPMethod]?: HtmlHandler<unknown, T>;
+};
+export type MiniNextRouteValue<T extends string> = HtmlHandler<unknown, T> | MiniNextRouteHandlerObject<T>;
+export type BunRoutes<R extends {
+    [K in keyof R]: RouterTypes.RouteValue<Extract<K, string>>;
+}> = R;
 /**
  * A helper function that helps narrow unknown objects
  * @param object - the object of type unknown that is to be narrowed
@@ -43,13 +57,13 @@ export type NamedFormHandlerReturnType<X> = HandlerReturnType | Promise<HandlerR
  * const {html,json, css, data, req, form, link, svg, deliver, route, params, header, head } = mini  //pull everything out of the mini handbag
  * ```
  */
-export declare class Mini<X = unknown> {
+export declare class Mini<X = unknown, ROUTE extends string = ""> {
     html: typeof html<X>;
     css: typeof html<X>;
     json: typeof json<X>;
     dangerjson: typeof dangerjson<X>;
     data: X;
-    req: Request;
+    req: BunRequest<ROUTE>;
     head: (head: HtmlHandler | HtmlString) => undefined;
     headers: (headers: HeadersInit, overwrite?: boolean) => undefined;
     options: (options: ResponseInit) => undefined;
@@ -71,15 +85,19 @@ export declare class Mini<X = unknown> {
  * const {html,json, css, data, req, form, link, svg, deliver, route, params, header, head } = mini  //pull everything out of the mini handbag
  * ```
  */
-export type HtmlHandler<Y = unknown> = ((mini: Mini<Y>) => LazyHandlerReturnType) | (() => LazyHandlerReturnType);
+export type HtmlHandler<Y = unknown, ROUTE extends string = ""> = ((mini: Mini<Y, ROUTE>) => LazyHandlerReturnType) | (() => LazyHandlerReturnType);
 export type NamedFormHandler<Y = unknown, Z = undefined> = ((mini: Mini<Y>) => NamedFormHandlerReturnType<Z>) | (() => NamedFormHandlerReturnType<Z>);
 declare global {
-    var FrontendScripts: Array<string>;
-    var FrontendScriptUrls: Array<string>;
+    var bundledFrontends: Record<string, {
+        frontendFilePath: string;
+        frontendContent: string;
+        position: number;
+    }>;
     var bundledSVGs: Record<string, {
         svgContent: string;
         svgFilePath: string;
         options: ResponseInit;
+        position: number;
     }>;
 }
 export type ScriptTag = (...params: any[]) => Promise<HtmlString>;
@@ -89,6 +107,7 @@ interface LinkSettings {
 export declare class url {
     static websocket: WebSocketHandler | undefined;
     static server: Server;
+    static routes: BunRoutes<{}>;
     static direct_handlers_html: Map<string, HtmlHandler>;
     private static frontends;
     private static svgs;
@@ -106,22 +125,22 @@ export declare class url {
      * @param snippet this is handy to pass in a piece of html that often goes along with a certain frontend
      * @returns a html script element with the bundled frontend as the src
      */
-    static frontend<X>(path: string, snippet?: BasedHtml): HtmlString;
-    static frontend<X>(path: string, snippet?: HtmlHandler<X>): (mini: Mini<X>) => HtmlString;
+    static frontend<X>(frontendFilePath: string, snippet?: BasedHtml): HtmlString;
+    static frontend<X>(frontendFilePath: string, snippet?: HtmlHandler<X>): (mini: Mini<X>) => HtmlString;
     /**
      * This is used by the frontend bundler in order to find all frontends and their corresponding script files.
      */
     static getFrontends(): {
-        path: string;
+        frontendFilePath: string;
         callerPath: string;
+        position: number;
     }[];
     static getSvgs(): {
         svgFilePath: string;
         callerPath: string;
+        position: number;
         options: ResponseInit;
     }[];
-    static serveFrontend(req: Request): Response | undefined;
-    static serveSvg(req: Request): Response | undefined;
     /**
      * tool to expose data to a frontend as a global variable.
      * @param name  this will be added as window.name to the window object in the frontend
@@ -154,7 +173,7 @@ export declare class url {
          * @example const {html,json, css, data, req, form, link, svg, deliver, route, params, header, head } = mini  //pull everything out of the mini handbag
          * @returns
          */
-        handler: (dataHandler: HtmlHandler<T>) => (oldmini: Mini) => Promise<string | void | HtmlString>;
+        handler: (dataHandler: HtmlHandler<T>) => (oldmini: Mini) => Promise<string | void | JsonString>;
         dataMaker: DataMaker<T, Z>;
         /**
          * use this to **specify the input type for the functions**,
@@ -162,7 +181,7 @@ export declare class url {
          * that you want to use in the HtmlHandlers that follow this **data blend!**
          * @example type lol = typeof MaybeLoggedIn.$Mini
          */
-        $Mini: Mini<T>;
+        $Mini: Mini<T, "">;
         /**
          * use this to **specify the input type for the functions**,
          *
@@ -186,19 +205,12 @@ export declare class url {
      * ```
      */
     static set<K extends string>(entries: [K, HtmlHandler][]): void;
+    static set<R extends {
+        [X in keyof R]: MiniNextRouteValue<Extract<X, string>>;
+    }>({ routes }: {
+        routes: R;
+    }): void;
     static set(urlPath: string, handler: HtmlHandler): void;
-    /**
-     * use this to remove routes.
-     * @param urlPath - the route to remove
-     * @example
-     * ``` js
-     * let perma_link_defined_by_editor_or_admin_user_that_changed = "/haha"
-     * url.remove(perma_link_defined_by_editor_or_admin_user_that_changed);
-     * // add new url after removing the old one (that might come from a sqlite db)
-     * url.set("/huhu", (mini)=> mini.html`huhu`)
-     * ```
-     */
-    static remove(urlPath: string): void;
     /**
      * wrap your handlers in this if you mutate something to prevent CSRF issues.
      * @param handler - normal html handler with mini as the argument
@@ -249,9 +261,9 @@ export declare class url {
      * @throws Will throw an Error if the provided url is not found in the urls array.
      */
     static get(Url: string): string | null;
-    static match(req: Request, reqPath?: string): Promise<Response | undefined>;
+    static handleWithMini(req: BunRequest<string>, server: Server, handler: HtmlHandler): Promise<Response>;
     /**
-     * user this to set the Websocket object. Check out [the bun docs](https://bun.sh/docs/api/websockets) for more details.
+     * use this to set the Websocket object. Check out [the bun docs](https://bun.sh/docs/api/websockets) for more details.
      * @param wsObject the websocketsocket object {@link WebSocketHandler}
      */
     static setWebsocket<T = undefined>(wsObject: WebSocketHandler<T>): void;
@@ -268,8 +280,9 @@ export declare class url {
      * @return {Promise<Response>} - The Response object.
      */
     static install(): {
-        fetch: (req: Request, server: Server) => Promise<Response>;
+        fetch: (req: Request, server: Server) => Response;
         websocket: WebSocketHandler<undefined> | undefined;
+        routes: {};
     };
 }
 export {};

package/dist/url.js

@@ -67,6 +67,7 @@ export class Mini {
 export class url {
     static websocket = undefined;
     static server;
+    static routes;
     // direct mapping of "url string" -> function leads to Html Response
     static direct_handlers_html = new Map();
     // An array of the uncompiled frontend files, example frontends[0] = "index.tsx" -> frontend/index.tsx (from the project root)
@@ -89,19 +90,35 @@ export class url {
         let callerPath = "";
         if (stack) {
             callerPath = stack[2].slice(stack[2].lastIndexOf("(") + 1, stack[2].lastIndexOf(".") + 3);
+            callerPath = callerPath.slice(callerPath.search("at") + 2).trim();
         }
-        url.svgs.push({ svgFilePath, callerPath, options });
-        var foundSvg = Object.entries(bundledSVGs).find(([key, value]) => value.svgFilePath === svgFilePath);
+        const position = url.svgs.length;
+        //we register the svg for bundleing.
+        url.svgs.push({
+            svgFilePath,
+            callerPath,
+            options,
+            position: url.svgs.length,
+        });
+        //this will be filled in by the bundling step.
+        var foundSvg = Object.entries(bundledSVGs).find(([key, value]) => value.position === position);
         return foundSvg && foundSvg[0];
     }
-    static frontend(path, snippet) {
+    static frontend(frontendFilePath, snippet) {
         const stack = new Error().stack?.split("\n");
         let callerPath = "";
         if (stack) {
             callerPath = stack[2].slice(stack[2].lastIndexOf("(") + 1, stack[2].lastIndexOf(".") + 3);
+            callerPath = callerPath.slice(callerPath.search("at") + 2).trim();
         }
-        const frontendIndex = url.frontends.push({ path, callerPath }) - 1;
-        const scriptUrl = FrontendScriptUrls[frontendIndex];
+        const position = url.frontends.length;
+        //we register the frontend for bundleing.
+        url.frontends.push({ frontendFilePath, callerPath, position });
+        //this will be filled in by the bundling step.
+        const bundledFrontend = Object.entries(bundledFrontends).find(([key, value]) => value.position === position);
+        if (!bundledFrontend)
+            return;
+        const scriptUrl = bundledFrontend[0];
         if (snippet instanceof BasedHtml || !snippet) {
             return html ` ${snippet}
         <script type="module" src="${scriptUrl}"></script>`; // return an html script tag with the index hash
@@ -120,24 +137,6 @@ export class url {
     static getSvgs() {
         return url.svgs;
     }
-    static serveFrontend(req) {
-        const reqPath = new URL(req.url).pathname;
-        const index = FrontendScriptUrls.indexOf(reqPath);
-        if (index !== -1) {
-            return new Response(FrontendScripts[index], {
-                headers: {
-                    "Content-Type": "application/javascript; charset=utf-8",
-                },
-            });
-        }
-    }
-    static serveSvg(req) {
-        const reqPath = new URL(req.url).pathname;
-        const resolvedSvg = bundledSVGs[reqPath];
-        if (resolvedSvg) {
-            return new Response(resolvedSvg.svgContent, resolvedSvg.options);
-        }
-    }
     /**
      * tool to expose data to a frontend as a global variable.
      * @param name  this will be added as window.name to the window object in the frontend
@@ -222,27 +221,14 @@ export class url {
         if (typeof entries === "string" && handler) {
             addUrl(entries, handler);
         }
-        if (typeof entries !== "string")
+        if (typeof entries !== "string" && "routes" in entries) {
+            url.routes = entries.routes;
+        }
+        if (typeof entries !== "string" && !("routes" in entries))
             for (const [entryUrl, entryHandler] of entries) {
                 addUrl(entryUrl, entryHandler);
             }
     }
-    /**
-     * use this to remove routes.
-     * @param urlPath - the route to remove
-     * @example
-     * ``` js
-     * let perma_link_defined_by_editor_or_admin_user_that_changed = "/haha"
-     * url.remove(perma_link_defined_by_editor_or_admin_user_that_changed);
-     * // add new url after removing the old one (that might come from a sqlite db)
-     * url.set("/huhu", (mini)=> mini.html`huhu`)
-     * ```
-     */
-    static remove(urlPath) {
-        for (const u of url.generateVariations(urlPath)) {
-            url.direct_handlers_html.delete(u);
-        }
-    }
     /**
      * wrap your handlers in this if you mutate something to prevent CSRF issues.
      * @param handler - normal html handler with mini as the argument
@@ -399,95 +385,92 @@ export class url {
         }
         return Url;
     }
-    static async match(req, reqPath) {
+    static async handleWithMini(req, server, handler) {
+        if (!url.server)
+            url.server = server;
         const miniurl = Object.freeze(new URL(req.url));
-        if (typeof reqPath === "undefined") {
-            reqPath = miniurl.pathname;
+        const reqPath = miniurl.pathname;
+        let redirectTarget = null;
+        let redirectStatus = undefined;
+        let handlerHead = undefined;
+        let handlerOptions = {
+            headers: {
+                "Content-Type": "text/html; charset=utf-8",
+            },
+        };
+        const post = req.method === "POST";
+        let formJson;
+        let formData;
+        const urlencoded = (req.headers.get("Content-Type") + "").includes("application/x-www-form-urlencoded");
+        const multipart = (req.headers.get("Content-Type") + "").includes("multipart/form-data");
+        if (post && !urlencoded && !multipart) {
+            const length = Number(req.headers.get("content-length"));
+            const bodyNotEmpty = length > 0;
+            if (bodyNotEmpty) {
+                formJson = await req.json();
+            }
+            else {
+                formJson = {};
+            }
         }
-        const handler = url.direct_handlers_html.get(reqPath);
-        if (handler) {
-            let redirectTarget = null;
-            let redirectStatus = undefined;
-            let handlerHead = undefined;
-            let handlerOptions = {
-                headers: {
-                    "Content-Type": "text/html; charset=utf-8",
+        if (post && (urlencoded || multipart)) {
+            formData = await req.formData();
+        }
+        //this is the source of mini
+        const mini = new Mini({
+            requrl: miniurl,
+            data: undefined,
+            req: req,
+            html,
+            css: html,
+            deliver: url.deliver,
+            route: reqPath,
+            params: new URL(req.url).searchParams,
+            json,
+            form: {
+                post,
+                urlencoded,
+                multipart,
+                formJson,
+                formData,
+                onPostSubmit(cb) {
+                    if (post) {
+                        return cb();
+                    }
                 },
-            };
-            const post = req.method === "POST";
-            let formJson;
-            let formData;
-            const urlencoded = (req.headers.get("Content-Type") + "").includes("application/x-www-form-urlencoded");
-            const multipart = (req.headers.get("Content-Type") + "").includes("multipart/form-data");
-            if (post && !urlencoded && !multipart) {
-                const length = Number(req.headers.get("content-length"));
-                const bodyNotEmpty = length > 0;
-                if (bodyNotEmpty) {
-                    formJson = await req.json();
+                actionlink: (qs = "", settings) => url.link(reqPath, qs, settings),
+            },
+            dangerjson,
+            head: (head) => {
+                handlerHead = head;
+            },
+            headers: (headers, overwrite = false) => {
+                if (overwrite) {
+                    handlerOptions.headers = headers;
                 }
                 else {
-                    formJson = {};
+                    handlerOptions.headers = {
+                        ...handlerOptions.headers,
+                        ...headers,
+                    };
                 }
-            }
-            if (post && (urlencoded || multipart)) {
-                formData = await req.formData();
-            }
-            //this is the source of mini
-            const mini = new Mini({
-                requrl: miniurl,
-                data: undefined,
-                req,
-                html,
-                css: html,
-                deliver: url.deliver,
-                route: reqPath,
-                params: new URL(req.url).searchParams,
-                json,
-                form: {
-                    post,
-                    urlencoded,
-                    multipart,
-                    formJson,
-                    formData,
-                    onPostSubmit(cb) {
-                        if (post) {
-                            return cb();
-                        }
-                    },
-                    actionlink: (qs = "", settings) => url.link(reqPath, qs, settings),
-                },
-                dangerjson,
-                head: (head) => {
-                    handlerHead = head;
-                },
-                headers: (headers, overwrite = false) => {
-                    if (overwrite) {
-                        handlerOptions.headers = headers;
-                    }
-                    else {
-                        handlerOptions.headers = {
-                            ...handlerOptions.headers,
-                            ...headers,
-                        };
-                    }
-                },
-                options: (options) => {
-                    handlerOptions = options;
-                },
-                redirect: (url, status) => {
-                    redirectTarget = url;
-                    redirectStatus = status;
-                },
-            }, undefined);
-            const unresolved = await handler(mini); //passing mini
-            if (redirectTarget) {
-                return Response.redirect(redirectTarget, redirectStatus);
-            }
-            return htmlResponder(mini, unresolved, handlerHead, handlerOptions);
+            },
+            options: (options) => {
+                handlerOptions = options;
+            },
+            redirect: (url, status) => {
+                redirectTarget = url;
+                redirectStatus = status;
+            },
+        }, undefined);
+        const unresolved = await handler(mini); //passing mini
+        if (redirectTarget) {
+            return Response.redirect(redirectTarget, redirectStatus);
         }
+        return htmlResponder(mini, unresolved, handlerHead, handlerOptions);
     }
     /**
-     * user this to set the Websocket object. Check out [the bun docs](https://bun.sh/docs/api/websockets) for more details.
+     * use this to set the Websocket object. Check out [the bun docs](https://bun.sh/docs/api/websockets) for more details.
      * @param wsObject the websocketsocket object {@link WebSocketHandler}
      */
     static setWebsocket(wsObject) {
@@ -508,24 +491,44 @@ export class url {
      * @return {Promise<Response>} - The Response object.
      */
     static install() {
-        async function fetchFunction(req, server) {
-            if (!url.server)
-                url.server = server;
-            //go through all the Htmlhandlers and see if there is a match
-            let res = await url.match(req);
-            if (res)
-                return res;
-            //handle frontend js file serving
-            res = url.serveFrontend(req);
-            if (res)
-                return res;
-            //handle svg file serving
-            res = url.serveSvg(req);
-            if (res)
-                return res;
+        for (const route in url.routes) {
+            //handle route object split by methods and pull them through mininext
+            const handler = url.routes[route];
+            if (typeof handler === "function") {
+                url.routes[route] = (req, server) => url.handleWithMini(req, server, handler);
+            }
+            else {
+                const newHandlerObject = {};
+                for (const HTTPmethod in handler) {
+                    newHandlerObject[HTTPmethod] = (req, server) => url.handleWithMini(req, server, handler[HTTPmethod]);
+                }
+                url.routes[route] = newHandlerObject;
+            }
+        }
+        //TODO add fronted + svg to routes object
+        for (const [route, handler] of url.direct_handlers_html) {
+            url.routes[route] = (req, server) => url.handleWithMini(req, server, handler);
+        }
+        for (const svgUrl in bundledSVGs) {
+            const resolvedSvg = bundledSVGs[svgUrl];
+            url.routes[svgUrl] = (req, server) => new Response(resolvedSvg.svgContent, resolvedSvg.options);
+        }
+        for (const frontendUrl in bundledFrontends) {
+            const resolvedFrontend = bundledFrontends[frontendUrl];
+            url.routes[frontendUrl] = (req, server) => new Response(resolvedFrontend.frontendContent, {
+                headers: {
+                    "Content-Type": "application/javascript; charset=utf-8",
+                },
+            });
+        }
+        function fetchFunction(req, server) {
             return new Response("No matching url found", { status: 404 });
         }
-        return { fetch: fetchFunction, websocket: url.websocket };
+        return {
+            fetch: fetchFunction,
+            websocket: url.websocket,
+            routes: url.routes,
+        };
     }
 }
 const no_post_warning = html `<div style="color:red;">

package/package.json

@@ -11,9 +11,9 @@
     "clean": "rm -rf ./dist"
   },
   "files": ["dist"],
-  "version": "0.6.1",
+  "version": "0.7.1",
   "devDependencies": {
-    "@types/bun": "latest"
+    "@types/bun": "^1.2.9"
   },
   "peerDependencies": {
     "typescript": "^5.0.0"