@use crate::{ui::ButtonKind, Aggregation, Entry, State, ValidToken};
@use super::{button, button_link, image_preview, file_input, layout, text_area, text_input, statics::file_upload_js};
@use uuid::Uuid;

@(aggregation: &Aggregation, aggregation_id: Uuid, entries: &[(Uuid, Entry)], token: &ValidToken, state: &State)

@:layout(state, "Edit Aggregation", None, {
    <script
        src="@state.statics_path(&file_upload_js.name)"
        type="text/javascript"
    >
    </script>
}, {
<section>
    <article class="content-group">
        <h3>Share Aggregation</h3>
    </article>
    <article class="content-group">
        <a
            href="@state.public_aggregation_path(aggregation_id)"
            target="_blank"
            rel="noopen noreferer"
        >
        Public Link
        </a>
    </article>
</section>
<section>
    <article class="content-group">
        <h3>Edit Aggregation</h3>
    </article>
    <article class="content-group">
        <p class="subtitle"><a href="@state.edit_aggregation_path(aggregation_id, token)">Do not lose this link</a></p>
    </article>
    <article class="content-group">
        <form method="POST" action="@state.update_aggregation_path(aggregation_id, token)">
            @:text_input("title", Some("Title"), Some(&aggregation.title))
            @:text_area("description", Some("Description"), Some(&aggregation.description))
            <div class="button-space">
                @:button("Update Aggregation", ButtonKind::Submit)
                @:button_link("Delete Aggregation", &state.delete_aggregation_path(aggregation_id, token), ButtonKind::Outline)
            </div>
        </form>
    </article>
    <ul>
        @for (id, entry) in entries {
        <li class="content-group">
            <article>
                <div class="edit-row">
                    <div class="edit-item">
                        @:image_preview(entry, state)
                        <div class="image-meta">
                            <div class="image-title">@entry.title</div>
                            <div class="image-description">@entry.description</div>
                        </div>
                    </div>
                    <div class="edit-item">
                        <form method="POST" action="@state.update_entry_path(aggregation_id, *id, token)">
                            @:text_input("title", Some("Title"), Some(&entry.title))
                            @:text_area("description", Some("Description"), Some(&entry.description))
                            <input type="hidden" name="filename" value="@entry.filename" />
                            <input type="hidden" name="delete_token" value="@entry.delete_token" />
                            <div class="button-space">
                                @:button("Update Image", ButtonKind::Submit)
                                @:button_link("Delete Image", &state.delete_entry_path(aggregation_id, *id, token), ButtonKind::Outline)
                            </div>
                        </form>
                    </div>
                </div>
            </article>
        </li>
        }
    </ul>
</section>
<section>
    <article>
        <form
            method="POST"
            action="@state.create_entry_path(aggregation_id, token)"
            enctype="multipart/form-data"
        >
            <div class="content-group">
                <h3><legend>Add Image</legend></h3>
            </div>
            <div class="content-group" id="file-input-container">
                <div class="button-space">
                    @:file_input("images[]", Some("Select Image"), Some(crate::accept()), false)
                </div>
                <div class="button-space">
                    @:button("Upload", ButtonKind::Submit)
                </div>
            </div>
        </form>
    </article>
</section>
})