evikit 1.0.3 → 2.1.0

package/README.md

@@ -13,7 +13,7 @@ Vite is a good foundation for building a server-rendered monolith SPA with an JS
 - Show the language chosen by the user in browser settings
 - Have SEO meta descriptions
 - Generate API documentation with a Swagger overview
-- _TODO_ Multipart forms
+- Send multipart not urlencoded when there's a file
 
 _TODO_ Add more simple language docs near code, don't overwhelm readers.
 
@@ -78,7 +78,6 @@ node_modules
 *~
 *swp
 .env
-*.db
 ```
 
 ### Database schema
@@ -114,16 +113,19 @@ Export the database at `src/lib/db/index.js`:
 ```js
 import { sqlite } from "evikit/sqlite";
 
+import pkg from "../../../package.json" with { type: "json" };
 import * as schema from "./schema.js";
 
-export const db = sqlite("data/local.db", { schema });
+export const db = sqlite({ pkg, schema });
 ```
 
 - See ChoiceServer below for an example of `upsert` returning a created row.
 - See QuestionIdServer below for an example of `select` with a join.
 - See VoteServer below for an example of `update` and `delete`.
 
-Create an empty `data/.gitkeep` file.
+The database is kept under the [OS-specific path](https://github.com/sindresorhus/env-paths) for your application, such as `~/.local/share/mysite-nodejs/db.sqlite3` on GNU/Linux.
+
+If you want a temporary, in-memory database, omit `pkg`, pass just `{ schema }`.
 
 ### Routing
 

package/db.d.ts

@@ -225,17 +225,17 @@ export function flatten<
   Schema extends Record<string, ObjectSchema<any, any>>, // eslint-disable-line @typescript-eslint/no-explicit-any
 >(relations: Relations<Schema>): Flatten<Schema>;
 
-export function primary(): MetadataAction<any, { primary: true }>; // eslint-disable-line @typescript-eslint/no-explicit-any
+export function primary<T>(): MetadataAction<T, { primary: true }>;
 
 export function references<
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   R extends { entries: any },
   K extends keyof R["entries"],
+  T,
 >(
   references: R,
   key: K,
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-): MetadataAction<any, { key: R["entries"][K]; references: R }>;
+): MetadataAction<T, { key: R["entries"][K]; references: R }>;
 
 export function relations<
   Schema extends Record<string, ObjectSchema<any, any>>, // eslint-disable-line @typescript-eslint/no-explicit-any

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "evikit",
   "description": "Preact/SQLite SSR framework for small web apps",
-  "version": "1.0.3",
+  "version": "2.1.0",
   "type": "module",
   "exports": {
     ".": "./index.js",
@@ -24,12 +24,11 @@
     "@fastify/busboy": "^3.2.0",
     "@types/gettext-parser": "^9.0.0",
     "@types/gettext.js": "^2.0.0",
-    "@types/lodash": "^4.17.24",
     "@types/node": "^25",
     "@valibot/to-json-schema": "^1.7.0",
+    "env-paths": "^4.0.0",
     "gettext-parser": "^9.0.2",
     "gettext.js": "^2.0.3",
-    "lodash": "^4.18.1",
     "preact-render-to-string": "^6.7.0"
   },
   "peerDependencies": {

package/server.d.ts

@@ -91,7 +91,9 @@ export function router(
             | {
                 content: {
                   // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                  "application/x-www-form-urlencoded": { schema: any };
+                  "application/x-www-form-urlencoded"?: { schema: any };
+                  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                  "multipart/form-data"?: { schema: any };
                 };
               };
           responses: Record<

package/server.js

@@ -2,7 +2,6 @@ import { Busboy } from "@fastify/busboy";
 import { toJsonSchema } from "@valibot/to-json-schema";
 import acceptLanguage from "accept-language";
 import { po } from "gettext-parser";
-import groupBy from "lodash/groupBy.js";
 import { readFile } from "node:fs/promises";
 import { Fragment, h } from "preact";
 import { renderToString } from "preact-render-to-string";
@@ -21,6 +20,7 @@ import { Po } from "./i18n.js";
 
 /** @type {import("./server-generic.js").ServerEndpoint} */
 export function endpoint({ input, outputs }, handler) {
+  const arrayOf = ArrayOf(input);
   const schema = union(
     Object.entries(outputs).map(([status, schema]) =>
       object({
@@ -35,7 +35,7 @@ export function endpoint({ input, outputs }, handler) {
   return {
     handler: async (req, res) => {
       try {
-        /** @type {Record<string, string | string[]>} */
+        /** @type {Record<string, string | File | (string | File)[]>} */
         const body = {};
         if (req.headers["content-type"]) {
           const busboy = new Busboy({
@@ -45,13 +45,39 @@ export function endpoint({ input, outputs }, handler) {
             body[name] =
               typeof body[name] == "undefined"
                 ? value
-                : [
-                    ...(typeof body[name] == "string"
-                      ? [body[name]]
-                      : body[name]),
-                    value,
-                  ];
+                : Array.isArray(body[name])
+                  ? [...body[name], value]
+                  : [body[name], value];
           });
+
+          if (
+            Object.values(input.entries).some(
+              (entry) => entry.type == "file" || arrayOf(entry, "file"),
+            )
+          ) {
+            busboy.on("file", (name, stream, filename) => {
+              const entry = input.entries[name];
+              if (entry && (entry.type == "file" || arrayOf(entry, "file"))) {
+                /** @type {ArrayBuffer[]} */
+                const buffers = [];
+                stream.on("data", (data) => {
+                  buffers.push(data);
+                });
+                stream.on("end", () => {
+                  const value = new File(buffers, filename);
+                  body[name] =
+                    typeof body[name] == "undefined"
+                      ? value
+                      : Array.isArray(body[name])
+                        ? [...body[name], value]
+                        : [body[name], value];
+                });
+              } else {
+                stream.resume();
+              }
+            });
+          }
+
           await new Promise((resolve, reject) => {
             busboy.on("error", reject).on("finish", resolve);
             req.pipe(busboy);
@@ -71,7 +97,7 @@ export function endpoint({ input, outputs }, handler) {
                 : undefined),
               ...Object.fromEntries(
                 Object.entries(
-                  groupBy(
+                  Object.groupBy(
                     [
                       ...new URL(
                         `http://${req.headers.host}${req.url}`,
