Added radio item, replaced menu item on profiles listing screen

src/components/ui/menu/MenuRadioItem.svelte

@@ -0,0 +1,36 @@
+<script>
+    import MenuLink from "$components/ui/menu/MenuItem.svelte";
+
+    /**
+     * @type {boolean}
+     */
+    export let checked;
+
+    /**
+     * @type {string}
+     */
+    export let name;
+
+    /**
+     * @type {string}
+     */
+    export let value;
+
+    /**
+     * @type {string|null}
+     */
+    export let href = null;
+</script>
+
+<MenuLink {href}>
+    <input type="radio" {name} {value} {checked} on:input on:click|stopPropagation>
+    <slot></slot>
+</MenuLink>
+
+<style lang="scss">
+    :global(.menu-item) input {
+        width: 16px;
+        height: 16px;
+        margin-right: 6px;
+    }
+</style>

src/routes/settings/maintenance/+page.svelte

@@ -1,6 +1,7 @@
 <script>
     import Menu from "$components/ui/menu/Menu.svelte";
     import MenuItem from "$components/ui/menu/MenuItem.svelte";
+    import MenuRadioItem from "$components/ui/menu/MenuRadioItem.svelte";
     import {activeProfileStore, maintenanceProfilesStore} from "$stores/maintenance-profiles-store.js";
 
     /** @type {import('$lib/extension/entities/MaintenanceProfile.js').default[]} */
@@ -11,6 +12,17 @@
     function resetActiveProfile() {
         $activeProfileStore = null;
     }
+
+    /**
+     * @param {Event} event
+     */
+    function enableSelectedProfile(event) {
+        const target = event.target;
+
+        if (target instanceof HTMLInputElement && target.checked) {
+            activeProfileStore.set(target.value);
+        }
+    }
 </script>
 
 <Menu>
@@ -20,10 +32,13 @@
         <hr>
     {/if}
     {#each profiles as profile}
-        <MenuItem href="/settings/maintenance/{profile.id}"
-                  icon="{$activeProfileStore === profile.id ? 'tag' : null}">
+        <MenuRadioItem href="/settings/maintenance/{profile.id}"
+                       name="active-profile"
+                       value="{profile.id}"
+                       checked="{$activeProfileStore === profile.id}"
+                       on:input={enableSelectedProfile}>
             {profile.settings.name}
-        </MenuItem>
+        </MenuRadioItem>
     {/each}
     <hr>
     <MenuItem href="#" on:click={resetActiveProfile}>Reset Active Profile</MenuItem>