inter-hub/Web/View/RequirementCandidates/Show.hs

module Web.View.RequirementCandidates.Show where

import Web.Types
import Generated.Types
import IHP.Prelude
import IHP.ViewPrelude

data ShowView = ShowView
    { candidate        :: !RequirementCandidate
    , widget           :: !Widget
    , triageStates     :: ![TriageState]
    , mAssignment      :: !(Maybe ReviewerAssignment)
    , users            :: ![User]
    , mSourceAnnotation :: !(Maybe Annotation)
    , mSourceThread    :: !(Maybe AnnotationThread)
    }

instance View ShowView where
    html ShowView { .. } = [hsx|
        <div class="mb-6 flex items-center gap-2 text-sm text-gray-500">
            <a href={RequirementCandidatesAction} class="hover:text-gray-700">Candidates</a>
            <span>/</span>
            <span>{candidate.title}</span>
        </div>

        <div class="max-w-3xl space-y-6">
            <!-- Header card -->
            <div class="bg-white rounded-lg border border-gray-200 px-6 py-5">
                <div class="flex items-start justify-between mb-3">
                    <h1 class="text-2xl font-semibold">{candidate.title}</h1>
                    <div class="flex gap-2 ml-4">
                        <a href={EditRequirementCandidateAction { requirementCandidateId = candidate.id }}
                           class="text-sm border border-gray-300 px-3 py-1.5 rounded hover:bg-gray-50">
                            Edit
                        </a>
                    </div>
                </div>
                <div class="flex items-center gap-2 mb-3">
                    <span class={statusClass candidate.status <> " text-xs px-2 py-0.5 rounded font-medium"}>
                        {candidate.status}
                    </span>
                    <span class="text-xs bg-gray-100 text-gray-600 px-2 py-0.5 rounded">
                        {candidate.category}
                    </span>
                    <span class="text-xs text-gray-400">
                        Widget: {widget.name}
                    </span>
                </div>
                <p class="text-sm text-gray-700 leading-relaxed">{candidate.description}</p>
            </div>

            <!-- Source -->
            <div class="bg-white rounded-lg border border-gray-200 px-6 py-4">
                <h2 class="text-sm font-semibold text-gray-700 mb-3">Source</h2>
                {renderSource mSourceAnnotation mSourceThread}
            </div>

            <!-- Triage actions -->
            <div class="bg-white rounded-lg border border-gray-200 px-6 py-4">
                <h2 class="text-sm font-semibold text-gray-700 mb-3">Triage</h2>
                {renderTriageActions candidate}
            </div>

            <!-- Reviewer assignment -->
            <div class="bg-white rounded-lg border border-gray-200 px-6 py-4">
                <h2 class="text-sm font-semibold text-gray-700 mb-3">Reviewer</h2>
                {renderReviewerSection candidate mAssignment users}
            </div>

            <!-- Triage history -->
            <div class="bg-white rounded-lg border border-gray-200 px-6 py-4">
                <h2 class="text-sm font-semibold text-gray-700 mb-3">Triage History</h2>
                {if null triageStates
                    then [hsx|<p class="text-sm text-gray-400">No triage actions recorded yet.</p>|]
                    else [hsx|
                        <ol class="space-y-2">
                            {forEach triageStates renderTriageRow}
                        </ol>
                    |]}
            </div>
        </div>
    |]

renderSource :: Maybe Annotation -> Maybe AnnotationThread -> Html
renderSource Nothing Nothing = [hsx|<p class="text-sm text-gray-400">No source linked.</p>|]
renderSource (Just a) _ = [hsx|
    <div class="text-sm">
        <p class="text-gray-500 mb-1">Source annotation:</p>
        <p class="text-gray-700 italic">"{a.body}"</p>
    </div>
|]
renderSource Nothing (Just t) = [hsx|
    <div class="text-sm">
        <p class="text-gray-500 mb-1">Source thread:</p>
        <a href={ShowAnnotationThreadAction { annotationThreadId = t.id }}
           class="text-indigo-600 hover:text-indigo-800">{t.title}</a>
    </div>
|]

