import { escapeHtml } from "@kitajs/html";
import config from "../../config.ts";
import type {
    LabelRow,
    PatchCommentRow,
    PatchRow,
    RepositoryRow,
} from "../../db/index.ts";
import { formatDateTime } from "../../lib/formatDate.ts";
import { displayName } from "../../lib/users.ts";
import type { SessionUser } from "../../middleware/session.ts";
import type { RenderedDiffFile } from "../../services/diffHighlight.ts";
import type { PatchMeta } from "../../services/git.ts";
import type { ApplyResult } from "../../services/patchCache.ts";
import { Avatar } from "../Avatar.tsx";
import { CommentThread } from "../CommentThread.tsx";
import { DateWithEdited } from "../DateWithEdited.tsx";
import { DiffView } from "../DiffView.tsx";
import { EditableTitle } from "../EditableTitle.tsx";
import { LabelBadges } from "../LabelBadges.tsx";
import { Layout } from "../layout.tsx";
import { ReactionBar, type ReactionCount } from "../ReactionBar.tsx";
import { RepoHeader } from "../repos/RepoHeader.tsx";
import { RepoNav } from "../repos/RepoNav.tsx";

interface PatchDetailProps {
    user: SessionUser | null;
    repo: RepositoryRow;
    patch: PatchRow & {
        author_username: string;
        author_avatar_version: number | null;
        author_name: string;
        author_email: string;
    };
    descriptionHtml: string;
    applyResult: ApplyResult | null;
    files: RenderedDiffFile[];
    tab: "conversation" | "changes";
    patchMeta: PatchMeta;
    comments: (PatchCommentRow & {
        author_username: string;
        author_avatar_version: number | null;
        bodyHtml: string;
    })[];
    reactions: ReactionCount[];
    commentReactions: Map<number, ReactionCount[]>;
    patchLabels: LabelRow[];
    repoLabels: LabelRow[];
}

