{{define "title"}}Edit DKIM Selector{{end}}

{{define "content"}}
<div class="container-fluid">
    <div class="row">
        <div class="col-md-8 offset-md-2">
            <div class="card">
                <div class="card-header bg-primary text-white d-flex justify-content-between align-items-center">
                    <h4 class="mb-0"><i class="bi bi-pencil me-2"></i>Edit DKIM Selector</h4>
                    <a href="/smtp-server/dkim" class="btn btn-light btn-sm"><i class="bi bi-arrow-left me-1"></i>Back to DKIM Keys</a>
                </div>
                <div class="card-body">
                    <form method="POST" class="needs-validation" novalidate>
                        <div class="mb-3">
                            <label for="selector" class="form-label"><i class="bi bi-key me-1"></i>DKIM Selector</label>
                            <input type="text" class="form-control" id="selector" name="selector" value="{{.dkim_key.Selector}}" placeholder="default" pattern="^[a-zA-Z0-9_-]+$" required>
                            <div class="invalid-feedback">Please provide a valid selector (letters, numbers, hyphens, and underscores only).</div>
                            <div class="form-text"><i class="bi bi-info-circle me-1"></i>The selector is used in DNS records to identify this DKIM key (e.g., "selector._domainkey.{{.domain.DomainName}}")</div>
                        </div>
                        <div class="row">
                            <div class="col-md-6">
                                <div class="alert alert-info">
                                    <h6><i class="bi bi-info-circle me-1"></i>Current Information</h6>
                                    <p class="mb-1"><strong>Domain:</strong> {{.domain.DomainName}}</p>
                                    <p class="mb-1"><strong>Current Selector:</strong> {{.dkim_key.Selector}}</p>
                                    <p class="mb-1"><strong>Status:</strong> {{if .dkim_key.IsActive}}<span class="badge bg-success">Active</span>{{else}}<span class="badge bg-danger">Inactive</span>{{end}}</p>
                                    <p class="mb-0"><strong>Created:</strong> {{strftime "%Y-%m-%d %H:%M:%S" .dkim_key.CreatedAt}}</p>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="alert alert-warning">
                                    <h6><i class="bi bi-exclamation-triangle me-1"></i>Important Note</h6>
                                    <p class="mb-0">Changing the selector will require updating your DNS records to match the new selector name.</p>
                                </div>
                            </div>
                        </div>
                        <div class="d-flex justify-content-between">
                            <a href="/smtp-server/dkim" class="btn btn-secondary"><i class="bi bi-x me-1"></i>Cancel</a>
                            <button type="submit" class="btn btn-primary"><i class="bi bi-save me-1"></i>Update Selector</button>
                        </div>
                    </form>
                </div>
            </div>

            <div class="card mt-4">
                <div class="card-header bg-info text-white"><h5 class="mb-0"><i class="bi bi-dns me-2"></i>DNS Record Information</h5></div>
                <div class="card-body">
                    <div class="alert alert-light">
                        <h6>Current DNS Record</h6>
                        <p class="mb-2"><strong>Name:</strong> <code>{{.dkim_key.Selector}}._domainkey.{{.domain.DomainName}}</code></p>
                        <p class="mb-0"><strong>Type:</strong> TXT</p>
                    </div>
                    <p class="text-muted"><i class="bi bi-lightbulb me-1"></i><strong>Tip:</strong> After changing the selector, update your DNS provider to use the new record name. The value stays the same.</p>
                </div>
            </div>
            <div class="card mt-4">
                <div class="card-header"><h5 class="mb-0"><i class="bi bi-cloud-arrow-up me-2"></i>DNS Automation</h5></div>
                <div class="card-body">
                    <p class="text-muted">By default you copy the DNS record above into your DNS provider yourself. Switch to Automatic to have this server push it there for you (on create and on every regenerate) via your DNS provider's API — this setting applies to the whole domain, not just this one selector.</p>
                    <form method="POST" action="/smtp-server/dkim/{{.dkim_key.ID}}/dns-automation">
                        <div class="mb-3">
                            <label class="form-label">Mode</label>
                            <select class="form-select" name="dkim_dns_automation" style="max-width: 300px;">
                                <option value="manual" {{if ne .domain.DKIMDNSAutomation "automatic"}}selected{{end}}>Manual (default)</option>
                                <option value="automatic" {{if eq .domain.DKIMDNSAutomation "automatic"}}selected{{end}}>Automatic</option>
                            </select>
                        </div>
                        <div class="mb-3">
                            <label class="form-label">DNS Provider</label>
                            <select class="form-select" name="dns_provider" id="dkim_dns_provider">
                                <option value="">Not configured</option>
                                <option value="cloudflare" {{if and .dns_creds (eq .dns_creds.Provider "cloudflare")}}selected{{end}}>Cloudflare</option>
                                <option value="route53" {{if and .dns_creds (eq .dns_creds.Provider "route53")}}selected{{end}}>AWS Route53</option>
                                <option value="digitalocean" {{if and .dns_creds (eq .dns_creds.Provider "digitalocean")}}selected{{end}}>DigitalOcean</option>
                                <option value="gcloud" {{if and .dns_creds (eq .dns_creds.Provider "gcloud")}}selected{{end}}>Google Cloud DNS</option>
                            </select>
                        </div>
                        <div class="mb-3">
                            <label class="form-label">Zone name</label>
                            <input type="text" class="form-control" name="zone_name" value="{{if .dns_creds}}{{.dns_creds.ZoneName}}{{end}}" placeholder="{{.domain.DomainName}}" style="max-width: 300px;">
                            <div class="form-text">Defaults to the domain name itself — override if your DNS provider hosts a parent zone instead.</div>
                        </div>

                        <div class="dkim-provider-fields" id="dkim-fields-cloudflare">
                            <div class="mb-3">
                                <label class="form-label">API Token</label>
                                <input type="password" class="form-control" name="cloudflare_api_token" value="{{if .dns_creds}}{{.dns_creds.CloudflareAPIToken}}{{end}}">
                            </div>
                        </div>
                        <div class="dkim-provider-fields" id="dkim-fields-route53">
                            <div class="mb-3">
                                <label class="form-label">Access Key ID</label>
                                <input type="password" class="form-control" name="route53_access_key_id" value="{{if .dns_creds}}{{.dns_creds.Route53AccessKeyID}}{{end}}">
                            </div>
                            <div class="mb-3">
                                <label class="form-label">Secret Access Key</label>
                                <input type="password" class="form-control" name="route53_secret_access_key" value="{{if .dns_creds}}{{.dns_creds.Route53SecretAccessKey}}{{end}}">
                            </div>
                            <div class="mb-3">
                                <label class="form-label">Region</label>
                                <input type="text" class="form-control" name="route53_region" value="{{if .dns_creds}}{{.dns_creds.Route53Region}}{{end}}" placeholder="us-east-1">
                            </div>
                        </div>
                        <div class="dkim-provider-fields" id="dkim-fields-digitalocean">
                            <div class="mb-3">
                                <label class="form-label">API Token</label>
                                <input type="password" class="form-control" name="digitalocean_api_token" value="{{if .dns_creds}}{{.dns_creds.DigitalOceanAPIToken}}{{end}}">
                            </div>
                        </div>
                        <div class="dkim-provider-fields" id="dkim-fields-gcloud">
                            <div class="mb-3">
                                <label class="form-label">Project ID</label>
                                <input type="text" class="form-control" name="gcloud_project" value="{{if .dns_creds}}{{.dns_creds.GCloudProject}}{{end}}">
                            </div>
                            <div class="mb-3">
                                <label class="form-label">Service Account Key (JSON)</label>
                                <textarea class="form-control font-monospace" name="gcloud_service_account_json" rows="3" placeholder="Paste the service account key's JSON content">{{if .dns_creds}}{{.dns_creds.GCloudServiceAccountJSON}}{{end}}</textarea>
                            </div>
                        </div>

                        <button type="submit" class="btn btn-primary btn-sm"><i class="bi bi-check-lg me-1"></i>Save</button>
                    </form>
                </div>
            </div>

            <div class="card mt-4">
                <div class="card-header"><h5 class="mb-0"><i class="bi bi-share me-2"></i>Shared DKIM Key</h5></div>
                <div class="card-body">
                    <p class="text-muted">Sign this domain's outbound mail with the server's one shared DKIM key instead of its own — lets you CNAME <code>{{.dkim_key.Selector}}._domainkey.{{.domain.DomainName}}</code> to the shared record once and never touch DNS again on rotation. Ask your global admin for the shared record's current name/value from the main DKIM page.</p>
                    <form method="POST" action="/smtp-server/dkim/{{.dkim_key.ID}}/use-global">
                        <div class="form-check mb-2">
                            <input type="checkbox" class="form-check-input" id="use_global_dkim" name="use_global_dkim" {{if .domain.UseGlobalDKIM}}checked{{end}}>
                            <label class="form-check-label" for="use_global_dkim">Use the shared DKIM key</label>
                        </div>
                        <button type="submit" class="btn btn-primary btn-sm"><i class="bi bi-check-lg me-1"></i>Save</button>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>

<script>
    function updateDKIMProviderFields() {
        var selected = document.getElementById('dkim_dns_provider').value;
        document.querySelectorAll('.dkim-provider-fields').forEach(function(el) {
            el.style.display = (el.id === 'dkim-fields-' + selected) ? '' : 'none';
        });
    }
    document.getElementById('dkim_dns_provider').addEventListener('change', updateDKIMProviderFields);
    updateDKIMProviderFields();
</script>

<script>
(function() {
    'use strict';
    window.addEventListener('load', function() {
        var forms = document.getElementsByClassName('needs-validation');
        Array.prototype.filter.call(forms, function(form) {
            form.addEventListener('submit', function(event) {
                if (form.checkValidity() === false) { event.preventDefault(); event.stopPropagation(); }
                form.classList.add('was-validated');
            }, false);
        });
    }, false);
})();
document.getElementById('selector').addEventListener('input', function(e) {
    const selectorRegex = /^[a-zA-Z0-9_-]+$/;
    if (e.target.value && !selectorRegex.test(e.target.value)) {
        e.target.setCustomValidity('Selector must contain only letters, numbers, hyphens, and underscores');
    } else {
        e.target.setCustomValidity('');
    }
});
</script>
{{end}}