From c1fff908fe9e83a1451815d7fa7aee72f22c5bc3 Mon Sep 17 00:00:00 2001
From: Naifer <161821705+omarNaifer12@users.noreply.github.com>
Date: Wed, 11 Dec 2024 11:06:23 +0100
Subject: [PATCH] Fix:Hide deleted filter component when reset button is
 clicked (#8880)

Resolve: #8874

Problem :
When we are on the deleted records page and use the filter, if no
records are found, we see the no deleted recordName message along with a
button to remove the deleted filter. However, if we reset and filter
again, and still don't find any records, this message and button for the
deleted filter continue to display.
Solution:
I noticed that the component RecordTableEmptyStateSoftDelete has this
button, and its visibility is controlled by the function
toggleSoftDeleteFilterState. If the state is true, the button appears;
if it's false, it doesn't. Therefore, we just need to call this function
when the reset button is clicked and set the state to false.
![All-Peopleand1morepage-Personal-MicrosoftEdge2024-12-0421-04-12-ezgif
com-video-to-gif-converter](https://github.com/user-attachments/assets/68e524ff-2902-4a25-a361-3bb8e1220ff8)

---------

Co-authored-by: bosiraphael <raphael.bosi@gmail.com>
---
 .../src/modules/views/components/ViewBar.tsx         |  1 +
 .../src/modules/views/components/ViewBarDetails.tsx  | 12 ++++++++++++
 2 files changed, 13 insertions(+)

diff --git a/packages/twenty-front/src/modules/views/components/ViewBar.tsx b/packages/twenty-front/src/modules/views/components/ViewBar.tsx
index 59642d58a..41a022446 100644
--- a/packages/twenty-front/src/modules/views/components/ViewBar.tsx
+++ b/packages/twenty-front/src/modules/views/components/ViewBar.tsx
@@ -82,6 +82,7 @@ export const ViewBar = ({
             filterDropdownId={filterDropdownId}
             hasFilterButton
             viewBarId={viewBarId}
+            objectNamePlural={objectNamePlural}
             rightComponent={
               <UpdateViewButtonGroup
                 hotkeyScope={{
diff --git a/packages/twenty-front/src/modules/views/components/ViewBarDetails.tsx b/packages/twenty-front/src/modules/views/components/ViewBarDetails.tsx
index c60f14c32..e605e3936 100644
--- a/packages/twenty-front/src/modules/views/components/ViewBarDetails.tsx
+++ b/packages/twenty-front/src/modules/views/components/ViewBarDetails.tsx
@@ -1,9 +1,11 @@
 import styled from '@emotion/styled';
 import { ReactNode, useMemo } from 'react';
 
+import { useObjectNameSingularFromPlural } from '@/object-metadata/hooks/useObjectNameSingularFromPlural';
 import { AddObjectFilterFromDetailsButton } from '@/object-record/object-filter-dropdown/components/AddObjectFilterFromDetailsButton';
 import { ObjectFilterDropdownScope } from '@/object-record/object-filter-dropdown/scopes/ObjectFilterDropdownScope';
 import { Filter } from '@/object-record/object-filter-dropdown/types/Filter';
+import { useHandleToggleTrashColumnFilter } from '@/object-record/record-index/hooks/useHandleToggleTrashColumnFilter';
 import { DropdownScope } from '@/ui/layout/dropdown/scopes/DropdownScope';
 import { useRecoilComponentFamilyValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentFamilyValueV2';
 import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2';
@@ -28,6 +30,7 @@ export type ViewBarDetailsProps = {
   rightComponent?: ReactNode;
   filterDropdownId?: string;
   viewBarId: string;
+  objectNamePlural: string;
 };
 
 const StyledBar = styled.div`
@@ -101,6 +104,7 @@ export const ViewBarDetails = ({
   rightComponent,
   filterDropdownId,
   viewBarId,
+  objectNamePlural,
 }: ViewBarDetailsProps) => {
   const { currentViewWithCombinedFiltersAndSorts } = useGetCurrentView();
 
@@ -125,6 +129,13 @@ export const ViewBarDetails = ({
     availableSortDefinitionsComponentState,
   );
 
+  const { objectNameSingular } = useObjectNameSingularFromPlural({
+    objectNamePlural: objectNamePlural,
+  });
+  const { toggleSoftDeleteFilterState } = useHandleToggleTrashColumnFilter({
+    objectNameSingular: objectNameSingular,
+    viewBarId: viewBarId,
+  });
   const { resetUnsavedViewStates } = useResetUnsavedViewStates();
   const canResetView = canPersistView && !hasFiltersQueryParams;
 
@@ -159,6 +170,7 @@ export const ViewBarDetails = ({
   const handleCancelClick = () => {
     if (isDefined(viewId)) {
       resetUnsavedViewStates(viewId);
+      toggleSoftDeleteFilterState(false);
     }
   };