@@ -80,7 +106,7 @@ export function endpoint({ input, outputs }, handler) {
                     ([name]) => name || "",
                   ),
                 ).map(([name, group]) => {
-                  const values = group.map((value) => value[1]);
+                  const values = (group || []).map((value) => value[1]);
                   return [name, values.length == 1 ? values[0] : values];
                 }),
               ),
@@ -270,6 +296,7 @@ export function router({ pkg }, ...routes) {
         path.replace(/:(\w+)/g, "{$1}"),
         Object.fromEntries(
           Object.entries(controller).map(([method, { input, outputs }]) => {
+            const arrayOf = ArrayOf(input);
             const parameters = path
               .split("/")
               .filter((component) => /^:/.test(component))
@@ -287,7 +314,12 @@ export function router({ pkg }, ...routes) {
                   ? {
                       requestBody: {
                         content: {
-                          "application/x-www-form-urlencoded": {
+                          [Object.values(input.entries).some(
+                            (entry) =>
+                              entry.type == "file" || arrayOf(entry, "file"),
+                          )
+                            ? "multipart/form-data"
+                            : "application/x-www-form-urlencoded"]: {
                             schema: toJsonSchema(
                               object(
                                 Object.fromEntries(
@@ -296,7 +328,13 @@ export function router({ pkg }, ...routes) {
                                   ),
                                 ),
                               ),
-                              { ignoreActions: ["trim"] },
+                              {
+                                ignoreActions: ["trim"],
+                                overrideSchema: (context) =>
+                                  context.valibotSchema.type == "file"
+                                    ? { format: "binary", type: "string" }
+                                    : context.jsonSchema,
+                              },
                             ),
                           },
                         },
@@ -427,3 +465,21 @@ export function text(output, status) {
     status,
   };
 }
+
+/** @param {import("valibot").ObjectSchema<any, any>} input */
+function ArrayOf(input) {
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  const entries = Object.values(input);
+  /**
+   * @param {typeof entries[0]} entry
+   * @param {string} type
+   */
+  return function arrayOf(entry, type) {
+    if (entry.type != "array") {
+      return false;
+    }
+    /** @type {import("valibot").ArraySchema<any, any>} */
+    const array = /** @type {any} */ (entry);
+    return array.item.type == type;
+  };
+}

package/sqlite.d.ts

@@ -5,4 +5,10 @@ import type { Db } from "./db.d.ts";
 export function sqlite<
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   Schema extends Record<string, ObjectSchema<any, any>>,
->(path: string, { schema }: { schema: Schema }): Db<Schema>;
+>({
+  pkg,
+  schema,
+}: {
+  pkg?: { name: string; version: string };
+  schema: Schema;
+}): Db<Schema>;

package/sqlite.js

@@ -1,12 +1,23 @@
+import envPaths from "env-paths";
 import { fail, ok } from "node:assert/strict";
+import { mkdirSync } from "node:fs";
 import { DatabaseSync } from "node:sqlite";
 import { getMetadata, parse } from "valibot";
 
 import { flatten, relations } from "./db.js";
 
 /** @type {typeof import("./sqlite.d.ts").sqlite} */
-export function sqlite(path, { schema }) {
-  const database = new DatabaseSync(path, { timeout: 1000 });
+export function sqlite({ pkg, schema }) {
+  const data = pkg
+    ? (() => {
+        const { data } = envPaths(pkg.name);
+        mkdirSync(data, { recursive: true });
+        return data;
+      })()
+    : undefined;
+  const database = new DatabaseSync(data ? `${data}/db.sqlite3` : ":memory:", {
+    timeout: 1000,
+  });
   const flat = flatten(relations(schema));
 
   const haveTables = /** @type {{ name: string }[]} */ (

package/use-enhance.js

@@ -21,14 +21,23 @@ export function useEnhance(schema, onSuccess) {
     setBusy(true);
     const form = /** @type {HTMLFormElement} */ (event.target);
     let output;
+
     try {
-      const body = new URLSearchParams();
+      const body = form.querySelector('[type="file"]')
+        ? new FormData()
+        : new URLSearchParams();
       for (const input of [...form.querySelectorAll("input")]) {
-        if (
-          !input.disabled &&
-          ((input.type != "checkbox" && input.type != "radio") || input.checked)
-        ) {
-          body.append(input.name, input.value);
+        if (!input.disabled) {
+          if (input.type == "file" && body instanceof FormData) {
+            for (const file of input.files || []) {
+              body.append(input.name, file, file.name);
+            }
+          } else if (
+            (input.type != "checkbox" && input.type != "radio") ||
+            input.checked
+          ) {
+            body.append(input.name, input.value);
+          }
         }
       }
       for (const select of [...form.querySelectorAll("select")]) {
@@ -41,11 +50,14 @@ export function useEnhance(schema, onSuccess) {
           body.append(textarea.name, textarea.value);
         }
       }
+
       const response = await fetch(form.action, {
-        body: body.toString(),
+        body: body instanceof FormData ? body : body.toString(),
         headers: {
           Accept: "application/json",
-          "Content-Type": "application/x-www-form-urlencoded",
+          ...(body instanceof FormData
+            ? {}
+            : { "Content-Type": "application/x-www-form-urlencoded" }),
           Cookie: jsdomCookie.setCookie.join("; "),
         },
         method: form.method,