import { Context } from "koa";
import { CollectionItem } from "sealious";
import { tempstream } from "tempstream";
import { Posts } from "../collections/collections";
import html from "../html";
import { SealiousItemListPage, BaseListPageFields } from "@sealcode/sealgen";

export const actionName = "ListPosts";

const filterFields = {};

export default new (class ListPostsPage extends SealiousItemListPage<
	typeof Posts,
	typeof BaseListPageFields
> {
	fields = BaseListPageFields;

	filterFields = filterFields;
	filterControls = [];

	async render(ctx: Context) {
		return html(
			ctx,
			"Posts",
			tempstream/* HTML */ `<div>
				<h2>Posts List</h2>
				<table>
					<thead>
						<th>id</th>
						${Object.keys(Posts.fields).map(
							(fieldname) => `<th>${fieldname}</th>`
						)}
					</thead>
					<tbody>
						${super.render(ctx)}
					</tbody>
				</table>
			</div>`
		);
	}

	async renderItem(_: Context, item: CollectionItem<typeof Posts>) {
		return tempstream`<tr><td>${item.id}</td>${Object.keys(Posts.fields).map(
			(fieldname: keyof typeof Posts["fields"]) =>
				tempstream`<td>${item.get(fieldname)}</td>`
		)}</tr>`;
	}
})(Posts);