@inject JsInteropService JsInteropService

<div class="p-4 mb-4 bg-white border border-gray-200 rounded-lg shadow-sm 2xl:col-span-2 dark:border-gray-700 sm:p-6 dark:bg-gray-800">
    <h3 class="mb-4 text-xl font-semibold dark:text-white">Attachments</h3>
    @if (Attachments.Any(x => !x.IsDeleted))
    {
        <div class="overflow-x-auto">
            <table class="w-full text-sm text-left text-gray-500 dark:text-gray-400">
                <thead class="text-xs text-gray-700 uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400">
                    <tr>
                        <th scope="col" class="px-6 py-3">Filename</th>
                        <th scope="col" class="px-6 py-3">Size</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach (var attachment in Attachments.Where(x => !x.IsDeleted))
                    {
                        <tr class="bg-white border-b dark:bg-gray-800 dark:border-gray-700">
                            <td class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap dark:text-white">
                                @if (attachment.Blob != null && attachment.Blob.Length > 0)
                                {
                                    <span @onclick="() => DownloadAttachment(attachment)" class="text-primary cursor-pointer">@attachment.Filename</span>
                                }
                                else
                                {
                                    <span class="text-gray-400 dark:text-gray-500" title="Attachment data unavailable">@attachment.Filename (unavailable)</span>
                                }
                            </td>
                            <td class="px-6 py-4">
                                @FormatSize(attachment.Blob?.Length ?? 0)
                            </td>
                        </tr>
                    }
                </tbody>
            </table>
        </div>
    }
    else
    {
        <p class="text-gray-500 dark:text-gray-400">No attachments available.</p>
    }
</div>

@code {
    /// <summary>
    /// The attachments to display.
    /// </summary>
    [Parameter]
    public ICollection<Attachment> Attachments { get; set; } = new List<Attachment>();

    private static string FormatSize(int bytes)
    {
        const double Kib = 1024d;
        const double Mib = Kib * 1024d;

        if (bytes < Kib)
        {
            return string.Create(System.Globalization.CultureInfo.CurrentCulture, $"{bytes} B");
        }

        if (bytes < Mib)
        {
            return string.Create(System.Globalization.CultureInfo.CurrentCulture, $"{(bytes / Kib):F1} KB");
        }

        return string.Create(System.Globalization.CultureInfo.CurrentCulture, $"{(bytes / Mib):F1} MB");
    }

    private async Task DownloadAttachment(Attachment attachment)
    {
        try
        {
            if (attachment.Blob != null)
            {
                await JsInteropService.DownloadFileFromStream(attachment.Filename, attachment.Blob);
            }
            else
            {
                // Handle the case where the attachment or its content is not found
                await Console.Error.WriteLineAsync($"Attachment not found or has no content: {attachment.Id}");
            }
        }
        catch (Exception ex)
        {
            // Handle any exceptions that occur during the download process
            await Console.Error.WriteLineAsync($"Error downloading attachment: {ex.Message}");
        }
    }
}
