@sealcode/sealgen 0.18.10 → 0.19.2

package/lib/utils/extract-fields-from-collection.js

@@ -3,15 +3,20 @@ import { exec } from "./utils.js";
 const target_locreq = _locreq(process.cwd());
 import { promises as fs } from "fs";
 import { is, predicates } from "@sealcode/ts-predicates";
+import { sealiousFieldInfoToFormField } from "../forms/fields/get-field-for-sealious.js";
 const counter = function* () {
   let i = 0;
   while (true) {
     yield i++;
   }
 }();
+const cache = {};
 async function extract_fields_from_collection(collection_name) {
+  if (cache[collection_name]) {
+    return cache[collection_name];
+  }
   const extractor_code = `import {default as the_app} from "./app.js";
-const c = new the_app().collections["${collection_name}"];
+	const c = new the_app({}).collections["${collection_name}"];
 const fields = [];
 for (const field_name in c.fields){
     let field = c.fields[field_name];
@@ -21,14 +26,17 @@ for (const field_name in c.fields){
     let referencing_field = null;
     let intermediary_field_that_points_there = null;
     let is_readonly = false;
-    let is_required = field.required;
+    let is_required = field.required || false;
     let subfields = [];
-    if(["derived-value", "cached-value", "settable-by"].includes(type)){
+    if(["derived-value", "cached-value", "settable-by",  "control-access"].includes(type)){
 	    type = field.virtual_field.typeName;
     }
     if(["derived-value", "cached-value", "reverse-single-reference"].includes(field.typeName)){
 	    is_readonly = true;
     }
+    if(type == "single-reference"){
+		target = field.target_collection;
+    }
     if(type == "deep-reverse-single-reference" || type =="reverse-single-reference"){
 		target = field.target_collection;
         referencing_collection = field.referencing_collection;
@@ -46,24 +54,56 @@ for (const field_name in c.fields){
     `dist/back/___extract_fields--${counter.next().value || 0}.js`
   );
   await fs.writeFile(extractor_code_path, extractor_code);
-  const { stdout } = await exec("node", [extractor_code_path]);
-  await fs.unlink(extractor_code_path);
-  const ret = JSON.parse(stdout);
-  if (!is(
-    ret,
-    predicates.array(
-      predicates.shape({
-        name: predicates.string,
-        type: predicates.string,
-        is_readonly: predicates.boolean
-      })
-    )
-  )) {
-    throw new Error(
-      "Encountered a problem while extracting the names of fields from collection. Got: " + stdout
+  const result = exec("node", [extractor_code_path]).then(async ({ stdout }) => {
+    await fs.unlink(extractor_code_path);
+    const ret = JSON.parse(stdout);
+    if (!is(
+      ret,
+      predicates.array(
+        predicates.shape({
+          name: predicates.string,
+          type: predicates.string,
+          is_readonly: predicates.boolean,
+          target: predicates.or(
+            predicates.string,
+            predicates.null
+          ),
+          referencing_collection: predicates.or(
+            predicates.string,
+            predicates.null
+          ),
+          referencing_field: predicates.or(
+            predicates.string,
+            predicates.null
+          ),
+          is_required: predicates.boolean,
+          intermediary_field_that_points_there: predicates.or(
+            predicates.string,
+            predicates.null
+          ),
+          subfields: predicates.array(
+            predicates.shape({ name: predicates.string })
+          )
+        })
+      )
+    )) {
+      throw new Error(
+        "Encountered a problem while extracting the names of fields from collection. Got: " + stdout
+      );
+    }
+    const result2 = await Promise.all(
+      ret.map(async (field_info) => ({
+        ...field_info,
+        form_field: await sealiousFieldInfoToFormField(field_info)
+      }))
     );
-  }
-  return ret;
+    return result2;
+  }).catch((e) => {
+    console.error("ERROR", e);
+    process.exit(1);
+  });
+  cache[collection_name] = result;
+  return result;
 }
 export {
   extract_fields_from_collection as default

package/lib/utils/make-slug.js

@@ -1,5 +1,5 @@
 function makeSlug(t) {
-  return t.replaceAll(/\P{General_Category=Letter}/g, "-").replaceAll(/-+/g, "-");
+  return t.replaceAll(/\P{General_Category=Letter}/gu, "-").replaceAll(/-+/g, "-");
 }
 export {
   makeSlug

package/lib/utils/wrap-attributes.js

@@ -0,0 +1,20 @@
+function needsQuotes(str) {
+  try {
+    new Function(`var obj = { ${str}: 1 };`);
+    return false;
+  } catch {
+    return true;
+  }
+}
+function wrapAttribute(name) {
+  return needsQuotes(name) ? `["${name}"]` : `.${name}`;
+}
+function wrapKeyName(name) {
+  return needsQuotes(name) ? `["${name}"]` : `${name}`;
+}
+export {
+  needsQuotes,
+  wrapAttribute,
+  wrapKeyName
+};
+//# sourceMappingURL=wrap-attributes.js.map

package/lib/utils/write-file.js

@@ -3,7 +3,7 @@ import { resolve } from "path";
 async function writeFile(path, content) {
   await fs.mkdir(resolve(path, "../"), { recursive: true });
   await fs.writeFile(path, content);
-  console.log(`${path} created`);
+  console.info(`${path} created`);
 }
 export {
   writeFile

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@sealcode/sealgen",
-	"version": "0.18.10",
+	"version": "0.19.2",
 	"description": "Module to automate adding routes and collections to a sealious application",
 	"main": "lib/index.js",
 	"type": "module",
@@ -39,13 +39,13 @@
 		"@types/wcag-contrast": "^3.0.3",
 		"@types/ws": "^8.5.10",
 		"@types/yargs": "^17.0.32",
-		"@typescript-eslint/eslint-plugin": "^5.58.0",
-		"@typescript-eslint/parser": "^5.58.0",
+		"@typescript-eslint/eslint-plugin": "^8.44.0",
+		"@typescript-eslint/parser": "^8.44.0",
 		"axios": "^1.6.7",
 		"chalk": "^5.3.0",
-		"eslint": "^7.32.0",
-		"eslint-config-prettier": "^8.3.0",
-		"eslint-plugin-prettier": "^3.4.1",
+		"eslint": "^9.36.0",
+		"eslint-config-prettier": "^8.10.2",
+		"eslint-plugin-prettier": "^5.5.4",
 		"eslint-plugin-with-tsc-error": "^0.0.7",
 		"get-port": "^5.1.1",
 		"koa-body": "^5.0.0",
@@ -55,7 +55,8 @@
 		"playwright": "^1.29.2",
 		"source-map-support": "^0.5.21",
 		"ts-node": "^10.9.1",
-		"typescript": "^4.7",
+		"typescript": "5.9",
+		"typescript-eslint": "^8.44.0",
 		"wait-port": "^1.0.4"
 	},
 	"types": "./@types/index.d.ts",
@@ -77,7 +78,7 @@
 		"locreq": "^3.0.0",
 		"md5": "^2.3.0",
 		"merge": "^2.1.1",
-		"prettier": "^2.7.1",
+		"prettier": "^3.6.2",
 		"prompts": "^2.4.2",
 		"recursive-readdir": "^2.2.3",
 		"tempfile": "^5.0.0",
@@ -90,6 +91,7 @@
 	"peerDependencies": {
 		"koa": "^2.13.0",
 		"koa-responsive-image-router": "^0.2.24",
-		"sealious": "^0.21"
+		"sealious": "^0.21.20",
+		"stimulus": "^3.2.2"
 	}
 }

package/src/add-collection.ts

@@ -25,8 +25,7 @@ export async function addCollection(
 		},
 	]);
 
-	// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
-	const collection_name: string = response.collection_name;
+	const collection_name: string = response.collection_name as string;
 
 	if (!collection_name) {
 		throw new Error("Empty collection name, please try again");
@@ -36,7 +35,6 @@ export async function addCollection(
 	);
 
 	if (existsSync(file_path)) {
-		// eslint-disable-next-line no-console
 		console.error(`ERROR: File ${file_path} already exists.`);
 		return;
 	}

package/src/add-crud.ts

@@ -1,19 +1,16 @@
 import _locreq from "locreq";
-import prompts from "prompts";
-
 import { escape_url_params } from "./utils/escape-url-params.js";
+import prompts from "prompts";
 import { toKebabCase, toPascalCase } from "js-convert-case";
 import { listCollections } from "./utils/list-collections.js";
-import {
-	makeDefaultDisplayFields,
-	makeDefaultFilterFields,
-} from "./templates/shared/collection-list.js";
+import { collectionListTemplate } from "./templates/shared/collection-list.js";
 import { writeFile } from "./utils/write-file.js";
-import { extractCollectionClassname } from "./generate-collections.js";
-import extract_fields_from_collection from "./utils/extract-fields-from-collection.js";
-import { getFieldHandler } from "./templates/shared/shared-crud-form-fields.js";
+import { curryImportPath, importPath } from "./utils/import-path.js";
+import { sharedCrudFormFields } from "./templates/shared/shared-crud-form-fields.js";
 import { generateRoutes } from "./generate-routes.js";
-import { formatWithPrettier } from "./utils/prettier.js";
+import { createItemFormTemplate } from "./templates/shared/collection-create-form.js";
+import { editItemFormTemplate } from "./templates/shared/collection-edit-form.js";
+import { itemDeleteTemplate } from "./templates/shared/item-delete.js";
 
 export async function addCRUD(
 	params: Partial<{ [key in "collection" | "url"]: string }>,
@@ -27,9 +24,7 @@ export async function addCRUD(
 			name: "collection",
 			message:
 				"Which sealious collection do you like to add CRUD forms for?",
-			choices: (
-				await listCollections()
-			).map((collection) => ({
+			choices: (await listCollections()).map((collection) => ({
 				title: collection,
 				value: collection,
 			})),
@@ -38,7 +33,7 @@ export async function addCRUD(
 			type: "text",
 			name: "url",
 			message:
-				"Enter a full absolute path for the new route (for example: /admin/users/): ",
+				"Enter a full absolute path for the new route (for example: /admin/users/:id/edit): ",
 			validate: (s: string) =>
 				s.trim()[0] == "/" ? true : "Should start with a '/'",
 			initial: function (_, { collection }: { collection: string }) {
@@ -46,103 +41,92 @@ export async function addCRUD(
 			},
 		},
 	]);
-
 	const collection_name = response.collection as string;
 	const url = response.url as string;
+	const list_action_name = toPascalCase(collection_name) + "CRUDList";
+	const create_action_name = toPascalCase(collection_name) + "CRUDCreate";
+	const edit_action_name = toPascalCase(collection_name) + "CRUDEdit";
+	const delete_action_name = toPascalCase(collection_name) + "CRUDDelete";
 
 	/* create the list endpoint */
 	const list_path = target_locreq.resolve(
-		`src/back/routes/${escape_url_params(url)}/index.page.ts`
+		`src/back/routes/${escape_url_params(url)}/index.list.tsx`
 	);
-	const [uppercase_collection, collection_fields] = await Promise.all([
-		extractCollectionClassname(
-			target_locreq.resolve(
-				"src/back/collections/" + collection_name + ".ts"
-			)
-		),
-		extract_fields_from_collection(collection_name),
-	]);
-
-	const field_handler_results = await Promise.all(
-		collection_fields.map(async (field) => {
-			return getFieldHandler(
-				collection_name,
-				field,
-				(p) => p,
-				"edit_fields"
-			);
-		})
+	const list_content = await collectionListTemplate(
+		collection_name,
+		list_action_name,
+		list_path,
+		{
+			post_import_js: `import { ${create_action_name}URL, ${edit_action_name}URL, ${delete_action_name}URL } from "${importPath(
+				list_path,
+				"src/back/routes/urls.ts"
+			)}";`,
+			post_header_html: `<a href={${create_action_name}URL}> Create </a>`,
+			render_item: (
+				collection_name: string
+			) => `	async renderItem(ctx: Context, item: CollectionItem<typeof ${toPascalCase(
+				collection_name
+			)}>) {
+					   return <tr>
+						   {displayFields.map(({ field, format }) => {
+							   // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment, @typescript-eslint/consistent-type-assertions, @typescript-eslint/no-explicit-any
+							   const value = item.get(field as any);
+							   return <td>{format ? format(value, item) : value}</td>;
+						   })}
+                           <td><div class="sealious-list__actions">
+                               <a href={${edit_action_name}URL(item.id)}>Edit</a>
+                               <a data-turbo-method="POST" data-turbo-confirm="Delete item?" href={${delete_action_name}URL(item.id)}>Delete</a>
+                               </div>
+                           </td>
+					   </tr>;
+				   }`,
+		}
 	);
