feat(Dashboard): added workflow instance details view (wip)

Signed-off-by: Jean-Baptiste Bianchi <[email protected]>

src/dashboard/Synapse.Dashboard/Components/CorrelationContextDetails.razor

@@ -0,0 +1,29 @@
+@*
+    Copyright © 2024-Present The Synapse Authors
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+*@
+
+@namespace Synapse.Dashboard.Components
+@inject IJsonSerializer JsonSerializer
+
+@if (CorrelationContext != null)
+{
+    <pre>
+        @JsonSerializer.SerializeToText(CorrelationContext);
+        </pre>
+}
+
+@code {
+    [Parameter] public CorrelationContext? CorrelationContext { get; set; }
+}

src/dashboard/Synapse.Dashboard/Components/DocumentDetails/DocumentDetails.razor

@@ -0,0 +1,147 @@
+@*
+    Copyright © 2024-Present The Synapse Authors
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+*@
+
+@namespace Synapse.Dashboard.Components
+@using Synapse.Dashboard.Components.DocumentDetailsStateManagement
+@inherits StatefulComponent<DocumentDetails, DocumentDetailsStore, DocumentDetailsState>
+
+<div class="d-flex justify-content-between">
+    @if (LabelTemplate != null) {
+        @LabelTemplate
+    }
+    else {
+        <span class="label">@Label</span>
+    }
+    @if (collapse != null)
+    {
+        <Icon Name="@(isOpen ? IconName.CaretUp : IconName.CaretDown)" @onclick="async (_) => await ToggleAsync()" />
+    }
+</div>
+
+<Collapse @ref="collapse" OnShowing="Store.LoadReferencedDocumentAsync">
+    @if (reference == null && Document == null)
+    {
+        <p>No document</p>
+    }
+    else
+    {
+        @if (!loaded)
+        {
+            <Spinner Class="me-3" Color="SpinnerColor.Primary" Size="SpinnerSize.Small" />
+        }
+        else
+        {
+            <PreferredLanguageSelector PreferedLanguageChange="Store.ToggleTextBasedEditorLanguageAsync" />
+            <StandaloneCodeEditor @ref="Store.TextEditor"
+                                  ConstructionOptions="Store.StandaloneEditorConstructionOptions"
+                                  OnDidInit="Store.OnTextBasedEditorInitAsync"
+                                  CssClass="h-100-px" />
+        }
+        @if (problemDetails != null)
+        {
+            <div class="problems">
+                <Callout Type="CalloutType.Danger" Heading="@problemDetails.Title">
+                    @problemDetails.Detail
+                </Callout>
+                @if (problemDetails.Errors != null && problemDetails.Errors.Any())
+                {
+                    foreach (KeyValuePair<string, string[]> errorContainer in problemDetails.Errors)
+                    {
+                        <Callout Type="CalloutType.Danger" Heading="@errorContainer.Key">
+                            <ul>
+                                @foreach (string error in errorContainer.Value)
+                                {
+                                    <li>@error</li>
+                                }
+                            </ul>
+                        </Callout>
+                    }
+                }
+            </div>
+        }
+    }
+</Collapse>
+
+@code {
+    /// <summary>
+    /// The label to display
+    /// </summary>
+    [Parameter] public string? Label { get; set; }
+    /// <summary>
+    /// The label to display
+    /// </summary>
+    [Parameter] public RenderFragment? LabelTemplate { get; set; }
+    /// <summary>
+    /// The reference of the document to load
+    /// </summary>
+    [Parameter] public string? Reference { get; set; }
+    /// <summary>
+    /// The reference of the document to display
+    /// </summary>
+    [Parameter] public object? Document { get; set; }
+
+    /// <summary>
+    /// The <see cref="Collapse" /> reference
+    /// </summary>
+    private Collapse collapse = default!;
+    /// <summary>
+    /// The state of the <see cref="Collapse" />
+    /// </summary>
+    private bool isOpen = false;
+    /// <summary>
+    /// The internal reference
+    /// </summary>
+    private string? reference;
+    /// <summary>
+    /// The internal boolean indicating if the resource already loaded
+    /// </summary>
+    private bool loaded = false;
+    /// <summary>
+    /// The <see cref="ProblemDetails"/> that occurred when trying to save the resource, if any
+    /// </summary>
+    private ProblemDetails? problemDetails = null;
+
+    /// <inheritdoc/>
+    protected override async Task OnInitializedAsync()
+    {
+        await base.OnInitializedAsync().ConfigureAwait(false);
+        Store.Reference.Subscribe(newReference => OnStateChanged(cmp => cmp.reference = newReference), token: CancellationTokenSource.Token);
+        Store.Loaded.Subscribe(newLoading => OnStateChanged(cmp => cmp.loaded = newLoading), token: CancellationTokenSource.Token);
+        Store.ProblemDetails.Subscribe(newProblemDetails => OnStateChanged(cmp => cmp.problemDetails = newProblemDetails), token: CancellationTokenSource.Token);
+    }
+
+    /// <inheritdoc/>
+    protected override async Task OnParametersSetAsync()
+    {
+        await base.OnParametersSetAsync();
+        Store.SetDocument(Document);
+        if (reference != Reference)
+        {
+            Store.SetReference(Reference);
+        }
+        if (collapse != null)
+        {
+            isOpen = false;
+            await collapse.HideAsync();
+        }
+    }
+
+    async Task ToggleAsync()
+    {
+        isOpen = !isOpen;
+        await (isOpen ? collapse.ShowAsync() : collapse.HideAsync());
+    }
+}

src/dashboard/Synapse.Dashboard/Components/ReferenceDetails/State.cs → src/dashboard/Synapse.Dashboard/Components/DocumentDetails/State.cs

@@ -11,12 +11,12 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
-namespace Synapse.Dashboard.Components.ReferenceDetailsStateManagement;
+namespace Synapse.Dashboard.Components.DocumentDetailsStateManagement;
 
 /// <summary>
-/// Represents the state of a <see cref="Synapse.Dashboard.Components.ReferenceDetails"/>
+/// Represents the state of a <see cref="Synapse.Dashboard.Components.DocumentDetails"/>
 /// </summary>
-public record ReferenceDetailsState
+public record DocumentDetailsState
 {
 
     /// <summary>
@@ -27,12 +27,12 @@ public record ReferenceDetailsState
     /// <summary>
     /// Gets/sets the reference to load
     /// </summary>
-    public string Reference { get; set; } = string.Empty;
+    public string? Reference { get; set; } = string.Empty;
 
     /// <summary>
-    /// Gets/sets the referenced document
+    /// Gets/sets the JSON representation of the referenced document
     /// </summary>
-    public string Document { get; set; } = string.Empty;
+    public string DocumentJson { get; set; } = string.Empty;
 
     /// <summary>
     /// Gets/sets a boolean indicating the reference has been loaded