From 8e3079389b5f065e712a880549b3f0b9a3f151bc Mon Sep 17 00:00:00 2001
From: Ykrej <stellan125@gmail.com>
Date: Wed, 2 Jul 2025 13:20:17 -0700
Subject: [PATCH 1/6] feat: collapsible filters menu

---
 src/routes/components/ServerPartsGrid.svelte | 12 +++++++++---
 1 file changed, 9 insertions(+), 3 deletions(-)

diff --git a/src/routes/components/ServerPartsGrid.svelte b/src/routes/components/ServerPartsGrid.svelte
index ba08bbd..2c4d676 100644
--- a/src/routes/components/ServerPartsGrid.svelte
+++ b/src/routes/components/ServerPartsGrid.svelte
@@ -10,6 +10,7 @@
 
   const uid = $props.id()
   const { rowData } = $props()
+  let filterMenuOpen = $state(true)
 
   const filterDivClass =
     'm-1 rounded-sm border-1 bg-gray-50 px-1 drop-shadow-md'
@@ -138,8 +139,13 @@
 </script>
 
 <div class="flex">
-  <div class="h-screen w-48 flex-none">
-    {#if gridApi}
+  <div class="h-screen flex-none {filterMenuOpen ? 'w-48' : 'w-6'}">
+    <button onclick={() => filterMenuOpen = !filterMenuOpen} class="w-full drop-shadow-sm hover:bg-sky-100 hover:drop-shadow-md m-0 {filterMenuOpen ? '' : 'h-screen'}">
+      <div class="flex {filterMenuOpen ? 'p-1 px-2' : ''}">
+        <span class={filterMenuOpen ? '' : 'rotate-270'}>Filters</span>
+      </div>
+    </button>
+    {#if gridApi && filterMenuOpen}
       {#each checkboxFilterDefs as { label, column } (`${uid}-${column}`)}
         <div class={filterDivClass}>
           <span>{label}</span>
@@ -164,7 +170,7 @@
           valueGetter={(value) => value * 30}
         />
       </div>
-    {:else}
+    {:else if filterMenuOpen}
       <Spinner class="justify-items-end" />
     {/if}
   </div>

From 8523bf003b00b626ef78d55765ae75df3f450236 Mon Sep 17 00:00:00 2001
From: Ykrej <stellan125@gmail.com>
Date: Wed, 2 Jul 2025 13:43:09 -0700
Subject: [PATCH 2/6] fix: filter button style

---
 src/routes/components/ServerPartsGrid.svelte | 14 ++++++++++----
 1 file changed, 10 insertions(+), 4 deletions(-)

diff --git a/src/routes/components/ServerPartsGrid.svelte b/src/routes/components/ServerPartsGrid.svelte
index 2c4d676..04aa176 100644
--- a/src/routes/components/ServerPartsGrid.svelte
+++ b/src/routes/components/ServerPartsGrid.svelte
@@ -140,10 +140,16 @@
 
 <div class="flex">
   <div class="h-screen flex-none {filterMenuOpen ? 'w-48' : 'w-6'}">
-    <button onclick={() => filterMenuOpen = !filterMenuOpen} class="w-full drop-shadow-sm hover:bg-sky-100 hover:drop-shadow-md m-0 {filterMenuOpen ? '' : 'h-screen'}">
-      <div class="flex {filterMenuOpen ? 'p-1 px-2' : ''}">
-        <span class={filterMenuOpen ? '' : 'rotate-270'}>Filters</span>
-      </div>
+    <button onclick={() => filterMenuOpen = !filterMenuOpen} class="w-full drop-shadow-sm hover:bg-sky-50 hover:drop-shadow-md m-0 {filterMenuOpen ? '' : 'h-screen'}">
+      {#if filterMenuOpen}
+        <div class="flex p-1 px-2">
+          <span>Filters</span>
+        </div>
+      {:else}
+        <div class="flex -translate-1/2">
+          <span class="-rotate-90">Filters</span>
+        </div>
+      {/if}
     </button>
     {#if gridApi && filterMenuOpen}
       {#each checkboxFilterDefs as { label, column } (`${uid}-${column}`)}

From e2fc67826efda33ec97ed54b6a779f2899169270 Mon Sep 17 00:00:00 2001
From: Ykrej <stellan125@gmail.com>
Date: Wed, 2 Jul 2025 13:43:37 -0700
Subject: [PATCH 3/6] fix: formatting

---
 src/routes/components/ServerPartsGrid.svelte | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/routes/components/ServerPartsGrid.svelte b/src/routes/components/ServerPartsGrid.svelte
index 04aa176..9dd0e32 100644
--- a/src/routes/components/ServerPartsGrid.svelte
+++ b/src/routes/components/ServerPartsGrid.svelte
@@ -140,7 +140,12 @@
 
 <div class="flex">
   <div class="h-screen flex-none {filterMenuOpen ? 'w-48' : 'w-6'}">
-    <button onclick={() => filterMenuOpen = !filterMenuOpen} class="w-full drop-shadow-sm hover:bg-sky-50 hover:drop-shadow-md m-0 {filterMenuOpen ? '' : 'h-screen'}">
+    <button
+      onclick={() => (filterMenuOpen = !filterMenuOpen)}
+      class="m-0 w-full drop-shadow-sm hover:bg-sky-50 hover:drop-shadow-md {filterMenuOpen
+        ? ''
+        : 'h-screen'}"
+    >
       {#if filterMenuOpen}
         <div class="flex p-1 px-2">
           <span>Filters</span>

From c7601124a4c451839934d88fe0d6e059b6c6becc Mon Sep 17 00:00:00 2001
From: Ykrej <stellan125@gmail.com>
Date: Wed, 2 Jul 2025 14:04:09 -0700
Subject: [PATCH 4/6] feat: sidebar icons

---
 src/routes/components/CloseIcon.svelte       | 20 ++++++++++++++++++++
 src/routes/components/HamburgerIcon.svelte   | 20 ++++++++++++++++++++
 src/routes/components/ServerPartsGrid.svelte | 11 +++++++++--
 3 files changed, 49 insertions(+), 2 deletions(-)
 create mode 100644 src/routes/components/CloseIcon.svelte
 create mode 100644 src/routes/components/HamburgerIcon.svelte

diff --git a/src/routes/components/CloseIcon.svelte b/src/routes/components/CloseIcon.svelte
new file mode 100644
index 0000000..c025c6c
--- /dev/null
+++ b/src/routes/components/CloseIcon.svelte
@@ -0,0 +1,20 @@
+<script lang="ts">
+  const { class: className }: { class?: string } = $props()
+</script>
+
+<div class={className ?? ''}>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    fill="none"
+    viewBox="0 0 24 24"
+    stroke-width="1.5"
+    stroke="currentColor"
+    class="size-6"
+  >
+    <path
+      stroke-linecap="round"
+      stroke-linejoin="round"
+      d="M6 18 18 6M6 6l12 12"
+    />
+  </svg>
+</div>
diff --git a/src/routes/components/HamburgerIcon.svelte b/src/routes/components/HamburgerIcon.svelte
new file mode 100644
index 0000000..fa879ee
--- /dev/null
+++ b/src/routes/components/HamburgerIcon.svelte
@@ -0,0 +1,20 @@
+<script lang="ts">
+  const { class: className }: { class?: string } = $props()
+</script>
+
+<div class={className ?? ''}>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    fill="none"
+    viewBox="0 0 24 24"
+    stroke-width="1.5"
+    stroke="currentColor"
+    class="size-6"
+  >
+    <path
+      stroke-linecap="round"
+      stroke-linejoin="round"
+      d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5"
+    />
+  </svg>
+</div>
diff --git a/src/routes/components/ServerPartsGrid.svelte b/src/routes/components/ServerPartsGrid.svelte
index 9dd0e32..c32c2fd 100644
--- a/src/routes/components/ServerPartsGrid.svelte
+++ b/src/routes/components/ServerPartsGrid.svelte
@@ -7,10 +7,12 @@
   import { mount } from 'svelte'
   import CellLink from './CellLink.svelte'
   import RangeFilter from './RangeFilter.svelte'
+  import CloseIcon from './CloseIcon.svelte'
+  import HamburgerIcon from './HamburgerIcon.svelte'
 
   const uid = $props.id()
   const { rowData } = $props()
-  let filterMenuOpen = $state(true)
+  let filterMenuOpen = $state(false)
 
   const filterDivClass =
     'm-1 rounded-sm border-1 bg-gray-50 px-1 drop-shadow-md'
@@ -149,10 +151,15 @@
       {#if filterMenuOpen}
         <div class="flex p-1 px-2">
           <span>Filters</span>
+          <span class="flex-grow"></span>
+          <CloseIcon />
         </div>
       {:else}
-        <div class="flex -translate-1/2">
+        <div class="flex h-full flex-col pt-1">
+          <HamburgerIcon />
+          <span class="flex-grow"></span>
           <span class="-rotate-90">Filters</span>
+          <span class="flex-grow"></span>
         </div>
       {/if}
     </button>

From 1940ff348692c6161b276c0af814d3d2102498ce Mon Sep 17 00:00:00 2001
From: Ykrej <stellan125@gmail.com>
Date: Wed, 2 Jul 2025 14:06:27 -0700
Subject: [PATCH 5/6] fix: set filter menu open by default again

---
 src/routes/components/ServerPartsGrid.svelte | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/routes/components/ServerPartsGrid.svelte b/src/routes/components/ServerPartsGrid.svelte
index c32c2fd..493b568 100644
--- a/src/routes/components/ServerPartsGrid.svelte
+++ b/src/routes/components/ServerPartsGrid.svelte
@@ -12,7 +12,8 @@
 
   const uid = $props.id()
   const { rowData } = $props()
-  let filterMenuOpen = $state(false)
+  
+  let filterMenuOpen = $state(true)
 
   const filterDivClass =
     'm-1 rounded-sm border-1 bg-gray-50 px-1 drop-shadow-md'

From 35ed9ea6b1641840320077b33fd9332e609b63dc Mon Sep 17 00:00:00 2001
From: Ykrej <stellan125@gmail.com>
Date: Wed, 2 Jul 2025 14:06:40 -0700
Subject: [PATCH 6/6] fix: formatting

---
 src/routes/components/ServerPartsGrid.svelte | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/routes/components/ServerPartsGrid.svelte b/src/routes/components/ServerPartsGrid.svelte
index 493b568..fde8e0f 100644
--- a/src/routes/components/ServerPartsGrid.svelte
+++ b/src/routes/components/ServerPartsGrid.svelte
@@ -12,7 +12,7 @@
 
   const uid = $props.id()
   const { rowData } = $props()
-  
+
   let filterMenuOpen = $state(true)
 
   const filterDivClass =