@sealcode/sealgen 0.19.18 → 0.19.20

package/@types/add-crud.test.d.ts

@@ -0,0 +1 @@
+export {};

package/@types/controllers/sealgen-table.stimulus.d.ts

@@ -4,6 +4,10 @@ export default class TableController extends Controller {
     tableTarget: HTMLTableElement;
     templateTarget: HTMLTemplateElement;
     getTbody(): HTMLTableSectionElement;
+    getRowIndex(tr: HTMLTableRowElement): number;
     addRow(): void;
-    swapRows(e: MouseEvent): void;
+    swapRows(index_a: number, index_b: number): void;
+    moveUp(e: MouseEvent): void;
+    moveDown(e: MouseEvent): void;
+    reindex(): void;
 }

package/@types/index.d.ts

@@ -45,3 +45,4 @@ export interface HTMLArgs {
     hideNavigation?: boolean;
 }
 export type HTMLFunc = (args: HTMLArgs) => Readable | Promise<Readable>;
+export type BreadcrumbLabel = string | ((ctx: Context) => Promise<string>);

package/lib/generate-routes.js

@@ -5,8 +5,8 @@ import { walkDir } from "./utils/walk.js";
 import { importPath } from "./utils/import-path.js";
 import { assertType, predicates } from "@sealcode/ts-predicates";
 import { unescape_url_params } from "./utils/escape-url-params.js";
-import { formatWithPrettier } from "./utils/prettier.js";
 import { Templates } from "./templates/templates.js";
+import { formatWithPrettier } from "./utils/prettier.js";
 const target_locreq = _locreq(process.cwd());
 async function extractActionName(full_file_path) {
   const file_content = await fs.readFile(full_file_path, "utf-8");
@@ -49,6 +49,12 @@ function sortRoutes(urls) {
     return encoded1 < encoded2 ? -1 : 1;
   });
 }
