Getting to making it work with modals

Seenginx.Models/NewFileForm.cs

@@ -0,0 +1,11 @@
+using System;
+using System.Collections.Generic;
+using System.Text;
+
+namespace Seenginx.Models
+{
+	public class NewFileForm
+	{
+		public string Name { get; set; }
+	}
+}

Seenginx/Components/FilesWithEditor.razor

@@ -12,7 +12,7 @@
 			</div>
 			<div class="control has-icons-left">
 				<div class="select is-small is-rounded">
-					<select class="neoBtnSmall" @onchange="e => OnFilterClick(e.Value.ToString())">
+					<select class="neoInput" @onchange="e => OnFilterClick(e.Value.ToString())">
 						@foreach (var filter in Filters)
 						{
 							<option value="@filter">@filter</option>
@@ -31,8 +31,8 @@
 		{
 			<div class="field is-grouped">
 				<div class="control is-expanded borderRBig neoInput has-text-centered">
-					<input class="input is-5 is-rounded is-small neoInput" 
+					<input class="input is-5 is-rounded is-small neoInput"
-								 type="text" placeholder="Search..." 
+								 type="text" placeholder="Search..."
 								 value="@SelectedFile.Name" disabled="@(SelectedFile.CanBeDeleted ? null : "disabled")"
 								 @onchange="e => SelectedFile.DraftName = e.Value.ToString()">
 				</div>
@@ -107,3 +107,5 @@
 	</div>
 
 </div>
+
+

Seenginx/Components/FilesWithEditor.razor.cs

@@ -1,4 +1,5 @@
-using Microsoft.AspNetCore.Components;
+using Blazorise;
+using Microsoft.AspNetCore.Components;
 using Microsoft.AspNetCore.Components.Web;
 using Microsoft.JSInterop;
 using Seenginx.Models;
@@ -24,12 +25,8 @@ namespace Seenginx.Components
 		[Parameter]
 		public Dictionary<string, string> FilterFolder { get; set; } = new Dictionary<string, string>();
 
-		[Parameter]
-		public EventCallback AddFile { get; set; }
 		[Parameter]
 		public EventCallback<CFile> UpdateFile { get; set; }
-		[Parameter]
-		public EventCallback DeleteFile { get; set; }
 
 		[Parameter]
 		public RenderFragment<CFile> Editor { get; set; } = null;
@@ -160,17 +157,34 @@ namespace Seenginx.Components
 			var draftCode = await JsRuntime.InvokeAsync<string>("GetEditorCode");
 			SelectedFile.Body = draftCode;
 		}
+
+		[Parameter]
+		public EventCallback TestConfiguration { get; set; }
+		[Parameter]
+		public Result<string> TestResult { get; set; }
 		protected async Task OnTest(MouseEventArgs e)
 		{
+			await TestConfiguration.InvokeAsync(null);
 		}
 
+		[Parameter]
+		public EventCallback AddFileModal { get; set; }
+		[Parameter]
+		public Result<ConfigFile> AddResult { get; set; }
 		protected async Task OnAddDialog()
 		{
-			await AddFile.InvokeAsync(null);
+			await AddFileModal.InvokeAsync(null);
 		}
-		protected async Task OnDeleteDialog()
+
+		[Parameter]
+		public EventCallback DeleteFileModal { get; set; }
+		[Parameter]
+		public Result<bool> DeleteResult { get; set; }
+		protected async Task OnDeleteDialog(MouseEventArgs eventArgs)
 		{
-			await DeleteFile.InvokeAsync(null);
+			await DeleteFileModal.InvokeAsync(eventArgs);
 		}
+
+
 	}
 }

Seenginx/Components/GeneralNotificationModal.razor

@@ -0,0 +1,19 @@
+@inherits GeneralNotificationModalBase
+
+<Modal @ref="ModalReference">
+	<ModalBackdrop />
+	<ModalContent IsForm="false" IsCentered="true">
+		<ModalHeader>
+			<ModalTitle>
+				<span class="icon is-medium"><i class="mdi @NotificationSettings.TitleClass"></i></span>
+				<span>@NotificationSettings.Title</span>
+			</ModalTitle>
+		</ModalHeader>
+		<ModalBody>
+			<p>@NotificationSettings.Text</p>
+		</ModalBody>
+		<ModalFooter>
+			<Blazorise.Bulma.Button Color="@NotificationSettings.ButtonColor" Clicked="@HideGeneralNotificationModal">Ok</Blazorise.Bulma.Button>
+		</ModalFooter>
+	</ModalContent>
+</Modal>

Seenginx/Components/GeneralNotificationModal.razor.cs

