Fix filter button height (#11237)

[#11218](https://github.com/twentyhq/twenty/issues/11218) Fixed Filter
Reset Button height

- Replaced the default button with LightButton to align with Figma
design specs which Restores expected button size and appearance.

- Ensured the correct height, padding, and styling are applied
automatically.

- Wrapped the button inside StyledChipcontainer for consistency.

---------

Co-authored-by: greptile-apps[bot] <165735046+greptile-apps[bot]@users.noreply.github.com>
Co-authored-by: Charles Bochet <charles@twenty.com>
Co-authored-by: Charles Bochet <charlesBochet@users.noreply.github.com>

packages/twenty-front/src/modules/views/components/ViewBarDetails.tsx

@@ -29,6 +29,7 @@ import { isViewBarExpandedComponentState } from '@/views/states/isViewBarExpande
 import { t } from '@lingui/core/macro';
 import { isNonEmptyArray } from '@sniptt/guards';
 import { isDefined } from 'twenty-shared/utils';
+import { LightButton } from 'twenty-ui';
 
 export type ViewBarDetailsProps = {
   hasFilterButton?: boolean;
@@ -63,18 +64,11 @@ const StyledChipcontainer = styled.div`
   z-index: 1;
 `;
 
-const StyledCancelButton = styled.button`
+const StyledActionButtonContainer = styled.div`
-  background-color: inherit;
+  display: flex;
-  border: none;
+  flex-direction: row;
-  color: ${({ theme }) => theme.font.color.tertiary};
+  gap: ${({ theme }) => theme.spacing(2)};
-  cursor: pointer;
+  padding-top: ${({ theme }) => theme.spacing(1)};
-  font-weight: ${({ theme }) => theme.font.weight.medium};
-  user-select: none;
-  margin-right: ${({ theme }) => theme.spacing(2)};
-  &:hover {
-    background-color: ${({ theme }) => theme.background.tertiary};
-    border-radius: ${({ theme }) => theme.spacing(1)};
-  }
 `;
 
 const StyledFilterContainer = styled.div`
@@ -257,15 +251,17 @@ export const ViewBarDetails = ({
           </StyledAddFilterContainer>
         )}
       </StyledFilterContainer>
-      {canResetView && (
+      <StyledActionButtonContainer>
-        <StyledCancelButton
+        {canResetView && (
-          data-testid="cancel-button"
+          <LightButton
-          onClick={handleCancelClick}
+            data-testid="cancel-button"
-        >
+            accent="tertiary"
-          {t`Reset`}
+            title={t`Reset`}
-        </StyledCancelButton>
+            onClick={handleCancelClick}
-      )}
+          />
-      {rightComponent}
+        )}
+        {rightComponent}
+      </StyledActionButtonContainer>
     </StyledBar>
   );
 };