{{define "title"}} - Transit: {{.MountName}}{{end}}
{{define "content"}}
<div class="page-header">
    <h2>Transit: {{.MountName}}</h2>
    <div class="page-meta">
        <a href="/dashboard">&larr; Dashboard</a>
    </div>
</div>

{{if .Error}}<div class="error">{{.Error}}</div>{{end}}

<div class="card">
    <div class="card-title">Named Keys</div>
    {{if .Keys}}
    <div class="table-wrapper">
        <table>
            <thead>
                <tr>
                    <th>Name</th>
                    <th>Actions</th>
                </tr>
            </thead>
            <tbody>
            {{range .Keys}}
            <tr>
                <td><a href="/transit/key/{{.Name}}">{{.Name}}</a></td>
                <td><a href="/transit/key/{{.Name}}">View</a></td>
            </tr>
            {{end}}
            </tbody>
        </table>
    </div>
    {{else}}
    <p>No keys configured.</p>
    {{end}}

    {{if .IsAdmin}}
    <details style="margin-top: 1rem;">
        <summary>Create Key</summary>
        <form method="post" action="/transit/key/create">
            {{csrfField}}
            <div class="form-row">
                <div class="form-group">
                    <label for="key_name">Name</label>
                    <input type="text" id="key_name" name="name" placeholder="payments" required>
                </div>
                <div class="form-group">
                    <label for="key_type">Type</label>
                    <select id="key_type" name="type">
                        <option value="aes256-gcm">aes256-gcm (default)</option>
                        <option value="chacha20-poly">chacha20-poly</option>
                        <option value="ed25519">ed25519</option>
                        <option value="ecdsa-p256">ecdsa-p256</option>
                        <option value="ecdsa-p384">ecdsa-p384</option>
                        <option value="hmac-sha256">hmac-sha256</option>
                        <option value="hmac-sha512">hmac-sha512</option>
                    </select>
                </div>
            </div>
            <div class="form-actions">
                <button type="submit">Create Key</button>
            </div>
        </form>
    </details>
    {{end}}
</div>

<div class="card">
    <div class="card-title">Encrypt</div>
    {{if .EncryptResult}}
    <div class="success">
        <p>Encrypted successfully.</p>
        <div class="form-group">
            <label>Ciphertext</label>
            <textarea rows="3" class="pem-input" readonly>{{.EncryptResult}}</textarea>
        </div>
    </div>
    {{end}}
    <form method="post" action="/transit/encrypt">
        {{csrfField}}
        <div class="form-row">
            <div class="form-group">
                <label for="enc_key">Key</label>
                <select id="enc_key" name="key" required>
                    <option value="">&mdash; select key &mdash;</option>
                    {{range .Keys}}<option value="{{.Name}}">{{.Name}}</option>{{end}}
                </select>
            </div>
            <div class="form-group">
                <label for="enc_ctx">Context <small style="text-transform:none;letter-spacing:0;">(optional AAD)</small></label>
                <input type="text" id="enc_ctx" name="context" placeholder="base64-encoded">
            </div>
        </div>
        <div class="form-group">
            <label for="enc_plaintext">Plaintext <small style="text-transform:none;letter-spacing:0;">(base64)</small></label>
            <textarea id="enc_plaintext" name="plaintext" rows="3" class="pem-input" required></textarea>
        </div>
        <div class="form-actions">
            <button type="submit">Encrypt</button>
        </div>
    </form>
</div>

<div class="card">
    <div class="card-title">Decrypt</div>
    {{if .DecryptResult}}
    <div class="success">
        <p>Decrypted successfully.</p>
        <div class="form-group">
            <label>Plaintext (base64)</label>
            <textarea rows="3" class="pem-input" readonly>{{.DecryptResult}}</textarea>
        </div>
    </div>
    {{end}}
    <form method="post" action="/transit/decrypt">
        {{csrfField}}
        <div class="form-row">
            <div class="form-group">
                <label for="dec_key">Key</label>
                <select id="dec_key" name="key" required>
                    <option value="">&mdash; select key &mdash;</option>
                    {{range .Keys}}<option value="{{.Name}}">{{.Name}}</option>{{end}}
                </select>
            </div>
            <div class="form-group">
                <label for="dec_ctx">Context <small style="text-transform:none;letter-spacing:0;">(optional)</small></label>
                <input type="text" id="dec_ctx" name="context">
            </div>
        </div>
        <div class="form-group">
            <label for="dec_ciphertext">Ciphertext</label>
            <textarea id="dec_ciphertext" name="ciphertext" rows="3" class="pem-input" placeholder="metacrypt:v1:..." required></textarea>
        </div>
        <div class="form-actions">
            <button type="submit">Decrypt</button>
        </div>
    </form>