@@ -0,0 +1,44 @@
+using Blazorise;
+using Microsoft.AspNetCore.Components;
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Threading.Tasks;
+
+namespace Seenginx.Components
+{
+	public class GeneralNotificationModalBase : ComponentBase
+	{
+		[Parameter]
+		public Modal ModalReference { get; set; }
+		[Parameter]
+		public GeneralNotificationSettings NotificationSettings { get; set; }
+
+		public void ShowGeneralNotificationModal(string titleClass, string title, string text, Color color)
+		{
+			NotificationSettings.TitleClass = titleClass;
+			NotificationSettings.Title = title;
+			NotificationSettings.Text = text;
+			NotificationSettings.ButtonColor = color;
+			ModalReference.Show();
+		}
+
+		public void HideGeneralNotificationModal()
+		{
+			ModalReference.Hide();
+			NotificationSettings.TitleClass = null;
+			NotificationSettings.Title = null;
+			NotificationSettings.Text = null;
+			NotificationSettings.ButtonColor = Color.None;
+		}
+
+	}
+
+	public class GeneralNotificationSettings
+	{
+		public string TitleClass { get; set; }
+		public string Title { get; set; }
+		public string Text { get; set; }
+		public Color ButtonColor { get; set; }
+	}
+}

Seenginx/Pages/Nginx.razor

@@ -1,26 +1,33 @@
 @inherits NginxBase
 @page "/nginx"
 
-<p>ciao</p>
-
 <FilesWithEditor CFile="ConfigFile" Filters="Filters" Files="ConfigFiles" FilterFolder="FilterFolder"
 								 SelectedFile="SelectedFile" SelectedFileChanged="SelectedFileChanged"
-								 AddFile="AddFile" DeleteFile="DeleteFile">
+								 TestConfiguration="TestConfiguration" TestResult="TestResult"
+								 DeleteFileModal="DeleteFile" DeleteResult="DeleteResult"
+								 AddFileModal="ShowAddFileModal" AddResult="AddFileResult">
 </FilesWithEditor>
-<Modal @ref="ModalRef">
+<Modal @ref="AddFileModal">
 	<ModalBackdrop />
 	<ModalContent IsForm="true" IsCentered="true">
 		<ModalHeader>
-			<ModalTitle>Employee edit</ModalTitle>
+			<ModalTitle>Add new file form</ModalTitle>
-			<CloseButton Clicked="@HideModal" />
+			<CloseButton Clicked="e => CloseModal(AddFileModal)"/>
 		</ModalHeader>
 		<ModalBody>
-			<p>Area you sure about that?</p>
+			<Blazorise.Bulma.Fields>
+				<Blazorise.Bulma.Field>
+					<Blazorise.Bulma.FieldLabel>File name</Blazorise.Bulma.FieldLabel>
+					<Blazorise.Bulma.FieldBody @bind-FileName="NewFileForm.Name"></Blazorise.Bulma.FieldBody>
+					<Blazorise.Bulma.FieldHelp>Service name which is going to be behing di config file</Blazorise.Bulma.FieldHelp>
+				</Blazorise.Bulma.Field>
+			</Blazorise.Bulma.Fields>
 		</ModalBody>
 		<ModalFooter>
-			<Blazorise.Bulma.Button Color="Color.Secondary" Clicked="@HideModal">Close</Blazorise.Bulma.Button>
+			<Blazorise.Bulma.Button Color="Color.Secondary" Clicked="e => CloseModal(AddFileModal)">Close</Blazorise.Bulma.Button>
-			<Blazorise.Bulma.Button Color="Color.Primary" Clicked="@HideModal">Save Changes</Blazorise.Bulma.Button>
+			<Blazorise.Bulma.Button Color="Color.Primary" Clicked="AddFileAsync">Add</Blazorise.Bulma.Button>
 		</ModalFooter>
 	</ModalContent>
 </Modal>
-
+<GeneralNotificationModal ModalReference="GeneralNotificationModal"
+													NotificationSettings="GeneralNotificationSettings"></GeneralNotificationModal>

Seenginx/Pages/Nginx.razor.cs

@@ -1,5 +1,7 @@
 using Blazorise;
 using Microsoft.AspNetCore.Components;
+using Microsoft.AspNetCore.Components.Web;
+using Seenginx.Components;
 using Seenginx.Models;
 using Seenginx.Services;
 using System;
@@ -23,6 +25,8 @@ namespace Seenginx.Pages
 		public ConfigFile SelectedFile { get; set; }
 		public List<string> Filters { get; set; } = new List<string>();
 		public List<int> FilteredOutFiles { get; set; } = new List<int>();
+		public Modal GeneralNotificationModal { get; set; } = new Modal();
+		public GeneralNotificationSettings GeneralNotificationSettings { get; set; } = null;
 
 		public Dictionary<string, string> FilterFolder { get; set; } = new Dictionary<string, string>();
 
