Fix race condition while loading metadata on sign in (#9027)

packages/twenty-front/src/modules/object-metadata/components/ObjectMetadataItemsGater.tsx

@@ -0,0 +1,19 @@
+import React from 'react';
+import { useRecoilValue } from 'recoil';
+
+import { isAppWaitingForFreshObjectMetadataState } from '@/object-metadata/states/isAppWaitingForFreshObjectMetadataState';
+import { UserOrMetadataLoader } from '~/loading/components/UserOrMetadataLoader';
+
+export const ObjectMetadataItemsGater = ({
+  children,
+}: React.PropsWithChildren) => {
+  const isAppWaitingForFreshObjectMetadata = useRecoilValue(
+    isAppWaitingForFreshObjectMetadataState,
+  );
+
+  const shouldDisplayChildren = !isAppWaitingForFreshObjectMetadata;
+
+  return (
+    <>{shouldDisplayChildren ? <>{children}</> : <UserOrMetadataLoader />}</>
+  );
+};

packages/twenty-front/src/modules/object-metadata/states/isAppWaitingForFreshObjectMetadataState.ts

@@ -0,0 +1,6 @@
+import { createState } from 'twenty-ui';
+
+export const isAppWaitingForFreshObjectMetadataState = createState<boolean>({
+  key: 'isAppWaitingForFreshObjectMetadataState',
+  defaultValue: false,
+});