package routes

import (
	"github.com/LazyBachelor/LazyPM/internal/models"
	"github.com/LazyBachelor/LazyPM/pkg/web/components"
)

type IssueDetailProps struct {
	Issue    *models.Issue
	Comments []*models.Comment
}

templ IssueDetailContent(props IssueDetailProps) {
	<div class="max-w-2xl mx-auto">
		<div class="mb-4">
			<a
				class="btn btn-ghost btn-sm"
				hx-get="/"
				hx-target="main"
				hx-swap="innerHTML"
				hx-push-url="true"
			>
				@components.IconBack()
				Back to Issues
			</a>
			<button
				type="button"
				class="btn btn-primary btn-sm"
				hx-get={ "/issues/" + props.Issue.ID + "/edit" }
				hx-target="#modal-container"
				hx-swap="innerHTML"
			>
				Edit
			</button>
			<button
				type="button"
				class="btn btn-error btn-sm btn-outline"
				hx-delete={ "/issues/" + props.Issue.ID }
				hx-confirm="Are you sure you want to delete this issue? This action cannot be undone."
				hx-target="body"
			>
				Delete issue
			</button>
		</div>
		<div id="issue-detail-container" class="mb-6">
			@components.IssueDetail(components.IssueDetailProps{Issue: props.Issue})
		</div>
		@components.CommentSection(components.CommentSectionProps{
			IssueID:  props.Issue.ID,
			Comments: props.Comments,
		})
	</div>
}

templ IssueDetail(props IssueDetailProps) {
	@BaseLayout() {
		@IssueDetailContent(props)
	}
}