module Web.View.ModelRoutingPolicies.Index where

import Web.View.Prelude

data IndexView = IndexView
    { policies :: ![ModelRoutingPolicy]
    , hubs     :: ![Hub]
    , agents   :: ![AgentRegistration]
    }

instance View IndexView where
    html IndexView { .. } = [hsx|
        <div class="p-6">
            <div class="flex justify-between items-center mb-6">
                <h1 class="text-2xl font-bold text-gray-900">Model Routing Policies</h1>
                <a href={NewModelRoutingPolicyAction}
                   class="px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 text-sm font-medium">
                    Add Policy
                </a>
            </div>
            <div class="bg-white shadow rounded-lg overflow-hidden">
                <table class="min-w-full divide-y divide-gray-200">
                    <thead class="bg-gray-50">
                        <tr>
                            <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">Hub</th>
                            <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">Task Type</th>
                            <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">Agent</th>
                            <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">Priority</th>
                            <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">Active</th>
                            <th class="px-6 py-3"></th>
                        </tr>
                    </thead>
                    <tbody class="divide-y divide-gray-200">
                        {forEach policies renderRow}
                    </tbody>
                </table>
            </div>
        </div>
    |]
      where
        hubName hid = maybe "Unknown" (.name) (find (\h -> h.id == hid) hubs)
        agentName aid = maybe "Unknown" (.name) (find (\a -> a.id == aid) agents)

        renderRow p = [hsx|
            <tr class="hover:bg-gray-50">
                <td class="px-6 py-4 text-sm text-gray-700">{hubName p.hubId}</td>
                <td class="px-6 py-4 text-sm font-mono">{p.taskType}</td>
                <td class="px-6 py-4 text-sm text-gray-700">
                    <a href={ShowAgentRegistrationAction p.agentRegistrationId}
                       class="hover:text-blue-600">{agentName p.agentRegistrationId}</a>
                </td>
                <td class="px-6 py-4 text-sm text-gray-500">{show p.priority}</td>
                <td class="px-6 py-4 text-sm">
                    {renderActiveStatus p.isActive}
                </td>
                <td class="px-6 py-4 text-right">
                    <a href={DeleteModelRoutingPolicyAction p.id}
                       class="text-sm text-red-600 hover:text-red-800"
                       data-method="DELETE"
                       data-confirm="Delete this routing policy?">Delete</a>
                </td>
            </tr>
        |]

renderActiveStatus :: Bool -> Html
renderActiveStatus True  = [hsx|<span class="text-green-600">Yes</span>|]
renderActiveStatus False = [hsx|<span class="text-gray-400">No</span>|]