Fix orphan views by deferring record table widget view creation to dashboard save (#20006)

packages/twenty-front/src/modules/object-record/record-table-widget/components/RecordTableWidgetProvider.tsx

@@ -98,6 +98,7 @@ export const RecordTableWidgetProvider = ({
           >
             <RecordTableWidgetViewLoadEffect
               viewId={viewId}
+              widgetId={widgetId}
               objectMetadataItem={objectMetadataItem}
             />
             {children}

packages/twenty-front/src/modules/object-record/record-table-widget/components/RecordTableWidgetViewLoadEffect.tsx

@@ -1,6 +1,10 @@
 import { type EnrichedObjectMetadataItem } from '@/object-metadata/types/EnrichedObjectMetadataItem';
 import { useLoadRecordIndexStates } from '@/object-record/record-index/hooks/useLoadRecordIndexStates';
 import { lastLoadedRecordTableWidgetViewIdComponentState } from '@/object-record/record-table-widget/states/lastLoadedRecordTableWidgetViewIdComponentState';
+import { useIsPageLayoutInEditMode } from '@/page-layout/hooks/useIsPageLayoutInEditMode';
+import { recordTableWidgetViewDraftByWidgetIdComponentFamilySelector } from '@/page-layout/states/selectors/recordTableWidgetViewDraftByWidgetIdComponentFamilySelector';
+import { constructViewFromRecordTableWidgetViewSnapshot } from '@/page-layout/widgets/record-table/utils/constructViewFromRecordTableWidgetViewSnapshot';
+import { useAtomComponentFamilySelectorValue } from '@/ui/utilities/state/jotai/hooks/useAtomComponentFamilySelectorValue';
 import { useAtomComponentState } from '@/ui/utilities/state/jotai/hooks/useAtomComponentState';
 import { useAtomFamilySelectorValue } from '@/ui/utilities/state/jotai/hooks/useAtomFamilySelectorValue';
 import { viewFromViewIdFamilySelector } from '@/views/states/selectors/viewFromViewIdFamilySelector';
@@ -9,11 +13,13 @@ import { isDefined } from 'twenty-shared/utils';
 
 type RecordTableWidgetViewLoadEffectProps = {
   viewId: string;
+  widgetId: string;
   objectMetadataItem: EnrichedObjectMetadataItem;
 };
 
 export const RecordTableWidgetViewLoadEffect = ({
   viewId,
+  widgetId,
   objectMetadataItem,
 }: RecordTableWidgetViewLoadEffectProps) => {
   const { loadRecordIndexStates } = useLoadRecordIndexStates();
@@ -23,18 +29,30 @@ export const RecordTableWidgetViewLoadEffect = ({
     setLastLoadedRecordTableWidgetViewId,
   ] = useAtomComponentState(lastLoadedRecordTableWidgetViewIdComponentState);
 
-  const viewFromViewId = useAtomFamilySelectorValue(
-    viewFromViewIdFamilySelector,
-    {
-      viewId,
-    },
+  const isPageLayoutInEditMode = useIsPageLayoutInEditMode();
+
+  const draftSnapshot = useAtomComponentFamilySelectorValue(
+    recordTableWidgetViewDraftByWidgetIdComponentFamilySelector,
+    { widgetId },
   );
 
+  const viewFromDraft =
+    isPageLayoutInEditMode && isDefined(draftSnapshot)
+      ? constructViewFromRecordTableWidgetViewSnapshot(draftSnapshot)
+      : undefined;
+
+  const viewFromSelector = useAtomFamilySelectorValue(
+    viewFromViewIdFamilySelector,
+    { viewId },
+  );
+
+  const currentView = viewFromDraft ?? viewFromSelector;
+
   const viewHasFields =
-    isDefined(viewFromViewId) && viewFromViewId.viewFields.length > 0;
+    isDefined(currentView) && currentView.viewFields.length > 0;
 
   useEffect(() => {
-    if (!isDefined(viewFromViewId)) {
+    if (!isDefined(currentView)) {
       return;
     }
 
@@ -50,7 +68,7 @@ export const RecordTableWidgetViewLoadEffect = ({
       return;
     }
 
-    loadRecordIndexStates(viewFromViewId, objectMetadataItem);
+    loadRecordIndexStates(currentView, objectMetadataItem);
 
     setLastLoadedRecordTableWidgetViewId({
       viewId,
@@ -60,7 +78,7 @@ export const RecordTableWidgetViewLoadEffect = ({
     viewId,
     lastLoadedRecordTableWidgetViewId,
     setLastLoadedRecordTableWidgetViewId,
-    viewFromViewId,
+    currentView,
     viewHasFields,
     objectMetadataItem,
     loadRecordIndexStates,