module Web.View.ArchiveRecords.LineageInspector where

import Web.Types
import Generated.Types
import IHP.Prelude
import IHP.ViewPrelude
import Web.Routes ()

data LineageInspectorView = LineageInspectorView
    { widget      :: !Widget
    , events      :: ![InteractionEvent]
    , annotations :: ![Annotation]
    , candidates  :: ![RequirementCandidate]
    , requirements :: ![Requirement]
    , decisions   :: ![DecisionRecord]
    , deployments :: ![DeploymentRecord]
    , signals     :: ![OutcomeSignal]
    , mArchive    :: !(Maybe ArchiveRecord)
    }

instance View LineageInspectorView where
    html LineageInspectorView { .. } = [hsx|
        <div class="max-w-4xl">
            <div class="flex items-center gap-3 mb-2">
                <a href={ShowWidgetAction (widget.id)}
                   class="text-sm text-gray-500 hover:underline">{widget.name}</a>
                <span class="text-gray-300">/</span>
                <h1 class="text-2xl font-semibold">Lineage Inspector</h1>
                {if widget.isArchived then archivedBadge else mempty}
            </div>
            <p class="text-sm text-gray-500 mb-6">Full traceability chain for this widget.</p>

            <div class="space-y-4">
                {renderChainStep "1" "Widget" 1}
                {renderChainStep "2" "Interaction Events" (length events)}
                {renderChainStep "3" "Annotations" (length annotations)}
                {renderChainStep "4" "Requirement Candidates" (length candidates)}
                {renderChainStep "5" "Requirements" (length requirements)}
                {renderChainStep "6" "Decision Records" (length decisions)}
                {renderChainStep "7" "Deployments" (length deployments)}
                {renderChainStep "8" "Outcome Signals" (length signals)}
            </div>

            {maybe mempty renderArchivePanel mArchive}

            <div class="mt-8">
                <h2 class="text-lg font-medium text-gray-800 mb-3">Recent Interaction Events</h2>
                {renderEventsTable events}
            </div>
        </div>
    |]
      where
        renderEventsTable :: [InteractionEvent] -> Html
        renderEventsTable [] = [hsx|<p class="text-sm text-gray-400">No events recorded.</p>|]
        renderEventsTable evs = [hsx|
            <div class="bg-white rounded-lg border border-gray-200 overflow-hidden">
                <table class="w-full text-sm">
                    <thead class="bg-gray-50 border-b border-gray-200">
                        <tr>
                            <th class="text-left px-4 py-2 font-medium text-gray-600">Event Type</th>
                            <th class="text-left px-4 py-2 font-medium text-gray-600">Occurred At</th>
                        </tr>
                    </thead>
                    <tbody class="divide-y divide-gray-100">
                        {forEach evs renderEventRow}
                    </tbody>
                </table>
            </div>
        |]

        renderChainStep :: Text -> Text -> Int -> Html
        renderChainStep stepNum label count = [hsx|
            <div class="flex items-center gap-4">
                <div class="w-8 h-8 rounded-full bg-indigo-100 text-indigo-700 flex items-center justify-center text-sm font-medium flex-shrink-0">
                    {stepNum}
                </div>
                <div class="flex-1 bg-white rounded-lg border border-gray-200 px-4 py-3 flex items-center justify-between">
                    <span class="text-sm font-medium text-gray-700">{label}</span>
                    <span class="text-sm font-bold text-gray-900">{show count}</span>
                </div>
            </div>
            |]

        renderEventRow :: InteractionEvent -> Html
        renderEventRow e = [hsx|
            <tr>
                <td class="px-4 py-2 text-gray-700">{e.eventType}</td>
                <td class="px-4 py-2 text-xs text-gray-400">{show e.occurredAt}</td>
            </tr>
            |]

renderArchivePanel :: ArchiveRecord -> Html
renderArchivePanel archive = [hsx|
    <div class="mt-6 bg-amber-50 border border-amber-200 rounded-lg p-4">
        <h3 class="text-sm font-medium text-amber-800 mb-2">Archive Record</h3>
        <dl class="grid grid-cols-2 gap-2 text-xs text-amber-700">
            <div><dt class="font-medium">Archived At</dt><dd>{show archive.archivedAt}</dd></div>
            <div><dt class="font-medium">Archived By</dt><dd>{archive.archivedBy}</dd></div>
            <div class="col-span-2"><dt class="font-medium">Reason</dt><dd>{archive.reason}</dd></div>
        </dl>
    </div>
|]

archivedBadge :: Html
archivedBadge = [hsx|<span class="text-sm bg-amber-100 text-amber-700 px-2 py-0.5 rounded font-medium">Archived</span>|]