{% extends "base.html" %}
{% load i18n %}
{% block title %}{% translate "Add Authorized Key" %} - Eenos{% endblock %}
{% block content %}
<div class="eenos-page-header flex-wrap gap-3"><div><h1 class="eenos-page-title">{% translate "Add Authorized Key" %}</h1><div class="eenos-page-subtitle">{% translate "Permit access to your hosting account using a trusted SSH public key." %}</div></div><div class="col-12 col-sm-auto"><a href="{% url 'ssh_authorized_keys' %}" class="btn btn-outline-secondary d-flex align-items-center justify-content-center gap-2 w-100"><i data-lucide="arrow-left"></i>{% translate "Authorized Keys" %}</a></div></div>
<nav class="eenos-breadcrumb" aria-label="{% translate 'Breadcrumb' %}"><a href="{% url 'dashboard' %}">{% translate "Dashboard" %}</a><span class="eenos-breadcrumb-separator"><i data-lucide="chevron-right"></i></span><span>{% translate "Security" %}</span><span class="eenos-breadcrumb-separator"><i data-lucide="chevron-right"></i></span><span>{% translate "SSH" %}</span><span class="eenos-breadcrumb-separator"><i data-lucide="chevron-right"></i></span><span class="eenos-breadcrumb-current">{% translate "Add Authorized Key" %}</span></nav>
{% include "includes/form_alerts.html" %}
<form method="post" id="addAuthorizedKeyForm" class="eenos-form" data-parsley-validate>{% csrf_token %}<input type="hidden" name="add_authorized" value="yes"><div class="eenos-card mb-4"><div class="d-flex align-items-start justify-content-between gap-3 mb-4"><div><h2 class="eenos-panel-title mb-1">{% translate "Public Key" %}</h2><div class="eenos-panel-subtitle">{% translate "Paste the complete public key exported by the trusted SSH client." %}</div></div><i data-lucide="shield-plus" class="eenos-card-action-icon"></i></div><div class="eenos-notice eenos-notice-info mb-4"><div class="eenos-notice-icon"><i data-lucide="info"></i></div><div class="eenos-notice-content"><div class="eenos-notice-title">{% translate "Supported key formats" %}</div><div class="eenos-notice-text">RSA, ECDSA, Ed25519</div></div></div><label for="public_key" class="form-label">{% translate "SSH Public Key" %}</label><textarea id="public_key" name="keydata" class="form-control font-monospace" maxlength="4096" rows="8" required spellcheck="false" placeholder="ssh-ed25519 AAAA... user@example.com" data-parsley-required-message="{% translate 'Paste the SSH public key.' %}" data-parsley-maxlength-message="{% translate 'The public key cannot exceed 4096 characters.' %}">{{ form.keydata.value|default:'' }}</textarea><div class="form-text">{% translate "Only add keys whose owner and origin you have verified." %}</div></div><div class="d-flex flex-column flex-sm-row gap-2 mb-4"><button type="button" class="btn btn-primary" id="openAddAuthorizedKey"><i data-lucide="key-round"></i>{% translate "Add Authorized Key" %}</button><a href="{% url 'ssh_authorized_keys' %}" class="btn btn-outline-secondary"><i data-lucide="arrow-left"></i>{% translate "Go Back" %}</a></div></form>
<div class="modal fade" id="addAuthorizedKeyModal" tabindex="-1" aria-labelledby="addAuthorizedKeyTitle" aria-hidden="true"><div class="modal-dialog modal-dialog-centered"><div class="modal-content"><div class="modal-header"><div><h2 class="modal-title fs-5" id="addAuthorizedKeyTitle">{% translate "Add Authorized Key" %}</h2><div class="small text-muted mt-1">{% translate "Confirm SSH access for this account." %}</div></div><button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="{% translate 'Close' %}"></button></div><div class="modal-body"><div class="eenos-notice eenos-notice-warning mb-0"><div class="eenos-notice-icon"><i data-lucide="shield-alert"></i></div><div class="eenos-notice-content"><div class="eenos-notice-title">{% translate "Grant SSH access?" %}</div><div class="eenos-notice-text">{% translate "The holder of the matching private key will be able to authenticate to your hosting account. Add this key only if you trust its owner." %}</div></div></div></div><div class="modal-footer"><button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal"><i data-lucide="x"></i>{% translate "Cancel" %}</button><button type="button" class="btn btn-primary" id="confirmAddAuthorizedKey"><i data-lucide="key-round"></i>{% translate "Add Public Key" %}</button></div></div></div></div>
{% endblock %}
{% block extra_js %}<script>$(function(){const form=$("#addAuthorizedKeyForm"),modal=bootstrap.Modal.getOrCreateInstance(document.getElementById("addAuthorizedKeyModal"));$("#openAddAuthorizedKey").on("click",function(){const validation=form.parsley();validation.validate();if(validation.isValid())modal.show()});$("#confirmAddAuthorizedKey").on("click",function(){form.get(0).submit()})});</script>{% endblock %}