@sealcode/sealgen 0.19.4 → 0.19.6

package/src/page/list.ts

@@ -1,15 +1,16 @@
-import { Context } from "koa";
-import { Templatable, tempstream, FlatTemplatable } from "tempstream";
-import { Page } from "./page.js";
 import { ShapeToType } from "@sealcode/ts-predicates";
+import { Context } from "koa";
+import qs from "qs";
+import { FlatTemplatable, Templatable, tempstream } from "tempstream";
 import { FormControl } from "../forms/controls/controls.js";
 import { FormField } from "../forms/fields/field.js";
-import { naturalNumbers, UrlWithNewParams } from "../utils/utils.js";
-import { makeHiddenInputs } from "../make-hidden-inputs.js";
-import qs from "qs";
 import { NumberField } from "../forms/fields/number.js";
 import { TextBasedSimpleField } from "../forms/fields/simple-form-field.js";
 import { FormDataValue } from "../forms/form-types.js";
+import { makeHiddenInputs } from "../make-hidden-inputs.js";
+import { naturalNumbers, UrlWithNewParams } from "../utils/utils.js";
+import { Page } from "./page.js";
+import Router from "@koa/router";
 
 export const BasePagePropsShape = <const>{};
 export type BasePageProps = ShapeToType<typeof BasePagePropsShape>;
@@ -72,8 +73,11 @@ export abstract class ListPage<
 	filterFields: Record<string, FormField> = {};
 	filterControls: FormControl[] = [];
 