@@ -43,33 +47,76 @@ namespace Seenginx.Pages
 			SelectedFile = configFile;
 		}
 
-		protected Modal ModalRef { get; set; }
 
-		protected void ShowModal()
+		protected Modal AddFileModal { get; set; }
+		public Result<ConfigFile> AddFileResult { get; set; }
+		public async Task ShowAddFileModal()
 		{
-			ModalRef.Show();
+			AddFileModal.Show();
+		}
+		public NewFileForm NewFileForm { get; set; } = new NewFileForm();
+		public async Task AddFileAsync()
+		{
+			AddFileResult = await NginxService.AddFileAsync(NewFileForm);
+			if (AddFileResult.AllOk)
+				ConfigFiles.Add(AddFileResult.Data);
+			else
+			{
+				GeneralNotificationSettings = new GeneralNotificationSettings
+				{
+					ButtonColor = Color.Danger,
+					TitleClass = "mdi-error",
+					Title = "Failure",
+					Text = TestResult.ErrorMessage
+				};
+				GeneralNotificationModal.Show();
+			}
 		}
 
-		protected void HideModal()
+		public Result<ConfigFile> SaveUpdateDraftResult { get; set; }
+		public async Task SaveUpdateDraftFileAsync()
 		{
-			ModalRef.Hide();
+			SaveUpdateDraftResult = await FileService.SaveUpdateDraftFileAsync(SelectedFile);
 		}
 
-		public async Task AddFile()
+		public Result<ConfigFile> SaveUpdateResult { get; set; }
+		public async Task SaveUpdateFileAsync()
 		{
-			ShowModal();
+			SaveUpdateResult = await FileService.SaveUpdateFileAsync(SelectedFile);
 		}
 
-		public async Task<Result<ConfigFile>> SaveDraftFileAsync() =>
+		public Result<string> TestResult { get; set; }
-			await FileService.SaveUpdateDraftFileAsync(SelectedFile);
+		public async Task TestConfiguration()
-
-		public async Task<Result<ConfigFile>> SaveFileAsync() =>
-			await FileService.SaveUpdateFileAsync(SelectedFile);
-
-		public Result<bool> DeleteFile(EventArgs eventArgs)
 		{
-			return FileService.DeleteFile(SelectedFile);
+			TestResult = await NginxService.TestNginxConfigurations(SelectedFile);
+			if (TestResult.AllOk)
+				GeneralNotificationSettings = new GeneralNotificationSettings
+				{
+					ButtonColor = Color.Success,
+					TitleClass = "mdi-success",
+					Title = "Success",
+					Text = $"Test of config file '{SelectedFile.Name}' completed with success."
+				};
+			else
+				GeneralNotificationSettings = new GeneralNotificationSettings
+				{
+					ButtonColor = Color.Danger,
+					TitleClass = "mdi-error",
+					Title = "Failure",
+					Text = TestResult.ErrorMessage
+				};
+			GeneralNotificationModal.Show();
 		}
 
+		public Result<bool> DeleteResult { get; set; }
+		public void DeleteFile()
+		{
+			DeleteResult = FileService.DeleteFile(SelectedFile);
+		}
+
+		public void CloseModal(Modal modal)
+		{
+			modal.Hide();
+		}
 	}
 }

Seenginx/Services/INginxService.cs

@@ -7,6 +7,7 @@ namespace Seenginx.Services
 	public interface INginxService
 	{
 		Task<IEnumerable<ConfigFile>> GetFilesAsync();
-		Task<Result<bool>> TestNginxConfigurations();
+		Task<Result<string>> TestNginxConfigurations(ConfigFile configFile);
+		Task<Result<ConfigFile>> AddFileAsync(NewFileForm newFileForm);
 	}
 }

Seenginx/Services/NginxService.cs

@@ -17,6 +17,12 @@ namespace Seenginx.Services
 			ConfigPaths = configPaths;
 		}
 
+		public async Task<Result<ConfigFile>> AddFileAsync(NewFileForm newFileForm)
+		{
+			var addResult = new Result<ConfigFile>();
+			addResult.Data.Name = newFileForm.Name;
+			return addResult;
+		}
 
 		public async Task<IEnumerable<ConfigFile>> GetFilesAsync()
 		{
@@ -82,10 +88,10 @@ namespace Seenginx.Services
 			return finalList;
 		}
 
-		public async Task<Result<bool>> TestNginxConfigurations()
+		public async Task<Result<string>> TestNginxConfigurations(ConfigFile configFile)
 		{
-			var result = new Result<bool>();
+			var result = new Result<string>();
-			result.SetData(true);
+			result.SetData("Uhu");
 			return result;
 		}
 	}