Fix view open in settings not saving (#10674)

This PR removes the legacy useGetCurrentView hook that still returned view with combined filters and sorts, which we don't use anymore. This allows to remove a bug where we couldn't select the "open in" settings of a view.
2025-03-05 15:52:37 +01:00
parent 07a72226da
commit f34b59b6b6
6 changed files with 38 additions and 100 deletions
--- a/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterAddFilterRuleSelect.tsx
+++ b/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterAddFilterRuleSelect.tsx
@ -11,7 +11,6 @@ import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown';
 import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
 import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown';
 import { ADVANCED_FILTER_DROPDOWN_ID } from '@/views/constants/AdvancedFilterDropdownId';
-import { useGetCurrentView } from '@/views/hooks/useGetCurrentView';
 import { useGetCurrentViewOnly } from '@/views/hooks/useGetCurrentViewOnly';
 import { useCallback } from 'react';
 import { useRecoilValue } from 'recoil';
@ -32,7 +31,7 @@ export const AdvancedFilterAddFilterRuleSelect = ({
    recordFilterGroup.id,
  );

-  const { currentViewId } = useGetCurrentView();
+  const { currentView } = useGetCurrentViewOnly();

  const { upsertRecordFilterGroup } = useUpsertRecordFilterGroup();

@ -42,8 +41,6 @@ export const AdvancedFilterAddFilterRuleSelect = ({

  const { closeDropdown } = useDropdown(dropdownId);

-  const { currentView } = useGetCurrentViewOnly();
-
  const objectMetadataId = currentView?.objectMetadataId;

  if (!isDefined(objectMetadataId)) {
@ -108,8 +105,8 @@ export const AdvancedFilterAddFilterRuleSelect = ({
  const handleAddFilterGroup = () => {
    closeDropdown();

-    if (!currentViewId) {
-      throw new Error('Missing view id');
+    if (!isDefined(currentView)) {
+      throw new Error('Missing view');
    }

    const newRecordFilterGroupId = v4();
--- a/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownViewSettingsContent.tsx
+++ b/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownViewSettingsContent.tsx
@ -12,17 +12,17 @@ import { useOptionsDropdown } from '@/object-record/object-options-dropdown/hook
 import { recordIndexOpenRecordInState } from '@/object-record/record-index/states/recordIndexOpenRecordInState';
 import { DropdownMenuHeader } from '@/ui/layout/dropdown/components/DropdownMenuHeader';
 import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
-import { useGetCurrentView } from '@/views/hooks/useGetCurrentView';
+import { useGetCurrentViewOnly } from '@/views/hooks/useGetCurrentViewOnly';
 import { ViewOpenRecordInType } from '@/views/types/ViewOpenRecordInType';
 import { ViewType } from '@/views/types/ViewType';
 import { useIsFeatureEnabled } from '@/workspace/hooks/useIsFeatureEnabled';
+import { useLingui } from '@lingui/react/macro';
 import { useRecoilValue } from 'recoil';
 import { FeatureFlagKey } from '~/generated-metadata/graphql';
-import { useLingui } from '@lingui/react/macro';

 export const ObjectOptionsDropdownViewSettingsContent = () => {
  const { t } = useLingui();
-  const { currentViewWithCombinedFiltersAndSorts } = useGetCurrentView();
+  const { currentView } = useGetCurrentViewOnly();

  const {
    recordIndexId,
@ -74,7 +74,7 @@ export const ObjectOptionsDropdownViewSettingsContent = () => {
            onToggleChange={() =>
              setAndPersistIsCompactModeActive(
                !isCompactModeActive,
-                currentViewWithCombinedFiltersAndSorts,
+                currentView,
              )
            }
            toggled={isCompactModeActive}
--- a/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownViewSettingsOpenInContent.tsx
+++ b/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownViewSettingsOpenInContent.tsx
@ -10,7 +10,7 @@ import { useOptionsDropdown } from '@/object-record/object-options-dropdown/hook
 import { recordIndexOpenRecordInState } from '@/object-record/record-index/states/recordIndexOpenRecordInState';
 import { DropdownMenuHeader } from '@/ui/layout/dropdown/components/DropdownMenuHeader';
 import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
-import { useGetCurrentView } from '@/views/hooks/useGetCurrentView';
+import { useGetCurrentViewOnly } from '@/views/hooks/useGetCurrentViewOnly';
 import { ViewOpenRecordInType } from '@/views/types/ViewOpenRecordInType';
 import { t } from '@lingui/core/macro';
 import { useRecoilValue } from 'recoil';
@ -18,7 +18,7 @@ import { useRecoilValue } from 'recoil';
 export const ObjectOptionsDropdownViewSettingsOpenInContent = () => {
  const { onContentChange } = useOptionsDropdown();
  const recordIndexOpenRecordIn = useRecoilValue(recordIndexOpenRecordInState);
-  const { currentViewWithCombinedFiltersAndSorts } = useGetCurrentView();
+  const { currentView } = useGetCurrentViewOnly();
  const { setAndPersistOpenRecordIn } = useObjectOptions();

  return (
@ -37,7 +37,7 @@ export const ObjectOptionsDropdownViewSettingsOpenInContent = () => {
          onClick={() =>
            setAndPersistOpenRecordIn(
              ViewOpenRecordInType.SIDE_PANEL,
-              currentViewWithCombinedFiltersAndSorts,
+              currentView,
            )
          }
        />
@ -50,7 +50,7 @@ export const ObjectOptionsDropdownViewSettingsOpenInContent = () => {
          onClick={() =>
            setAndPersistOpenRecordIn(
              ViewOpenRecordInType.RECORD_PAGE,
-              currentViewWithCombinedFiltersAndSorts,
+              currentView,
            )
          }
        />
--- a/packages/twenty-front/src/modules/views/hooks/useGetCurrentView.ts
+++ b/packages/twenty-front/src/modules/views/hooks/useGetCurrentView.ts
@ -1,77 +0,0 @@
-import { useEffect } from 'react';
-
-import { useContextStoreObjectMetadataItemOrThrow } from '@/context-store/hooks/useContextStoreObjectMetadataItemOrThrow';
-import { contextStoreCurrentViewIdComponentState } from '@/context-store/states/contextStoreCurrentViewIdComponentState';
-import { prefetchIndexViewIdFromObjectMetadataItemFamilySelector } from '@/prefetch/states/selector/prefetchIndexViewIdFromObjectMetadataItemFamilySelector';
-import { prefetchViewFromViewIdFamilySelector } from '@/prefetch/states/selector/prefetchViewFromViewIdFamilySelector';
-import { prefetchViewsFromObjectMetadataItemFamilySelector } from '@/prefetch/states/selector/prefetchViewsFromObjectMetadataItemFamilySelector';
-import { useAvailableComponentInstanceIdOrThrow } from '@/ui/utilities/state/component-state/hooks/useAvailableComponentInstanceIdOrThrow';
-import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2';
-import { useSetRecoilComponentStateV2 } from '@/ui/utilities/state/component-state/hooks/useSetRecoilComponentStateV2';
-import { ViewComponentInstanceContext } from '@/views/states/contexts/ViewComponentInstanceContext';
-import { isCurrentViewKeyIndexComponentState } from '@/views/states/isCurrentViewIndexComponentState';
-import { useRecoilValue } from 'recoil';
-import { isDefined } from 'twenty-shared';
-
-export const useGetCurrentView = (viewBarInstanceId?: string) => {
-  const instanceId = useAvailableComponentInstanceIdOrThrow(
-    ViewComponentInstanceContext,
-    viewBarInstanceId,
-  );
-
-  const { objectMetadataItem } = useContextStoreObjectMetadataItemOrThrow();
-
-  const currentViewId = useRecoilComponentValueV2(
-    contextStoreCurrentViewIdComponentState,
-  );
-
-  const indexViewId = useRecoilValue(
-    prefetchIndexViewIdFromObjectMetadataItemFamilySelector({
-      objectMetadataItemId: objectMetadataItem.id,
-    }),
-  );
-
-  const currentViewFromViewId = useRecoilValue(
-    prefetchViewFromViewIdFamilySelector({
-      viewId: currentViewId ?? '',
-    }),
-  );
-
-  const indexView = useRecoilValue(
-    prefetchViewFromViewIdFamilySelector({
-      viewId: indexViewId ?? '',
-    }),
-  );
-
-  const setIsCurrentViewKeyIndex = useSetRecoilComponentStateV2(
-    isCurrentViewKeyIndexComponentState,
-    instanceId,
-  );
-
-  const currentView = currentViewFromViewId ?? indexView;
-
-  useEffect(() => {
-    setIsCurrentViewKeyIndex(currentView?.key === 'INDEX');
-  }, [currentView, setIsCurrentViewKeyIndex]);
-
-  const viewsOnCurrentObject = useRecoilValue(
-    prefetchViewsFromObjectMetadataItemFamilySelector({
-      objectMetadataItemId: objectMetadataItem.id,
-    }),
-  );
-
-  if (!isDefined(currentView)) {
-    return {
-      instanceId,
-      currentViewWithSavedFiltersAndSorts: undefined,
-      currentViewWithCombinedFiltersAndSorts: undefined,
-      viewsOnCurrentObject: viewsOnCurrentObject ?? [],
-    };
-  }
-
-  return {
-    instanceId,
-    viewsOnCurrentObject: viewsOnCurrentObject ?? [],
-    currentViewId,
-  };
-};
--- a/packages/twenty-front/src/modules/views/view-picker/components/ViewPickerListContent.tsx
+++ b/packages/twenty-front/src/modules/views/view-picker/components/ViewPickerListContent.tsx
@ -3,19 +3,21 @@ import { DropResult } from '@hello-pangea/dnd';
 import { MouseEvent, useCallback } from 'react';
 import { IconPlus, MenuItem } from 'twenty-ui';

+import { useContextStoreObjectMetadataItemOrThrow } from '@/context-store/hooks/useContextStoreObjectMetadataItemOrThrow';
+import { prefetchViewsFromObjectMetadataItemFamilySelector } from '@/prefetch/states/selector/prefetchViewsFromObjectMetadataItemFamilySelector';
 import { DraggableItem } from '@/ui/layout/draggable-list/components/DraggableItem';
 import { DraggableList } from '@/ui/layout/draggable-list/components/DraggableList';
 import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
 import { DropdownMenuSeparator } from '@/ui/layout/dropdown/components/DropdownMenuSeparator';
 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 { useRecoilValue } from 'recoil';
 import { isDefined } from 'twenty-shared';
 import { moveArrayItem } from '~/utils/array/moveArrayItem';

@ -25,7 +27,14 @@ const StyledBoldDropdownMenuItemsContainer = styled(DropdownMenuItemsContainer)`

 export const ViewPickerListContent = () => {
  const { t } = useLingui();
-  const { viewsOnCurrentObject } = useGetCurrentView();
+
+  const { objectMetadataItem } = useContextStoreObjectMetadataItemOrThrow();
+
+  const viewsOnCurrentObject = useRecoilValue(
+    prefetchViewsFromObjectMetadataItemFamilySelector({
+      objectMetadataItemId: objectMetadataItem.id,
+    }),
+  );

  const { currentView } = useGetCurrentViewOnly();

--- a/packages/twenty-front/src/modules/views/view-picker/hooks/useDeleteViewFromCurrentState.ts
+++ b/packages/twenty-front/src/modules/views/view-picker/hooks/useDeleteViewFromCurrentState.ts
@ -1,19 +1,18 @@
-import { useRecoilCallback } from 'recoil';
+import { useRecoilCallback, useRecoilValue } from 'recoil';

+import { useContextStoreObjectMetadataItemOrThrow } from '@/context-store/hooks/useContextStoreObjectMetadataItemOrThrow';
+import { prefetchViewsFromObjectMetadataItemFamilySelector } from '@/prefetch/states/selector/prefetchViewsFromObjectMetadataItemFamilySelector';
 import { getSnapshotValue } from '@/ui/utilities/recoil-scope/utils/getSnapshotValue';
 import { useRecoilComponentCallbackStateV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentCallbackStateV2';
 import { useChangeView } from '@/views/hooks/useChangeView';
 import { useDeleteView } from '@/views/hooks/useDeleteView';
-import { useGetCurrentView } from '@/views/hooks/useGetCurrentView';
+import { useGetCurrentViewOnly } from '@/views/hooks/useGetCurrentViewOnly';
 import { useCloseAndResetViewPicker } from '@/views/view-picker/hooks/useCloseAndResetViewPicker';
 import { viewPickerIsDirtyComponentState } from '@/views/view-picker/states/viewPickerIsDirtyComponentState';
 import { viewPickerIsPersistingComponentState } from '@/views/view-picker/states/viewPickerIsPersistingComponentState';
 import { viewPickerReferenceViewIdComponentState } from '@/views/view-picker/states/viewPickerReferenceViewIdComponentState';

 export const useDeleteViewFromCurrentState = (viewBarInstanceId?: string) => {
-  const { viewsOnCurrentObject, currentViewId } =
-    useGetCurrentView(viewBarInstanceId);
-
  const { closeAndResetViewPicker } = useCloseAndResetViewPicker();

  const viewPickerIsPersistingCallbackState = useRecoilComponentCallbackStateV2(
@ -32,6 +31,16 @@ export const useDeleteViewFromCurrentState = (viewBarInstanceId?: string) => {
      viewBarInstanceId,
    );

+  const { objectMetadataItem } = useContextStoreObjectMetadataItemOrThrow();
+
+  const viewsOnCurrentObject = useRecoilValue(
+    prefetchViewsFromObjectMetadataItemFamilySelector({
+      objectMetadataItemId: objectMetadataItem.id,
+    }),
+  );
+
+  const { currentView } = useGetCurrentViewOnly();
+
  const { changeView } = useChangeView();

  const { deleteView } = useDeleteView();
@ -48,7 +57,7 @@ export const useDeleteViewFromCurrentState = (viewBarInstanceId?: string) => {
          viewPickerReferenceViewIdCallbackState,
        );

-        const shouldChangeView = viewPickerReferenceViewId === currentViewId;
+        const shouldChangeView = viewPickerReferenceViewId === currentView?.id;

        if (shouldChangeView) {
          changeView(
@ -61,7 +70,7 @@ export const useDeleteViewFromCurrentState = (viewBarInstanceId?: string) => {
        await deleteView(viewPickerReferenceViewId);
      },
    [
-      currentViewId,
+      currentView,
      closeAndResetViewPicker,
      changeView,
      deleteView,