From 2014d367f85f84016c4edd9e2e8549cd704eb5c9 Mon Sep 17 00:00:00 2001
From: Thomas Heartman <thomas@getunleash.io>
Date: Fri, 15 Nov 2024 08:36:22 +0100
Subject: [PATCH] 1-3073: close sidebar when you click a link within it (#8763)

This change makes it so that the project status sidebar will close
when you follow a link within it. We do that by using JS event
bubbling and attaching a handler on the modal parent. We can listen
for events and check whether the target is an anchor and, if so, close
the modal.
---
 .../Project/ProjectStatus/ProjectStatusModal.tsx      | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/frontend/src/component/project/Project/ProjectStatus/ProjectStatusModal.tsx b/frontend/src/component/project/Project/ProjectStatus/ProjectStatusModal.tsx
index b6e79c12b5..4b15b31485 100644
--- a/frontend/src/component/project/Project/ProjectStatus/ProjectStatusModal.tsx
+++ b/frontend/src/component/project/Project/ProjectStatus/ProjectStatusModal.tsx
@@ -106,7 +106,16 @@ const CloseRow = styled('div')(({ theme }) => ({
 
 export const ProjectStatusModal = ({ open, close }: Props) => {
     return (
-        <DynamicSidebarModal open={open} onClose={close} label='Project status'>
+        <DynamicSidebarModal
+            open={open}
+            onClose={close}
+            label='Project status'
+            onClick={(e: React.SyntheticEvent) => {
+                if (e.target instanceof HTMLAnchorElement) {
+                    close();
+                }
+            }}
+        >
             <ModalContentContainer>
                 <HeaderRow>
                     <StyledProjectStatusSvg aria-hidden='true' />