import { toKebabCase, toPascalCase } from "js-convert-case";

export async function jddComponentTemplate(component_name: string) {
	return `import { TempstreamJSX } from "tempstream";
import type { ComponentToHTMLArgs } from "@sealcode/jdd";
import { Component, ComponentArguments } from "@sealcode/jdd";

const component_arguments = {
	title: new ComponentArguments.ShortText(),
	content: new ComponentArguments.Markdown(),
} as const;

export class ${toPascalCase(
		component_name
	)} extends Component<typeof component_arguments> {
	getArguments() {
		return component_arguments;
	}

	async toHTML({
		args: { title, content},
		classes,
		jdd_context: { render_markdown, render_image, language },
	}: ComponentToHTMLArgs<typeof component_arguments>): Promise<string> {
		return (
			<div class={["${toKebabCase(component_name)}", ...classes]}>
				<h2>{title} • ${toPascalCase(component_name)} </h2>
				<div>{render_markdown(language, content)}</div>
			</div>
		);
	}
}
`;
}