{#if viewAllMode === 'storage'} viewAllMode = null} onItemsChanged={loadPiclets} onDragStart={handleDragStart} onDragEnd={handleDragEnd} /> {:else if viewAllMode === 'discovered'} viewAllMode = null} /> {:else}
{#if isLoading}

Loading collection...

{:else if rosterPiclets.length === 0 && storagePiclets.length === 0 && discoveredMonsters.length === 0}

No Piclets Yet

Take photos to discover new Piclets!

{:else}

Roster

{#each Array(6) as _, position} handleRosterClick(position)} onEmptyClick={handleRosterClick} onDragStart={handleDragStart} onDragEnd={handleDragEnd} /> {/each}
{#if storagePiclets.length > 0}

Storage ({storagePiclets.length})

{#if storagePiclets.length > 10} {/if}
{#each storagePiclets.slice(0, 10) as piclet} handleStorageClick(piclet)} onDragStart={handleDragStart} onDragEnd={handleDragEnd} /> {/each}
{/if} {#if discoveredMonsters.length > 0}

Discovered ({discoveredMonsters.length})

{#if discoveredMonsters.length > 10} {/if}
{#each discoveredMonsters.slice(0, 10) as monster} handleDiscoveredClick(monster)} /> {/each}
{/if}
{/if} {#if selectedPiclet} selectedPiclet = null} onDeleted={loadPiclets} /> {/if} {#if addToRosterPosition !== null} addToRosterPosition = null} onAdded={loadPiclets} /> {/if}
{/if}