-	init(): void {
-		super.init();
+	init(path: string, router: Router): void {
+		if (this.initialized) {
+			return;
+		}
+		super.init(path, router);
 		for (const [, field] of Object.entries(this.filterFields)) {
 			void field.init();
 		}
@@ -107,9 +111,9 @@ export abstract class ListPage<
 		}
 		const { itemsPerPage, page } = await this.getPaginationConfig(ctx);
 		const items_promise = this.getItems(ctx, page, itemsPerPage, values);
-		return tempstream`${(items
-			? Promise.resolve(items)
-			: items_promise
+		return tempstream`${(items ?
+			Promise.resolve(items)
+		:	items_promise
 		).then((items) =>
 			items.map((item, index) => this.renderItem(ctx, item, index))
 		)}`;
@@ -128,12 +132,12 @@ export abstract class ListPage<
 
 		return tempstream /* HTML */ `<div class="list-pagination">
 			<div class="list-pagination__left">
-				${page > 1
-					? this.renderPageButton(ctx, 1, "Pierwsza strona")
-					: ""}
-				${page > 1
-					? this.renderPageButton(ctx, page - 1, "Poprzednia strona")
-					: ""}
+				${page > 1 ?
+					this.renderPageButton(ctx, 1, "Pierwsza strona")
+				:	""}
+				${page > 1 ?
+					this.renderPageButton(ctx, page - 1, "Poprzednia strona")
+				:	""}
 			</div>
 			<div class="list-pagination__center">
 				<select
@@ -157,12 +161,12 @@ export abstract class ListPage<
 				</select>
 			</div>
 			<div class="list-pagination__right">
-				${page < totalIems
-					? this.renderPageButton(ctx, page + 1, "Następna strona")
-					: ""}
-				${page < totalIems
-					? this.renderPageButton(ctx, totalIems, "Ostatnia strona")
-					: ""}
+				${page < totalIems ?
+					this.renderPageButton(ctx, page + 1, "Następna strona")
+				:	""}
+				${page < totalIems ?
+					this.renderPageButton(ctx, totalIems, "Ostatnia strona")
+				:	""}
 			</div>
 		</div>`;
 	}
@@ -248,11 +252,12 @@ export abstract class ListPage<
 		const current_order =
 			current_sort?.field == field ? current_sort.order : null;
 		const order =
-			current_order === "asc" // cycles the sort order: null → "asc" → "desc" → null → ...
-				? "desc"
-				: current_order === null
-					? "asc"
-					: null;
+			(
+				current_order === "asc" // cycles the sort order: null → "asc" → "desc" → null → ...
+			) ?
+				"desc"
+			: current_order === null ? "asc"
+			: null;
 		return /* HTML */ `<th data-field="${field}">
 			<a href="${this.makeSortLink(ctx, field, order)}"
 				>${label}

package/src/page/mountable-with-fields.test.ts

@@ -11,8 +11,8 @@ describe("mountable-with-fields", () => {
 			required: new CollectionField(true, new FieldTypes.Text()),
 		};
 		new (class extends Form<typeof fields, void> {
-			fields = fields;
-			controls = [];
+			getFields = () => fields;
+			getControls = () => [];
 			async onSubmit(ctx: Context, form_values: FormData) {
 				const data = await this.getParsedValues(ctx);
 				// this should not throw a Typescript error

package/src/page/mountable-with-fields.ts

@@ -13,6 +13,7 @@ import type {
 	FormData,
 } from "../forms/form-types.js";
 import { Mountable } from "./mountable.js";
+import Router from "@koa/router";
 
 export type PageErrorMessage = { type: "access" | "internal"; message: string };
 
@@ -27,21 +28,41 @@ type ParsedValue<T extends FormField> = Resolved<
 export abstract class MountableWithFields<
 	F extends Fields = Fields,
 > extends Mountable {
+	getFields: () => F;
 	fields: F;
+	initialized = false;
 	field_names_prefix = ""; // useful for multiform, where many forms are merged into one and field assignment is made using the prefix
 	form_id = ""; // all fields within this mountable will be tied to form of this id
-	abstract controls: FormControl[];
+	abstract getControls: (fields: F) => FormControl[];
+	controls: FormControl[];
 
 	constructor() {
 		super();
 		if (!this.fields) this.fields = {} as F;
 	}
 
-	init(): void {
+	/** most routes should be setup using .mount(), but mount runs before
+        initialization so we don't yet have controls, app, etc ready for dynamic
+        routes **/
+	init(path: string, router: Router): void {
+		// we setup fields not on construction, but sometime after the app is
+		// initialized, as some field constructors require app data to fulle
+		// construct themselves
+		super.init(path, router);
+		if (this.initialized) {
+			return;
+		}
+		if (this.getFields) {
+			this.fields = this.getFields();
+		} else if (!this.fields) {
+			throw new Error("Fields not defined and getter not provided");
+		}
+		this.controls = this.getControls(this.fields);
 		for (const [field_name, field] of Object.entries(this.fields)) {
 			void field.init();
 			field.setName(field_name);
 		}
+		this.initialized = true;
 	}
 
 	makeFormControlContext(
@@ -145,9 +166,9 @@ export abstract class MountableWithFields<
 	): Promise<Record<string, FormDataValue>>;
 
 	async getParsedValues(ctx: Context): Promise<{
-		[field in keyof F]: F[field] extends FormField<true>
-			? Exclude<ParsedValue<F[field]>, null>
-			: ParsedValue<F[field]>;
+		[field in keyof F]: F[field] extends FormField<true> ?
+			Exclude<ParsedValue<F[field]>, null>
+		:	ParsedValue<F[field]>;
 	}> {
 		const raw_values = await this.extractRawValues(ctx);
 		const result: Record<string, unknown> = {};

package/src/page/mountable.ts

@@ -3,7 +3,7 @@ import Router from "@koa/router";
 import { Context } from "koa";
 
 export abstract class Mountable {
-	init(): void {}
+	init(_path: string, _router: Router): void {}
 	abstract mount(router: Router, path: string): void;
 
 	abstract canAccess(

package/src/page/page.ts

@@ -15,7 +15,7 @@ export abstract class Page<
 > extends MountableWithFields<F> {
 	propsParser: PagePropsParser<Record<keyof Fields, unknown>> =
 		new AllQueryParams();
-	controls = [];
+	getControls = () => [];
 
 	mount(router: Router, path: string): void {
 		router.get(path, async (ctx) => {

package/src/templates/form.ts

@@ -4,13 +4,12 @@ const defaults = {
 	postimport: `
          import { Fields } from "@sealcode/sealgen";
          import type {FormDataValue} from "@sealcode/sealgen";`,
-	fields: `
-           password: new Fields.Password(true),`,
-	controls: `
-		new Controls.SimpleInput(fields.password, {
+	get_fields: `()=>(<const>{ password: new Fields.Password(true) })`,
+	get_controls: `
+	()=><const>[new Controls.SimpleInput(fields.password, {
 			label: "Password:",
 			type: "password",
-}),`,
+})],`,
 	validate_method: `async validateValues(
 		ctx: Context,
 		data: Record<string, FormDataValue>
@@ -48,28 +47,20 @@ export async function formTemplate(
 	const params = { ...defaults, ..._params };
 	const content = `import type { Context } from "koa";
 import type { FormData } from "@sealcode/sealgen";
-import { Form,  Controls, fieldsToShape } from "@sealcode/sealgen";
+import { Form,  Controls } from "@sealcode/sealgen";
 import html from "src/back/html.js";
 
 ${params.postimport}
 
 export const actionName = "${action_name}";
 
-const fields = {
-    ${params.fields}
-};
-
-Form.initFieldNames(fields);
-
-export const ${action_name}Shape = fieldsToShape(fields);
+const getFields = ${params.get_fields};
 
-export default new (class ${action_name}Form extends Form<typeof fields, void> {
+export default new (class ${action_name}Form extends Form<ReturnType<typeof getFields>, void> {
 	defaultSuccessMessage = "Formularz wypełniony poprawnie";
-	fields = fields;
+    getFields = getFields;
 
-	controls = [
-		${params.controls}
-	];
+    getControls = ${params.get_controls};
 
    ${params.other_methods}
 

package/src/templates/shared/collection-create-form.ts

@@ -12,11 +12,11 @@ export async function createItemFormTemplate(
 ): Promise<string> {
 	const collection_fields =
 		await extract_fields_from_collection(collection_name);
-	const formFieldsVar = `${toPascalCase(collection_name)}FormFields`;
+	const formFieldsGetterVar = `get${toPascalCase(collection_name)}FormFields`;
 
 	return formTemplate(create_action_name, {
 		success_message: "Created!",
-		postimport: `import {${formFieldsVar}, get${toPascalCase(
+		postimport: `import {${formFieldsGetterVar}, get${toPascalCase(
 			collection_name
 		)}FormControls }from "./shared.js";
 
@@ -28,12 +28,12 @@ export async function createItemFormTemplate(
 		import {tempstream} from "tempstream";
 `,
 
-		fields: `...${toPascalCase(collection_name)}FormFields`,
-		controls: `
+		get_fields: `get${toPascalCase(collection_name)}FormFields`,
+		get_controls: `(fields: ReturnType<typeof getFields>)=>[
                 new Controls.FormHeader("Create ${toPascalCase(
 					collection_name
 				)}"), 
-                ...get${toPascalCase(collection_name)}FormControls()`,
+                ...get${toPascalCase(collection_name)}FormControls(this.fields)]`,
 
 		can_access: `canAccess = async (ctx: Context) => {
 			 const policy = ${toPascalCase(collection_name)}.getPolicy("create");
@@ -55,15 +55,15 @@ export async function createItemFormTemplate(
 		${collection_fields
 			.map((field_info) =>
 				field_info.form_field.generateCreateValueGetter(field_info, {
-					form_field_types: formFieldsVar,
+					form_field_types: "FormFieldTypes",
 					sealious_field: `fields${wrapAttribute(field_info.name)}`,
-					form_fields: "fields",
+					form_fields: "this.fields",
 				})
 			)
 			.join(",\n")} 
 			});
 
-   		for(const field of Object.values(${formFieldsVar})){
+   		for(const field of Object.values(this.fields)){
 			// eslint-disable-next-line no-await-in-loop
             await field.postSealiousCreate(ctx, created, formData)
         }

package/src/templates/shared/collection-edit-form.ts

@@ -12,12 +12,12 @@ export async function editItemFormTemplate(
 ): Promise<string> {
 	const collection_fields =
 		await extract_fields_from_collection(collection_name);
-	const formFieldsVar = `${toPascalCase(collection_name)}FormFields`;
+	const formFieldsGetterVar = `get${toPascalCase(collection_name)}FormFields`;
 	const collectionVar = `${toPascalCase(collection_name)}`;
 
 	return formTemplate(edit_action_name, {
 		success_message: "Changes saved!",
-		postimport: `import {${formFieldsVar}, get${toPascalCase(
+		postimport: `import {${formFieldsGetterVar}, get${toPascalCase(
 			collection_name
 		)}FormControls }from "../shared.js";
         import { ${collectionVar} } from "src/back/collections/collections.js";
@@ -27,12 +27,12 @@ export async function editItemFormTemplate(
 		import type { CollectionInputWithAllKeys } from "sealious";
 `,
 
-		fields: `...${toPascalCase(collection_name)}FormFields`,
-		controls: `
+		get_fields: formFieldsGetterVar,
+		get_controls: `(fields: ReturnType<typeof getFields>)=>[
                 new Controls.FormHeader("Edit ${toPascalCase(
 					collection_name
 				)}"), 
-                ...get${toPascalCase(collection_name)}FormControls()`,
+                ...get${toPascalCase(collection_name)}FormControls(this.fields)]`,
 
 		can_access: `canAccess = async (ctx: Context) => {
 			 const policy = ${toPascalCase(collection_name)}.getPolicy("edit");
@@ -67,7 +67,7 @@ export async function editItemFormTemplate(
 								sealious_field: `${collectionVar}.fields${wrapAttribute(
 									field_info.name
 								)}`,
-								form_fields: "fields",
+								form_fields: "this.fields",
 							}
 						)
 					)
@@ -77,7 +77,7 @@ export async function editItemFormTemplate(
 
                 await item.save(ctx.$context);
 
-				for(const field of Object.values(${formFieldsVar})){
+				for(const field of Object.values(this.fields)){
 				    // eslint-disable-next-line no-await-in-loop
 				await field.postSealiousEdit(ctx, item, formData)
 				}
@@ -95,7 +95,7 @@ export async function editItemFormTemplate(
             }
         `,
 
-		get_initial_values: `async getInitialValues(ctx: Context): Promise<{ [key in keyof typeof fields]: FormDataValue | undefined }>  {
+		get_initial_values: `async getInitialValues(ctx: Context): Promise<{ [key in keyof typeof this.fields]: FormDataValue | undefined }>  {
                const id = await this.getID(ctx);
 
                const {
@@ -116,7 +116,7 @@ export async function editItemFormTemplate(
 					.map((field_info) =>
 						field_info.form_field.generateInitialValue(field_info, {
 							form_field_types: "FieldTypes",
-							form_fields: "fields",
+							form_fields: "this.fields",
 						})
 					)
 					.join(",\n")}

package/src/templates/shared/collection-list.ts

@@ -25,9 +25,9 @@ export function makeDefaultFilterFields(
 		.map((field) => {
 			const type = field.type;
 			return `{ field: "${field.name}", ...${
-				type in DefaultListFilters
-					? `DefaultListFilters["${field.type}"]`
-					: `DefaultListFilters.fallback`
+				type in DefaultListFilters ?
+					`DefaultListFilters["${field.type}"]`
+				:	`DefaultListFilters.fallback`
 			} }`;
 		})
 		.join(",\n");
@@ -148,7 +148,8 @@ export default new (class ${action_name}Page extends SealiousItemListPage<
 	typeof ${uppercase_collection},
 	typeof BaseListPageFields
 > {
-	fields = BaseListPageFields;
+	getFields = ()=>BaseListPageFields;
+	getControls = ()=>[];
 
 	async renderFilters(ctx: Context): Promise<FlatTemplatable> {
 		const query_params = qs.parse(ctx.search.slice(1));

package/src/templates/shared/shared-crud-form-fields.ts

@@ -19,13 +19,13 @@ ${Array.from(
 			)
 			.flat()
 			.map(
-				({ what, from, as }) =>
-					`import {${what}${as ? ` as ${as}` : ""} } from "${from}"`
+				({ what, from, as, type }) =>
+					`import ${type ? "type " : ""}{${what}${as ? ` as ${as}` : ""} } from "${from}"`
 			)
 	).values()
 ).join(";\n")}
 
-export const ${toPascalCase(collection_name)}FormFields = <const>{
+export const get${toPascalCase(collection_name)}FormFields = () => <const>{
 	${collection_fields
 		.map((field_info) => {
 			return `${
@@ -40,11 +40,11 @@ export const ${toPascalCase(collection_name)}FormFields = <const>{
 		.join(",\n")}
 };
 
-const fields = ${toPascalCase(collection_name)}FormFields 
+const getFields = get${toPascalCase(collection_name)}FormFields 
 
 export const get${toPascalCase(
 		collection_name
-	)}FormControls: () => Controls.FormControl[] = () => [
+	)}FormControls: (fields: ReturnType<typeof getFields>) => Controls.FormControl[] = (fields) => [
 	${collection_fields
 		.map(({ name }) => `fields${wrapAttribute(name)}.getControl()`)
 		.join(",\n")}

package/src/utils/extract-fields-from-collection.ts

@@ -61,6 +61,9 @@ for (const field_name in c.fields){
     }
     if(type == "single-reference"){
 		target = field.target_collection;
+    }
+	if(type == "item-draft"){
+		target = field.target_collection_name;
     }
     if(type == "deep-reverse-single-reference" || type =="reverse-single-reference"){
 		target = field.target_collection;