LANCommander/LANCommander.Launcher/UI/Components/DownloadQueue.razor

@using LANCommander.Launcher.Models
@inject DownloadService DownloadService
@inject NavigationManager NavigationManager

<Drawer Placement="bottom" Class="download-queue" @bind-Visible="@Visible" OnClose="() => Visible = false">

    @if (DownloadService.Queue.Any(qi => qi.State))
    {
        <h2>In Progress</h2>
        @foreach (var queueItem in DownloadService.Queue.Where(qi => qi.State))
        {
            <div class="queue-item">
                <MediaImage Id="@queueItem.CoverId" Class="queue-item-cover" />
                <div class="queue-item-info">
                    <div>
                        <h3>@queueItem.Title</h3>
                    </div>
                </div>
                <div class="queue-item-current-download">
                    <CurrentDownloadItem />
                </div>
            </div>
        }
    }

    <h2>Up Next</h2>
    @foreach (var queueItem in DownloadService.Queue.Where(qi => !qi.State && qi.Status == Enums.DownloadStatus.Idle))
    {
        <div class="queue-item">
            <MediaImage Id="@queueItem.CoverId" Class="queue-item-cover" />
            <div class="queue-item-info">
                <div>
                    <h3>@queueItem.Title</h3>
                </div>
            </div>
            <div class="queue-item-actions">
                <Button Icon="@IconType.Outline.Close" Size="@ButtonSize.Large" Danger OnClick="() => Remove(queueItem)" />
            </div>
        </div>
    }

    @if (!DownloadService.Queue.Any(qi => qi.Status == Enums.DownloadStatus.Idle))
    {
        <Empty Simple Description="@("The queue is empty")" />
    }

    @if (DownloadService.Queue.Any(qi => !qi.State && qi.Status != Enums.DownloadStatus.Idle && qi.Status != Enums.DownloadStatus.Failed && qi.Status != Enums.DownloadStatus.Canceled))
    {
        <h2>Completed</h2>
        @foreach (var queueItem in DownloadService.Queue.Where(qi => !qi.State))
        {
            <div class="queue-item">
                <MediaImage Id="@queueItem.CoverId" Class="queue-item-cover" />
                <div class="queue-item-info">
                    <div>
                        <h3>@queueItem.Title</h3>
                        <span>@ByteSizeLib.ByteSize.FromBytes(queueItem.TotalBytes)</span>
                    </div>
                </div>
                <div class="queue-item-actions">
                    <PlayButton LibraryItemId="@queueItem.Id">
                        <MenuExtra>
                            <MenuItem OnClick="() => ViewInLibrary(queueItem)">
                                View in Library
                            </MenuItem>
                        </MenuExtra>
                    </PlayButton>
                </div>
            </div>
        }
    }
</Drawer>

@code {
    [Parameter] public bool Visible { get; set; }
    [Parameter] public EventCallback<bool> VisibleChanged { get; set; }

    protected override async Task OnInitializedAsync()
    {
        DownloadService.OnQueueChanged += async () =>
        {
            StateHasChanged();
        };
    }

    async Task Remove(IDownloadQueueItem queueItem)
    {
        DownloadService.Remove(queueItem);
    }

    async Task ViewInLibrary(IDownloadQueueItem queueItem)
    {
        Visible = false;
        NavigationManager.NavigateTo("/" + queueItem.Id);
    }
}