From b5cdb0d81bbe723d1018bc7599bbcfb6e0572b3f Mon Sep 17 00:00:00 2001
From: KoloMl <thekolomoets@hotmail.com>
Date: Sun, 10 Nov 2024 20:41:45 +0400
Subject: [PATCH] Show the active profile directly in the index view

---
 .../ui/menu/MenuCheckboxItem.svelte           | 36 +++++++++++++++++++
 src/routes/+page.svelte                       | 17 +++++++++
 2 files changed, 53 insertions(+)
 create mode 100644 src/components/ui/menu/MenuCheckboxItem.svelte

diff --git a/src/components/ui/menu/MenuCheckboxItem.svelte b/src/components/ui/menu/MenuCheckboxItem.svelte
new file mode 100644
index 0000000..77d5383
--- /dev/null
+++ b/src/components/ui/menu/MenuCheckboxItem.svelte
@@ -0,0 +1,36 @@
+<script>
+    import MenuLink from "$components/ui/menu/MenuItem.svelte";
+
+    /**
+     * @type {boolean}
+     */
+    export let checked;
+
+    /**
+     * @type {string|undefined}
+     */
+    export let name = undefined;
+
+    /**
+     * @type {string|undefined}
+     */
+    export let value = undefined;
+
+    /**
+     * @type {string|null}
+     */
+    export let href = null;
+</script>
+
+<MenuLink {href}>
+    <input type="checkbox" {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>
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index 8c3d976..27ae80e 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -1,9 +1,26 @@
 <script>
     import Menu from "$components/ui/menu/Menu.svelte";
     import MenuItem from "$components/ui/menu/MenuItem.svelte";
+    import { activeProfileStore, maintenanceProfilesStore } from "$stores/maintenance-profiles-store.js";
+    import MenuCheckboxItem from "$components/ui/menu/MenuCheckboxItem.svelte";
+
+    /** @type {import('$lib/extension/entities/MaintenanceProfile.js').default|undefined} */
+    let activeProfile;
+
+    $: activeProfile = $maintenanceProfilesStore.find(profile => profile.id === $activeProfileStore);
+
+    function turnOffActiveProfile() {
+        $activeProfileStore = null;
+    }
 </script>
 
 <Menu>
+    {#if activeProfile}
+        <MenuCheckboxItem checked on:input={turnOffActiveProfile} href="/features/maintenance/{activeProfile.id}">
+            Active Profile: {activeProfile.settings.name}
+        </MenuCheckboxItem>
+        <hr>
+    {/if}
     <MenuItem href="/features/maintenance">Tagging Profiles</MenuItem>
     <hr>
     <MenuItem href="/preferences">Preferences</MenuItem>