Implemented extendable system settings tab. Started implementing white labeling settings

Moonlight.Frontend/UI/Admin/Views/Sys/Settings.razor

@@ -0,0 +1,52 @@
+@using Microsoft.Extensions.Options
+@using Moonlight.Frontend.Configuration
+@using ShadcnBlazor.Cards
+@using ShadcnBlazor.Sidebars
+
+@inject IOptions<SystemSettingsOptions> Options
+
+<div class="mt-5 flex flex-col md:flex-row gap-5">
+    <Card ClassName="flex py-2 grow-0 min-w-56 max-h-[65vh] md:min-h-[65vh]">
+        <CardContent ClassName="px-2 flex flex-col gap-y-1 h-full max-h-[65vh] overflow-y-auto scrollbar-thin">
+            @foreach (var menuPage in Pages)
+            {
+                <SidebarMenuButton @onclick="() => Navigate(menuPage)" IsActive="@(CurrentPage == menuPage)" ClassName="overflow-visible">
+                    <DynamicComponent Type="@menuPage.IconComponentType" />
+                    <span>@menuPage.Name</span>
+                </SidebarMenuButton>
+            }
+        </CardContent>
+    </Card>
+    @if (CurrentPage != null)
+    {
+        <Card ClassName="flex grow">
+            <CardHeader>
+                <CardTitle>@CurrentPage.Name</CardTitle>
+                <CardDescription>@CurrentPage.Description</CardDescription>
+            </CardHeader>
+            <CardContent>
+                <DynamicComponent Type="@CurrentPage.ComponentType" />
+            </CardContent>
+        </Card>
+    }
+</div>
+
+@code
+{
+    private SystemSettingsPage[] Pages;
+    private SystemSettingsPage? CurrentPage;
+
+    protected override void OnInitialized()
+    {
+        Pages = Options
+            .Value
+            .Components
+            .OrderBy(x => x.Order)
+            .ToArray();
+
+        CurrentPage = Pages.FirstOrDefault();
+    }
+
+    private void Navigate(SystemSettingsPage page)
+        => CurrentPage = page;
+}