package secrets

import "fmt"

templ (s *SecretsPlugin) index() {
    <div class="grid-container">
            <form hx-post="/secrets/add" hx-target="#data">
                <div class="grid-x">
                    <h2>Secrets</h2>
                </div>
                <div class="grid-x">
                    <div class="cell auto">
                        <div class="input-group">
                            <span class="input-group-label">Key</span>
                            <input class="input-group-field" placeholder="Key..." name="key" />
                        </div>
                    </div>
                    <div class="cell auto">
                        <div class="input-group">
                            <span class="input-group-label">Value</span>
                            <input class="input-group-field" placeholder="Value..." name="value" />
                            <div class="input-group-button">
                                <button class="button primary" type="submit">Add Secret</button>
                            </div>
                        </div>
                    </div>
                </div>
            </form>
            <div class="grid-x grid-margin-x">
                <div id="data">
                    @s.keysList()
                </div>
            </div>
    </div>
}

templ (s *SecretsPlugin) keysList() {
    <ul class="no-bullet">
        for _, key := range s.keys() {
            <li>
            <button
                class="button tiny alert middle"
                style="vertical-align: baseline"
                hx-delete="/secrets/remove"
                hx-confirm={ fmt.Sprintf("Are you sure you want to delete %s?", key) }
                hx-target="#data"
                hx-include="this"
                name="key" value={ key }>X</button>
            { key }</li>
        }
    </ul>
}