export function PatchDetail({
    user,
    repo,
    patch,
    descriptionHtml,
    applyResult,
    files,
    tab,
    patchMeta,
    comments,
    reactions,
    commentReactions,
    patchLabels,
    repoLabels,
}: PatchDetailProps) {
    const canEdit =
        user != null &&
        (user.isAdmin ||
            (user.id === patch.author_id && patch.status === "open"));
    const canManageLabels =
        user != null &&
        (user.isAdmin ||
            (repo.allow_user_labels === 1 && user.id === patch.author_id));

    const baseUrl = `/${repo.name}/patches/${patch.number}`;
    const reactUrl = `${baseUrl}/react`;

    return (
        <Layout user={user} title={`${patch.title} — ${repo.name}`}>
            <div class="container">
                <RepoHeader repo={repo} />
                <RepoNav repo={repo} active="patches" user={user} />

                <div class="issue-detail">
                    <div class="issue-detail-header">
                        <span class="issue-number">#{patch.number}</span>
                        <EditableTitle
                            title={patch.title}
                            canEdit={canEdit}
                            editAction={`${baseUrl}/edit`}
                            bodyFieldName="edit_description"
                            bodyValue={patch.description}
                        />
                        <span class={`patch-badge ${patch.status}`} safe>
                            {patch.status}
                        </span>
                        {canEdit && (
                            <div class="issue-detail-meta-actions">
                                {user?.isAdmin &&
                                    patch.status === "open" &&
                                    applyResult?.status === "clean" && (
                                        <form
                                            method="POST"
                                            action={`${baseUrl}/merge`}
                                            class="inline-form"
                                        >
                                            <input
                                                type="hidden"
                                                name="version"
                                                value={patch.version}
                                            />
                                            <button
                                                type="submit"
                                                class="btn btn-sm btn-primary"
                                            >
                                                Merge patch
                                            </button>
                                        </form>
                                    )}
                                {patch.status === "open" && (
                                    <details class="confirm-details">
                                        <summary class="btn btn-sm">
                                            Update patch file
                                        </summary>
                                        <div class="confirm-popup">
                                            <form
                                                method="POST"
                                                action={`${baseUrl}/upload`}
                                                enctype="multipart/form-data"
                                                class="upload-patch-form"
                                            >
                                                <input
                                                    type="file"
                                                    name="patch_file"
                                                    accept=".patch"
                                                    required
                                                    class="form-input"
                                                />
                                                <button
                                                    type="submit"
                                                    class="btn btn-sm btn-primary"
                                                >
                                                    Upload
                                                </button>
                                            </form>
                                        </div>
                                    </details>
                                )}
                                {user?.isAdmin && patch.status !== "merged" && (
                                    <form
                                        method="POST"
                                        action={`${baseUrl}/close`}
                                        class="inline-form"
                                    >
                                        <button
                                            type="submit"
                                            class="btn btn-sm"
                                        >
                                            {patch.status === "open"
                                                ? "Close patch"
                                                : "Reopen patch"}
                                        </button>
                                    </form>
                                )}
                                <details class="confirm-details">
                                    <summary class="btn btn-sm btn-danger">
                                        Delete
                                    </summary>
                                    <div class="confirm-popup">
                                        Permanently delete this patch?
                                        <form
                                            method="POST"
                                            action={`${baseUrl}/delete`}
                                            class="inline-form"
                                        >
                                            <button
                                                type="submit"
                                                class="btn btn-sm btn-danger"
                                            >
                                                Yes, delete
                                            </button>
                                        </form>
                                    </div>
                                </details>
                            </div>
                        )}
                    </div>
                    <LabelBadges
                        labels={patchLabels}
                        repoLabels={repoLabels}
                        canManage={canManageLabels}
                        baseUrl={baseUrl}
                    />
                </div>

                {/* Subview tabs */}
                <div class="patch-tab-nav">
                    <a
                        href={baseUrl}
                        class={`repo-tab${tab === "conversation" ? " active" : ""}`}
                    >
                        Conversation{" "}
                        {comments.length > 0 && (
                            <span class="tab-count">{comments.length}</span>
                        )}
                    </a>
                    <a
                        href={`${baseUrl}?tab=changes`}
                        class={`repo-tab${tab === "changes" ? " active" : ""}`}
                    >
                        Changes{" "}
                        {files.length > 0 && (
                            <span class="tab-count">{files.length}</span>
                        )}
                    </a>
                </div>

                {tab === "conversation" ? (
                    <div class="issue-detail">
                        {/* Patch description */}
                        <div class="timeline-item">
                            <div class="timeline-author">
                                <Avatar
                                    userId={patch.author_id}
                                    version={patch.author_avatar_version}
                                    size={24}
                                />
                                <strong safe>
                                    {displayName(patch.author_username)}
                                </strong>
                                <div class="timeline-author-right">
                                    {canEdit && (
                                        <details class="inline-edit-details">
                                            <summary class="btn btn-xs">
                                                <span class="when-closed">
                                                    Edit
                                                </span>
                                                <span class="when-open">
                                                    Stop editing
                                                </span>
                                            </summary>
                                        </details>
                                    )}
                                    <DateWithEdited
                                        date={patch.created_at}
                                        editedAt={patch.edited_at}
                                    />
                                </div>
                            </div>
                            {canEdit && (
                                <div class="inline-edit-form-area">
                                    <form
                                        method="POST"
                                        action={`${baseUrl}/edit`}
                                        class="inline-edit-form"
                                    >
                                        <input
                                            type="hidden"
                                            name="title"
                                            value={patch.title}
                                        />
                                        <div class="form-group">
                                            <textarea
                                                class="form-input"
                                                id="edit-patch-desc"
                                                name="edit_description"
                                                rows="6"
                                                maxlength={
                                                    config.MAX_TEXT_BODY_BYTES
                                                }
                                                safe
                                            >
                                                {patch.description}
                                            </textarea>
                                        </div>
                                        <div class="form-actions">
                                            <button
                                                type="submit"
                                                class="btn btn-sm btn-primary"
                                            >
                                                Save
                                            </button>
                                        </div>
                                    </form>
                                </div>
                            )}
                            <div class="timeline-body markdown-body">
                                {(descriptionHtml as "safe") || (
                                    <em class="text-muted">
                                        No description provided.
                                    </em>
                                )}
                            </div>
                            <ReactionBar
                                reactions={reactions}
                                postUrl={reactUrl}
                                user={user}
                            />
                        </div>

                        {/* Apply status */}
                        {!!applyResult && (
                            <div class="timeline-item">
                                <div
                                    class={`apply-result apply-${applyResult.status}`}
                                >
                                    <div>
                                        <span class="apply-icon">
                                            {applyResult.status === "clean"
                                                ? "✓"
                                                : "✗"}
                                        </span>
                                        <span>
                                            {applyResult.status === "clean"
                                                ? "Applies cleanly"
                                                : "Has conflicts"}
                                        </span>
                                    </div>
                                    {!!applyResult.output && (
                                        <pre class="apply-output" safe>
                                            {applyResult.output}
                                        </pre>
                                    )}
                                </div>
                            </div>
                        )}

                        <CommentThread
                            user={user}
                            comments={comments}
                            commentReactions={commentReactions}
                            baseUrl={baseUrl}
                            parentStatus={patch.status}
                        />
                    </div>
                ) : (
                    <div>
                        <div class="commit-card">
                            <h2
                                class={`commit-card-subject${patchMeta.subject ? "" : " commit-card-subject-empty"}`}
                            >
                                {patchMeta.subject
                                    ? escapeHtml(patchMeta.subject)
                                    : "No commit message"}
                            </h2>
                            {!!patchMeta.body && (
                                <pre class="commit-card-body">
                                    {escapeHtml(patchMeta.body)}
                                </pre>
                            )}
                            <div class="commit-card-meta">
                                <div class="commit-card-meta-row">
                                    <span class="commit-meta-label">
                                        Author
                                    </span>
                                    <span class="commit-meta-value">
                                        {escapeHtml(
                                            `${patchMeta.author} <${patchMeta.email}>`,
                                        )}
                                    </span>
                                </div>
                                <div class="commit-card-meta-row">
                                    <span class="commit-meta-label">Date</span>
                                    <time
                                        class="commit-meta-value"
                                        datetime={patchMeta.date}
                                        safe
                                    >
                                        {formatDateTime(patchMeta.date)}
                                    </time>
                                </div>
                            </div>
                        </div>
                        <DiffView files={files} repo={repo} />
                    </div>
                )}
            </div>
        </Layout>
    );
}