renderTriageActions :: RequirementCandidate -> Html
renderTriageActions c = [hsx|
    <div class="flex flex-wrap gap-2">
        {forEach (allowedNextStatuses c.status) (renderTriageButton c.id)}
    </div>
|]

allowedNextStatuses :: Text -> [Text]
allowedNextStatuses "open"      = ["in_review"]
allowedNextStatuses "in_review" = ["accepted", "rejected", "deferred"]
allowedNextStatuses "deferred"  = ["in_review"]
allowedNextStatuses _           = []

renderTriageButton :: Id RequirementCandidate -> Text -> Html
renderTriageButton candidateId newStatus = [hsx|
    <form method="POST" action={UpdateTriageStatusAction { requirementCandidateId = candidateId }}
          class="inline">
        {hiddenField "authenticity_token"}
        <input type="hidden" name="status" value={newStatus} />
        <button type="submit" class={triageButtonClass newStatus}>
            → {newStatus}
        </button>
    </form>
|]

triageButtonClass :: Text -> Text
triageButtonClass "accepted"  = "text-sm px-3 py-1.5 rounded border bg-green-50 border-green-300 text-green-800 hover:bg-green-100"
triageButtonClass "rejected"  = "text-sm px-3 py-1.5 rounded border bg-red-50 border-red-300 text-red-800 hover:bg-red-100"
triageButtonClass "deferred"  = "text-sm px-3 py-1.5 rounded border bg-gray-50 border-gray-300 text-gray-700 hover:bg-gray-100"
triageButtonClass _           = "text-sm px-3 py-1.5 rounded border bg-yellow-50 border-yellow-300 text-yellow-800 hover:bg-yellow-100"

renderReviewerSection :: RequirementCandidate -> Maybe ReviewerAssignment -> [User] -> Html
renderReviewerSection candidate mAssignment users = [hsx|
    <div class="flex items-center gap-4">
        <div class="text-sm text-gray-600">
            {case mAssignment of
                Nothing -> [hsx|<span class="text-gray-400">Unassigned</span>|]
                Just ra -> [hsx|<span>{reviewerName ra users}</span>|]}
        </div>
        <form method="POST" action={AssignReviewerAction { requirementCandidateId = candidate.id }}
              class="flex items-center gap-2">
            {hiddenField "authenticity_token"}
            <select name="userId" class="text-sm border border-gray-300 rounded px-2 py-1">
                {forEach users (\u -> [hsx|<option value={show u.id}>{u.name}</option>|])}
            </select>
            <button type="submit"
                    class="text-sm bg-indigo-600 text-white px-3 py-1 rounded hover:bg-indigo-700">
                Assign
            </button>
        </form>
    </div>
|]

reviewerName :: ReviewerAssignment -> [User] -> Text
reviewerName ra users =
    maybe "Unknown" (.name) (find (\u -> u.id == ra.userId) users)

renderTriageRow :: TriageState -> Html
renderTriageRow ts = [hsx|
    <li class="flex items-start gap-3 text-sm">
        <span class={statusClass ts.status <> " text-xs px-2 py-0.5 rounded mt-0.5 shrink-0"}>
            {ts.status}
        </span>
        <div>
            {maybe mempty (\n -> [hsx|<p class="text-gray-700">{n}</p>|]) ts.notes}
            <p class="text-xs text-gray-400">{show ts.changedAt}</p>
        </div>
    </li>
|]

statusClass :: Text -> Text
statusClass "open"      = "bg-blue-100 text-blue-700"
statusClass "in_review" = "bg-yellow-100 text-yellow-800"
statusClass "accepted"  = "bg-green-100 text-green-800"
statusClass "rejected"  = "bg-red-100 text-red-800"
statusClass "deferred"  = "bg-gray-100 text-gray-600"
statusClass _           = "bg-gray-100 text-gray-600"