From 92f9501d26cb3dcde5a747b6889a231e36c2aaad Mon Sep 17 00:00:00 2001
From: Conor Webb <126772285+ConorWebb96@users.noreply.github.com>
Date: Mon, 17 Jun 2024 08:21:26 +0100
Subject: [PATCH] Add function to close side panel based on the browser's
 history. (#13944)

* Add function to close side panel based on the browser's history.

* Switched to hashchange, removed from SidePanel, added to ClientApp.svelte

* Removed unused onMount, fixed lint issue

* Removed unnecessary if statement.
---
 packages/client/src/components/ClientApp.svelte     | 11 +++++++++++
 packages/client/src/components/app/SidePanel.svelte |  4 ----
 2 files changed, 11 insertions(+), 4 deletions(-)

diff --git a/packages/client/src/components/ClientApp.svelte b/packages/client/src/components/ClientApp.svelte
index b790ecd0d4..c1bdc92ac4 100644
--- a/packages/client/src/components/ClientApp.svelte
+++ b/packages/client/src/components/ClientApp.svelte
@@ -19,6 +19,7 @@
     devToolsStore,
     devToolsEnabled,
     environmentStore,
+    sidePanelStore,
   } from "stores"
   import NotificationDisplay from "components/overlay/NotificationDisplay.svelte"
   import ConfirmationDisplay from "components/overlay/ConfirmationDisplay.svelte"
@@ -102,6 +103,16 @@
         embedded: !!$appStore.embedded,
       })
     }
+    const handleHashChange = () => {
+      const { open } = $sidePanelStore
+      if (open) {
+        sidePanelStore.actions.close()
+      }
+    }
+    window.addEventListener("hashchange", handleHashChange)
+    return () => {
+      window.removeEventListener("hashchange", handleHashChange)
+    }
   })
 
   $: {
diff --git a/packages/client/src/components/app/SidePanel.svelte b/packages/client/src/components/app/SidePanel.svelte
index bff5a78837..d49ab33c40 100644
--- a/packages/client/src/components/app/SidePanel.svelte
+++ b/packages/client/src/components/app/SidePanel.svelte
@@ -29,10 +29,6 @@
     }
   }
 
-  // $: {
-
-  // }
-
   // Derive visibility
   $: open = $sidePanelStore.contentId === $component.id