</div>

<div class="card">
    <div class="card-title">Rewrap</div>
    {{if .RewrapResult}}
    <div class="success">
        <p>Re-wrapped successfully.</p>
        <div class="form-group">
            <label>New Ciphertext</label>
            <textarea rows="3" class="pem-input" readonly>{{.RewrapResult}}</textarea>
        </div>
    </div>
    {{end}}
    <form method="post" action="/transit/rewrap">
        {{csrfField}}
        <div class="form-row">
            <div class="form-group">
                <label for="rew_key">Key</label>
                <select id="rew_key" name="key" required>
                    <option value="">&mdash; select key &mdash;</option>
                    {{range .Keys}}<option value="{{.Name}}">{{.Name}}</option>{{end}}
                </select>
            </div>
            <div class="form-group">
                <label for="rew_ctx">Context <small style="text-transform:none;letter-spacing:0;">(optional)</small></label>
                <input type="text" id="rew_ctx" name="context">
            </div>
        </div>
        <div class="form-group">
            <label for="rew_ciphertext">Ciphertext</label>
            <textarea id="rew_ciphertext" name="ciphertext" rows="3" class="pem-input" placeholder="metacrypt:v1:..." required></textarea>
        </div>
        <div class="form-actions">
            <button type="submit">Rewrap</button>
        </div>
    </form>
</div>

<div class="card">
    <div class="card-title">Sign</div>
    {{if .SignResult}}
    <div class="success">
        <p>Signed successfully.</p>
        <div class="form-group">
            <label>Signature</label>
            <textarea rows="3" class="pem-input" readonly>{{.SignResult}}</textarea>
        </div>
    </div>
    {{end}}
    <form method="post" action="/transit/sign">
        {{csrfField}}
        <div class="form-group">
            <label for="sig_key">Key</label>
            <select id="sig_key" name="key" required>
                <option value="">&mdash; select signing key &mdash;</option>
                {{range .Keys}}<option value="{{.Name}}">{{.Name}}</option>{{end}}
            </select>
        </div>
        <div class="form-group">
            <label for="sig_input">Input <small style="text-transform:none;letter-spacing:0;">(base64)</small></label>
            <textarea id="sig_input" name="input" rows="3" class="pem-input" required></textarea>
        </div>
        <div class="form-actions">
            <button type="submit">Sign</button>
        </div>
    </form>
</div>

<div class="card">
    <div class="card-title">Verify</div>
    {{if .VerifyResult}}
    <div class="{{if .VerifyResult}}success{{else}}error{{end}}">
        {{if .VerifyResult}}<p>Signature is valid.</p>{{else}}<p>Signature is invalid.</p>{{end}}
    </div>
    {{end}}
    <form method="post" action="/transit/verify">
        {{csrfField}}
        <div class="form-group">
            <label for="ver_key">Key</label>
            <select id="ver_key" name="key" required>
                <option value="">&mdash; select signing key &mdash;</option>
                {{range .Keys}}<option value="{{.Name}}">{{.Name}}</option>{{end}}
            </select>
        </div>
        <div class="form-group">
            <label for="ver_input">Input <small style="text-transform:none;letter-spacing:0;">(base64)</small></label>
            <textarea id="ver_input" name="input" rows="3" class="pem-input" required></textarea>
        </div>
        <div class="form-group">
            <label for="ver_sig">Signature</label>
            <textarea id="ver_sig" name="signature" rows="3" class="pem-input" placeholder="metacrypt:v1:..." required></textarea>
        </div>
        <div class="form-actions">
            <button type="submit">Verify</button>
        </div>
    </form>
</div>

<div class="card">
    <div class="card-title">HMAC</div>
    {{if .HMACResult}}
    <div class="success">
        <p>HMAC computed successfully.</p>
        <div class="form-group">
            <label>HMAC</label>
            <textarea rows="2" class="pem-input" readonly>{{.HMACResult}}</textarea>
        </div>
    </div>
    {{end}}
    <form method="post" action="/transit/hmac">
        {{csrfField}}
        <div class="form-group">
            <label for="hmac_key">Key</label>
            <select id="hmac_key" name="key" required>
                <option value="">&mdash; select HMAC key &mdash;</option>
                {{range .Keys}}<option value="{{.Name}}">{{.Name}}</option>{{end}}
            </select>
        </div>
        <div class="form-group">
            <label for="hmac_input">Input <small style="text-transform:none;letter-spacing:0;">(base64)</small></label>
            <textarea id="hmac_input" name="input" rows="3" class="pem-input" required></textarea>
        </div>
        <div class="form-actions">
            <button type="submit">Generate HMAC</button>
        </div>
    </form>
</div>
{{end}}