Refactoring and improvement of alert selection into its own component

CronAlarm/Config/AlertGroup.cs

@@ -1,4 +1,5 @@
 using System.Collections.Generic;
+using System.Linq;
 
 namespace CronAlarm.Config
 {
@@ -6,5 +7,7 @@ namespace CronAlarm.Config
     {
         public string Name { get; set; }
         public IList<AlertOption> Options { get; set; } = new List<AlertOption>();
+
+        public IEnumerable<(int index, AlertOption option)> IndexedOptions => Options.Select((o, i) => (i, o));
     }
 }

CronAlarm/Pages/AlertSelection.razor

@@ -0,0 +1,19 @@
+@foreach (var group in Config.Alerts.Groups)
+{
+    <div class="row">
+        <div class="col-12">
+            @group.Name
+            <div class="list-group">
+                @foreach (var option in group.IndexedOptions)
+                {
+                    <button type="button" class="list-group-item list-group-item-action @ActiveClass(group.Name, option.index)" @onclick="evt => ToggleOption(group.Name, option.index)">
+                        @option.option.Label
+                    </button>
+                }
+            </div>
+        </div>
+    </div>
+}
+<div>
+    <button class="btn btn-primary" @onclick="Save">Save</button> <button class="btn btn-secondary" @onclick="Reset">Reset</button>
+</div>

CronAlarm/Pages/AlertSelection.razor.cs

@@ -0,0 +1,48 @@
+using CronAlarm.Config;
+using Microsoft.AspNetCore.Components;
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Threading.Tasks;
+
+namespace CronAlarm.Pages
+{
+    public partial class AlertSelection : IComponent
+    {
+        [Inject]
+        private AlertConfig Config { get; set; }
+
+        private IDictionary<string, int> SelectedOptions { get; set; } = new Dictionary<string, int>();
+
+        public AlertSelection()
+        {
+            SelectedOptions["Weekdays"] = 1;
+        }
+
+        private void ToggleOption(string group, int index)
+        {
+            if (SelectedOptions.ContainsKey(group) && SelectedOptions[group] == index)
+            {
+                // set to "unselected"
+                index = -1;
+            }
+
+            SelectedOptions[group] = index;
+        }
+
+        private string ActiveClass(string group, int index)
+        {
+            return SelectedOptions.ContainsKey(group) && SelectedOptions[group] == index ? "active" : string.Empty;
+        }
+
+        private void Save()
+        {
+            //this.
+        }
+
+        private void Reset()
+        {
+
+        }
+    }
+}

CronAlarm/Pages/Index.razor

@@ -3,23 +3,5 @@
 <h1>Alerts</h1>
 
 <div class="container">
-    @foreach (var group in Config.Alerts.Groups)
-    {
-        <div class="row">
-            <div class="col-12">
-                @group.Name
-                <div class="list-group">
-                    @foreach (var option in group.Options)
-                    {
-                        <button type="button" class="list-group-item list-group-item-action" @onclick="SelectOption">
-                            @option.Label
-                        </button>
-                    }
-                </div>
-            </div>
-        </div>
-    }
-    <div>
-        <button class="btn btn-primary" @onclick="Save">Save</button> <button class="btn btn-secondary" @onclick="Reset">Reset</button>
-    </div>
+    <AlertSelection />
 </div>

CronAlarm/Pages/Index.razor.cs

@@ -1,30 +1,11 @@
-using CronAlarm.Config;
-using Microsoft.AspNetCore.Components;
-using Microsoft.Extensions.Configuration;
+using Microsoft.AspNetCore.Components;
 
 namespace CronAlarm.Pages
 {
     public partial class Index : IComponent
     {
-        [Inject]
-        private AlertConfig Config { get; set; }
-
         public Index()
         {
-            var foo = 42;
-        }
-
-        private void SelectOption()
-        { }
-
-        private void Save()
-        {
-
-        }
-
-        private void Reset()
-        {
-
         }
     }
 }

CronAlarm/Program.cs

@@ -1,3 +1,4 @@
+using CronAlarm.Config;
 using Microsoft.AspNetCore.Hosting;
 using Ninject;
 using Ninject.Web.AspNetCore;
@@ -31,6 +32,8 @@ namespace CronAlarm
 
             kernel.Load(typeof(AspNetCoreHostConfiguration).Assembly);
 
+            kernel.Bind<AlertConfig>().ToSelf();
+
             return kernel;
         }
     }