From 125fa85d6e36c3ea7e6529da9fdd791ab9d05f33 Mon Sep 17 00:00:00 2001
From: markosteger <marko.steger@gmail.com>
Date: Mon, 13 Mar 2023 15:03:57 +0100
Subject: [PATCH] ReturnModal - modal that returns values

---
 .../Pages/Index.razor                         | 62 ++++++----------
 .../Components/ReturnModal.razor              | 22 ++++++
 .../Components/ReturnModal.razor.cs           | 71 +++++++++++++++++++
 .../Models/Modal/ModalOptions.cs              |  2 -
 .../Models/Modal/ModalResult.cs               |  5 ++
 .../Services/ModalDialogService.cs            |  3 +-
 6 files changed, 122 insertions(+), 43 deletions(-)
 create mode 100644 src/Connected.Components/Components/ReturnModal.razor
 create mode 100644 src/Connected.Components/Components/ReturnModal.razor.cs
 create mode 100644 src/Connected.Components/Models/Modal/ModalResult.cs

diff --git a/src/Connected.Components.Showcase.Runner/Pages/Index.razor b/src/Connected.Components.Showcase.Runner/Pages/Index.razor
index 9ed0882..e5de230 100644
--- a/src/Connected.Components.Showcase.Runner/Pages/Index.razor
+++ b/src/Connected.Components.Showcase.Runner/Pages/Index.razor
@@ -1,49 +1,33 @@
 @page "/"
-@using Connected.Models;
 @using Connected.Components;
+@using Connected.Models.Modal;
+@using Connected.Services;
+
+@inject ModalDialogService modalDialog;
 
 
 <h1 style="text-align:center;">Component Sandbox</h1>
 
-<Grid>
-    @for (int i = 0; i < 5; i++)
-    {
-        int num = i;
-        <GridRow>
-            <GridRowContent>
-                Fixed content @num.ToString()
-            </GridRowContent>
-            <GridRowContent Collapsable=true>
-                Collapsable content @num.ToString()
-            </GridRowContent>
-        </GridRow>
-    }
-</Grid>
-
-<p>Izbran datum je: @date</p>
-
-<FormWizard Id="Wizard1">
-    <FormWizardStep Name="Step1">
-        Step1
-    </FormWizardStep>
-    <FormWizardStep Name="Step2">
-        Step2
-    </FormWizardStep>
-    <FormWizardStep Name="Step3">
-        Step3
-    </FormWizardStep>
-    <FormWizardStep Name="Step4">
-        Step4
-    </FormWizardStep>
-</FormWizard>
-<DatePicker 
-CloseOnDateSelect=true
-@bind-SelectedDate=@date>
- 
-</DatePicker>
-
-<p>Selected date is @date.ToString()</p>
+
+<Button OnClick="OpenValueDialog">Open dialog</Button>
+
+<ReturnModal ReturnType="int" @bind-Visible=@ResultDialogShown @bind-Value=@value Title="Dialog1">
+    <NumberInput @bind-Value=@value></NumberInput>
+</ReturnModal>
+
+<p>Modal value @value.ToString()</p>
+
 
 @code {
     DateTime date = DateTime.Today;
+
+    int value = 0;
+    bool ResultDialogShown = false;
+
+
+    private void OpenValueDialog()
+    {
+        ResultDialogShown = !ResultDialogShown;
+        StateHasChanged();
+    }    
 }
