I created a custom dialog component with MudProgressCircular (Child razor) that should display the progress while writing the part details to the XML output file. The issue I am trying to address is the dialog won't open while saving the details to the file, but it opens later when the task is complete.
Parent.razor
<MudButton Class="mt-2" OnClick="@(() => OnClickedAsync())" Color="Color.Primary" Size="Size.Small" Edge="Edge.Start">Process Parts</MudButton>@code { private List<Part> partItems; private async Task OnClickedAsync() { using (var handler = new HttpClientHandler()) { using (var httpClient = new HttpClient(handler)) { serviceEndpoint = $"{Config.GetValue<string>("API")}/Parts"; var parts = await httpClient.GetFromJsonAsync<Part[]>(serviceEndpoint); partItems = parts.ToList(); } } ProcessParts(partItems); } private void ProcessParts(List<Part> parts) { var options = new DialogOptions { FullWidth = true, MaxWidth = MaxWidth.ExtraExtraLarge, CloseButton = true, Position = DialogPosition.Center, CloseOnEscapeKey = true }; var param = new DialogParameters(); param.Add("Parts", parts); var dialogRef = Dialogsrv.Show<Child>($"Processing parts", param, options);}Child.razor
<MudDialog Style="width:fit-content"><DialogContent><MudProgressCircular Color="Color.Primary" Value="@_value" Size="Size.Large"> @_value.ToString("N0") %</MudProgressCircular></DialogContent><DialogActions><MudButton Variant="Variant.Filled" Color="Color.Primary" OnClick="Close">Close</MudButton></DialogActions></MudDialog>@code { [CascadingParameter] private IMudDialogInstance ThisDialog { get; set; } [Parameter] public List<Part> Parts { get; set; } private int count = 0; private double _value; protected override void OnInitialized() { ProcessParts(Parts); } private void ProcessParts(List<Part> parts) { XDocument doc = XDocument.Load("Contents\\Template.xml"); XElement root = doc.Root; foreach (var part in parts) { root.Element("Parts").Add( new XElement("Part", new XElement("PartNo", part.Part), new XElement("Filename", part.FileName), new XElement("Material", part.Material), new XElement("CustomerName", part.CustomerName) )); count++; _value = 100 * count / parts.Count; } string fullPath = Path.Combine(_filePath, "Parts.xml"); using (StreamWriter stream = new StreamWriter(fullPath, false, Encoding.GetEncoding("Windows-1252"))) { doc.Save(stream); } }}I made sure the following if anyone is wondering.
- MudDialogProvider exists in the MainLayout.razor
- Registered the dialog service in dependency injection
Then I thought this might be an async/await issue, so I switched the methods in the Child.razor to the synchronous, but no luck.