<script lang="ts">
	import { rdelete } from "src/lib/requests.svelte";
    import type { Model } from "./+page.svelte";
	import MessageSimple from "src/lib/MessageSimple.svelte";
	import { createEventDispatcher } from "svelte";

    let message: MessageSimple;

    let { model, expand } = $props<{model: Model, expand?: boolean}>();

    const dispatch = createEventDispatcher<{reload: void}>();

    async function deleteZip() {
        message.clear();

        try {
            await rdelete("models/data/delete-zip-file", { id: model.id });
            dispatch('reload');
        } catch (e) {
            if (e instanceof Response) {
                message.display(await e.json());
            } else {
                message.display("Could not delete the zip file");
            }
        }
    }
</script>


<form on:submit|preventDefault={deleteZip}>
    {#if expand}
        Failed to proccess the zip file.<br/>
        Delete file and upload a correct version do add more classes.<br/>
        <br/>
    {:else}
        Failed to proccess the zip file.<br/>
        Delete file and proccess again.<br/>
        <br/>
    {/if}
    <div class="spacer" ></div>
    <MessageSimple bind:this={message} />
    <button class="danger">
        Delete Zip File
    </button>
</form>
