diff --git a/packages/twenty-front/src/modules/views/components/ViewBarDetails.tsx b/packages/twenty-front/src/modules/views/components/ViewBarDetails.tsx index 317be0082..d56c226ab 100644 --- a/packages/twenty-front/src/modules/views/components/ViewBarDetails.tsx +++ b/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` - background-color: inherit; - border: none; - color: ${({ theme }) => theme.font.color.tertiary}; - cursor: pointer; - 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 StyledActionButtonContainer = styled.div` + display: flex; + flex-direction: row; + gap: ${({ theme }) => theme.spacing(2)}; + padding-top: ${({ theme }) => theme.spacing(1)}; `; const StyledFilterContainer = styled.div` @@ -257,15 +251,17 @@ export const ViewBarDetails = ({ )} - {canResetView && ( - - {t`Reset`} - - )} - {rightComponent} + + {canResetView && ( + + )} + {rightComponent} + ); };