@sealcode/sealgen 0.18.10 → 0.19.2

package/src/forms/fields/password.ts

@@ -0,0 +1,13 @@
+import { TextBasedSimpleField } from "./simple-form-field.js";
+
+export class Password<
+	Required extends boolean,
+> extends TextBasedSimpleField<Required> {
+	constructor(required: Required) {
+		super(required, "password");
+	}
+
+	async sealiousValueToForm(): Promise<undefined> {
+		return undefined;
+	}
+}

package/src/forms/fields/pick-from-list-sealious.ts

@@ -0,0 +1,22 @@
+import { FieldTypes as SealiousFieldTypes } from "sealious";
+import { PickFromListField } from "./pick-from-list.js";
+import { ExtractedFieldInfo } from "../../utils/extract-fields-from-collection.js";
+
+export class PickFromListSealious<
+	Required extends boolean,
+> extends PickFromListField<Required> {
+	constructor(public sealious_field: SealiousFieldTypes.Enum<string>) {
+		super(sealious_field.required as Required, async (ctx) =>
+			sealious_field
+				.getAllowedValues(ctx.$app)
+				.map((value) => ({ value, label: value }))
+		);
+	}
+
+	generateFieldDeclaration(
+		field_info: ExtractedFieldInfo,
+		vars: { form_field_types: string; sealious_field: string }
+	): string {
+		return `new ${vars.form_field_types}.${this.constructor.name}(${vars.sealious_field})`;
+	}
+}

package/src/forms/fields/pick-from-list.ts

@@ -1,12 +1,12 @@
 import { is, predicates } from "@sealcode/ts-predicates";
 import { Context } from "koa";
-import type { DropdownOption } from "../controls/dropdown.js";
+import { Dropdown, DropdownOption } from "../controls/dropdown.js";
 import { FormFieldValidationResponse } from "./field.js";
-import { SimpleFormField } from "./simple-form-field.js";
+import { TextBasedSimpleField } from "./simple-form-field.js";
 
 export class PickFromListField<