+	await writeFile(list_path, list_content);
 
-	const list_content = `import { CRUD } from "@sealcode/crud-ui";
-import type { CollectionItem } from "sealious";
-import type { ListFilterRender } from "@sealcode/sealgen";
-import { Controls, DefaultListFilters, Fields } from "@sealcode/sealgen";
-import { ${toPascalCase(
-		collection_name
-	)} } from "src/back/collections/collections.js";
-import html from "src/back/html.js";
-
-export const actionName = "${toPascalCase(collection_name)}CRUD";
-
-const edit_fields = <const>
-{
-	${field_handler_results
-		.filter(({ hide_field }) => !hide_field)
-		.map(({ field }) => field)
-		.filter((e) => e != "")
-		.join(",\n")}
-};
-
-
-const edit_controls = [
-	${field_handler_results
-		.filter(({ hide_control }) => !hide_control)
-		.map(({ controls }) => controls)
-		.filter((e) => e != "")
-		.join(",\n")}
-]
+	/* create the shared fields file */
+	const fields_path = target_locreq.resolve(
+		`src/back/routes/${escape_url_params(url)}/shared.ts`
+	);
+	const fields_content = await sharedCrudFormFields(collection_name);
+	await writeFile(fields_path, fields_content);
 
-// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
-const fields_for_display = [
-${makeDefaultDisplayFields(collection_fields)}
-] as {
-	field: keyof (typeof ${toPascalCase(collection_name)})["fields"];
-	label: string;
-	format?: (value: unknown, item: CollectionItem<typeof ${toPascalCase(
-		collection_name
-	)}>) => string | Promise<string>;
-}[];
+	/* create the create endpoint */
+	const create_path = target_locreq.resolve(
+		`src/back/routes/${escape_url_params(url)}/create.form.ts`
+	);
+	const create_content = await createItemFormTemplate(
+		create_action_name,
+		create_path,
+		collection_name,
+		list_action_name
+	);
+	await writeFile(create_path, create_content);
 
-// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
-const fields_for_filters = [
-     ${makeDefaultFilterFields(collection_fields)}
-] as {
-	field: keyof (typeof ${uppercase_collection})["fields"];
-	render?: ListFilterRender;
-	prepareValue?: (filter_value: unknown)=>unknown; // set this function to change what filter value is passed to Sealious
-}[];
+	/* create the edit endpoint */
+	const edit_path = target_locreq.resolve(
+		`src/back/routes/${escape_url_params(url)}/[id]/edit.form.ts`
+	);
+	const edit_content = await editItemFormTemplate(
+		edit_action_name,
+		edit_path,
+		collection_name,
+		list_action_name
+	);
+	await writeFile(edit_path, edit_content);
 
-export default new CRUD({
-	collection: ${toPascalCase(collection_name)},
-	nice_collection_name: "${toPascalCase(collection_name)}",
-	fields_for_display,
-	fields_for_filters,
-	html,
-	list_title: "${toPascalCase(collection_name)} list",
-	edit_title: "Edit",
-	edit_button_text: "Edit",
-	delete_button_text: "Delete",
-	back_to_list_button_text: "← Back to ${toPascalCase(collection_name)} list",
-	edit_fields,
-	edit_controls,
-	form_value_to_sealious_value: {},
-	sealious_value_to_form_value: {},
-	post_edit: async () => {},
-	post_create: async () => {},
-});
-`;
-	await writeFile(list_path, await formatWithPrettier(list_content));
+	/* create the actual delete endpoint */
+	const delete_path = target_locreq.resolve(
+		`src/back/routes/${escape_url_params(url)}/[id]/delete.page.tsx`
+	);
+	const base_import_path = curryImportPath(delete_path);
+	const delete_content = await itemDeleteTemplate(
+		delete_action_name,
+		collection_name,
+		list_action_name,
+		base_import_path
+	);
+	await writeFile(delete_path, delete_content);
 
 	await generateRoutes();
 }