\ No newline at end of file
diff --git a/src/Connected.Components/Components/ReturnModal.razor b/src/Connected.Components/Components/ReturnModal.razor
new file mode 100644
index 0000000..b9498dc
--- /dev/null
+++ b/src/Connected.Components/Components/ReturnModal.razor
@@ -0,0 +1,22 @@
+@typeparam ReturnType
+
+@using Connected.Models.Modal;
+@if (Visible)
+{
+    <div class="modal fade show" tabindex="-1">
+        <div class="modal-dialog modal-dialog-scrollable modal-dialog-centered">
+            <div class="modal-content">
+                <div class="modal-header">
+                        <h3 class="modal-title">@Title</h3>
+                </div>
+                <div class="modal-body">
+                    @ChildContent
+                </div>
+                <div class="modal-footer">
+                    <button type="button" class="btn btn-sm btn-core" @onclick="@(()=>CloseModal())">Zapri</button>
+                    <button type="button" class="btn btn-sm btn-info" @onclick="@(()=>CloseModal(true))">Ok</button>
+                </div>
+            </div>
+        </div>
+    </div>
+}
\ No newline at end of file
diff --git a/src/Connected.Components/Components/ReturnModal.razor.cs b/src/Connected.Components/Components/ReturnModal.razor.cs
new file mode 100644
index 0000000..c0c4f11
--- /dev/null
+++ b/src/Connected.Components/Components/ReturnModal.razor.cs
@@ -0,0 +1,71 @@
+using Connected.Models.Modal;
+using Microsoft.AspNetCore.Components;
+using Microsoft.AspNetCore.Components.Web;
+
+namespace Connected.Components;
+public partial class ReturnModal<ReturnType>
+{
+	[Parameter]
+	public bool Visible { get; set; } = false;
+
+	[Parameter]
+	public EventCallback<bool> VisibleChanged { get; set; }
+
+	[Parameter]
+	public string Title { get; set; } = string.Empty;
+
+	[Parameter]
+	public RenderFragment? ChildContent { get; set; }
+	protected bool OverlayClickToClose { get; set; } = true;
+
+	private ReturnType initialValue { get; set; }
+
+	[Parameter]
+	public ReturnType Value { get; set; } = default;
+
+	[Parameter]
+	public EventCallback<ReturnType> ValueChanged { get; set; }
+
+	protected ModalOptions? ModalOptions { get; set; }
+
+	public async Task CloseModal(bool returnResult = false)
+	{
+		Visible = false;
+		VisibleChanged.InvokeAsync(Visible);
+		Title = "";
+		ChildContent = null;
+		StateHasChanged();
+		if (!returnResult)
+			await ValueChanged.InvokeAsync(initialValue);
+		else
+			initialValue = Value;
+	}
+
+
+	public void CheckEscape(KeyboardEventArgs args)
+	{
+		if (!ModalOptions.DisableEscKey)
+		{
+			var key = args.Key.ToLower();
+			if (key.Equals("escape"))
+			{
+				CloseModal();
+			}
+		}
+	}
+
+	public void CloseIfEnabled(MouseEventArgs args)
+	{
+		CloseModal();
+	}
+
+	public void PreventClose(MouseEventArgs args)
+	{
+		OverlayClickToClose = false;
+	}
+
+	protected override async Task OnInitializedAsync()
+	{
+			initialValue = Value;
+	}
+}
\ No newline at end of file
diff --git a/src/Connected.Components/Models/Modal/ModalOptions.cs b/src/Connected.Components/Models/Modal/ModalOptions.cs
index 4f2443f..50c3ae5 100644
--- a/src/Connected.Components/Models/Modal/ModalOptions.cs
+++ b/src/Connected.Components/Models/Modal/ModalOptions.cs
@@ -5,6 +5,4 @@ public class ModalOptions
 	public bool DisableBackdropClick { get; set; } = false;
 	public bool NoHeader { get; set; } = false;
 
-
-
 }
diff --git a/src/Connected.Components/Models/Modal/ModalResult.cs b/src/Connected.Components/Models/Modal/ModalResult.cs
new file mode 100644
index 0000000..20eaec8
--- /dev/null
+++ b/src/Connected.Components/Models/Modal/ModalResult.cs
@@ -0,0 +1,5 @@
+namespace Connected.Models.Modal;
+internal class ModalResult
+{
+	public object Result { get; set; }
+}
diff --git a/src/Connected.Components/Services/ModalDialogService.cs b/src/Connected.Components/Services/ModalDialogService.cs
index 5b988ef..c07bc8b 100644
--- a/src/Connected.Components/Services/ModalDialogService.cs
+++ b/src/Connected.Components/Services/ModalDialogService.cs
@@ -1,5 +1,4 @@
-using Connected.Components;
-using Connected.Models.Modal;
+using Connected.Models.Modal;
 using Microsoft.AspNetCore.Components;
 
 namespace Connected.Services;