vite-plugin-server-actions 0.1.1 → 1.0.0

package/src/validation.js

@@ -0,0 +1,307 @@
+import { z } from "zod";
+import { extendZodWithOpenApi, OpenAPIRegistry, OpenApiGeneratorV3 } from "@asteasolutions/zod-to-openapi";
+
+// Extend Zod with OpenAPI support
+extendZodWithOpenApi(z);
+
+/**
+ * Base validation adapter interface
+ */
+export class ValidationAdapter {
+	/**
+	 * Validate data against a schema
+	 * @param {any} schema - The validation schema
+	 * @param {any} data - The data to validate
+	 * @returns {Promise<{success: boolean, data?: any, errors?: any[]}>}
+	 */
+	async validate(schema, data) {
+		throw new Error("ValidationAdapter.validate must be implemented");
+	}
+
+	/**
+	 * Convert schema to OpenAPI schema format
+	 * @param {any} schema - The validation schema
+	 * @returns {object} OpenAPI schema object
+	 */
+	toOpenAPISchema(schema) {
+		throw new Error("ValidationAdapter.toOpenAPISchema must be implemented");
+	}
+
+	/**
+	 * Get parameter definitions for OpenAPI
+	 * @param {any} schema - The validation schema
+	 * @returns {Array} Array of OpenAPI parameter objects
+	 */
+	getParameters(schema) {
+		throw new Error("ValidationAdapter.getParameters must be implemented");
+	}
+}
+
+/**
+ * Zod validation adapter
+ */
+export class ZodAdapter extends ValidationAdapter {
+	async validate(schema, data) {
+		try {
+			const validatedData = await schema.parseAsync(data);
+			return {
+				success: true,
+				data: validatedData,
+			};
+		} catch (error) {
+			if (error instanceof z.ZodError) {
+				return {
+					success: false,
+					errors: error.errors.map((err) => ({
+						path: err.path.join("."),
+						message: err.message,
+						code: err.code,
+						value: err.input,
+					})),
+				};
+			}
+			return {
+				success: false,
+				errors: [
+					{
+						path: "root",
+						message: error.message,
+						code: "unknown",
+					},
+				],
+			};
+		}
+	}
+
+	toOpenAPISchema(schema) {
+		try {
+			// Use @asteasolutions/zod-to-openapi for conversion
+			const registry = new OpenAPIRegistry();
+			const schemaName = "_TempSchema";
+
+			// The library requires schemas to be registered with openapi metadata
+			// For simple conversion, we'll create a temporary registry
+			const extendedSchema = schema.openapi ? schema : schema;
+			registry.register(schemaName, extendedSchema);
+
+			// Generate the OpenAPI components
+			const generator = new OpenApiGeneratorV3(registry.definitions);
+			const components = generator.generateComponents();
+
+			// Extract the schema from components
+			const openAPISchema = components.components?.schemas?.[schemaName];
+
+			if (!openAPISchema) {
+				// Fallback for schemas that couldn't be converted
+				return { type: "object", description: "Schema conversion not supported" };
+			}
+
+			return openAPISchema;
+		} catch (error) {
+			console.warn(`Failed to convert Zod schema to OpenAPI: ${error.message}`);
+			return { type: "object", description: "Schema conversion failed" };
+		}
+	}
+
+	getParameters(schema) {
+		if (!schema || typeof schema._def === "undefined") {
+			return [];
+		}
+
+		// For function parameters, we expect an array schema or object schema
+		if (schema._def.typeName === "ZodArray") {
+			// Array of parameters - convert each item to a parameter
+			const itemSchema = schema._def.type;
+			return this._schemaToParameters(itemSchema, "body");
+		} else if (schema._def.typeName === "ZodObject") {
+			// Object parameters - convert each property to a parameter
+			return this._objectToParameters(schema);
+		}
+
+		return [
+			{
+				name: "data",
+				in: "body",
+				required: true,
+				schema: this.toOpenAPISchema(schema),
+			},
+		];
+	}
+
+	_objectToParameters(zodObject) {
+		const shape = zodObject._def.shape();
+		const parameters = [];
+
+		for (const [key, value] of Object.entries(shape)) {
+			parameters.push({
+				name: key,
+				in: "body",
+				required: !value.isOptional(),
+				schema: this.toOpenAPISchema(value),
+				description: value.description || `Parameter: ${key}`,
+			});
+		}
+
+		return parameters;
+	}
+
+	_schemaToParameters(schema, location = "body") {
+		return [
+			{
+				name: "data",
+				in: location,
+				required: true,
+				schema: this.toOpenAPISchema(schema),
+			},
+		];
+	}
+}
+
+/**
+ * Schema discovery utilities
+ */
+export class SchemaDiscovery {
+	constructor(adapter = new ZodAdapter()) {
+		this.adapter = adapter;
+		this.schemas = new Map();
+	}
+
+	/**
+	 * Register a schema for a function
+	 * @param {string} moduleName - Module name
+	 * @param {string} functionName - Function name
+	 * @param {any} schema - Validation schema
+	 */
+	registerSchema(moduleName, functionName, schema) {
+		const key = `${moduleName}.${functionName}`;
+		this.schemas.set(key, schema);
+	}
+
+	/**
+	 * Get schema for a function
+	 * @param {string} moduleName - Module name
+	 * @param {string} functionName - Function name
+	 * @returns {any|null} Schema or null if not found
+	 */
+	getSchema(moduleName, functionName) {
+		const key = `${moduleName}.${functionName}`;
+		return this.schemas.get(key) || null;
+	}
+
+	/**
+	 * Get all schemas
+	 * @returns {Map} All registered schemas
+	 */
+	getAllSchemas() {
+		return new Map(this.schemas);
+	}
+
+	/**
+	 * Discover schemas from module exports
+	 * @param {object} module - Module with exported functions
+	 * @param {string} moduleName - Module name
+	 */
+	discoverFromModule(module, moduleName) {
+		for (const [functionName, fn] of Object.entries(module)) {
+			if (typeof fn === "function") {
+				// Check if function has attached schema
+				if (fn.schema) {
+					this.registerSchema(moduleName, functionName, fn.schema);
+				}
+
+				// Check for JSDoc schema annotations (future enhancement)
+				// This would require parsing JSDoc comments from the function
+			}
+		}
+	}
+
+	/**
+	 * Clear all schemas
+	 */
+	clear() {
+		this.schemas.clear();
+	}
+}
+
+/**
+ * Validation middleware factory
+ */
+export function createValidationMiddleware(options = {}) {
+	const adapter = options.adapter || new ZodAdapter();
+	const schemaDiscovery = options.schemaDiscovery || new SchemaDiscovery(adapter);
+
+	return async function validationMiddleware(req, res, next) {
+		let moduleName, functionName, schema;
+
+		// Check for context from route setup
+		if (req.validationContext) {
+			moduleName = req.validationContext.moduleName;
+			functionName = req.validationContext.functionName;
+			schema = req.validationContext.schema;
+		} else {
+			// Fallback to URL parsing and schema discovery
+			const urlParts = req.url.split("/");
+			functionName = urlParts[urlParts.length - 1];
+			moduleName = urlParts[urlParts.length - 2];
+			schema = schemaDiscovery.getSchema(moduleName, functionName);
+		}
+
+		if (!schema) {
+			// No schema defined, skip validation
+			return next();
+		}
+
+		try {
+			// Request body should be an array of arguments for server functions
+			if (!Array.isArray(req.body) || req.body.length === 0) {
+				return res.status(400).json({
+					error: "Validation failed",
+					details: "Request body must be a non-empty array of function arguments",
+				});
+			}
+
+			// Validate based on schema type
+			let validationData;
+			if (schema._def?.typeName === "ZodTuple") {
+				// Schema expects multiple arguments (tuple)
+				validationData = req.body;
+			} else {
+				// Schema expects single argument (first element of array)
+				validationData = req.body[0];
+			}
+
+			const result = await adapter.validate(schema, validationData);
+
+			if (!result.success) {
+				return res.status(400).json({
+					error: "Validation failed",
+					details: result.errors,
+					validationErrors: result.errors,
+				});
+			}
+
+			// Replace request body with validated data
+			if (schema._def?.typeName === "ZodTuple") {
+				req.body = result.data;
+			} else {
+				req.body = [result.data];
+			}
+
+			next();
+		} catch (error) {
+			console.error("Validation middleware error:", error);
+			res.status(500).json({
+				error: "Internal validation error",
+				details: error.message,
+			});
+		}
+	};
+}
+
+// Export default adapters and utilities
+export const adapters = {
+	zod: ZodAdapter,
+};
+
+export const defaultAdapter = new ZodAdapter();
+export const defaultSchemaDiscovery = new SchemaDiscovery(defaultAdapter);

