From d2ef9e27ed215bf92c85226f6d651e19cf0389f2 Mon Sep 17 00:00:00 2001
From: Mateusz Kwasniewski <kwasniewski.mateusz@gmail.com>
Date: Tue, 16 Jul 2024 17:27:11 +0200
Subject: [PATCH] refactor: insights actions container relaxed width (#7603)

---
 frontend/src/component/insights/Insights.tsx      | 15 +++++++++------
 .../components/InsightsHeader/InsightsHeader.tsx  |  1 -
 2 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/frontend/src/component/insights/Insights.tsx b/frontend/src/component/insights/Insights.tsx
index cebc93fdcc..ac23815df2 100644
--- a/frontend/src/component/insights/Insights.tsx
+++ b/frontend/src/component/insights/Insights.tsx
@@ -25,6 +25,14 @@ const StickyWrapper = styled(Box, {
     transition: 'padding 0.3s ease',
 }));
 
+const StyledProjectSelect = styled(ProjectSelect)(({ theme }) => ({
+    flex: 1,
+    width: '300px',
+    [theme.breakpoints.down('sm')]: {
+        width: '100%',
+    },
+}));
+
 export const Insights: VFC = () => {
     const [scrolled, setScrolled] = useState(false);
     const { insights, loading, error } = useInsights();
@@ -60,16 +68,11 @@ export const Insights: VFC = () => {
             <StickyWrapper scrolled={scrolled}>
                 <InsightsHeader
                     actions={
-                        <ProjectSelect
+                        <StyledProjectSelect
                             selectedProjects={projects}
                             onChange={setProjects}
                             dataTestId={'DASHBOARD_PROJECT_SELECT'}
                             limitTags={1}
-                            sx={{
-                                flex: 1,
-                                maxWidth: '360px',
-                                width: '100%',
-                            }}
                         />
                     }
                 />
diff --git a/frontend/src/component/insights/components/InsightsHeader/InsightsHeader.tsx b/frontend/src/component/insights/components/InsightsHeader/InsightsHeader.tsx
index 48a87f49b5..1d4125fb8a 100644
--- a/frontend/src/component/insights/components/InsightsHeader/InsightsHeader.tsx
+++ b/frontend/src/component/insights/components/InsightsHeader/InsightsHeader.tsx
@@ -33,7 +33,6 @@ const StyledActionButtons = styled('div')(({ theme }) => ({
 const StyledExternalActionsContainer = styled('div')(({ theme }) => ({
     display: 'flex',
     gap: theme.spacing(1),
-    width: 300,
     [theme.breakpoints.down('md')]: {
         width: '100%',
     },