Replace props with useCurrentViewViewFilterGroup hook

twentyhq · Oct 20, 2024 · ca1bfe8 · ca1bfe8
1 parent 9f15d46
commit ca1bfe8
Show file tree

Hide file tree

Showing 4 changed files with 41 additions and 37 deletions.
diff --git a/...rc/modules/object-record/advanced-filter/components/AdvancedFilterAddFilterRuleSelect.tsx b/...rc/modules/object-record/advanced-filter/components/AdvancedFilterAddFilterRuleSelect.tsx
@@ -29,7 +29,7 @@ export const AdvancedFilterAddFilterRuleSelect = ({
       parentViewFilterGroupId,
     });
 
-  const dropdownId = `advanced-filter-add-filter-rule-${currentViewFilterGroup.id}`;
+  const dropdownId = `advanced-filter-add-filter-rule-${currentViewFilterGroup?.id}`;
 
   const { currentViewId } = useGetCurrentView();
 
@@ -81,7 +81,7 @@ export const AdvancedFilterAddFilterRuleSelect = ({
       definition: defaultFilterDefinition,
       value: '',
       displayValue: '',
-      viewFilterGroupId: currentViewFilterGroup.id,
+      viewFilterGroupId: currentViewFilterGroup?.id,
       positionInViewFilterGroup: newPositionInViewFilterGroup,
     });
   };
