Added file upload component

Wave/Components/FileUploadComponent.razor

@@ -0,0 +1,41 @@
+@using Wave.Utilities
+
+@if (Busy) {
+    <progress class="progress progress-primary w-full max-w-xs mb-3"></progress>
+}
+<div class="form-control">
+    <InputFile class="file-input file-input-bordered w-full max-w-xs" disabled="@Busy"
+               OnChange="@LoadFiles" accept="@AcceptTypes" />
+    @if (!string.IsNullOrWhiteSpace(Message)) {
+        <div class="label">
+            <span class="label-text-alt text-error">@Message</span>
+        </div>
+    }
+</div>
+
+@code {
+    [Parameter]
+    public long MaxFileSize { get; set; } = 1024 * 1024 * 5; // 5MB should be fine
+    [Parameter]
+    public string AcceptTypes { get; set; } = "image/png, image/jpeg, image/webp";
+    [Parameter]
+    public required EventCallback<string> FileUploadedCallback { get; set; }
+
+    private string Message { get; set; } = string.Empty;
+    private bool Busy { get; set; }
+
+    private async Task LoadFiles(InputFileChangeEventArgs args) {
+        Busy = true;
+
+        try {
+            string tempPath = await FileUtilities.StoreTemporary(args.File.OpenReadStream(MaxFileSize));
+            await FileUploadedCallback.InvokeAsync(tempPath);
+            Message = string.Empty; 
+        } catch (Exception ex) {
+            Message = "File upload failed: " + ex.Message;
+        } finally {
+            Busy = false;
+        }
+    }
+
+}

Wave/Components/Pages/Upload.razor

@@ -2,7 +2,6 @@
 
 @using Microsoft.AspNetCore.Authorization
 @using Wave.Services
-@using System.IO.Pipelines
 
 @attribute [Authorize]
 @rendermode InteractiveServer
@@ -11,48 +10,24 @@
 <PageTitle>Upload</PageTitle>
 
 <h3 class="title mb-3">Upload</h3>
-@if (Busy) {
+
-    <progress class="progress progress-primary w-56"></progress>
-} 
 <div>
-    <p>@Message</p>
     @if (Path is not null) {
         <img src="@Path" type="@ImageService.ImageMimeType" width="800" alt="" />
     }
 </div>
-
+<FileUploadComponent FileUploadedCallback="Callback" />
-<InputFile OnChange="@LoadFiles" accept="image/png, image/jpeg, image/webp" />
 
 @code {
-    private const long MaxFileSize = 1024 * 1024 * 5; // 5MB should be fine
-    private string Message { get; set; } = string.Empty;
     private string? Path { get; set; }
-    private bool Busy { get; set; }
     
-    private async Task LoadFiles(InputFileChangeEventArgs args) {
+    private async Task Callback(string tempFilePath) {
-        Busy = true;
+        var guid = await ImageService.StoreImageAsync(tempFilePath);
-
+        if (guid is null) {
-        try {
+            throw new ApplicationException("Could not process file, upload possibly corrupted.");
-            string tempName = System.IO.Path.GetRandomFileName();
-            string tempDirectory = System.IO.Path.Combine(".", "files", "temp");
-            Directory.CreateDirectory(tempDirectory);
-            string tempPath = System.IO.Path.Combine(tempDirectory, tempName);
-            await using var fs = new FileStream(tempPath, FileMode.Create);
-            await args.File.OpenReadStream(MaxFileSize).CopyToAsync(fs);
-
-            var guid = await ImageService.StoreImageAsync(tempPath);
-
-            if (guid is null) {
-                Message = "Image upload failed";
-            } else {
-                Message = "Image uploaded successfully";
-                Path = "/images/" + guid;
-            }
-        } catch (Exception ex) {
-            Message = $"{ex.Message} ({ex.GetType().Name}).";
-        } finally {
-            Busy = false;
         }
+
+        Path = "/images/" + guid;
     }
 
 }