module Web.View.AiGovernancePolicies.New where

import Web.View.Prelude

data NewView = NewView
    { policy :: !AiGovernancePolicy
    , hubs   :: ![Hub]
    , agents :: ![AgentRegistration]
    }

renderHubOption :: Hub -> Html
renderHubOption h = [hsx|<option value={show h.id}>{h.name}</option>|]

renderAgentOption :: AgentRegistration -> Html
renderAgentOption a = [hsx|<option value={show a.id}>{a.name}</option>|]

renderActionOption :: (Text, Text) -> Html
renderActionOption (val, lbl) = [hsx|
    <label class="flex items-center gap-2 text-sm">
        <input type="checkbox" name="allowedActions" value={val} class="rounded" />
        <span>{lbl}</span>
    </label>
|]

allowedActionOptions :: [(Text, Text)]
allowedActionOptions =
    [ ("read",       "read — agent may read artifacts")
    , ("propose",    "propose — agent may create proposals")
    , ("delegate",   "delegate — agent may delegate to other agents")
    , ("auto_apply", "auto_apply — agent may apply changes without human review")
    ]

instance View NewView where
    html NewView { .. } = [hsx|
        <div class="p-6 max-w-xl">
            <h1 class="text-2xl font-bold text-gray-900 mb-6">Add AI Governance Policy</h1>
            {renderForm policy hubs agents}
        </div>
    |]

renderForm :: AiGovernancePolicy -> [Hub] -> [AgentRegistration] -> Html
renderForm policy hubs agents = formFor policy [hsx|
    <div class="space-y-4">
        <div>
            <label class="block text-sm font-medium text-gray-700 mb-1">Hub</label>
            <select name="hubId" class="block w-full border-gray-300 rounded-md shadow-sm text-sm">
                {forEach hubs renderHubOption}
            </select>
        </div>
        <div>
            <label class="block text-sm font-medium text-gray-700 mb-1">Agent</label>
            <select name="agentRegistrationId" class="block w-full border-gray-300 rounded-md shadow-sm text-sm">
                {forEach agents renderAgentOption}
            </select>
        </div>
        <div>{(textField #artifactType) { fieldLabel = "Artifact Type", placeholder = "e.g. requirement_candidate, annotation, decision_record" }}</div>
        <div>
            <label class="block text-sm font-medium text-gray-700 mb-2">Allowed Actions</label>
            <div class="space-y-2">
                {forEach allowedActionOptions renderActionOption}
            </div>
        </div>
        <div class="flex gap-3 pt-2">
            {submitButton { label = "Create Policy" }}
            <a href={AiGovernancePoliciesAction}
               class="px-4 py-2 bg-gray-100 hover:bg-gray-200 rounded-md text-sm">Cancel</a>
        </div>
    </div>
|]