<script>
    import { t }    from '../../translations.svelte.js';
    import ListTask from './ListTask.svelte';

    let { est_time, lastEvent, show_closed, states = {}, tasks } = $props();

    let sortedTasks = $derived.by(() => Object.values(tasks).sort((a, b) => a.name.localeCompare(b.name)));
</script>

<ul>
    {#each sortedTasks as task (task.id)}
    <ListTask {states} {task} {lastEvent} siblings={tasks} {est_time} show_closed={show_closed || task.show_closed} />
    {/each}
</ul>
