Markdown: merge uploaded files callback

[stsrki]

          The fix seems to be working fine. That's good.

Regarding the suggested changes. If you think you could improve it and make it without introducing any new APIs while still making it sync between C# and JS reference, then you're free to go. I will open new ticket for that.

Anyways, before merging, please update the docs and mention the current behavior and the reasoning behind it so that people are aware of it.

Originally posted by @stsrki in #5975 (comment)

[stsrki]

@tesar-tech if there is no breaking changes do it in 1.7, otherwise move it to master, or next-2.0.

[tesar-tech]

I will just leave here some issues I have found/fixed. Might be important for a future reference..

(1) Uploading multiple file - weird percentage counting.

Now with fixed multiple uploads, this is what's happening:

In onimageupload 1
Started Image: Screenshot From 2025-02-05 16-19-14.png
In onimageupload 1
Started Image: Screenshot From 2025-02-05 18-05-29.png
Image: Screenshot From 2025-02-05 16-19-14.png Progress: 17
Image: Screenshot From 2025-02-05 16-19-14.png Progress: 27
Image: Screenshot From 2025-02-05 16-19-14.png Progress: 45
Image: Screenshot From 2025-02-05 16-19-14.png Progress: 55
Image: Screenshot From 2025-02-05 16-19-14.png Progress: 73
Image: Screenshot From 2025-02-05 16-19-14.png Progress: 83
Image: Screenshot From 2025-02-05 18-05-29.png Progress: 101
Image: Screenshot From 2025-02-05 18-05-29.png Progress: 111
Image: Screenshot From 2025-02-05 18-05-29.png Progress: 128
Image: Screenshot From 2025-02-05 16-19-14.png Progress: 146
Image: Screenshot From 2025-02-05 18-05-29.png Progress: 156
Image: Screenshot From 2025-02-05 16-19-14.png Progress: 166
Image: Screenshot From 2025-02-05 18-05-29.png Progress: 184
Image: Screenshot From 2025-02-05 18-05-29.png Progress: 194
Image: Screenshot From 2025-02-05 18-05-29.png Progress: 211
Image: Screenshot From 2025-02-05 16-19-14.png Progress: 220

I guess two tasks are writing into one variable??

In onimageupload 1 comes from Console.WriteLine($"In onimageupload {e.Files.Length}"); - the core issue here.

(2) Referencing file from FileEdit.OnChange

<Paragraph>
    Steps to reproduce:
    <UnorderedList>
        <UnorderedListItem>
            Upload file or files.
        </UnorderedListItem>
        <UnorderedListItem>
            Upload files again
        </UnorderedListItem>
        <UnorderedListItem>
            Press the button
        </UnorderedListItem>
    </UnorderedList>
    Explanation: On every upload the file entry list is initialized again. FileEdit.js l78. 
    If we keep the file IFileEntry from the first upload, the blob is no longer present after the second upload.
    
</Paragraph>
<Field>
    <FileEdit Multiple="true" Changed="@OnChanged" />
</Field>

<Button Clicked="() => SomeMethodThatIsCalledLaaater()">write ot stream async later</Button>
@code {
    bool _storeFile = true;
    IFileEntry? _fileForLater;
    
    async Task SomeMethodThatIsCalledLaaater()
    {
        if (_fileForLater is null) return;
        //c# file is not null, but the state of the actual blob is unknow
        using var memoryStream = new MemoryStream();
        await _fileForLater.WriteToStreamAsync(memoryStream);
    }
    
    async Task OnChanged(FileChangedEventArgs e)
    {
            if (_storeFile)
            {
                _storeFile = false;
                _fileForLater = e.Files.First();
            }
    }

}
    

This requires similar fix as was done fore fileupload in markdown.

(3) Multiple files in Markdown without UploadUrl result in unexpected behavior

<Markdown
    ImageUploadChanged="@OnImageUploadChanged"
/>

@code {
    async Task OnImageUploadChanged( FileChangedEventArgs e )
    {
       
            foreach ( var file in e.Files )
            {
                await using var stream = new System.IO.MemoryStream(); 
                await file.WriteToStreamAsync(stream);
            }
     
    }

}

Uploading one file with this code results in this text inside the textarea

[](#url#)

Which is kind of wrong, it's not even empty image, just empty link.

Then uploading multiple files (2 for this case) result in "cloning" the text:

[](#url#)[](#url#)[](#url#)[](#url#)

(note that totally 3 files has been "uploaded"). On next upload the "tags" multiply again.

This does not happen when file.UploadUrl is provided, for example like that:

   foreach ( var file in e.Files )
            {
                await using var stream = new System.IO.MemoryStream(); 
                await file.WriteToStreamAsync(stream);
                file.UploadUrl = "some text" + file.Name;
            }