<script lang="ts">
	import {onMount} from 'svelte'
    import {GetModpacks} from '../wailsjs/go/main/ModpackManager.js'
    import {ImportModpack} from '../wailsjs/go/main/InstanceManager.js'
    import { main } from '../wailsjs/go/models';
    import {loading} from './global.js'
    let modpacks: main.Modpack[] = []
    let pack: main.Modpack
 
    onMount(() => {
        GetModpacks().then((result) => {
            modpacks = result
            pack = result[0]
        })
    })

    function AddModpack(){
        $loading = true
        ImportModpack(pack, pack.Name).then(() => $loading = false)
    }

</script>

<main>
    <select id="pack" bind:value={pack} name="pack">Select a Modpack: 
        {#each modpacks as pack}
            <option value={pack}>{pack.Name}</option>
        {/each}
    </select>
    <button on:click={AddModpack}>Add Modpack</button>
</main>