package templates

// FilterItem renders a single saved filter item for the list
templ FilterItem(id string, name string) {
	<div
		class="flex items-center justify-between p-2 rounded hover:opacity-80"
		style="background-color: var(--bg-primary);"
		data-filter-id={ id }
	>
		<button
			data-action="load-filter"
			@click="loadFilter($event)"
			class="flex-1 text-left px-2 py-1 rounded"
			style="color: var(--text-primary);"
		>
			{ name }
		</button>
		<button
			data-action="delete-filter"
			@click="deleteFilter($event)"
			class="p-1 hover:opacity-70 rounded"
			style="color: var(--text-secondary);"
			title="Delete filter"
		>
			🗑
		</button>
	</div>
}