package/src/add-jdd-component.ts

@@ -19,12 +19,11 @@ export async function addJDDComponent(): Promise<void> {
 	);
 
 	if (existsSync(file_path)) {
-		// eslint-disable-next-line no-console
 		console.error(`ERROR: File ${file_path} already exists.`);
 		return;
 	}
 	await fs.mkdir(resolve(file_path, "../"), { recursive: true });
-	await fs.writeFile(file_path, jddComponentTemplate(component_name));
+	await fs.writeFile(file_path, await jddComponentTemplate(component_name));
 
 	const css_file_path = target_locreq.resolve(
 		`src/back/jdd-components/${toKebabCase(component_name)}/${toKebabCase(
@@ -36,8 +35,8 @@ export async function addJDDComponent(): Promise<void> {
 		`.${toKebabCase(component_name)} {
 }`
 	);
-	// eslint-disable-next-line no-console
-	console.log(`Created ${file_path}`);
-	console.log(`Created ${css_file_path}`);
+
+	console.info(`Created ${file_path}`);
+	console.info(`Created ${css_file_path}`);
 	await generateComponents();
 }

package/src/add-list-route.test.ts

@@ -4,7 +4,7 @@ import { RealAppTest } from "./test_utils/test-on-real-app.js";
 import { collectionTemplate } from "./templates/collection.js";
 import assert from "node:assert";
 
-describe("single-reference.test", () => {
+describe("single-reference", () => {
 	let page: Page;
 	before(async () => {
 		const browser = await getBrowser();

package/src/add-route.ts

@@ -2,7 +2,6 @@ import { existsSync, promises as fs } from "fs";
 import _locreq from "locreq";
 import { resolve } from "path";
 import { generateRoutes } from "./generate-routes.js";
-import { testTemplate } from "./templates/route-test.js";
 import { escape_url_params } from "./utils/escape-url-params.js";
 import prompts from "prompts";
 import { Templates } from "./templates/templates.js";
@@ -68,28 +67,19 @@ export async function addRoute(
 	const test_file_path = target_locreq.resolve(
 		`src/back/routes/${base_file_name}.test.ts`
 	);
-	const template = Templates[mode as keyof typeof Templates];
+	const template = Templates[mode];
 
 	if (!template) {
 		throw new Error(`Could not get template ${mode}`);
 	}
 
 	if (existsSync(file_path)) {
-		// eslint-disable-next-line no-console
 		console.error(`ERROR: File ${file_path} already exists.`);
 		return;
 	}
 	await fs.mkdir(resolve(file_path, "../"), { recursive: true });
 	await fs.writeFile(file_path, await template(action, file_path));
-	if (mode !== "lpr" && mode !== "jdd-editor") {
-		await fs.writeFile(
-			test_file_path,
-			await testTemplate(action, file_path)
-		);
-	}
-	// eslint-disable-next-line no-console
-	console.log(`${file_path} created`);
-	// eslint-disable-next-line no-console
-	console.log(`${test_file_path} created`);
+	console.info(`${file_path} created`);
+	console.info(`${test_file_path} created`);
 	await generateRoutes();
 }

package/src/build.ts

@@ -64,7 +64,7 @@ async function build(watch: boolean): Promise<void> {
 		copy_to_public.map(async ({ from, to }) => {
 			try {
 				await fs.stat(resolve(project_dir, "public", to));
-			} catch (e) {
+			} catch (_e) {
 				await fs.mkdir(resolve(project_dir, "public", to, "../"), {
 					recursive: true,
 				});
@@ -94,12 +94,14 @@ async function build(watch: boolean): Promise<void> {
 	];
 	await Promise.all(builders.map((b) => b.build()));
 	if (watch) {
-		const watcher = chokidar.watch("src", { ignoreInitial: true });
+		const watcher = chokidar.watch(["src", ...controller_dirs], {
+			ignoreInitial: true,
+		});
 		const port = await get_notifier_port();
 		const notifier = make_notifier(port, 8080); // TODO: parse the app config to get the actual port
 		await write_notifier_config(watch, port);
 		watcher.on("all", (_, file_path) => {
-			console.log("Detected a change!", file_path);
+			console.info("Detected a change!", file_path);
 			builders.forEach((builder) => {
 				const owns_a_file = builder.ownsFile(file_path);
 				if (owns_a_file) {
@@ -123,7 +125,7 @@ export async function buildProject({
 	try {
 		await build(watch);
 	} catch (e) {
-		console.log("CAUGHT!");
+		console.error("CAUGHT!");
 		// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
 		console.error(e.message);
 		if (!watch) {

package/src/builders/backend-ts-builder.ts

@@ -27,7 +27,6 @@ export class BackendTSBuilder extends Builder {
 		);
 	}
 
-	// eslint-disable-next-line @typescript-eslint/no-empty-function
 	async dispose(): Promise<void> {}
 
 	async _build(): Promise<void> {

package/src/builders/builder.ts

@@ -4,7 +4,10 @@ export abstract class Builder {
 	abstract _build(): Promise<void>;
 	abstract dispose(): Promise<void>;
 
-	constructor(public project_dir: string, public style_dirs: string[]) {}
+	constructor(
+		public project_dir: string,
+		public style_dirs: string[]
+	) {}
 
 	public ongoing_build: Promise<void> | null = null;
 

package/src/builders/colors-builder.ts

@@ -1,4 +1,3 @@
-/* eslint-disable @typescript-eslint/no-non-null-assertion */
 import { build } from "esbuild";
 import tempfile from "tempfile";
 import { promises as fs } from "fs";
@@ -26,7 +25,6 @@ export class ColorsBuilder extends Builder {
 		return file_path == COLORS_TS_PATH;
 	}
 
-	// eslint-disable-next-line @typescript-eslint/no-empty-function
 	async dispose(): Promise<void> {}
 
 	async _build() {
@@ -242,8 +240,12 @@ export class ColorsBuilder extends Builder {
 
 								.hex {
 									padding: 8px;
-									font-family: Menlo, Consolas, Monaco,
-										Liberation Mono, Lucida Console,
+									font-family:
+										Menlo,
+										Consolas,
+										Monaco,
+										Liberation Mono,
+										Lucida Console,
 										monospace;
 									opacity: 0.5;
 									visibility: hidden;
@@ -433,16 +435,16 @@ export class ColorsBuilder extends Builder {
 								)
 									? \`var(--color-\${box.getAttribute(
 											"data-color-group-name"
-									  )}-\${box.getAttribute(
+										)}-\${box.getAttribute(
 											"data-color-name"
-									  )})\`
+										)})\`
 									: \`var(--color-\${box.getAttribute(
 											"data-color-group-name"
-									  )}-\${box.getAttribute(
+										)}-\${box.getAttribute(
 											"data-color-name"
-									  )}-\${box.getAttribute(
+										)}-\${box.getAttribute(
 											"data-color-shade-number"
-									  )})\`;
+										)})\`;
 								navigator.clipboard.writeText(css_var);
 								pop_toast();
 							}

package/src/builders/css-builder.ts

@@ -7,7 +7,10 @@ import { Builder } from "./builder.js";
 
 export class CSSClump {
 	public files: string[] = [];
-	constructor(public project_dir: string, public name: string) {}
+	constructor(
+		public project_dir: string,
+		public name: string
+	) {}
 
 	addFile(full_path: string) {
 		this.files.push(full_path);

package/src/builders/fonts-builder.ts

@@ -10,7 +10,6 @@ export class FontsBuilder extends Builder {
 		return file_path == FONTS_CONFIG_PATH;
 	}
 
-	// eslint-disable-next-line @typescript-eslint/no-empty-function
 	async dispose(): Promise<void> {}
 
 	async _build() {