package/.editorconfig

@@ -1,20 +0,0 @@
-root = true
-
-[*]
-end_of_line = lf
-insert_final_newline = true
-indent_style = tab
-indent_size = 2
-charset = utf-8
-trim_trailing_whitespace = true
-
-[test/**/expected.css]
-insert_final_newline = false
-
-[package.json]
-indent_style = space
-
-[*.md]
-trim_trailing_whitespace = true
-indent_size = 2
-indent_style = space

package/.nvmrc

@@ -1 +0,0 @@
-v20.17.0

package/.prettierrc

@@ -1,7 +0,0 @@
-{
-	"printWidth": 120,
-	"quoteProps": "consistent",
-	"semi": true,
-	"singleQuote": false,
-	"bracketSameLine": false
-}

package/examples/todo-app/.prettierrc

@@ -1,17 +0,0 @@
-{
-	"plugins": ["prettier-plugin-svelte", "prettier-plugin-tailwindcss"],
-	"overrides": [
-		{
-			"files": "*.svelte",
-			"options": {
-				"parser": "svelte",
-				"svelteAllowShorthand": false
-			}
-		}
-	],
-	"printWidth": 120,
-	"quoteProps": "consistent",
-	"semi": true,
-	"singleQuote": false,
-	"bracketSameLine": false
-}

