import { PERMS } from "@/lib/permission-slugs";
import type { HousekeepingPageInput } from "../../../route-handlers";
import { economyQuery } from "../queries/catalog";
import { EconomyCommandForm } from "./economy-command-form";
import {
	EconomyPageFrame,
	type EconomyPageProps,
	parseEconomyListInput,
} from "./economy-page-frame";

export function EconomyItemsPage(props: EconomyPageProps) {
	const edit = props.context.has(PERMS.CATALOG_EDIT) ? (
		<EconomyCommandForm
			commandId="economy.items.base.update"
			buttonLabel="Save base item"
			input={{}}
			fields={[
				{ name: "id", label: "ID", type: "identifier", required: true },
				{
					name: "publicName",
					label: "Public name",
					type: "text",
					maxLength: 56,
				},
				{ name: "itemName", label: "Item name", type: "text", maxLength: 70 },
				{
					name: "interactionType",
					label: "Interaction",
					type: "text",
					maxLength: 500,
				},
			]}
		/>
	) : null;
	return (
		<EconomyPageFrame
			title="Items"
			description="Base item definitions and catalog linkage."
			result={props.result}
			forms={edit}
		/>
	);
}

export async function renderEconomyItemsPage(input: HousekeepingPageInput) {
	const routeId = input.match.routeId as EconomyPageProps["routeId"];
	const result = await economyQuery.run(input.context, {
		routeId: routeId ?? "economy.items.overview",
		params: input.match.params,
		list: parseEconomyListInput(input.searchParams ?? {}),
	});
	return (
		<EconomyItemsPage
			context={input.context}
			result={result}
			routeId={routeId}
		/>
	);
}