-	Required extends boolean
-> extends SimpleFormField<Required> {
+	Required extends boolean,
+> extends TextBasedSimpleField<Required, Dropdown> {
 	constructor(
 		public required: Required,
 		public generateOptions: (ctx: Context) => Promise<DropdownOption[]>,
@@ -49,4 +49,8 @@ export class PickFromListField<
 	public getEmptyValue(): string {
 		return "";
 	}
+
+	getControl(): Dropdown {
+		return new Dropdown(this);
+	}
 }

package/src/forms/fields/proxy-field.ts

@@ -1,6 +1,8 @@
+import { FormControl } from "../controls/form-control.js";
 import { FormField } from "./field.js";
 
-export class ProxyFormField<T> extends FormField<boolean, T> {
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+export class ProxyFormField<T> extends FormField<boolean, T, any> {
 	constructor(
 		required: boolean,
 		public name: string,
@@ -21,4 +23,8 @@ export class ProxyFormField<T> extends FormField<boolean, T> {
 			parsed_value: this.parsed_value,
 		};
 	}
+
+	getControl(): FormControl {
+		throw new Error("This field does not have a default control assigned");
+	}
 }

package/src/forms/fields/regexp.ts

@@ -1,9 +1,16 @@
 import { is, predicates } from "@sealcode/ts-predicates";
 import { Context } from "koa";
+import { SimpleInput } from "../controls/simple-input.js";
 import { FormDataValue } from "../form-types.js";
 import { FieldParseResult, FormField } from "./field.js";
+import { FormControlContext } from "../controls/form-control.js";
 
-export class RegExpField<Required extends boolean> extends FormField<Required> {
+export class RegExpField<Required extends boolean> extends FormField<
+	Required,
+	string,
+	SimpleInput,
+	string
+> {
 	constructor(
 		required: Required,
 		public regexp: RegExp,
@@ -50,4 +57,23 @@ export class RegExpField<Required extends boolean> extends FormField<Required> {
 	public getEmptyValue(): string {
 		return this.default_value || "";
 	}
+
+	public getControl(): SimpleInput {
+		return new SimpleInput(this, { label: this.name });
+	}
+
+	async getSealiousCreateValue(fctx: FormControlContext): Promise<string> {
+		const { parsed } = await this.getParsedValue(
+			fctx.ctx,
+			fctx.data.raw_values
+		);
+		return parsed || "";
+	}
+
+	async sealiousValueToForm(
+		ctx: Context,
+		sealious_value: string | null
+	): Promise<FormDataValue> {
+		return sealious_value || "";
+	}
 }

package/src/forms/fields/simple-form-field.ts

@@ -1,30 +1,126 @@
+/* eslint @typescript-eslint/no-unused-vars: off */
 import { FormDataValue } from "../form-types.js";
 import { Context } from "koa";
 import { predicates } from "@sealcode/ts-predicates";
 import { FieldParseResult, FormField } from "./field.js";
+import { SimpleInput } from "../controls/simple-input.js";
+import { FormControl } from "../controls/controls.js";
+import { CollectionItem } from "sealious";
+import { FormControlContext } from "../controls/form-control.js";
 
-export class SimpleFormField<Required extends boolean> extends FormField<
-	Required,
-	string | null
-> {
+export abstract class SimpleFormField<
+	Required extends boolean,
+	DefaultControl extends FormControl = SimpleInput,
+	Parsed = string,
+> extends FormField<Required, Parsed, DefaultControl> {
+	predicate = predicates.string;
+
+	constructor(
+		required: Required,
+		public type: string = "text"
+	) {
+		super(required);
+	}
+
+	async sealiousValueToForm(
+		_ctx: Context,
+		value: unknown
+	): Promise<FormDataValue> {
+		if (value === null) {
+			return "";
+		}
+		// eslint-disable-next-line @typescript-eslint/no-base-to-string
+		return String(value) as FormDataValue;
+	}
+}
+
+export class TextBasedSimpleField<
+	Required extends boolean,
+	DefaultControl extends FormControl = SimpleInput,
+> extends SimpleFormField<Required, DefaultControl, string | null> {
 	async parse(
 		_: Context,
 		raw_value: FormDataValue
 	): Promise<FieldParseResult<string>> {
 		return {
+			// eslint-disable-next-line @typescript-eslint/no-base-to-string
 			parsed_value: (raw_value || "").toString(),
 			parsable: true,
 			error: null,
 		};
 	}
 
-	predicate = predicates.string;
+	async getSealiousCreateValue(
+		fctx: FormControlContext
+	): Promise<string | null> {
+		const { parsed } = await this.getParsedValue(
+			fctx.ctx,
+			fctx.data.raw_values
+		);
+		return parsed || "";
+	}
+
+	async postSealiousCreate(
+		ctx: Context,
+		// eslint-disable-next-line @typescript-eslint/no-explicit-any
+		created_item: CollectionItem<any>
+	): Promise<void> {}
+
+	async postSealiousEdit(
+		ctx: Context,
+		// eslint-disable-next-line @typescript-eslint/no-explicit-any
+		edited_item: CollectionItem<any>
+	): Promise<void> {}
+
+	getControl(): DefaultControl {
+		return new SimpleInput(this, {
+			label: this.name,
+			type: this.type,
+		}) as unknown as DefaultControl;
+	}
 
 	public getEmptyValue(): string {
 		return "";
 	}
+}
 
-	constructor(required: Required) {
-		super(required);
+export class NumberBasedSimpleField<
+	Required extends boolean,
+	DefaultControl extends FormControl = SimpleInput,
+> extends SimpleFormField<Required, DefaultControl, number> {
+	async parse(
+		_: Context,
+		raw_value: FormDataValue
+	): Promise<FieldParseResult<number>> {
+		return {
+			parsed_value: parseFloat(raw_value as string) || 0,
+			parsable: true,
+			error: null,
+		};
+	}
+
+	async getSealiousCreateValue(
+		fctx: FormControlContext
+	): Promise<number | undefined> {
+		const { parsed } = await this.getParsedValue(
+			fctx.ctx,
+			fctx.data.raw_values
+		);
+		return parsed || 0;
+	}
+
+	async postSealiousCreate(): Promise<void> {}
+
+	async postSealiousEdit(): Promise<void> {}
+
+	getControl(): DefaultControl {
+		return new SimpleInput(this, {
+			label: this.name,
+			type: this.type,
+		}) as unknown as DefaultControl;
+	}
+
+	public getEmptyValue(): number {
+		return 0;
 	}
 }

package/src/forms/fields/single-reference.ts

@@ -0,0 +1,62 @@
+import { Collection, FieldTypes as SealiousFieldTypes } from "sealious";
+import { CollectionField } from "./collection-field.js";
+import { SingleReferenceDropdown } from "../controls/single-reference.js";
+import { FormControlContext } from "../controls/form-control.js";
+import { Context } from "koa";
+import { ExtractedFieldInfo } from "../../utils/extract-fields-from-collection.js";
+import { toPascalCase } from "js-convert-case";
+
+export class SingleReference<
+	TargetCollection extends Collection,
+	Required extends boolean,
+	F extends SealiousFieldTypes.SingleReference,
+> extends CollectionField<F, Required> {
+	getControl(): SingleReferenceDropdown<TargetCollection, F, Required> {
+		return new SingleReferenceDropdown(this, {
+			label: this.name,
+			getLabel: (item) => item.id,
+		});
+	}
+
+	async getSealiousCreateValue(
+		fctx: FormControlContext
+	): Promise<string | undefined> {
+		const { parsed } = await this.getParsedValue(
+			fctx.ctx,
+			fctx.data.raw_values
+		);
+		return parsed || undefined;
+	}
+
+	async sealiousValueToForm(_ctx: Context, value: string | null) {
+		return value || undefined;
+	}
+
+	generateImportsForFieldList(field_info: ExtractedFieldInfo) {
+		if (!field_info.target) {
+			throw new Error("Expected 'target' attribute in field info");
+		}
+		return [
+			{
+				what: toPascalCase(field_info.target),
+				from: "src/back/collections/collections.js",
+			},
+		];
+	}
+
+	generateFieldDeclaration(
+		field_info: ExtractedFieldInfo,
+		vars: { form_field_types: string; sealious_field: string }
+	): string {
+		if (!field_info.target) {
+			throw new Error("Expected 'target' attribute in field info");
+		}
+		return `new ${vars.form_field_types}.${
+			this.constructor.name
+		}<typeof ${toPascalCase(field_info.target)}, ${String(
+			field_info.is_required
+		)}, typeof ${vars.sealious_field}>(${String(field_info.is_required)}, ${
+			vars.sealious_field
+		})`;
+	}
+}

package/src/forms/fields/structured-array.ts

@@ -1,27 +1,120 @@
+/* eslint-disable  @typescript-eslint/no-explicit-any */
+/* eslint-disable  @typescript-eslint/no-unsafe-argument */
+/* eslint-disable @typescript-eslint/no-unsafe-return */
+/* eslint-disable @typescript-eslint/no-unsafe-call */
+/* eslint-disable @typescript-eslint/no-unsafe-member-access */
 import { Context } from "koa";
-import { Field, FieldsetOutput, FieldTypes } from "sealious";
+import {
+	Field as SealiousField,
+	FieldTypes as SealiousFieldTypes,
+	FieldsetInput,
+} from "sealious";
 import { FormDataValue } from "../form-types.js";
-import { FormField } from "./field.js";
+import { Table as TableControl } from "../controls/table.js";
+import {
+	sealiousToFormField,
+	SealiousToFormField,
+} from "./get-field-for-sealious.js";
+import { FormControl, FormControlContext } from "../controls/form-control.js";
+import { ExtractedFieldInfo } from "../../utils/extract-fields-from-collection.js";
+import { Table } from "./table.js";
 
-export class StructuredArrayField<
-	Fields extends Record<string, Field<unknown>>
-> extends FormField<
-	true,
-	FieldTypes.ArrayStorageInput<FieldsetOutput<Fields>>
-> {
-	constructor(public sealious_field: FieldTypes.StructuredArray<Fields>) {
-		super(true);
-	}
+export class StructuredArray<
+	SealiousFields extends Record<string, SealiousField<unknown>>,
+> extends Table<{
+	[name in keyof SealiousFields]: SealiousToFormField<SealiousFields[name]>;
+}> {
+	public sealious_field: SealiousFieldTypes.StructuredArray<SealiousFields>;
 
-	async parse(_context: Context, value: FormDataValue) {
-		return {
-			parsable: <const>true,
-			error: null,
-			parsed_value: (value as FieldsetOutput<Fields>) || [],
+	constructor(
+		sealious_field: SealiousFieldTypes.StructuredArray<SealiousFields>
+	) {
+		const columns = Object.fromEntries(
+			Object.entries(sealious_field.subfields).map(
+				([key, sealious_field]) => [
+					key,
+					sealiousToFormField(sealious_field),
+				]
+			)
+		) as {
+			[name in keyof SealiousFields]: SealiousToFormField<
+				SealiousFields[name]
+			>;
 		};
+		super(columns);
+		this.sealious_field = sealious_field;
+	}
+
+	getControl(): TableControl<{
+		[name in keyof SealiousFields]: SealiousToFormField<
+			SealiousFields[name]
+		>;
+	}> {
+		return new TableControl<{
+			[name in keyof SealiousFields]: SealiousToFormField<
+				SealiousFields[name]
+			>;
+		}>(this as any, {
+			label: this.name,
+			subfield_controls: Object.fromEntries(
+				Object.entries(this.columns).map(([column_name, subfield]) => [
+					column_name as keyof SealiousFields,
+					subfield.getControl(),
+				])
+			) as unknown as Record<keyof SealiousFields, FormControl>,
+			allow_adding: true,
+			make_new_row: () => ({}) as any,
+		});
+	}
+
+	generateFieldDeclaration(
+		_field_info: ExtractedFieldInfo,
+		vars: { form_field_types: string; sealious_field: string }
+	): string {
+		return `new ${vars.form_field_types}.${this.constructor.name}(${vars.sealious_field})`;
+	}
+
+	async getSealiousCreateValue(
+		fctx: FormControlContext
+	): Promise<
+		SealiousFieldTypes.ArrayStorageInput<FieldsetInput<SealiousFields>>
+	> {
+		const { parsed } = await this.getParsedValue(
+			fctx.ctx,
+			fctx.data.raw_values
+		);
+		return (
+			(parsed as SealiousFieldTypes.ArrayStorageInput<
+				FieldsetInput<SealiousFields>
+			>) || this.getEmptyValue()
+		);
 	}
 
-	getEmptyValue() {
-		return [] as FieldTypes.ArrayStorageInput<FieldsetOutput<Fields>>;
+	async sealiousValueToForm(
+		ctx: Context,
+		sealiousValue: Record<string, FormDataValue | null>[] | null
+	): Promise<FormDataValue> {
+		return Promise.all(
+			(sealiousValue || []).map(async (element) =>
+				Object.fromEntries(
+					await Promise.all(
+						Object.entries(element).map(async ([key, value]) => {
+							const form_subfield = this.columns[key];
+							if (!form_subfield) {
+								return [key, ""];
+							}
+							return [
+								key,
+								await form_subfield.sealiousValueToForm(
+									ctx,
+									value,
+									{} as any
+								),
+							];
+						})
+					)
+				)
+			)
+		);
 	}
 }

package/src/forms/fields/table.ts

@@ -2,21 +2,18 @@ import { is, predicates } from "@sealcode/ts-predicates";
 import { Context } from "koa";
 import { FormDataValue } from "../form-types.js";
 import { FieldParseResult, FormField } from "./field.js";
+import {
+	Table as TableControl,
+	TABLE_COLUMN_FIELD_INDEX_PLACEHOLDER,
+} from "../controls/table.js";
+import { FormControl } from "../controls/form-control.js";
 
 export type ExtractFormFieldParsed<Field extends FormField> =
-	Field extends FormField<
-		// eslint-disable-next-line @typescript-eslint/no-explicit-any
-		true,
-		infer T
-	>
+	Field extends FormField<true, infer T>
 		? NonNullable<T>
-		: Field extends FormField<
-				// eslint-disable-next-line @typescript-eslint/no-explicit-any
-				true,
-				infer T
-		  >
-		? T
-		: never;
+		: Field extends FormField<true, infer T>
+			? T
+			: never;
 
 export type TableFieldParsed<F extends Record<string, FormField>> = {
 	[field_name in keyof F]: ExtractFormFieldParsed<F[field_name]>;
@@ -34,6 +31,16 @@ export class Table<F extends Record<string, FormField>> extends FormField<
 		return [];
 	}
 
+	setName(name: string) {
+		super.setName(name);
+		for (const [column_name, field] of Object.entries(this.columns)) {
+			field.setName(
+				`${this.name}[${TABLE_COLUMN_FIELD_INDEX_PLACEHOLDER}][${column_name}]`
+			);
+		}
+		return this;
+	}
+
 	async parse(
 		ctx: Context,
 		raw_value: FormDataValue
@@ -51,10 +58,10 @@ export class Table<F extends Record<string, FormField>> extends FormField<
 			const row_data = raw_value[row_number];
 			const parsed_row: Record<string, unknown> = {};
 			if (!is(row_data, predicates.object)) {
-				console.log("table.ts<fields>:55", this.name);
+				// eslint-disable-next-line @typescript-eslint/no-base-to-string
 				throw new Error(`Expected object, got ${String(row_data)}`);
 			}
-			for (const key in row_data) {
+			for (const key of Object.keys(row_data)) {
 				const field = this.columns[key];
 				if (field == undefined) {
 					return {
@@ -80,13 +87,29 @@ export class Table<F extends Record<string, FormField>> extends FormField<
 						parsed_value: null,
 					};
 				}
-				// eslint-disable-next-line @typescript-eslint/consistent-type-assertions, @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-explicit-any
+				// eslint-disable-next-line @typescript-eslint/no-explicit-any
 				parsed_row[key] = parse_result.parsed_value as any;
 			}
-			// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
 			result.push(parsed_row as { [field_name in keyof F]: unknown });
 		}
 		const ret = { parsed_value: result, parsable: true, error: null };
 		return ret as FieldParseResult<TableFieldParsed<F>>;
 	}
+
+	getControl(): TableControl<F> {
+		return new TableControl<F>(this, {
+			label: this.name,
+			subfield_controls: Object.fromEntries(
+				Object.entries(this.columns).map(([column_name, field]) => [
+					column_name as keyof F,
+					field.getControl(),
+				])
+			) as Record<keyof F, FormControl>,
+			allow_adding: true,
+			make_new_row: async () =>
+				Object.fromEntries(
+					Object.keys(this.columns).map((key) => [key, ""])
+				) as Record<keyof F, string>,
+		});
+	}
 }

package/src/forms/fields/text.ts

@@ -0,0 +1,18 @@
+import { FormControlContext } from "../controls/form-control.js";
+import { TextBasedSimpleField } from "./simple-form-field.js";
+
+export class Text<
+	Required extends boolean,
+> extends TextBasedSimpleField<Required> {
+	constructor(required: Required) {
+		super(required, "text");
+	}
+
+	async getSealiousCreateValue(fctx: FormControlContext): Promise<string> {
+		const { parsed } = await this.getParsedValue(
+			fctx.ctx,
+			fctx.data.raw_values
+		);
+		return parsed || this.getEmptyValue();
+	}
+}

package/src/forms/fields/url.ts

@@ -0,0 +1,20 @@
+import { FormControlContext } from "../controls/form-control.js";
+import { TextBasedSimpleField } from "./simple-form-field.js";
+
+export class URLField<
+	Required extends boolean,
+> extends TextBasedSimpleField<Required> {
+	constructor(required: Required) {
+		super(required, "text");
+	}
+
+	async getSealiousCreateValue(
+		fctx: FormControlContext
+	): Promise<string | null> {
+		const { parsed } = await this.getParsedValue(
+			fctx.ctx,
+			fctx.data.raw_values
+		);
+		return parsed || null;
+	}
+}

package/src/forms/form-types.ts

@@ -1,6 +1,7 @@
 import { FilePointer } from "@sealcode/file-manager";
 import type { FlatTemplatable } from "tempstream";
 import type { FormField } from "./fields/field.js";
+import { FieldMessages } from "./controls/form-control.js";
 
 export type FormDataPrimitive =
 	| string
@@ -13,12 +14,11 @@ export type FormDataValue =
 	| FormDataPrimitive
 	| Record<string, FormDataPrimitive>;
 
-export type FieldValueType<F extends FormField> = F extends FormField<infer R>
-	? R
-	: never;
+export type FieldValueType<F extends FormField> =
+	F extends FormField<infer R> ? R : never;
 
 export type FormFieldsToValues<
-	F extends Record<string, FormField<boolean, keyof F>>
+	F extends Record<string, FormField<boolean, keyof F>>,
 > = {
 	[Property in keyof F]: FieldValueType<F[Property]>;
 };
@@ -28,6 +28,7 @@ export type FormMessage = { type: "info" | "success" | "error"; text: string };
 export type FormData<Fieldnames extends string = string> = {
 	raw_values: Record<Fieldnames, FormDataValue>;
 	messages: FormMessage[];
+	field_messages: FieldMessages<Fieldnames>;
 };
 
 export type FormReaction =

package/src/forms/form.test.ts

@@ -9,11 +9,11 @@ import { getBrowser } from "../utils/browser-creator.js";
 import { assertThrowsAsync } from "../utils/utils.js";
 import { FormDataValue } from "./form-types.js";
 import getPort from "get-port";
-import { SimpleFormField } from "./fields/simple-form-field.js";
+import { TextBasedSimpleField } from "./fields/simple-form-field.js";
 import { expect as PlaywritghtExpect } from "@playwright/test";
 
 const fields = {
-	text: new Fields.SimpleFormField(true),
+	text: new Fields.TextBasedSimpleField(true),
 };
 
 export function form_factory(canAccessFun?: Mountable["canAccess"]): Form<typeof fields, void> {
@@ -36,7 +36,7 @@ export function form_factory(canAccessFun?: Mountable["canAccess"]): Form<typeof
 }
 
 const port = await getPort();
-console.log("Using port " + port + " for form.test.ts");
+console.info("Using port " + port + " for form.test.ts");
 
 describe("form test", () => {
 	let page: Page;
@@ -91,7 +91,6 @@ describe("form test", () => {
 					},
 				}
 			);
-			console.log(res_axios.data);
 			if (!res_axios.data.includes("Some fields are invalid")) {
 				throw new Error("when sending a empty request with axios, the error didnt appear");
 			}
@@ -139,7 +138,6 @@ describe("form test", () => {
 						async (
 							ctx: Koa.Context
 						): Promise<{ canAccess: boolean; message: string }> => {
-							console.log("CAN ACCESS? FALSE");
 							return { canAccess: false, message: "" };
 						}
 					),
@@ -349,7 +347,7 @@ describe("form test", () => {
 				await page.getByPlaceholder("text").click();
 				await page.getByPlaceholder("text").fill("yes@an.email");
 				await page.getByRole("button", { name: "Submit" }).click();
-				assertThrowsAsync(async () => {
+				await assertThrowsAsync(async () => {
 					return page
 						.getByText("Please enter a proper email address")
 						.click({ timeout: 500 });
@@ -370,7 +368,7 @@ describe("form test", () => {
 			const router = new Router();
 
 			const fields = {
-				title: new SimpleFormField(true),
+				title: new TextBasedSimpleField(true),
 			};
 
 			mount(