+const getPathToBuiltFile = (filePath) => {
+  const rootPath = target_locreq.resolve("");
+  const relativePath = relative(rootPath, filePath);
+  const distPath = relativePath.replace(/^src[\\/]/, "dist/");
+  return distPath.replace(/\.(ts|tsx)$/, ".js");
+};
 async function generateRoutes() {
   const files = await Promise.all(
     (await walkDir(target_locreq.resolve("src/back/routes"))).filter(
@@ -58,6 +64,7 @@ async function generateRoutes() {
     ).map(async (fullpath) => ({
       fullpath,
       actionName: await extractActionName(fullpath),
+      module_path: getPathToBuiltFile(fullpath),
       // trailing slash is important here, as it enables to use the entire path while building relative URLs. For example, while visiting /users/123, the path ./add-photo leads to /users/add-photo. While visiting /users/123/ (note the trailing slash), the path ./add-photo leads to /users/123/add-photo
       url: unescape_url_params(
         "/" + relative(
@@ -71,7 +78,7 @@ async function generateRoutes() {
     }))
   );
   const url_tree = { children: {} };
-  sortRoutes(files).forEach(({ actionName, url }) => {
+  sortRoutes(files).forEach(({ actionName, url, module_path }) => {
     const elements = url.split("/").filter((e) => e != "");
     let pointer = url_tree;
     for (const [index, element] of elements.entries()) {
@@ -81,6 +88,7 @@ async function generateRoutes() {
       pointer = pointer.children[element];
       if (index == elements.length - 1) {
         pointer.actionName = actionName;
+        pointer.module_path = module_path;
       }
     }
   });
@@ -88,6 +96,7 @@ async function generateRoutes() {
 
 export type URLTree = {
    actionName?: string;
+   module_path?: string;
    children: { [key: string]: URLTree };
 };
 export const url_tree = ${JSON.stringify(url_tree)};

package/lib/templates/form.js

@@ -41,13 +41,13 @@ const defaults = {
 async function formTemplate(action_name, _params = defaults) {
   const params = { ...defaults, ..._params };
   const content = `import type { Context } from "koa";
-import type { FormData } from "@sealcode/sealgen";
+import type { FormData, BreadcrumbLabel } from "@sealcode/sealgen";
 import { Form,  Controls } from "@sealcode/sealgen";
 import html from "src/back/html.js";
-
 ${params.postimport}
 
 export const actionName = "${action_name}";
+export const breadcrumbLabel: BreadcrumbLabel = "${action_name}";
 
 const getFields = ${params.get_fields};
 

package/lib/templates/jdd-editor.js

@@ -48,12 +48,14 @@ import type { FieldNames } from "sealious";
 import { TempstreamJSX } from "tempstream";
 import type ${collectionClassName} from "src/back/collections/${collection_name}.js";
 import { EditJDDField } from "@sealcode/jdd-editor";
+import type { BreadcrumbLabel } from "@sealcode/sealgen";
 import html from "src/back/html.js";
 import { registry } from "src/back/jdd-components/registry.js";
 import { makeJDDContext } from "src/back/jdd-context.js";
 import { defaultHead } from "src/back/defaultHead.js";
 
 export const actionName = "${actionName}";
+export const breadcrumbLabel: BreadcrumbLabel = "${actionName}";
 
 export default new (class JDDCreatePreviewPage extends EditJDDField<${collectionClassName}> {
 	getCollection(ctx: Context) {

package/lib/templates/long-running-process.js

@@ -5,10 +5,12 @@ async function LongRunningProcessTemplate(action_name, newfilefullpath) {
   return `import { Context } from "koa";
 import { TempstreamJSX } from "tempstream";
 import { Page } from "@sealcode/sealgen";
+import type { BreadcrumbLabel } from "@sealcode/sealgen";
 import html from "${rel("src/back/html.js")}";
 import { LongRunningProcess } from "sealious";
 
 export const actionName = "${action_name}";
+export const breadcrumbLabel: BreadcrumbLabel = "${action_name}";
 
 export default new (class PatroniteAutoImportStatusPage extends Page {
 	// eslint-disable-next-line @typescript-eslint/no-unused-vars

package/lib/templates/multiform.js

@@ -4,9 +4,11 @@ async function multiformTemplate(action_name, newfilefullpath) {
   return `import { Context } from "koa";
 import html from "${rel("src/back/html.js")}";
 import { Controls, Fields, Form, FormMessage, Multiform } from "@sealcode/sealgen";
+import type { BreadcrumbLabel } from "@sealcode/sealgen";
 import { FlatTemplatable } from "tempstream";
 
 export const actionName = "${action_name}";
+export const breadcrumbLabel: BreadcrumbLabel = "${action_name}";
 
 const fields1 = {
 	email: new Fields.TextBasedSimpleField(true),

package/lib/templates/page.js

@@ -2,9 +2,11 @@ async function pageTemplate(action_name) {
   return `import type { Context } from "koa";
 import { TempstreamJSX } from "tempstream";
 import { Page } from "@sealcode/sealgen";
+import type { BreadcrumbLabel } from "@sealcode/sealgen";
 import html from "src/back/html.js";
 
 export const actionName = "${action_name}";
+export const breadcrumbLabel: BreadcrumbLabel = "${action_name}";
 
 export default new (class ${action_name}Page extends Page {
 	// eslint-disable-next-line @typescript-eslint/no-unused-vars

package/lib/templates/post.js

@@ -1,9 +1,11 @@
 async function postTemplate(action_name) {
   return `import type { Context } from "koa";
 import { Mountable } from "@sealcode/sealgen";
+import type { BreadcrumbLabel } from "@sealcode/sealgen";
 import type Router from "@koa/router";
 
 export const actionName = "${action_name}";
+export const breadcrumbLabel: BreadcrumbLabel = "${action_name}";
 
 export default new (class ${action_name}Redirect extends Mountable {
 	// eslint-disable-next-line @typescript-eslint/no-unused-vars

package/lib/templates/redirect.js

@@ -1,9 +1,11 @@
 async function redirectTemplate(action_name) {
   return `import type { Context } from "koa";
 import { Mountable } from "@sealcode/sealgen";
+import type { BreadcrumbLabel } from "@sealcode/sealgen";
 import type Router from "@koa/router";
 
 export const actionName = "${action_name}";
+export const breadcrumbLabel: BreadcrumbLabel = "${action_name}";
 
 export default new (class ${action_name}Redirect extends Mountable {
 	// eslint-disable-next-line @typescript-eslint/no-unused-vars

package/lib/templates/shared/collection-list.js

@@ -91,7 +91,7 @@ import type { FlatTemplatable, Templatable } from "tempstream";
 import { TempstreamJSX, tempstream } from "tempstream";
 import { ${uppercase_collection} } from "src/back/collections/collections.js";
 import html from "src/back/html.js";
-import type { ListFilterRender, FormDisplayInfo } from "@sealcode/sealgen";
+import type { ListFilterRender, FormDisplayInfo, BreadcrumbLabel } from "@sealcode/sealgen";
 import {
 	SealiousItemListPage,
 	BaseListPageFields,
@@ -103,6 +103,7 @@ ${hooks.post_import_js}
 ${field_import_string}
 
 export const actionName = "${action_name}";
+export const breadcrumbLabel: BreadcrumbLabel = "${action_name}";
 
 const filterFields:{
     field: keyof (typeof ${uppercase_collection})["fields"];

package/lib/templates/shared/item-delete.js

@@ -4,6 +4,7 @@ function itemDeleteTemplate(delete_action_name, collection_name, list_action_nam
   const result = `import type { Context } from "koa";
 import { Mountable } from "@sealcode/sealgen";
 import type Router from "@koa/router";
+import type { BreadcrumbLabel } from "@sealcode/sealgen";
 
 import { ${toPascalCase(collection_name)} } from "${importPath(
     "src/back/collections/collections.js"
@@ -14,6 +15,7 @@ import { ${list_action_name}URL } from "${importPath(
   )}";
 
 export const actionName = "${delete_action_name}";
+export const breadcrumbLabel: BreadcrumbLabel = "${delete_action_name}";
 
 export default new (class ${delete_action_name}Redirect extends Mountable {
     canAccess = async (ctx: Context) => {

package/lib/templates/stateful-page.js

@@ -5,9 +5,11 @@ async function statefulPageTemplate(action_name, newfilefullpath) {
   return formatWithPrettier(`import { TempstreamJSX, Templatable } from "tempstream";
 import { Context } from "koa";
 import { StatefulPage, StatefulPageActionArgument } from "@sealcode/sealgen";
+import type { BreadcrumbLabel } from "@sealcode/sealgen";
 import html from "${rel("src/back/html.js")}";
 
 export const actionName = "${action_name}";
+export const breadcrumbLabel: BreadcrumbLabel = "${action_name}";
 
 const actions = {
 	add: ({ state, inputs }: StatefulPageActionArgument<State>) => {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@sealcode/sealgen",
-	"version": "0.19.18",
+	"version": "0.19.20",
 	"description": "Module to automate adding routes and collections to a sealious application",
 	"main": "lib/index.js",
 	"type": "module",

package/src/add-crud.test.ts

@@ -0,0 +1,44 @@
+import { Locator, Page } from "playwright";
+import { RealAppTest } from "./test_utils/test-on-real-app.js";
+import { getBrowser } from "./utils/browser-creator.js";
+
+describe("add crud test", () => {
+	let page: Page;
+	before(async () => {
+		const browser = await getBrowser();
+		const context = await browser.newContext();
+		page = await context.newPage();
+	});
+
+	after(async () => {
+		await page.close();
+	});
+
+	it("Generate simple sealious crud", async function () {
+		const test_app = await RealAppTest.init();
+
+		const path = "/sample";
+		await test_app.runSealgenCommand(`add-collection --collection_name=sealcode-test`);
+		await test_app.runSealgenCommand(`add-crud --url=${path} --collection=sealcode-test`);
+		await test_app.start();
+
+		await page.goto(test_app.fullURL(`sample/create/`));
+
+		const contentInput: Locator = page.getByLabel("Content");
+
+		await contentInput.focus();
+		await contentInput.fill("Hello");
+
+		await page.locator("[type=submit]").click();
+		await page.locator('[href="/sample/"]').click();
+
+		const dataFieldNameAttr: string | null = await page
+			.getByText("Hello")
+			.getAttribute("data-field-name");
+
+		if (dataFieldNameAttr !== "content") {
+			throw new Error("Generated td element does not have correct data-field-name attribute");
+		}
+		await test_app.close();
+	}).timeout(100 * 1000);
+});

package/src/add-crud.ts

@@ -71,7 +71,7 @@ export async function addCRUD(
 						   {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>;
+							   return <td data-field-name={field}>{format ? format(value, item) : value}</td>;
 						   })}
                            <td><div class="sealious-list__actions">
                                <a href={${edit_action_name}URL(item.id)}>Edit</a>

package/src/generate-routes.ts

@@ -5,8 +5,8 @@ import { walkDir } from "./utils/walk.js";
 import { importPath } from "./utils/import-path.js";
 import { assertType, predicates } from "@sealcode/ts-predicates";
 import { unescape_url_params } from "./utils/escape-url-params.js";
-import { formatWithPrettier } from "./utils/prettier.js";
 import { Templates } from "./templates/templates.js";
+import { formatWithPrettier } from "./utils/prettier.js";
 
 const target_locreq = _locreq(process.cwd());
 
@@ -67,6 +67,13 @@ export function sortRoutes<T extends { url: string }>(urls: T[]): T[] {
 	});
 }
 
+const getPathToBuiltFile = (filePath: string) => {
+	const rootPath = target_locreq.resolve("");
+	const relativePath = relative(rootPath, filePath);
+	const distPath = relativePath.replace(/^src[\\/]/, "dist/");
+	return distPath.replace(/\.(ts|tsx)$/, ".js");
+};
+
 export async function generateRoutes(): Promise<void> {
 	const files = await Promise.all(
 		(await walkDir(target_locreq.resolve("src/back/routes")))
@@ -79,6 +86,7 @@ export async function generateRoutes(): Promise<void> {
 			.map(async (fullpath) => ({
 				fullpath,
 				actionName: await extractActionName(fullpath),
+				module_path: getPathToBuiltFile(fullpath),
 				// trailing slash is important here, as it enables to use the entire path while building relative URLs. For example, while visiting /users/123, the path ./add-photo leads to /users/add-photo. While visiting /users/123/ (note the trailing slash), the path ./add-photo leads to /users/123/add-photo
 				url: unescape_url_params(
 					"/" +
@@ -98,11 +106,12 @@ export async function generateRoutes(): Promise<void> {
 
 	type URLTree = {
 		actionName?: string;
+		module_path?: string;
 		children: { [key: string]: URLTree };
 	};
 
 	const url_tree: URLTree = { children: {} };
-	sortRoutes(files).forEach(({ actionName, url }) => {
+	sortRoutes(files).forEach(({ actionName, url, module_path }) => {
 		const elements = url.split("/").filter((e) => e != "");
 		let pointer: URLTree = url_tree;
 		for (const [index, element] of elements.entries()) {
@@ -113,6 +122,7 @@ export async function generateRoutes(): Promise<void> {
 			if (index == elements.length - 1) {
 				(pointer as unknown as { actionName: string }).actionName =
 					actionName;
+				pointer.module_path = module_path;
 			}
 		}
 	});
@@ -121,6 +131,7 @@ export async function generateRoutes(): Promise<void> {
 
 export type URLTree = {
    actionName?: string;
+   module_path?: string;
    children: { [key: string]: URLTree };
 };
 export const url_tree = ${JSON.stringify(url_tree)};

package/src/index.ts

@@ -52,3 +52,5 @@ export interface HTMLArgs {
 }
 
 export type HTMLFunc = (args: HTMLArgs) => Readable | Promise<Readable>;
+
+export type BreadcrumbLabel = string | ((ctx: Context) => Promise<string>);

package/src/templates/form.ts

@@ -46,13 +46,13 @@ export async function formTemplate(
 ): Promise<string> {
 	const params = { ...defaults, ..._params };
 	const content = `import type { Context } from "koa";
-import type { FormData } from "@sealcode/sealgen";
+import type { FormData, BreadcrumbLabel } from "@sealcode/sealgen";
 import { Form,  Controls } from "@sealcode/sealgen";
 import html from "src/back/html.js";
-
 ${params.postimport}
 
 export const actionName = "${action_name}";
+export const breadcrumbLabel: BreadcrumbLabel = "${action_name}";
 
 const getFields = ${params.get_fields};
 

package/src/templates/jdd-editor.ts

@@ -58,12 +58,14 @@ import type { FieldNames } from "sealious";
 import { TempstreamJSX } from "tempstream";
 import type ${collectionClassName} from "src/back/collections/${collection_name}.js";
 import { EditJDDField } from "@sealcode/jdd-editor";
+import type { BreadcrumbLabel } from "@sealcode/sealgen";
 import html from "src/back/html.js";
 import { registry } from "src/back/jdd-components/registry.js";
 import { makeJDDContext } from "src/back/jdd-context.js";
 import { defaultHead } from "src/back/defaultHead.js";
 
 export const actionName = "${actionName}";
+export const breadcrumbLabel: BreadcrumbLabel = "${actionName}";
 
 export default new (class JDDCreatePreviewPage extends EditJDDField<${collectionClassName}> {
 	getCollection(ctx: Context) {

package/src/templates/long-running-process.ts

@@ -9,10 +9,12 @@ export async function LongRunningProcessTemplate(
 	return `import { Context } from "koa";
 import { TempstreamJSX } from "tempstream";
 import { Page } from "@sealcode/sealgen";
+import type { BreadcrumbLabel } from "@sealcode/sealgen";
 import html from "${rel("src/back/html.js")}";
 import { LongRunningProcess } from "sealious";
 
 export const actionName = "${action_name}";
+export const breadcrumbLabel: BreadcrumbLabel = "${action_name}";
 
 export default new (class PatroniteAutoImportStatusPage extends Page {
 	// eslint-disable-next-line @typescript-eslint/no-unused-vars

package/src/templates/multiform.ts

@@ -8,9 +8,11 @@ export async function multiformTemplate(
 	return `import { Context } from "koa";
 import html from "${rel("src/back/html.js")}";
 import { Controls, Fields, Form, FormMessage, Multiform } from "@sealcode/sealgen";
+import type { BreadcrumbLabel } from "@sealcode/sealgen";
 import { FlatTemplatable } from "tempstream";
 
 export const actionName = "${action_name}";
+export const breadcrumbLabel: BreadcrumbLabel = "${action_name}";
 
 const fields1 = {
 	email: new Fields.TextBasedSimpleField(true),

package/src/templates/page.ts

@@ -2,9 +2,11 @@ export async function pageTemplate(action_name: string): Promise<string> {
 	return `import type { Context } from "koa";
 import { TempstreamJSX } from "tempstream";
 import { Page } from "@sealcode/sealgen";
+import type { BreadcrumbLabel } from "@sealcode/sealgen";
 import html from "src/back/html.js";
 
 export const actionName = "${action_name}";
+export const breadcrumbLabel: BreadcrumbLabel = "${action_name}";
 
 export default new (class ${action_name}Page extends Page {
 	// eslint-disable-next-line @typescript-eslint/no-unused-vars

package/src/templates/post.ts

@@ -1,9 +1,11 @@
 export async function postTemplate(action_name: string): Promise<string> {
 	return `import type { Context } from "koa";
 import { Mountable } from "@sealcode/sealgen";
+import type { BreadcrumbLabel } from "@sealcode/sealgen";
 import type Router from "@koa/router";
 
 export const actionName = "${action_name}";
+export const breadcrumbLabel: BreadcrumbLabel = "${action_name}";
 
 export default new (class ${action_name}Redirect extends Mountable {
 	// eslint-disable-next-line @typescript-eslint/no-unused-vars

package/src/templates/redirect.ts

@@ -1,9 +1,11 @@
 export async function redirectTemplate(action_name: string): Promise<string> {
 	return `import type { Context } from "koa";
 import { Mountable } from "@sealcode/sealgen";
+import type { BreadcrumbLabel } from "@sealcode/sealgen";
 import type Router from "@koa/router";
 
 export const actionName = "${action_name}";
+export const breadcrumbLabel: BreadcrumbLabel = "${action_name}";
 
 export default new (class ${action_name}Redirect extends Mountable {
 	// eslint-disable-next-line @typescript-eslint/no-unused-vars

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

@@ -118,7 +118,7 @@ import type { FlatTemplatable, Templatable } from "tempstream";
 import { TempstreamJSX, tempstream } from "tempstream";
 import { ${uppercase_collection} } from "src/back/collections/collections.js";
 import html from "src/back/html.js";
-import type { ListFilterRender, FormDisplayInfo } from "@sealcode/sealgen";
+import type { ListFilterRender, FormDisplayInfo, BreadcrumbLabel } from "@sealcode/sealgen";
 import {
 	SealiousItemListPage,
 	BaseListPageFields,
@@ -130,6 +130,7 @@ ${hooks.post_import_js}
 ${field_import_string}
 
 export const actionName = "${action_name}";
+export const breadcrumbLabel: BreadcrumbLabel = "${action_name}";
 
 const filterFields:{
     field: keyof (typeof ${uppercase_collection})["fields"];

package/src/templates/shared/item-delete.ts

@@ -10,6 +10,7 @@ export function itemDeleteTemplate(
 	const result = `import type { Context } from "koa";
 import { Mountable } from "@sealcode/sealgen";
 import type Router from "@koa/router";
+import type { BreadcrumbLabel } from "@sealcode/sealgen";
 
 import { ${toPascalCase(collection_name)} } from "${importPath(
 		"src/back/collections/collections.js"
@@ -20,6 +21,7 @@ import { ${list_action_name}URL } from "${importPath(
 	)}";
 
 export const actionName = "${delete_action_name}";
+export const breadcrumbLabel: BreadcrumbLabel = "${delete_action_name}";
 
 export default new (class ${delete_action_name}Redirect extends Mountable {
     canAccess = async (ctx: Context) => {

package/src/templates/stateful-page.ts

@@ -9,9 +9,11 @@ export async function statefulPageTemplate(
 	return formatWithPrettier(`import { TempstreamJSX, Templatable } from "tempstream";
 import { Context } from "koa";
 import { StatefulPage, StatefulPageActionArgument } from "@sealcode/sealgen";
+import type { BreadcrumbLabel } from "@sealcode/sealgen";
 import html from "${rel("src/back/html.js")}";
 
 export const actionName = "${action_name}";
+export const breadcrumbLabel: BreadcrumbLabel = "${action_name}";
 
 const actions = {
 	add: ({ state, inputs }: StatefulPageActionArgument<State>) => {