package/examples/todo-app/README.md

@@ -1,58 +0,0 @@
-# Vite Server Actions - TODO App Example
-
-This is an example of a simple TODO application that
-uses [Vite Server Actions](https://github.com/HelgeSverre/vite-plugin-server-actions)
-and [Svelte](https://svelte.dev/) to demonstrate a real-world use case, where server actions are used to save, list, and
-delete TODOs, with data stored in a JSON file.
-
-## 🚀 Quick Start
-
-### Clone the repository and install dependencies
-
-```shell
-git clone
-cd examples/todo-app
-npm install
-```
-
-## Run in development mode
-
-```shell
-npm install
-npm run dev
-```
-
-Open [http://localhost:5173](http://localhost:5173) to view it in your browser. (Note: The port may vary, check the
-console output for the correct port)
-
-## Build and run in production mode
-
-Server Actions works in production mode by bundling the server into a single file that can be run with Node.js.
-
-Here's how you can build and run the example in production mode:
-
-```shell
-# Install dependencies and build the project
-npm install
-npm run build
-
-# Run the generated express.js server
-node dist/server.js
-```
-
-Open [http://localhost:3000](http://localhost:3000) to view it in your browser.
-
-## 📁 Project Structure
-
-The important files and directories in this example are:
-
-- `src/` - Contains the client-side Svelte application
-- `src/actions/` - Contains the server action files (functions that are run on the server, note the `.server.js` suffix)
-  - `src/actions/todo.server.js` - Contains server actions for managing TODOs
-  - `src/actions/auth.server.js` - Contains a dummy server action for demonstration purposes
-- `src/App.svelte` - The main Svelte component that imports and calls the server actions to manage TODOs.
-- `vite.config.js` - Vite configuration file that includes the Server Actions plugin `serverActions()`
-- `dist/` - The output directory for the production build.
-- `dist/server.js` - The express server that serves the client-side application and the server actions (automatically
-  created by the plugin)
-- `todos.json` - The JSON file where the TODOs are stored (serves the purpose of a simple database for this example)

package/examples/todo-app/index.html

@@ -1,12 +0,0 @@
-<!doctype html>
-<html lang="en">
-	<head>
-		<meta charset="UTF-8" />
-		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
-		<title>TODO Example Svelte</title>
-	</head>
-	<body>
-		<div id="app"></div>
-		<script type="module" src="/src/main.js"></script>
-	</body>
-</html>

package/examples/todo-app/jsconfig.json

@@ -1,32 +0,0 @@
-{
-	"compilerOptions": {
-		"moduleResolution": "bundler",
-		"target": "ESNext",
-		"module": "ESNext",
-		/**
-		 * svelte-preprocess cannot figure out whether you have
-		 * a value or a type, so tell TypeScript to enforce using
-		 * `import type` instead of `import` for Types.
-		 */
-		"verbatimModuleSyntax": true,
-		"isolatedModules": true,
-		"resolveJsonModule": true,
-		/**
-		 * To have warnings / errors of the Svelte compiler at the
-		 * correct position, enable source maps by default.
-		 */
-		"sourceMap": true,
-		"esModuleInterop": true,
-		"skipLibCheck": true,
-		/**
-		 * Typecheck JS in `.svelte` and `.js` files by default.
-		 * Disable this if you'd like to use dynamic types.
-		 */
-		"checkJs": true
-	},
-	/**
-	 * Use global.d.ts instead of compilerOptions.types
-	 * to avoid limiting type declarations.
-	 */
-	"include": ["src/**/*.d.ts", "src/**/*.js", "src/**/*.svelte"]
-}

package/examples/todo-app/package.json

@@ -1,22 +0,0 @@
-{
-  "name": "todo-app",
-  "version": "0.0.0",
-  "private": true,
-  "type": "module",
-  "scripts": {
-    "build": "vite build",
-    "dev": "vite",
-    "format": "npx prettier --write .",
-    "preview": "vite preview",
-    "sort": "npx sort-package-json"
-  },
-  "devDependencies": {
-    "@sveltejs/vite-plugin-svelte": "^3.1.1",
-    "prettier": "^3.3.3",
-    "prettier-plugin-svelte": "^3.2.6",
-    "prettier-plugin-tailwindcss": "^0.6.5",
-    "svelte": "^4.2.18",
-    "vite": "^5.4.1",
-    "vite-plugin-inspect": "^0.8.7"
-  }
-}

package/examples/todo-app/src/App.svelte

@@ -1,155 +0,0 @@
-<script>
-	import { onMount } from "svelte";
-	import { addTodo, deleteTodo, getTodos, updateTodo } from "./actions/todo.server.js";
-	import { login } from "./actions/auth.server.js";
-
-	let todos = [];
-	let newTodoText = "";
-
-	onMount(() => {
-		login("admin", "admin");
-		loadTodos();
-	});
-
-	async function loadTodos() {
-		console.log("Loading todos...");
-		todos = await getTodos();
-	}
-
-	async function handleAddTodo() {
-		if (!newTodoText.trim()) return;
-
-		await addTodo({ text: newTodoText });
-		await loadTodos();
-		newTodoText = "";
-	}
-
-	async function handleToggleTodo(id) {
-		const todo = todos.find((t) => t.id === id);
-		if (todo) {
-			const updatedTodo = await updateTodo(id, { completed: !todo.completed });
-			todos = todos.map((t) => (t.id === id ? updatedTodo : t));
-		}
-	}
-
-	async function handleDeleteTodo(id) {
-		await deleteTodo(id);
-		await loadTodos();
-	}
-</script>
-
-<main>
-	<h1>Todo List</h1>
-
-	<form class="todo-form" on:submit|preventDefault={handleAddTodo}>
-		<input class="todo-input" bind:value={newTodoText} placeholder="Add a new todo" />
-		<button class="todo-button" type="submit">Add</button>
-	</form>
-
-	{#if todos.length > 0}
-		<ul class="todo-list">
-			{#each todos as todo}
-				<li class="todo-item">
-					<input type="checkbox" checked={todo.completed} on:change={() => handleToggleTodo(todo.id)} />
-					<span class:completed={todo.completed}>{todo.text}</span>
-					<button class="delete-button" on:click={() => handleDeleteTodo(todo.id)}>Delete</button>
-				</li>
-			{/each}
-		</ul>
-	{/if}
-</main>
-
-<style>
-	/* Basic global styling */
-	main {
-		font-family: sans-serif;
-		max-width: 600px;
-		margin: 2rem auto;
-		padding: 1rem;
-		background-color: #f8f8f8;
-		border-radius: 8px;
-		box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
-	}
-
-	h1 {
-		text-align: center;
-		color: #333;
-		margin-bottom: 1rem;
-	}
-
-	.todo-form {
-		display: flex;
-		gap: 0.5rem;
-		margin-bottom: 1rem;
-	}
-
-	.todo-input {
-		flex: 1;
-		padding: 0.5rem;
-		border: 1px solid #ccc;
-		border-radius: 4px;
-		font-size: 1rem;
-	}
-
-	.todo-button {
-		padding: 0.5rem 1rem;
-		font-size: 1rem;
-		color: white;
-		background-color: #333;
-		border: none;
-		border-radius: 4px;
-		cursor: pointer;
-	}
-
-	.todo-button:hover {
-		background-color: #555;
-	}
-
-	.todo-list {
-		list-style: none;
-		padding: 0;
-		margin: 0;
-		border-top: 1px solid #e0e0e0;
-	}
-
-	.todo-item {
-		display: flex;
-		align-items: center;
-		justify-content: space-between;
-		padding: 0.5rem;
-		border-bottom: 1px solid #e0e0e0;
-	}
-
-	.todo-item:last-child {
-		border-bottom: none;
-	}
-
-	.todo-item input[type="checkbox"] {
-		margin-right: 1rem;
-	}
-
-	.todo-item span {
-		flex: 1;
-		font-size: 1rem;
-		color: #333;
-	}
-
-	.todo-item span.completed {
-		text-decoration: line-through;
-		color: #888;
-	}
-
-	.delete-button {
-		padding: 0.25rem 0.5rem;
-		font-size: 0.875rem;
-		color: #fff;
-		background-color: #cc0000;
-		border: none;
-		border-radius: 4px;
-		cursor: pointer;
-	}
-
-	.delete-button:hover {
-		background-color: #ff3333;
-	}
-</style>

package/examples/todo-app/src/actions/auth.server.js

@@ -1,14 +0,0 @@
-export function login(user, pass) {
-	if (user === "admin" && pass === "admin") {
-		return {
-			user: "admin",
-			role: "admin",
-		};
-	} else {
-		throw new Error("Invalid user or password");
-	}
-}
-
-export function logout() {
-	return true;
-}