Implemented CRUD for view filter group and removed old states (#10590)

This PR implements CRUD for view filter groups with the new logic as
already done for view filters and view sorts.

It also completely removes the old combined view filter group states and
usage.

This PR is quite big but the impact is limited since it only changes
advanced filters module, which is under feature flag at the moment, and
it is already in a broken state so unusable, even if someone activates
the feature flag.

packages/twenty-front/src/modules/views/view-picker/components/ViewPickerDropdown.tsx

@@ -12,7 +12,7 @@ import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown';
 import { StyledDropdownButtonContainer } from '@/ui/layout/dropdown/components/StyledDropdownButtonContainer';
 import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown';
 import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2';
-import { useGetCurrentView } from '@/views/hooks/useGetCurrentView';
+import { useGetCurrentViewOnly } from '@/views/hooks/useGetCurrentViewOnly';
 import { ViewsHotkeyScope } from '@/views/types/ViewsHotkeyScope';
 import { ViewPickerContentCreateMode } from '@/views/view-picker/components/ViewPickerContentCreateMode';
 import { ViewPickerContentEditMode } from '@/views/view-picker/components/ViewPickerContentEditMode';
@@ -51,7 +51,7 @@ const StyledViewName = styled.span`
 export const ViewPickerDropdown = () => {
   const theme = useTheme();
 
-  const { currentViewWithCombinedFiltersAndSorts } = useGetCurrentView();
+  const { currentView } = useGetCurrentViewOnly();
 
   const { updateViewFromCurrentState } = useUpdateViewFromCurrentState();
 
@@ -66,7 +66,7 @@ export const ViewPickerDropdown = () => {
   const { viewPickerMode, setViewPickerMode } = useViewPickerMode();
 
   const { getIcon } = useIcons();
-  const CurrentViewIcon = getIcon(currentViewWithCombinedFiltersAndSorts?.icon);
+  const CurrentViewIcon = getIcon(currentView?.icon);
 
   const handleClickOutside = async () => {
     if (isViewsListDropdownOpen && viewPickerMode === 'edit') {
@@ -85,14 +85,12 @@ export const ViewPickerDropdown = () => {
       onClickOutside={handleClickOutside}
       clickableComponent={
         <StyledDropdownButtonContainer isUnfolded={isViewsListDropdownOpen}>
-          {currentViewWithCombinedFiltersAndSorts && CurrentViewIcon ? (
+          {currentView && CurrentViewIcon ? (
             <CurrentViewIcon size={theme.icon.size.md} />
           ) : (
             <IconList size={theme.icon.size.md} />
           )}
-          <StyledViewName>
-            {currentViewWithCombinedFiltersAndSorts?.name ?? 'All'}
-          </StyledViewName>
+          <StyledViewName>{currentView?.name ?? 'All'}</StyledViewName>
           <StyledDropdownLabelAdornments>
             {isDefined(entityCount) && <>· {entityCount} </>}
             <IconChevronDown size={theme.icon.size.sm} />

packages/twenty-front/src/modules/views/view-picker/components/ViewPickerListContent.tsx

@@ -10,13 +10,14 @@ import { DropdownMenuSeparator } from '@/ui/layout/dropdown/components/DropdownM
 import { useSetRecoilComponentStateV2 } from '@/ui/utilities/state/component-state/hooks/useSetRecoilComponentStateV2';
 import { useChangeView } from '@/views/hooks/useChangeView';
 import { useGetCurrentView } from '@/views/hooks/useGetCurrentView';
+import { useGetCurrentViewOnly } from '@/views/hooks/useGetCurrentViewOnly';
 import { useUpdateView } from '@/views/hooks/useUpdateView';
 import { ViewPickerOptionDropdown } from '@/views/view-picker/components/ViewPickerOptionDropdown';
 import { useViewPickerMode } from '@/views/view-picker/hooks/useViewPickerMode';
 import { viewPickerReferenceViewIdComponentState } from '@/views/view-picker/states/viewPickerReferenceViewIdComponentState';
+import { useLingui } from '@lingui/react/macro';
 import { isDefined } from 'twenty-shared';
 import { moveArrayItem } from '~/utils/array/moveArrayItem';
-import { useLingui } from '@lingui/react/macro';
 
 const StyledBoldDropdownMenuItemsContainer = styled(DropdownMenuItemsContainer)`
   font-weight: ${({ theme }) => theme.font.weight.regular};
@@ -24,8 +25,9 @@ const StyledBoldDropdownMenuItemsContainer = styled(DropdownMenuItemsContainer)`
 
 export const ViewPickerListContent = () => {
   const { t } = useLingui();
-  const { currentViewWithCombinedFiltersAndSorts, viewsOnCurrentObject } =
-    useGetCurrentView();
+  const { viewsOnCurrentObject } = useGetCurrentView();
+
+  const { currentView } = useGetCurrentViewOnly();
 
   const setViewPickerReferenceViewId = useSetRecoilComponentStateV2(
     viewPickerReferenceViewIdComponentState,
@@ -41,8 +43,8 @@ export const ViewPickerListContent = () => {
   };
 
   const handleAddViewButtonClick = () => {
-    if (isDefined(currentViewWithCombinedFiltersAndSorts?.id)) {
-      setViewPickerReferenceViewId(currentViewWithCombinedFiltersAndSorts.id);
+    if (isDefined(currentView?.id)) {
+      setViewPickerReferenceViewId(currentView.id);
       setViewPickerMode('create-empty');
     }
   };

packages/twenty-front/src/modules/views/view-picker/hooks/useDeleteViewFromCurrentState.ts

@@ -32,7 +32,7 @@ export const useDeleteViewFromCurrentState = (viewBarInstanceId?: string) => {
       viewBarInstanceId,
     );
 
-  const { changeView } = useChangeView(viewBarInstanceId);
+  const { changeView } = useChangeView();
 
   const { deleteView } = useDeleteView();
 

packages/twenty-front/src/modules/views/view-picker/hooks/useUpdateViewFromCurrentState.ts

@@ -10,7 +10,7 @@ import { viewPickerReferenceViewIdComponentState } from '@/views/view-picker/sta
 import { viewPickerSelectedIconComponentState } from '@/views/view-picker/states/viewPickerSelectedIconComponentState';
 import { useRecoilCallback } from 'recoil';
 
-export const useUpdateViewFromCurrentState = (viewBarInstanceId?: string) => {
+export const useUpdateViewFromCurrentState = () => {
   const { closeAndResetViewPicker } = useCloseAndResetViewPicker();
 
   const viewPickerInputNameCallbackState = useRecoilComponentCallbackStateV2(
@@ -33,7 +33,7 @@ export const useUpdateViewFromCurrentState = (viewBarInstanceId?: string) => {
     useRecoilComponentCallbackStateV2(viewPickerReferenceViewIdComponentState);
 
   const { updateView } = useUpdateView();
-  const { changeView } = useChangeView(viewBarInstanceId);
+  const { changeView } = useChangeView();
 
   const updateViewFromCurrentState = useRecoilCallback(
     ({ set, snapshot }) =>