@@ -97,7 +97,7 @@ export const AdvancedFilterAddFilterRuleSelect = ({
       id: v4(),
       viewId: currentViewId,
       logicalOperator: ViewFilterGroupLogicalOperator.AND,
-      parentViewFilterGroupId: currentViewFilterGroup.id,
+      parentViewFilterGroupId: currentViewFilterGroup?.id,
       positionInViewFilterGroup: newPositionInViewFilterGroup,
     };
 

diff --git a/...rc/modules/object-record/advanced-filter/components/AdvancedFilterRuleOptionsDropdown.tsx b/...rc/modules/object-record/advanced-filter/components/AdvancedFilterRuleOptionsDropdown.tsx
@@ -1,4 +1,5 @@
 import { AdvancedFilterRuleOptionsDropdownButton } from '@/object-record/advanced-filter/components/AdvancedFilterRuleOptionsDropdownButton';
+import { useCurrentViewViewFilterGroup } from '@/object-record/advanced-filter/hooks/useCurrentViewViewFilterGroup';
 import { useDeleteCombinedViewFilterGroup } from '@/object-record/advanced-filter/hooks/useDeleteCombinedViewFilterGroup';
 import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown';
 import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
@@ -8,51 +9,56 @@ import { useDeleteCombinedViewFilters } from '@/views/hooks/useDeleteCombinedVie
 import { isDefined } from 'twenty-ui';
 
 type AdvancedFilterRuleOptionsDropdownProps = {
-  dropdownId: string;
+  parentViewFilterGroupId?: string;
 } & (
   | {
       viewFilterId: string;
-      parentViewFilterGroupId: string;
-      isOnlyViewFilterInGroup: boolean;
       viewFilterGroupId?: never;
     }
   | {
       viewFilterId?: never;
-      parentViewFilterGroupId?: never;
-      isOnlyViewFilterInGroup?: never;
       viewFilterGroupId: string;
     }
 );
 
-export const AdvancedFilterRuleOptionsDropdown = (
-  props: AdvancedFilterRuleOptionsDropdownProps,
-) => {
+export const AdvancedFilterRuleOptionsDropdown = ({
+  parentViewFilterGroupId,
+  viewFilterId,
+  viewFilterGroupId,
+}: AdvancedFilterRuleOptionsDropdownProps) => {
+  const dropdownId = `advanced-filter-rule-options-${viewFilterId ?? viewFilterGroupId}`;
+
   const { deleteCombinedViewFilter } = useDeleteCombinedViewFilters();
   const { deleteCombinedViewFilterGroup } = useDeleteCombinedViewFilterGroup();
 
+  const { currentViewFilterGroup, childViewFiltersAndViewFilterGroups } =
+    useCurrentViewViewFilterGroup({
+      parentViewFilterGroupId: parentViewFilterGroupId,
+    });
+
   const handleRemove = () => {
-    if (isDefined(props.viewFilterId)) {
-      deleteCombinedViewFilter(props.viewFilterId);
-      if (props.isOnlyViewFilterInGroup === true) {
-        deleteCombinedViewFilterGroup(props.parentViewFilterGroupId);
+    if (isDefined(viewFilterId)) {
+      deleteCombinedViewFilter(viewFilterId);
+
+      const isOnlyViewFilterInGroup =
+        childViewFiltersAndViewFilterGroups.length === 1;
+
+      if (isOnlyViewFilterInGroup && isDefined(parentViewFilterGroupId)) {
+        deleteCombinedViewFilterGroup(parentViewFilterGroupId);
       }
-    } else if (isDefined(props.viewFilterGroupId)) {
-      deleteCombinedViewFilterGroup(props.viewFilterGroupId);
+    } else if (isDefined(currentViewFilterGroup)) {
+      deleteCombinedViewFilterGroup(currentViewFilterGroup.id);
     }
   };
 
-  const removeButtonLabel = props.viewFilterId
-    ? 'Remove rule'
-    : 'Remove rule group';
+  const removeButtonLabel = viewFilterId ? 'Remove rule' : 'Remove rule group';
 
   return (
     <Dropdown
       disableBlur
-      dropdownId={props.dropdownId}
+      dropdownId={dropdownId}
       clickableComponent={
-        <AdvancedFilterRuleOptionsDropdownButton
-          dropdownId={props.dropdownId}
-        />
+        <AdvancedFilterRuleOptionsDropdownButton dropdownId={dropdownId} />
       }
       dropdownComponents={
         <DropdownMenuItemsContainer>

diff --git a/...nt/src/modules/object-record/advanced-filter/components/AdvancedFilterViewFilterGroup.tsx b/...nt/src/modules/object-record/advanced-filter/components/AdvancedFilterViewFilterGroup.tsx
@@ -57,10 +57,7 @@ export const AdvancedFilterViewFilterGroup = (
               viewBarInstanceId={props.viewBarInstanceId}
               parentViewFilterGroupId={currentViewFilterGroup.id}
             />
-            <AdvancedFilterRuleOptionsDropdown
-              dropdownId={`advanced-filter-rule-options-${child.id}`}
-              viewFilterGroupId={child.id}
-            />
+            <AdvancedFilterRuleOptionsDropdown viewFilterGroupId={child.id} />
           </StyledRow>
         ) : (
           <StyledRow key={child.id}>
@@ -69,14 +66,7 @@ export const AdvancedFilterViewFilterGroup = (
               viewFilterGroup={currentViewFilterGroup}
             />
             <AdvancedFilterViewFilter viewFilter={child} />
-            <AdvancedFilterRuleOptionsDropdown
-              dropdownId={`advanced-filter-rule-options-${child.id}`}
-              viewFilterId={child.id}
-              parentViewFilterGroupId={currentViewFilterGroup.id}
-              isOnlyViewFilterInGroup={
-                childViewFiltersAndViewFilterGroups.length === 1
-              }
-            />
+            <AdvancedFilterRuleOptionsDropdown viewFilterId={child.id} />
           </StyledRow>
         ),
       )}

diff --git a/...ty-front/src/modules/object-record/advanced-filter/hooks/useCurrentViewViewFilterGroup.ts b/...ty-front/src/modules/object-record/advanced-filter/hooks/useCurrentViewViewFilterGroup.ts
@@ -1,4 +1,6 @@
 import { useGetCurrentView } from '@/views/hooks/useGetCurrentView';
+import { ViewFilter } from '@/views/types/ViewFilter';
+import { ViewFilterGroup } from '@/views/types/ViewFilterGroup';
 
 export const useCurrentViewViewFilterGroup = ({
   parentViewFilterGroupId,
@@ -16,7 +18,13 @@ export const useCurrentViewViewFilterGroup = ({
     );
 
   if (!currentViewFilterGroup) {
-    throw new Error('Current view filter group not found');
+    return {
+      currentViewFilterGroup: undefined,
+      childViewFiltersAndViewFilterGroups: [] satisfies (
+        | ViewFilter
+        | ViewFilterGroup
+      )[],
+    };
   }
 
   const childViewFilters =