Feat/error boundaries (#2779)

* - Changed to objectNameSingular always defined
- Added ErrorCatchAll

* - Added mock mode for companies logged out
- Added a proper ErrorBoundary component

* Removed react-error-boundary

* Implemented proper ErrorBoundary

* Fixes

* Change strategy about mocks

---------

Co-authored-by: Charles Bochet <charles@twenty.com>

front/package.json

@@ -40,6 +40,7 @@
     "react-datepicker": "^4.11.0",
     "react-dom": "^18.2.0",
     "react-dropzone": "^14.2.3",
+    "react-error-boundary": "^4.0.11",
     "react-helmet-async": "^1.3.0",
     "react-hook-form": "^7.45.1",
     "react-hotkeys-hook": "^4.4.0",
@@ -176,4 +177,4 @@
   "msw": {
     "workerDirectory": "public"
   }
-}
+}

front/src/index.tsx

@@ -7,6 +7,8 @@ import { RecoilRoot } from 'recoil';
 import { ApolloProvider } from '@/apollo/components/ApolloProvider';
 import { ClientConfigProvider } from '@/client-config/components/ClientConfigProvider';
 import { RecoilDebugObserverEffect } from '@/debug/components/RecoilDebugObserver';
+import { AppErrorBoundary } from '@/error-handler/components/AppErrorBoundary';
+import { PromiseRejectionEffect } from '@/error-handler/components/PromiseRejectionEffect';
 import { ApolloMetadataClientProvider } from '@/object-metadata/components/ApolloMetadataClientProvider';
 import { ObjectMetadataItemsProvider } from '@/object-metadata/components/ObjectMetadataItemsProvider';
 import { DialogManager } from '@/ui/feedback/dialog-manager/components/DialogManager';
@@ -16,12 +18,11 @@ import { SnackBarProviderScope } from '@/ui/feedback/snack-bar-manager/scopes/Sn
 import { AppThemeProvider } from '@/ui/theme/components/AppThemeProvider';
 import { ThemeType } from '@/ui/theme/constants/theme';
 import { UserProvider } from '@/users/components/UserProvider';
+import { App } from '~/App';
+import { PageChangeEffect } from '~/effect-components/PageChangeEffect';
 
 import '@emotion/react';
 
-import { PageChangeEffect } from './effect-components/PageChangeEffect';
-import { App } from './App';
-
 import './index.css';
 import 'react-loading-skeleton/dist/skeleton.css';
 
@@ -31,35 +32,38 @@ const root = ReactDOM.createRoot(
 
 root.render(
   <RecoilRoot>
-    <RecoilDebugObserverEffect />
+    <AppErrorBoundary>
-    <BrowserRouter>
+      <RecoilDebugObserverEffect />
-      <ApolloProvider>
+      <BrowserRouter>
-        <HelmetProvider>
+        <SnackBarProviderScope snackBarManagerScopeId="snack-bar-manager">
-          <ClientConfigProvider>
+          <ApolloProvider>
-            <UserProvider>
+            <HelmetProvider>
-              <ApolloMetadataClientProvider>
+              <ClientConfigProvider>
-                <SnackBarProviderScope snackBarManagerScopeId="snack-bar-manager">
+                <UserProvider>
-                  <ObjectMetadataItemsProvider>
+                  <ApolloMetadataClientProvider>
-                    <PageChangeEffect />
+                    <ObjectMetadataItemsProvider>
-                    <AppThemeProvider>
+                      <AppThemeProvider>
-                      <SnackBarProvider>
+                        <SnackBarProvider>
-                        <DialogManagerScope dialogManagerScopeId="dialog-manager">
+                          <DialogManagerScope dialogManagerScopeId="dialog-manager">
-                          <DialogManager>
+                            <DialogManager>
-                            <StrictMode>
+                              <StrictMode>
-                              <App />
+                                <PromiseRejectionEffect />
-                            </StrictMode>
+                                <App />
-                          </DialogManager>
+                              </StrictMode>
-                        </DialogManagerScope>
+                            </DialogManager>
-                      </SnackBarProvider>
+                          </DialogManagerScope>
-                    </AppThemeProvider>
+                        </SnackBarProvider>
-                  </ObjectMetadataItemsProvider>
+                      </AppThemeProvider>
-                </SnackBarProviderScope>
+                      <PageChangeEffect />
-              </ApolloMetadataClientProvider>
+                    </ObjectMetadataItemsProvider>
-            </UserProvider>
+                  </ApolloMetadataClientProvider>
-          </ClientConfigProvider>
+                </UserProvider>
-        </HelmetProvider>
+              </ClientConfigProvider>
-      </ApolloProvider>
+            </HelmetProvider>
-    </BrowserRouter>
+          </ApolloProvider>
+        </SnackBarProviderScope>
+      </BrowserRouter>
+    </AppErrorBoundary>
   </RecoilRoot>,
 );
 

front/src/modules/activities/components/ActivityComments.tsx

@@ -67,7 +67,7 @@ export const ActivityComments = ({
   const currentWorkspaceMember = useRecoilValue(currentWorkspaceMemberState);
 
   const { records: comments } = useFindManyRecords({
-    objectNamePlural: 'comments',
+    objectNameSingular: 'comment',
     filter: {
       activityId: {
         eq: activity?.id ?? '',

front/src/modules/activities/files/hooks/useAttachments.tsx

@@ -5,7 +5,7 @@ import { ActivityTargetableEntity } from '../../types/ActivityTargetableEntity';
 
 export const useAttachments = (entity: ActivityTargetableEntity) => {
   const { records: attachments } = useFindManyRecords({
-    objectNamePlural: 'attachments',
+    objectNameSingular: 'attachment',
     filter: {
       [entity.type === 'Company' ? 'companyId' : 'personId']: { eq: entity.id },
     },

front/src/modules/activities/inline-cell/components/ActivityTargetInlineCellEditMode.tsx

@@ -87,7 +87,7 @@ export const ActivityTargetInlineCellEditMode = ({
     orderByField: 'createdAt',
     mappingFunction: (record: any) => identifiersMapper?.(record, 'person'),
     selectedIds: initialPeopleIds,
-    objectNamePlural: 'people',
+    objectNameSingular: 'person',
     limit: 3,
   });
 
@@ -102,7 +102,7 @@ export const ActivityTargetInlineCellEditMode = ({
     orderByField: 'createdAt',
     mappingFunction: (record: any) => identifiersMapper?.(record, 'company'),
     selectedIds: initialCompanyIds,
-    objectNamePlural: 'companies',
+    objectNameSingular: 'company',
     limit: 3,
   });
 

front/src/modules/activities/inline-cell/components/ActivityTargetsInlineCell.tsx

@@ -28,7 +28,7 @@ export const ActivityTargetsInlineCell = ({
     ) ?? [];
 
   const { records: activityTargets } = useFindManyRecords<ActivityTarget>({
-    objectNamePlural: 'activityTargets',
+    objectNameSingular: 'activityTarget',
     filter: { id: { in: activityTargetIds } },
   });
 

front/src/modules/activities/notes/hooks/useNotes.ts

@@ -5,7 +5,7 @@ import { ActivityTargetableEntity } from '../../types/ActivityTargetableEntity';
 
 export const useNotes = (entity: ActivityTargetableEntity) => {
   const { records: activityTargets } = useFindManyRecords({
-    objectNamePlural: 'activityTargets',
+    objectNameSingular: 'activityTarget',
     filter: {
       [entity.type === 'Company' ? 'companyId' : 'personId']: { eq: entity.id },
     },
@@ -23,7 +23,7 @@ export const useNotes = (entity: ActivityTargetableEntity) => {
 
   const { records: notes } = useFindManyRecords({
     skip: !activityTargets?.length,
-    objectNamePlural: 'activities',
+    objectNameSingular: 'activity',
     filter,
     orderBy,
   });

front/src/modules/activities/tasks/components/TaskRow.tsx

@@ -82,7 +82,7 @@ export const TaskRow = ({
     ) ?? [];
 
   const { records: activityTargets } = useFindManyRecords<ActivityTarget>({
-    objectNamePlural: 'activityTargets',
+    objectNameSingular: 'activityTarget',
     filter: { id: { in: activityTargetIds } },
   });
 

front/src/modules/activities/tasks/hooks/useCurrentUserDueTaskCount.ts

@@ -9,7 +9,7 @@ export const useCurrentUserTaskCount = () => {
   const currentWorkspaceMember = useRecoilValue(currentWorkspaceMemberState);
 
   const { records: tasks } = useFindManyRecords({
-    objectNamePlural: 'activities',
+    objectNameSingular: 'activity',
     filter: {
       type: { eq: 'Task' },
       completedAt: { is: 'NULL' },

front/src/modules/activities/tasks/hooks/useTasks.ts

@@ -22,7 +22,7 @@ export const useTasks = (props?: UseTasksProps) => {
   });
 
   const { records: activityTargets } = useFindManyRecords({
-    objectNamePlural: 'activityTargets',
+    objectNameSingular: 'activityTarget',
     filter: isDefined(entity)
       ? {
           [entity?.type === 'Company' ? 'companyId' : 'personId']: {
@@ -33,7 +33,7 @@ export const useTasks = (props?: UseTasksProps) => {
   });
 
   const { records: completeTasksData } = useFindManyRecords({
-    objectNamePlural: 'activities',
+    objectNameSingular: 'activity',
     skip: !entity && !selectedFilter,
     filter: {
       completedAt: { is: 'NOT_NULL' },
@@ -57,7 +57,7 @@ export const useTasks = (props?: UseTasksProps) => {
   });
 
   const { records: incompleteTaskData } = useFindManyRecords({
-    objectNamePlural: 'activities',
+    objectNameSingular: 'activity',
     skip: !entity && !selectedFilter,
     filter: {
       completedAt: { is: 'NULL' },

front/src/modules/activities/timeline/components/Timeline.tsx

@@ -49,7 +49,7 @@ const StyledEmptyTimelineSubTitle = styled.div`
 
 export const Timeline = ({ entity }: { entity: ActivityTargetableEntity }) => {
   const { records: activityTargets, loading } = useFindManyRecords({
-    objectNamePlural: 'activityTargets',
+    objectNameSingular: 'activityTarget',
     filter: {
       [entity.type === 'Company' ? 'companyId' : 'personId']: { eq: entity.id },
     },
@@ -57,7 +57,7 @@ export const Timeline = ({ entity }: { entity: ActivityTargetableEntity }) => {
 
   const { records: activities } = useFindManyRecords({
     skip: !activityTargets?.length,
-    objectNamePlural: 'activities',
+    objectNameSingular: 'activity',
     filter: {
       id: {
         in: activityTargets?.map((activityTarget) => activityTarget.activityId),

front/src/modules/apollo/optimistic-effect/hooks/useOptimisticEffect.ts

@@ -12,6 +12,7 @@ import {
   useObjectMetadataItem,
 } from '@/object-metadata/hooks/useObjectMetadataItem';
 import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem';
+import { ObjectMetadataItemIdentifier } from '@/object-metadata/types/ObjectMetadataItemIdentifier';
 
 import { optimisticEffectState } from '../states/optimisticEffectState';
 import { OptimisticEffect } from '../types/internal/OptimisticEffect';
@@ -19,10 +20,9 @@ import { OptimisticEffectDefinition } from '../types/OptimisticEffectDefinition'
 
 export const useOptimisticEffect = ({
   objectNameSingular,
-}: {
+}: ObjectMetadataItemIdentifier) => {
-  objectNameSingular: string | undefined;
-}) => {
   const apolloClient = useApolloClient();
+
   const { findManyRecordsQuery } = useObjectMetadataItem({
     objectNameSingular,
   });

front/src/modules/auth/hooks/useAuth.ts

@@ -28,6 +28,7 @@ export const useAuth = () => {
   const setCurrentWorkspaceMember = useSetRecoilState(
     currentWorkspaceMemberState,
   );
+
   const setCurrentWorkspace = useSetRecoilState(currentWorkspaceState);
   const setIsVerifyPendingState = useSetRecoilState(isVerifyPendingState);
 

front/src/modules/command-menu/components/CommandMenu.tsx

@@ -116,7 +116,7 @@ export const CommandMenu = () => {
 
   const { records: people } = useFindManyRecords<Person>({
     skip: !isCommandMenuOpened,
-    objectNamePlural: 'people',
+    objectNameSingular: 'person',
     filter: {
       or: [
         { name: { firstName: { ilike: `%${search}%` } } },
@@ -128,7 +128,7 @@ export const CommandMenu = () => {
 
   const { records: companies } = useFindManyRecords<Person>({
     skip: !isCommandMenuOpened,
-    objectNamePlural: 'companies',
+    objectNameSingular: 'company',
     filter: {
       name: { ilike: `%${search}%` },
     },
@@ -137,7 +137,7 @@ export const CommandMenu = () => {
 
   const { records: activities } = useFindManyRecords<Person>({
     skip: !isCommandMenuOpened,
-    objectNamePlural: 'activities',
+    objectNameSingular: 'activity',
     filter: {
       or: [
         { title: { like: `%${search}%` } },

front/src/modules/companies/components/HooksCompanyBoardEffect.tsx

@@ -61,7 +61,7 @@ export const HooksCompanyBoardEffect = ({
   const currentViewSorts = useRecoilValue(currentViewSortsState);
 
   const { objectMetadataItem } = useObjectMetadataItem({
-    objectNamePlural: 'opportunities',
+    objectNameSingular: 'opportunity',
   });
 
   const { columnDefinitions, filterDefinitions, sortDefinitions } =
@@ -85,7 +85,7 @@ export const HooksCompanyBoardEffect = ({
   );
 
   useFindManyRecords({
-    objectNamePlural: 'pipelineSteps',
+    objectNameSingular: 'pipelineStep',
     filter: {},
     onCompleted: useCallback(
       (data: PaginatedRecordTypeResults<PipelineStep>) => {
@@ -107,7 +107,7 @@ export const HooksCompanyBoardEffect = ({
 
   const { fetchMoreRecords: fetchMoreOpportunities } = useFindManyRecords({
     skip: !pipelineSteps.length,
-    objectNamePlural: 'opportunities',
+    objectNameSingular: 'opportunity',
     filter: filter,
     orderBy: orderBy,
     onCompleted: useCallback(
@@ -132,7 +132,7 @@ export const HooksCompanyBoardEffect = ({
 
   const { fetchMoreRecords: fetchMoreCompanies } = useFindManyRecords({
     skip: !opportunities.length,
-    objectNamePlural: 'companies',
+    objectNameSingular: 'company',
     filter: {
       id: {
         in: opportunities.map((opportunity) => opportunity.companyId || ''),

front/src/modules/companies/components/NewOpportunityButton.tsx

@@ -78,7 +78,7 @@ export const NewOpportunityButton = () => {
     orderByField: 'createdAt',
     selectedIds: [],
     mappingFunction: (record: any) => identifiersMapper?.(record, 'company'),
-    objectNamePlural: 'companies',
+    objectNameSingular: 'company',
   });
 
   return (

front/src/modules/companies/components/OpportunityPicker.tsx

@@ -54,7 +54,7 @@ export const OpportunityPicker = ({
     orderByField: 'createdAt',
     selectedIds: [],
     mappingFunction: (record: any) => identifiersMapper?.(record, 'company'),
-    objectNamePlural: 'companies',
+    objectNameSingular: 'company',
   });
 
   const [isProgressSelectionUnfolded, setIsProgressSelectionUnfolded] =

front/src/modules/error-handler/components/AppErrorBoundary.tsx

@@ -0,0 +1,19 @@
+import { ErrorInfo, ReactNode } from 'react';
+import { ErrorBoundary } from 'react-error-boundary';
+
+import { GenericErrorFallback } from '@/error-handler/components/GenericErrorFallback';
+
+export const AppErrorBoundary = ({ children }: { children: ReactNode }) => {
+  const handleError = (_error: Error, _info: ErrorInfo) => {
+    // TODO: log error to Sentry
+  };
+
+  return (
+    <ErrorBoundary
+      FallbackComponent={GenericErrorFallback}
+      onError={handleError}
+    >
+      {children}
+    </ErrorBoundary>
+  );
+};

front/src/modules/error-handler/components/GenericErrorFallback.tsx

@@ -0,0 +1,26 @@
+import { FallbackProps } from 'react-error-boundary';
+
+type GenericErrorFallbackProps = FallbackProps;
+
+export const GenericErrorFallback = ({
+  error,
+  resetErrorBoundary,
+}: GenericErrorFallbackProps) => {
+  return (
+    <div
+      style={{
+        color: 'red',
+        display: 'flex',
+        flexDirection: 'column',
+        gap: '20px',
+        alignItems: 'center',
+        justifyContent: 'center',
+        width: '100%',
+        height: '100%',
+      }}
+    >
+      <div>{error.message}</div>
+      <button onClick={() => resetErrorBoundary()}>Retry</button>
+    </div>
+  );
+};

front/src/modules/error-handler/components/PromiseRejectionEffect.tsx

@@ -0,0 +1,39 @@
+import React, { useCallback, useEffect } from 'react';
+
+import { ObjectMetadataItemNotFoundError } from '@/object-metadata/errors/ObjectMetadataNotFoundError';
+import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar';
+
+export const PromiseRejectionEffect = () => {
+  const { enqueueSnackBar } = useSnackBar();
+
+  const handlePromiseRejection = useCallback(
+    (event: PromiseRejectionEvent) => {
+      const error = event.reason;
+
+      // TODO: connect Sentry here
+      if (error instanceof ObjectMetadataItemNotFoundError) {
+        enqueueSnackBar(
+          `Error with custom object that cannot be found : ${event.reason}`,
+          {
+            variant: 'error',
+          },
+        );
+      } else {
+        enqueueSnackBar(`Error: ${event.reason}`, {
+          variant: 'error',
+        });
+      }
+    },
+    [enqueueSnackBar],
+  );
+
+  useEffect(() => {
+    window.addEventListener('unhandledrejection', handlePromiseRejection);
+
+    return () => {
+      window.removeEventListener('unhandledrejection', handlePromiseRejection);
+    };
+  }, [handlePromiseRejection]);
+
+  return <></>;
+};

front/src/modules/favorites/hooks/useFavorites.ts

@@ -8,6 +8,7 @@ import { currentWorkspaceMemberState } from '@/auth/states/currentWorkspaceMembe
 import { Favorite } from '@/favorites/types/Favorite';
 import { mapFavorites } from '@/favorites/utils/mapFavorites';
 import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem';
+import { useObjectNameSingularFromPlural } from '@/object-metadata/hooks/useObjectNameSingularFromPlural';
 import { getRecordOptimisticEffectDefinition } from '@/object-record/graphql/optimistic-effect-definition/getRecordOptimisticEffectDefinition';
 import { useFindManyRecords } from '@/object-record/hooks/useFindManyRecords';
 import { PaginatedRecordTypeResults } from '@/object-record/types/PaginatedRecordTypeResults';
@@ -18,7 +19,7 @@ import { favoritesState } from '../states/favoritesState';
 export const useFavorites = ({
   objectNamePlural,
 }: {
-  objectNamePlural: string | undefined;
+  objectNamePlural: string;
 }) => {
   const currentWorkspaceMember = useRecoilValue(currentWorkspaceMemberState);
 
@@ -30,7 +31,7 @@ export const useFavorites = ({
     deleteOneRecordMutation: deleteOneFavoriteMutation,
     objectMetadataItem: favoriteObjectMetadataItem,
   } = useObjectMetadataItem({
-    objectNamePlural: 'favorites',
+    objectNameSingular: 'favorite',
   });
 
   const { registerOptimisticEffect, triggerOptimisticEffects } =
@@ -39,15 +40,19 @@ export const useFavorites = ({
     });
   const { performOptimisticEvict } = useOptimisticEvict();
 
+  const { objectNameSingular } = useObjectNameSingularFromPlural({
+    objectNamePlural,
+  });
+
   const { objectMetadataItem: favoriteTargetObjectMetadataItem } =
     useObjectMetadataItem({
-      objectNamePlural,
+      objectNameSingular,
     });
 
   const apolloClient = useApolloClient();
 
   useFindManyRecords({
-    objectNamePlural: 'favorites',
+    objectNameSingular: 'favorite',
     onCompleted: useRecoilCallback(
       ({ snapshot, set }) =>
         async (data: PaginatedRecordTypeResults<Required<Favorite>>) => {

front/src/modules/object-metadata/components/ApolloMetadataClientProvider.tsx

@@ -14,7 +14,6 @@ export const ApolloMetadataClientProvider = ({
   children: React.ReactNode;
 }) => {
   const [tokenPair] = useRecoilState(tokenPairState);
-
   const apolloMetadataClient = useMemo(() => {
     if (tokenPair?.accessToken.token) {
       return new ApolloClient({

front/src/modules/object-metadata/components/ObjectMetadataItemsLoadEffect.tsx

@@ -0,0 +1,7 @@
+import { useFindManyObjectMetadataItems } from '@/object-metadata/hooks/useFindManyObjectMetadataItems';
+
+export const ObjectMetadataItemsLoadEffect = () => {
+  useFindManyObjectMetadataItems();
+
+  return <></>;
+};

front/src/modules/object-metadata/components/ObjectMetadataItemsProvider.tsx

@@ -1,14 +1,21 @@
+import { useRecoilValue } from 'recoil';
+
+import { currentWorkspaceState } from '@/auth/states/currentWorkspaceState';
+import { ObjectMetadataItemsLoadEffect } from '@/object-metadata/components/ObjectMetadataItemsLoadEffect';
 import { ObjectMetadataItemsRelationPickerEffect } from '@/object-metadata/components/ObjectMetadataItemsRelationPickerEffect';
-import { useFindManyObjectMetadataItems } from '@/object-metadata/hooks/useFindManyObjectMetadataItems';
+import { objectMetadataItemsState } from '@/object-metadata/states/objectMetadataItemsState';
 import { RelationPickerScope } from '@/ui/input/components/internal/relation-picker/scopes/RelationPickerScope';
 
 export const ObjectMetadataItemsProvider = ({
   children,
 }: React.PropsWithChildren) => {
-  const { loading } = useFindManyObjectMetadataItems();
+  const objectMetadataItems = useRecoilValue(objectMetadataItemsState);
+  const currentWorkspace = useRecoilValue(currentWorkspaceState);
 
-  return loading ? (
+  return objectMetadataItems.length < 1 && currentWorkspace ? (
-    <></>
+    <>
+      <ObjectMetadataItemsLoadEffect />
+    </>
   ) : (
     <>
       <ObjectMetadataItemsRelationPickerEffect />

front/src/modules/object-metadata/errors/ObjectMetadataNotFoundError.ts

@@ -0,0 +1,13 @@
+import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem';
+
+export class ObjectMetadataItemNotFoundError extends Error {
+  constructor(objectName: string, objectMetadataItems: ObjectMetadataItem[]) {
+    const message = `Object metadata item "${objectName}" cannot be found in an array of ${
+      objectMetadataItems?.length ?? 0
+    } elements`;
+
+    super(message);
+
+    Object.setPrototypeOf(this, ObjectMetadataItemNotFoundError.prototype);
+  }
+}

front/src/modules/object-metadata/hooks/useObjectMetadataItem.ts

@@ -1,7 +1,11 @@
 import { gql } from '@apollo/client';
 import { useRecoilValue } from 'recoil';
 
+import { currentWorkspaceState } from '@/auth/states/currentWorkspaceState';
+import { ObjectMetadataItemNotFoundError } from '@/object-metadata/errors/ObjectMetadataNotFoundError';
 import { objectMetadataItemFamilySelector } from '@/object-metadata/states/objectMetadataItemFamilySelector';
+import { objectMetadataItemsState } from '@/object-metadata/states/objectMetadataItemsState';
+import { getObjectMetadataItemsMock } from '@/object-metadata/utils/getObjectMetadataItemsMock';
 import { useGenerateCreateOneRecordMutation } from '@/object-record/hooks/useGenerateCreateOneRecordMutation';
 import { useGenerateFindManyRecordsQuery } from '@/object-record/hooks/useGenerateFindManyRecordsQuery';
 import { useGenerateFindOneRecordQuery } from '@/object-record/hooks/useGenerateFindOneRecordQuery';
@@ -26,17 +30,36 @@ export const EMPTY_MUTATION = gql`
 `;
 
 export const useObjectMetadataItem = (
-  { objectNamePlural, objectNameSingular }: ObjectMetadataItemIdentifier,
+  { objectNameSingular }: ObjectMetadataItemIdentifier,
   depth?: number,
 ) => {
-  const objectMetadataItem = useRecoilValue(
+  const currentWorkspace = useRecoilValue(currentWorkspaceState);
+  const mockObjectMetadataItems = getObjectMetadataItemsMock();
+
+  let objectMetadataItem = useRecoilValue(
     objectMetadataItemFamilySelector({
-      objectNamePlural,
+      objectName: objectNameSingular,
-      objectNameSingular,
+      objectNameType: 'singular',
     }),
   );
 
-  const objectMetadataItemNotFound = !isDefined(objectMetadataItem);
+  let objectMetadataItems = useRecoilValue(objectMetadataItemsState);
+
+  if (!currentWorkspace) {
+    objectMetadataItem =
+      mockObjectMetadataItems.find(
+        (objectMetadataItem) =>
+          objectMetadataItem.nameSingular === objectNameSingular,
+      ) ?? null;
+    objectMetadataItems = mockObjectMetadataItems;
+  }
+
+  if (!isDefined(objectMetadataItem)) {
+    throw new ObjectMetadataItemNotFoundError(
+      objectNameSingular,
+      objectMetadataItems,
+    );
+  }
 
   const getRecordFromCache = useGetRecordFromCache({
     objectMetadataItem,
@@ -68,17 +91,16 @@ export const useObjectMetadataItem = (
     objectMetadataItem,
   });
 
-  const labelIdentifierFieldMetadataId = objectMetadataItem?.fields.find(
+  const labelIdentifierFieldMetadataId = objectMetadataItem.fields.find(
     ({ name }) => name === 'name',
   )?.id;
 
-  const basePathToShowPage = `/object/${objectMetadataItem?.nameSingular}/`;
+  const basePathToShowPage = `/object/${objectMetadataItem.nameSingular}/`;
 
   return {
     labelIdentifierFieldMetadataId,
     basePathToShowPage,
     objectMetadataItem,
-    objectMetadataItemNotFound,
     getRecordFromCache,
     modifyRecordFromCache,
     findManyRecordsQuery,

front/src/modules/object-metadata/hooks/useObjectNamePluralFromSingular.ts

@@ -0,0 +1,38 @@
+import { useRecoilValue } from 'recoil';
+
+import { currentWorkspaceState } from '@/auth/states/currentWorkspaceState';
+import { objectMetadataItemFamilySelector } from '@/object-metadata/states/objectMetadataItemFamilySelector';
+import { getObjectMetadataItemsMock } from '@/object-metadata/utils/getObjectMetadataItemsMock';
+import { isDefined } from '~/utils/isDefined';
+
+export const useObjectNamePluralFromSingular = ({
+  objectNameSingular,
+}: {
+  objectNameSingular: string;
+}) => {
+  const currentWorkspace = useRecoilValue(currentWorkspaceState);
+  const mockObjectMetadataItems = getObjectMetadataItemsMock();
+
+  let objectMetadataItem = useRecoilValue(
+    objectMetadataItemFamilySelector({
+      objectName: objectNameSingular,
+      objectNameType: 'singular',
+    }),
+  );
+
+  if (!currentWorkspace) {
+    objectMetadataItem =
+      mockObjectMetadataItems.find(
+        (objectMetadataItem) =>
+          objectMetadataItem.nameSingular === objectNameSingular,
+      ) ?? null;
+  }
+
+  if (!isDefined(objectMetadataItem)) {
+    throw new Error(
+      `Object metadata item not found for ${objectNameSingular} object`,
+    );
+  }
+
+  return { objectNamePlural: objectMetadataItem.namePlural };
+};

front/src/modules/object-metadata/hooks/useObjectNameSingularFromPlural.ts

@@ -0,0 +1,38 @@
+import { useRecoilValue } from 'recoil';
+
+import { currentWorkspaceState } from '@/auth/states/currentWorkspaceState';
+import { objectMetadataItemFamilySelector } from '@/object-metadata/states/objectMetadataItemFamilySelector';
+import { getObjectMetadataItemsMock } from '@/object-metadata/utils/getObjectMetadataItemsMock';
+import { isDefined } from '~/utils/isDefined';
+
+export const useObjectNameSingularFromPlural = ({
+  objectNamePlural,
+}: {
+  objectNamePlural: string;
+}) => {
+  const currentWorkspace = useRecoilValue(currentWorkspaceState);
+  const mockObjectMetadataItems = getObjectMetadataItemsMock();
+
+  let objectMetadataItem = useRecoilValue(
+    objectMetadataItemFamilySelector({
+      objectName: objectNamePlural,
+      objectNameType: 'plural',
+    }),
+  );
+
+  if (!currentWorkspace) {
+    objectMetadataItem =
+      mockObjectMetadataItems.find(
+        (objectMetadataItem) =>
+          objectMetadataItem.namePlural === objectNamePlural,
+      ) ?? null;
+  }
+
+  if (!isDefined(objectMetadataItem)) {
+    throw new Error(
+      `Object metadata item not found for ${objectNamePlural} object`,
+    );
+  }
+
+  return { objectNameSingular: objectMetadataItem.nameSingular };
+};

front/src/modules/object-metadata/states/objectMetadataItemFamilySelector.ts

@@ -3,27 +3,37 @@ import { selectorFamily } from 'recoil';
 import { objectMetadataItemsState } from '@/object-metadata/states/objectMetadataItemsState';
 import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem';
 
+type ObjectMetadataItemSelector = {
+  objectName: string;
+  objectNameType: 'singular' | 'plural';
+};
+
 export const objectMetadataItemFamilySelector = selectorFamily<
   ObjectMetadataItem | null,
-  { objectNameSingular?: string; objectNamePlural?: string }
+  ObjectMetadataItemSelector
 >({
   key: 'objectMetadataItemFamilySelector',
   get:
-    ({
+    ({ objectNameType, objectName }: ObjectMetadataItemSelector) =>
-      objectNameSingular,
-      objectNamePlural,
-    }: {
-      objectNameSingular?: string;
-      objectNamePlural?: string;
-    }) =>
     ({ get }) => {
       const objectMetadataItems = get(objectMetadataItemsState);
-      return (
+
-        objectMetadataItems.find(
+      if (objectNameType === 'singular') {
-          (objectMetadataItem) =>
+        return (
-            objectMetadataItem.nameSingular === objectNameSingular ||
+          objectMetadataItems.find(
-            objectMetadataItem.namePlural === objectNamePlural,
+            (objectMetadataItem) =>
-        ) ?? null
+              objectMetadataItem.nameSingular === objectName,
-      );
+          ) ?? null
+        );
+      } else if (objectNameType === 'plural') {
+        return (
+          objectMetadataItems.find(
+            (objectMetadataItem) =>
+              objectMetadataItem.namePlural === objectName,
+          ) ?? null
+        );
+      }
+
+      return null;
     },
 });

front/src/modules/object-metadata/types/ObjectMetadataItemIdentifier.ts

@@ -1,4 +1,3 @@
 export type ObjectMetadataItemIdentifier = {
-  objectNamePlural?: string;
+  objectNameSingular: string;
-  objectNameSingular?: string;
 };

front/src/modules/object-record/components/RecordShowPage.tsx

@@ -37,6 +37,10 @@ export const RecordShowPage = () => {
     objectRecordId: string;
   }>();
 
+  if (!objectNameSingular) {
+    throw new Error(`Object name is not defined`);
+  }
+
   const { objectMetadataItem } = useObjectMetadataItem({
     objectNameSingular,
   });
@@ -44,7 +48,7 @@ export const RecordShowPage = () => {
   const { identifiersMapper } = useRelationPicker();
 
   const { favorites, createFavorite, deleteFavorite } = useFavorites({
-    objectNamePlural: objectMetadataItem?.namePlural,
+    objectNamePlural: objectMetadataItem.namePlural,
   });
 
   const [, setEntityFields] = useRecoilState(

front/src/modules/object-record/components/RecordTableContainer.tsx

@@ -2,6 +2,7 @@ import styled from '@emotion/styled';
 
 import { useColumnDefinitionsFromFieldMetadata } from '@/object-metadata/hooks/useColumnDefinitionsFromFieldMetadata';
 import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem';
+import { useObjectNameSingularFromPlural } from '@/object-metadata/hooks/useObjectNameSingularFromPlural';
 import { RecordTable } from '@/ui/object/record-table/components/RecordTable';
 import { TableOptionsDropdownId } from '@/ui/object/record-table/constants/TableOptionsDropdownId';
 import { useRecordTable } from '@/ui/object/record-table/hooks/useRecordTable';
@@ -29,17 +30,19 @@ export const RecordTableContainer = ({
   objectNamePlural: string;
   createRecord: () => void;
 }) => {
-  const { objectMetadataItem: foundObjectMetadataItem } = useObjectMetadataItem(
+  const { objectNameSingular } = useObjectNameSingularFromPlural({
-    {
+    objectNamePlural,
-      objectNamePlural,
+  });
-    },
+
-  );
+  const { objectMetadataItem } = useObjectMetadataItem({
-  const { columnDefinitions } = useColumnDefinitionsFromFieldMetadata(
+    objectNameSingular,
-    foundObjectMetadataItem,
+  });
-  );
+
+  const { columnDefinitions } =
+    useColumnDefinitionsFromFieldMetadata(objectMetadataItem);
 
   const { updateOneRecord } = useUpdateOneRecord({
-    objectNameSingular: foundObjectMetadataItem?.nameSingular,
+    objectNameSingular,
   });
 
   const recordTableId = objectNamePlural ?? '';

front/src/modules/object-record/components/RecordTableEffect.tsx

@@ -2,6 +2,7 @@ import { useEffect } from 'react';
 
 import { useColumnDefinitionsFromFieldMetadata } from '@/object-metadata/hooks/useColumnDefinitionsFromFieldMetadata';
 import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem';
+import { useObjectNameSingularFromPlural } from '@/object-metadata/hooks/useObjectNameSingularFromPlural';
 import { useRecordTableContextMenuEntries } from '@/object-record/hooks/useRecordTableContextMenuEntries';
 import { filterAvailableTableColumns } from '@/object-record/utils/filterAvailableTableColumns';
 import { useRecordTable } from '@/ui/object/record-table/hooks/useRecordTable';
@@ -16,18 +17,23 @@ export const RecordTableEffect = ({
   viewBarId: string;
 }) => {
   const {
+    // Todo: do not infer objectNamePlural from recordTableId
     scopeId: objectNamePlural,
     setAvailableTableColumns,
     setOnEntityCountChange,
     setObjectMetadataConfig,
   } = useRecordTable({ recordTableScopeId: recordTableId });
 
+  const { objectNameSingular } = useObjectNameSingularFromPlural({
+    objectNamePlural,
+  });
+
   const {
     objectMetadataItem,
     basePathToShowPage,
     labelIdentifierFieldMetadataId,
   } = useObjectMetadataItem({
-    objectNamePlural,
+    objectNameSingular,
   });
 
   const { columnDefinitions, filterDefinitions, sortDefinitions } =

front/src/modules/object-record/components/RecordTablePage.tsx

@@ -1,11 +1,11 @@
 import { useEffect } from 'react';
 import { useNavigate, useParams } from 'react-router-dom';
 import styled from '@emotion/styled';
+import { isNonEmptyString } from '@sniptt/guards';
 
 import { useOnboardingStatus } from '@/auth/hooks/useOnboardingStatus';
 import { OnboardingStatus } from '@/auth/utils/getOnboardingStatus';
-import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem';
+import { useObjectNameSingularFromPlural } from '@/object-metadata/hooks/useObjectNameSingularFromPlural';
-import { ObjectMetadataItemIdentifier } from '@/object-metadata/types/ObjectMetadataItemIdentifier';
 import { IconBuildingSkyscraper } from '@/ui/display/icon';
 import { PageAddButton } from '@/ui/layout/page/PageAddButton';
 import { PageBody } from '@/ui/layout/page/PageBody';
@@ -25,18 +25,12 @@ const StyledTableContainer = styled.div`
   width: 100%;
 `;
 
-export type RecordTablePageProps = Pick<
-  ObjectMetadataItemIdentifier,
-  'objectNamePlural'
->;
-
 export const RecordTablePage = () => {
   const objectNamePlural = useParams().objectNamePlural ?? '';
 
-  const { objectMetadataItemNotFound, objectMetadataItem } =
+  const { objectNameSingular } = useObjectNameSingularFromPlural({
-    useObjectMetadataItem({
+    objectNamePlural,
-      objectNamePlural,
+  });
-    });
 
   const onboardingStatus = useOnboardingStatus();
 
@@ -44,15 +38,15 @@ export const RecordTablePage = () => {
 
   useEffect(() => {
     if (
-      objectMetadataItemNotFound &&
+      !isNonEmptyString(objectNamePlural) &&
       onboardingStatus === OnboardingStatus.Completed
     ) {
       navigate('/');
     }
-  }, [objectMetadataItemNotFound, navigate, onboardingStatus]);
+  }, [objectNamePlural, navigate, onboardingStatus]);
 
   const { createOneRecord: createOneObject } = useCreateOneRecord({
-    objectNameSingular: objectMetadataItem?.nameSingular,
+    objectNameSingular,
   });
 
   const handleAddButtonClick = async () => {

front/src/modules/object-record/hooks/useCreateOneRecord.ts

@@ -8,42 +8,39 @@ import { capitalize } from '~/utils/string/capitalize';
 
 export const useCreateOneRecord = <T>({
   objectNameSingular,
-}: Pick<ObjectMetadataItemIdentifier, 'objectNameSingular'>) => {
+}: ObjectMetadataItemIdentifier) => {
   const { triggerOptimisticEffects } = useOptimisticEffect({
     objectNameSingular,
   });
 
-  const {
+  const { objectMetadataItem, createOneRecordMutation } = useObjectMetadataItem(
-    objectMetadataItem,
+    {
-    objectMetadataItemNotFound,
+      objectNameSingular,
-    createOneRecordMutation,
+    },
-  } = useObjectMetadataItem({
+  );
-    objectNameSingular,
-  });
 
   // TODO: type this with a minimal type at least with Record<string, any>
   const [mutate] = useMutation(createOneRecordMutation);
 
   const createOneRecord = async (input: Record<string, any>) => {
-    if (!objectMetadataItem || !objectNameSingular) {
+    const createdObject = await mutate({
-      return null;
-    }
-
-    const createdRecord = await mutate({
       variables: {
         input: { ...input, id: v4() },
       },
     });
 
     triggerOptimisticEffects(
-      `${capitalize(objectNameSingular)}Edge`,
+      `${capitalize(objectMetadataItem.nameSingular)}Edge`,
-      createdRecord.data[`create${capitalize(objectNameSingular)}`],
+      createdObject.data[
+        `create${capitalize(objectMetadataItem.nameSingular)}`
+      ],
     );
-    return createdRecord.data[`create${capitalize(objectNameSingular)}`] as T;
+    return createdObject.data[
+      `create${capitalize(objectMetadataItem.nameSingular)}`
+    ] as T;
   };
 
   return {
     createOneRecord,
-    objectMetadataItemNotFound,
   };
 };

front/src/modules/object-record/hooks/useDeleteOneRecord.ts

@@ -8,41 +8,40 @@ import { capitalize } from '~/utils/string/capitalize';
 
 export const useDeleteOneRecord = <T>({
   objectNameSingular,
-}: Pick<ObjectMetadataItemIdentifier, 'objectNameSingular'>) => {
+}: ObjectMetadataItemIdentifier) => {
   const { performOptimisticEvict } = useOptimisticEvict();
 
-  const {
+  const { objectMetadataItem, deleteOneRecordMutation } = useObjectMetadataItem(
-    objectMetadataItem,
+    {
-    objectMetadataItemNotFound,
+      objectNameSingular,
-    deleteOneRecordMutation,
+    },
-  } = useObjectMetadataItem({
+  );
-    objectNameSingular,
-  });
 
   // TODO: type this with a minimal type at least with Record<string, any>
   const [mutate] = useMutation(deleteOneRecordMutation);
 
   const deleteOneRecord = useCallback(
     async (idToDelete: string) => {
-      if (!objectMetadataItem || !objectNameSingular) {
-        return null;
-      }
-
       const deletedRecord = await mutate({
         variables: {
           idToDelete,
         },
       });
 
-      performOptimisticEvict(capitalize(objectNameSingular), 'id', idToDelete);
+      performOptimisticEvict(
+        capitalize(objectMetadataItem.nameSingular),
+        'id',
+        idToDelete,
+      );
 
-      return deletedRecord.data[`create${capitalize(objectNameSingular)}`] as T;
+      return deletedRecord.data[
+        `create${capitalize(objectMetadataItem.nameSingular)}`
+      ] as T;
     },
-    [performOptimisticEvict, objectMetadataItem, mutate, objectNameSingular],
+    [performOptimisticEvict, objectMetadataItem, mutate],
   );
 
   return {
     deleteOneRecord,
-    objectMetadataItemNotFound,
   };
 };

front/src/modules/object-record/hooks/useFindManyRecords.ts

@@ -2,9 +2,10 @@ import { useCallback, useMemo } from 'react';
 import { useQuery } from '@apollo/client';
 import { isNonEmptyArray } from '@apollo/client/utilities';
 import { isNonEmptyString } from '@sniptt/guards';
-import { useRecoilState } from 'recoil';
+import { useRecoilState, useRecoilValue } from 'recoil';
 
 import { useOptimisticEffect } from '@/apollo/optimistic-effect/hooks/useOptimisticEffect';
+import { currentWorkspaceState } from '@/auth/states/currentWorkspaceState';
 import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem';
 import { ObjectMetadataItemIdentifier } from '@/object-metadata/types/ObjectMetadataItemIdentifier';
 import { getRecordOptimisticEffectDefinition } from '@/object-record/graphql/optimistic-effect-definition/getRecordOptimisticEffectDefinition';
@@ -27,13 +28,13 @@ import { mapPaginatedRecordsToRecords } from '../utils/mapPaginatedRecordsToReco
 export const useFindManyRecords = <
   RecordType extends { id: string } & Record<string, any>,
 >({
-  objectNamePlural,
+  objectNameSingular,
   filter,
   orderBy,
   limit = DEFAULT_SEARCH_REQUEST_LIMIT,
   onCompleted,
   skip,
-}: Pick<ObjectMetadataItemIdentifier, 'objectNamePlural'> & {
+}: ObjectMetadataItemIdentifier & {
   filter?: any;
   orderBy?: any;
   limit?: number;
@@ -41,7 +42,10 @@ export const useFindManyRecords = <
   skip?: boolean;
 }) => {
   const findManyQueryStateIdentifier =
-    objectNamePlural + JSON.stringify(filter) + JSON.stringify(orderBy) + limit;
+    objectNameSingular +
+    JSON.stringify(filter) +
+    JSON.stringify(orderBy) +
+    limit;
 
   const [lastCursor, setLastCursor] = useRecoilState(
     cursorFamilyState(findManyQueryStateIdentifier),
@@ -55,24 +59,21 @@ export const useFindManyRecords = <
     isFetchingMoreRecordsFamilyState(findManyQueryStateIdentifier),
   );
 
-  const {
+  const { objectMetadataItem, findManyRecordsQuery } = useObjectMetadataItem({
-    objectMetadataItem,
+    objectNameSingular,
-    objectMetadataItemNotFound,
-    findManyRecordsQuery,
-  } = useObjectMetadataItem({
-    objectNamePlural,
   });
 
   const { registerOptimisticEffect } = useOptimisticEffect({
-    objectNameSingular: objectMetadataItem?.nameSingular,
+    objectNameSingular,
   });
 
   const { enqueueSnackBar } = useSnackBar();
+  const currentWorkspace = useRecoilValue(currentWorkspaceState);
 
   const { data, loading, error, fetchMore } = useQuery<
     PaginatedRecordType<RecordType>
   >(findManyRecordsQuery, {
-    skip: skip || !objectMetadataItem || !objectNamePlural,
+    skip: skip || !objectMetadataItem || !currentWorkspace,
     variables: {
       filter: filter ?? {},
       limit: limit,
@@ -92,21 +93,24 @@ export const useFindManyRecords = <
         });
       }
 
-      if (objectNamePlural) {
+      onCompleted?.(data[objectMetadataItem.namePlural]);
-        onCompleted?.(data[objectNamePlural]);
 
-        if (objectNamePlural && data?.[objectNamePlural]) {
+      if (data?.[objectMetadataItem.namePlural]) {
-          setLastCursor(data?.[objectNamePlural]?.pageInfo.endCursor);
+        setLastCursor(
-          setHasNextPage(data?.[objectNamePlural]?.pageInfo.hasNextPage);
+          data?.[objectMetadataItem.namePlural]?.pageInfo.endCursor,
-        }
+        );
+        setHasNextPage(
+          data?.[objectMetadataItem.namePlural]?.pageInfo.hasNextPage,
+        );
       }
     },
     onError: (error) => {
       logError(
-        `useFindManyObjectRecords for "${objectNamePlural}" error : ` + error,
+        `useFindManyRecords for "${objectMetadataItem.namePlural}" error : ` +
+          error,
       );
       enqueueSnackBar(
-        `Error during useFindManyObjectRecords for "${objectNamePlural}", ${error.message}`,
+        `Error during useFindManyRecords for "${objectMetadataItem.namePlural}", ${error.message}`,
         {
           variant: 'error',
         },
@@ -115,7 +119,7 @@ export const useFindManyRecords = <
   });
 
   const fetchMoreRecords = useCallback(async () => {
-    if (objectNamePlural && hasNextPage) {
+    if (hasNextPage) {
       setIsFetchingMoreObjects(true);
 
       try {
@@ -126,33 +130,38 @@ export const useFindManyRecords = <
             lastCursor: isNonEmptyString(lastCursor) ? lastCursor : undefined,
           },
           updateQuery: (prev, { fetchMoreResult }) => {
-            const previousEdges = prev?.[objectNamePlural]?.edges;
+            const previousEdges = prev?.[objectMetadataItem.namePlural]?.edges;
-            const nextEdges = fetchMoreResult?.[objectNamePlural]?.edges;
+            const nextEdges =
+              fetchMoreResult?.[objectMetadataItem.namePlural]?.edges;
 
             let newEdges: PaginatedRecordTypeEdge<RecordType>[] = [];
 
             if (isNonEmptyArray(previousEdges) && isNonEmptyArray(nextEdges)) {
               newEdges = filterUniqueRecordEdgesByCursor([
-                ...prev?.[objectNamePlural]?.edges,
+                ...prev?.[objectMetadataItem.namePlural]?.edges,
-                ...fetchMoreResult?.[objectNamePlural]?.edges,
+                ...fetchMoreResult?.[objectMetadataItem.namePlural]?.edges,
               ]);
             }
 
             return Object.assign({}, prev, {
-              [objectNamePlural]: {
+              [objectMetadataItem.namePlural]: {
                 __typename: `${capitalize(
-                  objectMetadataItem?.nameSingular ?? '',
+                  objectMetadataItem.nameSingular,
                 )}Connection`,
                 edges: newEdges,
-                pageInfo: fetchMoreResult?.[objectNamePlural].pageInfo,
+                pageInfo:
+                  fetchMoreResult?.[objectMetadataItem.namePlural].pageInfo,
               },
             } as PaginatedRecordType<RecordType>);
           },
         });
       } catch (error) {
-        logError(`fetchMoreObjects for "${objectNamePlural}" error : ` + error);
+        logError(
+          `fetchMoreObjects for "${objectMetadataItem.namePlural}" error : ` +
+            error,
+        );
         enqueueSnackBar(
-          `Error during fetchMoreObjects for "${objectNamePlural}", ${error}`,
+          `Error during fetchMoreObjects for "${objectMetadataItem.namePlural}", ${error}`,
           {
             variant: 'error',
           },
@@ -162,7 +171,6 @@ export const useFindManyRecords = <
       }
     }
   }, [
-    objectNamePlural,
     lastCursor,
     fetchMore,
     filter,
@@ -175,13 +183,11 @@ export const useFindManyRecords = <
 
   const records = useMemo(
     () =>
-      objectNamePlural
+      mapPaginatedRecordsToRecords({
-        ? mapPaginatedRecordsToRecords({
+        pagedRecords: data,
-            pagedRecords: data,
+        objectNamePlural: objectMetadataItem.namePlural,
-            objectNamePlural,
+      }),
-          })
+    [data, objectMetadataItem],
-        : [],
-    [data, objectNamePlural],
   );
 
   return {
@@ -189,7 +195,6 @@ export const useFindManyRecords = <
     records,
     loading,
     error,
-    objectMetadataItemNotFound,
     fetchMoreRecords,
   };
 };

front/src/modules/object-record/hooks/useFindOneRecord.ts

@@ -11,19 +11,18 @@ export const useFindOneRecord = <
   onCompleted,
   depth,
   skip,
-}: Pick<ObjectMetadataItemIdentifier, 'objectNameSingular'> & {
+}: ObjectMetadataItemIdentifier & {
   objectRecordId: string | undefined;
   onCompleted?: (data: ObjectType) => void;
   skip?: boolean;
   depth?: number;
 }) => {
-  const { objectMetadataItem, objectMetadataItemNotFound, findOneRecordQuery } =
+  const { objectMetadataItem, findOneRecordQuery } = useObjectMetadataItem(
-    useObjectMetadataItem(
+    {
-      {
+      objectNameSingular,
-        objectNameSingular,
+    },
-      },
+    depth,
-      depth,
+  );
-    );
 
   const { data, loading, error } = useQuery<
     { [nameSingular: string]: ObjectType },
@@ -34,19 +33,17 @@ export const useFindOneRecord = <
       objectRecordId: objectRecordId ?? '',
     },
     onCompleted: (data) => {
-      if (onCompleted && objectNameSingular) {
+      if (onCompleted) {
         onCompleted(data[objectNameSingular]);
       }
     },
   });
 
-  const record =
+  const record = data ? data[objectNameSingular] : undefined;
-    objectNameSingular && data ? data[objectNameSingular] : undefined;
 
   return {
     record,
     loading,
     error,
-    objectMetadataItemNotFound,
   };
 };

front/src/modules/object-record/hooks/useGenerateCreateOneRecordMutation.ts

@@ -8,7 +8,7 @@ import { capitalize } from '~/utils/string/capitalize';
 export const useGenerateCreateOneRecordMutation = ({
   objectMetadataItem,
 }: {
-  objectMetadataItem: ObjectMetadataItem | undefined | null;
+  objectMetadataItem: ObjectMetadataItem;
 }) => {
   const mapFieldMetadataToGraphQLQuery = useMapFieldMetadataToGraphQLQuery();
 

front/src/modules/object-record/hooks/useGenerateFindManyRecordsQuery.ts

@@ -9,7 +9,7 @@ export const useGenerateFindManyRecordsQuery = ({
   objectMetadataItem,
   depth,
 }: {
-  objectMetadataItem: ObjectMetadataItem | undefined | null;
+  objectMetadataItem: ObjectMetadataItem;
   depth?: number;
 }) => {
   const mapFieldMetadataToGraphQLQuery = useMapFieldMetadataToGraphQLQuery();

front/src/modules/object-record/hooks/useGenerateFindOneRecordQuery.ts

@@ -8,7 +8,7 @@ export const useGenerateFindOneRecordQuery = ({
   objectMetadataItem,
   depth,
 }: {
-  objectMetadataItem: ObjectMetadataItem | null | undefined;
+  objectMetadataItem: ObjectMetadataItem;
   depth?: number;
 }) => {
   const mapFieldMetadataToGraphQLQuery = useMapFieldMetadataToGraphQLQuery();

front/src/modules/object-record/hooks/useGenerateUpdateOneRecordMutation.ts

@@ -16,7 +16,7 @@ export const getUpdateOneRecordMutationGraphQLField = ({
 export const useGenerateUpdateOneRecordMutation = ({
   objectMetadataItem,
 }: {
-  objectMetadataItem: ObjectMetadataItem | undefined | null;
+  objectMetadataItem: ObjectMetadataItem;
 }) => {
   const mapFieldMetadataToGraphQLQuery = useMapFieldMetadataToGraphQLQuery();
 

front/src/modules/object-record/hooks/useGetRecordFromCache.ts

@@ -8,7 +8,7 @@ import { capitalize } from '~/utils/string/capitalize';
 export const useGetRecordFromCache = ({
   objectMetadataItem,
 }: {
-  objectMetadataItem: ObjectMetadataItem | undefined | null;
+  objectMetadataItem: ObjectMetadataItem;
 }) => {
   const mapFieldMetadataToGraphQLQuery = useMapFieldMetadataToGraphQLQuery();
   const apolloClient = useApolloClient();
@@ -31,7 +31,7 @@ export const useGetRecordFromCache = ({
 
     const cache = apolloClient.cache;
     const cachedRecordId = cache.identify({
-      __typename: capitalize(objectMetadataItem?.nameSingular ?? ''),
+      __typename: capitalize(objectMetadataItem.nameSingular),
       id: recordId,
     });
 

front/src/modules/object-record/hooks/useModifyRecordFromCache.ts

@@ -8,7 +8,7 @@ import { capitalize } from '~/utils/string/capitalize';
 export const useModifyRecordFromCache = ({
   objectMetadataItem,
 }: {
-  objectMetadataItem: ObjectMetadataItem | undefined | null;
+  objectMetadataItem: ObjectMetadataItem;
 }) => {
   const apolloClient = useApolloClient();
 
@@ -19,7 +19,7 @@ export const useModifyRecordFromCache = ({
 
     const cache = apolloClient.cache;
     const cachedRecordId = cache.identify({
-      __typename: capitalize(objectMetadataItem?.nameSingular ?? ''),
+      __typename: capitalize(objectMetadataItem.nameSingular),
       id: recordId,
     });
 

front/src/modules/object-record/hooks/useObjectRecordTable.ts

@@ -2,6 +2,7 @@ import { useRecoilValue } from 'recoil';
 
 import { useOptimisticEffect } from '@/apollo/optimistic-effect/hooks/useOptimisticEffect';
 import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem';
+import { useObjectNameSingularFromPlural } from '@/object-metadata/hooks/useObjectNameSingularFromPlural';
 import { turnFiltersIntoWhereClause } from '@/ui/object/object-filter-dropdown/utils/turnFiltersIntoWhereClause';
 import { turnSortsIntoOrderBy } from '@/ui/object/object-sort-dropdown/utils/turnSortsIntoOrderBy';
 import { useRecordTableScopedStates } from '@/ui/object/record-table/hooks/internal/useRecordTableScopedStates';
@@ -14,14 +15,18 @@ import { useFindManyRecords } from './useFindManyRecords';
 export const useObjectRecordTable = () => {
   const { scopeId: objectNamePlural, setRecordTableData } = useRecordTable();
 
+  const { objectNameSingular } = useObjectNameSingularFromPlural({
+    objectNamePlural,
+  });
+
   const { objectMetadataItem: foundObjectMetadataItem } = useObjectMetadataItem(
     {
-      objectNamePlural,
+      objectNameSingular,
     },
   );
 
   const { registerOptimisticEffect } = useOptimisticEffect({
-    objectNameSingular: foundObjectMetadataItem?.nameSingular,
+    objectNameSingular,
   });
 
   const { tableFiltersState, tableSortsState } = useRecordTableScopedStates();
@@ -39,7 +44,7 @@ export const useObjectRecordTable = () => {
   );
 
   const { records, loading, fetchMoreRecords } = useFindManyRecords({
-    objectNamePlural,
+    objectNameSingular,
     filter,
     orderBy,
     onCompleted: (data) => {

front/src/modules/object-record/hooks/useRecordTableContextMenuEntries.tsx

@@ -3,7 +3,7 @@ import { isNonEmptyString } from '@sniptt/guards';
 import { useRecoilCallback, useRecoilValue, useSetRecoilState } from 'recoil';
 
 import { useFavorites } from '@/favorites/hooks/useFavorites';
-import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem';
+import { useObjectNameSingularFromPlural } from '@/object-metadata/hooks/useObjectNameSingularFromPlural';
 import { useDeleteOneRecord } from '@/object-record/hooks/useDeleteOneRecord';
 import { IconHeart, IconHeartOff, IconTrash } from '@/ui/display/icon';
 import { actionBarEntriesState } from '@/ui/navigation/action-bar/states/actionBarEntriesState';
@@ -38,7 +38,7 @@ export const useRecordTableContextMenuEntries = (
     recordTableScopeId: scopeId,
   });
 
-  const { objectMetadataItem } = useObjectMetadataItem({
+  const { objectNameSingular } = useObjectNameSingularFromPlural({
     objectNamePlural,
   });
 
@@ -67,7 +67,7 @@ export const useRecordTableContextMenuEntries = (
   });
 
   const { deleteOneRecord } = useDeleteOneRecord({
-    objectNameSingular: objectMetadataItem?.nameSingular,
+    objectNameSingular,
   });
 
   const handleDeleteClick = useRecoilCallback(({ snapshot }) => async () => {

front/src/modules/object-record/hooks/useUpdateOneRecord.ts

@@ -7,10 +7,9 @@ import { capitalize } from '~/utils/string/capitalize';
 
 export const useUpdateOneRecord = <T>({
   objectNameSingular,
-}: Pick<ObjectMetadataItemIdentifier, 'objectNameSingular'>) => {
+}: ObjectMetadataItemIdentifier) => {
   const {
     objectMetadataItem,
-    objectMetadataItemNotFound,
     updateOneRecordMutation,
     getRecordFromCache,
     findManyRecordsQuery,
@@ -29,10 +28,6 @@ export const useUpdateOneRecord = <T>({
     input: Record<string, any>;
     forceRefetch?: boolean;
   }) => {
-    if (!objectMetadataItem || !objectNameSingular) {
-      return null;
-    }
-
     const cachedRecord = getRecordFromCache(idToUpdate);
 
     const updatedRecord = await mutateUpdateOneRecord({
@@ -43,7 +38,7 @@ export const useUpdateOneRecord = <T>({
         },
       },
       optimisticResponse: {
-        [`update${capitalize(objectNameSingular)}`]: {
+        [`update${capitalize(objectMetadataItem.nameSingular)}`]: {
           ...(cachedRecord ?? {}),
           ...input,
         },
@@ -54,11 +49,12 @@ export const useUpdateOneRecord = <T>({
       awaitRefetchQueries: forceRefetch,
     });
 
-    return updatedRecord.data[`update${capitalize(objectNameSingular)}`] as T;
+    return updatedRecord.data[
+      `update${capitalize(objectMetadataItem.nameSingular)}`
+    ] as T;
   };
 
   return {
     updateOneRecord,
-    objectMetadataItemNotFound,
   };
 };

front/src/modules/object-record/types/PaginatedRecordTypeResults.ts

@@ -1,9 +1,13 @@
-export type PaginatedRecordTypeEdge<RecordType extends { id: string }> = {
+export type PaginatedRecordTypeEdge<
+  RecordType extends { id: string } & Record<string, any>,
+> = {
   node: RecordType;
   cursor: string;
 };
 
-export type PaginatedRecordTypeResults<RecordType extends { id: string }> = {
+export type PaginatedRecordTypeResults<
+  RecordType extends { id: string } & Record<string, any>,
+> = {
   __typename?: string;
   edges: PaginatedRecordTypeEdge<RecordType>[];
   pageInfo: {

front/src/modules/object-record/utils/generateDeleteOneRecordMutation.ts

@@ -7,13 +7,13 @@ import { capitalize } from '~/utils/string/capitalize';
 export const generateDeleteOneRecordMutation = ({
   objectMetadataItem,
 }: {
-  objectMetadataItem: ObjectMetadataItem | undefined | null;
+  objectMetadataItem: ObjectMetadataItem;
 }) => {
   if (!objectMetadataItem) {
     return EMPTY_MUTATION;
   }
 
-  const capitalizedObjectName = capitalize(objectMetadataItem?.nameSingular);
+  const capitalizedObjectName = capitalize(objectMetadataItem.nameSingular);
 
   return gql`
     mutation DeleteOne${capitalizedObjectName}($idToDelete: ID!)  {

front/src/modules/people/components/PeopleCard.tsx

@@ -107,7 +107,6 @@ export const PeopleCard = ({
     setIsOptionsOpen(!isOptionsOpen);
   };
 
-  // TODO: refactor with useObjectMetadataItem V2 with typed hooks
   const {
     findManyRecordsQuery,
     updateOneRecordMutation,

front/src/modules/search/hooks/useFilteredSearchEntityQuery.ts

@@ -1,6 +1,7 @@
 import { QueryHookOptions, QueryResult } from '@apollo/client';
 import { isNonEmptyString } from '@sniptt/guards';
 
+import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem';
 import { mapPaginatedRecordsToRecords } from '@/object-record/utils/mapPaginatedRecordsToRecords';
 import { EntitiesForMultipleEntitySelect } from '@/ui/input/relation-picker/components/MultipleEntitySelect';
 import { EntityForSelect } from '@/ui/input/relation-picker/types/EntityForSelect';
@@ -30,7 +31,7 @@ export const useFilteredSearchEntityQuery = ({
   mappingFunction,
   limit,
   excludeEntityIds = [],
-  objectNamePlural,
+  objectNameSingular,
 }: {
   queryHook: (
     queryOptions?: QueryHookOptions<any, any>,
@@ -42,8 +43,12 @@ export const useFilteredSearchEntityQuery = ({
   mappingFunction: (entity: any) => EntityForSelect | undefined;
   limit?: number;
   excludeEntityIds?: string[];
-  objectNamePlural: string;
+  objectNameSingular: string;
 }): EntitiesForMultipleEntitySelect<EntityForSelect> => {
+  const { objectMetadataItem } = useObjectMetadataItem({
+    objectNameSingular,
+  });
+
   const { loading: selectedEntitiesLoading, data: selectedEntitiesData } =
     queryHook({
       variables: {
@@ -138,19 +143,19 @@ export const useFilteredSearchEntityQuery = ({
 
   return {
     selectedEntities: mapPaginatedRecordsToRecords({
-      objectNamePlural: objectNamePlural,
+      objectNamePlural: objectMetadataItem.namePlural,
       pagedRecords: selectedEntitiesData,
     })
       .map(mappingFunction)
       .filter(assertNotNull),
     filteredSelectedEntities: mapPaginatedRecordsToRecords({
-      objectNamePlural: objectNamePlural,
+      objectNamePlural: objectMetadataItem.namePlural,
       pagedRecords: filteredSelectedEntitiesData,
     })
       .map(mappingFunction)
       .filter(assertNotNull),
     entitiesToSelect: mapPaginatedRecordsToRecords({
-      objectNamePlural: objectNamePlural,
+      objectNamePlural: objectMetadataItem.namePlural,
       pagedRecords: entitiesToSelectData,
     })
       .map(mappingFunction)

front/src/modules/settings/data-model/hooks/useFieldPreview.ts

@@ -31,7 +31,7 @@ export const useFieldPreview = ({
 
   const { value: firstRecordFieldValue } = useFieldPreviewValue({
     fieldName: fieldName || '',
-    objectNamePlural: objectMetadataItem?.namePlural || '',
+    objectNamePlural: objectMetadataItem?.namePlural ?? '',
     skip:
       !fieldName ||
       !objectMetadataItem ||

front/src/modules/settings/data-model/hooks/useFieldPreviewValue.ts

@@ -1,3 +1,4 @@
+import { useObjectNameSingularFromPlural } from '@/object-metadata/hooks/useObjectNameSingularFromPlural';
 import { useFindManyRecords } from '@/object-record/hooks/useFindManyRecords';
 import { assertNotNull } from '~/utils/assert';
 
@@ -10,8 +11,12 @@ export const useFieldPreviewValue = ({
   objectNamePlural: string;
   skip?: boolean;
 }) => {
-  const { records } = useFindManyRecords({
+  const { objectNameSingular } = useObjectNameSingularFromPlural({
     objectNamePlural,
+  });
+
+  const { records } = useFindManyRecords({
+    objectNameSingular,
     skip,
   });
 

front/src/modules/settings/data-model/hooks/useRelationFieldPreviewValue.ts

@@ -10,12 +10,13 @@ export const useRelationFieldPreviewValue = ({
 }) => {
   const { findObjectMetadataItemById } = useObjectMetadataItemForSettings();
 
+  // TODO: make this impossible to be undefined
   const relationObjectMetadataItem = relationObjectMetadataId
     ? findObjectMetadataItemById(relationObjectMetadataId)
     : undefined;
 
   const { records: relationObjects } = useFindManyRecords({
-    objectNamePlural: relationObjectMetadataItem?.namePlural,
+    objectNameSingular: relationObjectMetadataItem?.nameSingular ?? '',
     skip: skip || !relationObjectMetadataItem,
   });
 

front/src/modules/settings/data-model/object-details/components/SettingsObjectItemTableRow.tsx

@@ -37,7 +37,7 @@ export const SettingsObjectItemTableRow = ({
   const theme = useTheme();
 
   const { records } = useFindManyRecords({
-    objectNamePlural: objectItem.namePlural,
+    objectNameSingular: objectItem.nameSingular,
   });
 
   const { Icon } = useLazyLoadIcon(objectItem.icon ?? '');

front/src/modules/settings/profile/components/NameFields.tsx

@@ -40,7 +40,7 @@ export const NameFields = ({
     currentWorkspaceMember?.name?.lastName ?? '',
   );
 
-  const { updateOneRecord, objectMetadataItemNotFound } = useUpdateOneRecord({
+  const { updateOneRecord } = useUpdateOneRecord({
     objectNameSingular: 'workspaceMember',
   });
 
@@ -58,9 +58,6 @@ export const NameFields = ({
       }
 
       if (autoSave) {
-        if (!updateOneRecord || objectMetadataItemNotFound) {
-          throw new Error('Object not found in metadata');
-        }
         await updateOneRecord({
           idToUpdate: currentWorkspaceMember?.id,
           input: {

front/src/modules/settings/profile/components/ProfilePictureUploader.tsx

@@ -19,7 +19,7 @@ export const ProfilePictureUploader = () => {
     useState<AbortController | null>(null);
   const [errorMessage, setErrorMessage] = useState<string | null>(null);
 
-  const { updateOneRecord, objectMetadataItemNotFound } = useUpdateOneRecord({
+  const { updateOneRecord } = useUpdateOneRecord({
     objectNameSingular: 'workspaceMember',
   });
 
@@ -54,9 +54,7 @@ export const ProfilePictureUploader = () => {
       if (!avatarUrl) {
         throw new Error('Avatar URL not found');
       }
-      if (!updateOneRecord || objectMetadataItemNotFound) {
+
-        throw new Error('Object not found in metadata');
-      }
       await updateOneRecord({
         idToUpdate: currentWorkspaceMember?.id,
         input: {
@@ -80,12 +78,10 @@ export const ProfilePictureUploader = () => {
   };
 
   const handleRemove = async () => {
-    if (!updateOneRecord || objectMetadataItemNotFound) {
-      throw new Error('Object not found in metadata');
-    }
     if (!currentWorkspaceMember?.id) {
       throw new Error('User is not logged in');
     }
+
     await updateOneRecord({
       idToUpdate: currentWorkspaceMember?.id,
       input: {

front/src/modules/sign-in-background-mock/components/SignInBackgroundMockContainer.tsx

@@ -14,8 +14,8 @@ const StyledContainer = styled.div`
 `;
 
 export const SignInBackgroundMockContainer = () => {
-  const recordTableId = 'sign-in-background-mock-table';
+  const recordTableId = 'companies';
-  const viewBarId = 'sign-in-background-mock-view';
+  const viewBarId = 'companies-mock';
 
   return (
     <StyledContainer>

front/src/modules/sign-in-background-mock/components/SignInBackgroundMockContainerEffect.tsx

@@ -1,6 +1,7 @@
 import { useEffect } from 'react';
 
 import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem';
+import { useObjectNameSingularFromPlural } from '@/object-metadata/hooks/useObjectNameSingularFromPlural';
 import { useRecordTableContextMenuEntries } from '@/object-record/hooks/useRecordTableContextMenuEntries';
 import { filterAvailableTableColumns } from '@/object-record/utils/filterAvailableTableColumns';
 import { signInBackgroundMockCompanies } from '@/sign-in-background-mock/constants/signInBackgroundMockCompanies';
@@ -35,10 +36,14 @@ export const SignInBackgroundMockContainerEffect = ({
     recordTableScopeId: recordTableId,
   });
 
-  const { objectMetadataItem } = useObjectMetadataItem({
+  const { objectNameSingular } = useObjectNameSingularFromPlural({
     objectNamePlural,
   });
 
+  const { objectMetadataItem } = useObjectMetadataItem({
+    objectNameSingular,
+  });
+
   const {
     setAvailableSortDefinitions,
     setAvailableFilterDefinitions,
@@ -49,7 +54,7 @@ export const SignInBackgroundMockContainerEffect = ({
   } = useViewBar({ viewBarId: viewId });
 
   useEffect(() => {
-    setViewObjectMetadataId?.('company-mock-object-metadata-id');
+    setViewObjectMetadataId?.(objectMetadataItem.id);
     setViewType?.(ViewType.Table);
 
     setAvailableSortDefinitions?.(signInBackgroundMockSortDefinitions);

front/src/modules/sign-in-background-mock/constants/signInBackgroundMockMetadataItems.ts

@@ -1,400 +0,0 @@
-export const metadataItem = {
-  __typename: 'object',
-  id: '20202020-480c-434e-b4c7-e22408b97047',
-  dataSourceId: '20202020-7f63-47a9-b1b3-6c7290ca9fb1',
-  nameSingular: 'company',
-  namePlural: 'companies',
-  labelSingular: 'Company',
-  labelPlural: 'Companies',
-  description: 'A company',
-  icon: 'IconBuildingSkyscraper',
-  isCustom: false,
-  isActive: true,
-  isSystem: false,
-  createdAt: '2023-11-23T15:38:02.187Z',
-  updatedAt: '2023-11-23T15:38:02.187Z',
-  fields: [
-    {
-      __typename: 'field',
-      id: '20202020-5e4e-4007-a630-8a2617914889',
-      type: 'TEXT',
-      name: 'domainName',
-      label: 'Domain Name',
-      description:
-        'The company website URL. We use this url to fetch the company icon',
-      icon: 'IconLink',
-      isCustom: false,
-      isActive: true,
-      isSystem: false,
-      isNullable: true,
-      createdAt: '2023-11-23T15:38:02.292Z',
-      updatedAt: '2023-11-23T15:38:02.292Z',
-      fromRelationMetadata: null,
-      toRelationMetadata: null,
-    },
-    {
-      __typename: 'field',
-      id: '20202020-64b8-41bf-a01c-be6a806e8b70',
-      type: 'DATE_TIME',
-      name: 'updatedAt',
-      label: 'Update date',
-      description: null,
-      icon: 'IconCalendar',
-      isCustom: false,
-      isActive: true,
-      isSystem: true,
-      isNullable: false,
-      createdAt: '2023-11-23T15:38:02.292Z',
-      updatedAt: '2023-11-23T15:38:02.292Z',
-      fromRelationMetadata: null,
-      toRelationMetadata: null,
-    },
-    {
-      __typename: 'field',
-      id: '20202020-7fbd-41ad-b64d-25a15ff62f04',
-      type: 'NUMBER',
-      name: 'employees',
-      label: 'Employees',
-      description: 'Number of employees in the company',
-      icon: 'IconUsers',
-      isCustom: false,
-      isActive: true,
-      isSystem: false,
-      isNullable: true,
-      createdAt: '2023-11-23T15:38:02.292Z',
-      updatedAt: '2023-11-23T15:38:02.292Z',
-      fromRelationMetadata: null,
-      toRelationMetadata: null,
-    },
-    {
-      __typename: 'field',
-      id: '20202020-6d30-4111-9f40-b4301906fd3c',
-      type: 'TEXT',
-      name: 'name',
-      label: 'Name',
-      description: 'The company name',
-      icon: 'IconBuildingSkyscraper',
-      isCustom: false,
-      isActive: true,
-      isSystem: false,
-      isNullable: true,
-      createdAt: '2023-11-23T15:38:02.292Z',
-      updatedAt: '2023-11-23T15:38:02.292Z',
-      fromRelationMetadata: null,
-      toRelationMetadata: null,
-    },
-    {
-      __typename: 'field',
-      id: '20202020-e7c8-4771-8cc4-ce0e8c36a3c0',
-      type: 'RELATION',
-      name: 'favorites',
-      label: 'Favorites',
-      description: 'Favorites linked to the company',
-      icon: 'IconHeart',
-      isCustom: false,
-      isActive: true,
-      isSystem: false,
-      isNullable: true,
-      createdAt: '2023-11-23T15:38:02.292Z',
-      updatedAt: '2023-11-23T15:38:02.292Z',
-      fromRelationMetadata: {
-        __typename: 'relation',
-        id: '73d9610a-a196-4186-b5b2-9a1da2d3bede',
-        relationType: 'ONE_TO_MANY',
-        toObjectMetadata: {
-          __typename: 'object',
-          id: '20202020-90e4-4701-a350-8ab75e23e3b8',
-          dataSourceId: '20202020-7f63-47a9-b1b3-6c7290ca9fb1',
-          nameSingular: 'favorite',
-          namePlural: 'favorites',
-        },
-        toFieldMetadataId: '20202020-09e1-4384-ae3e-39e7956396ff',
-      },
-      toRelationMetadata: null,
-    },
-    {
-      __typename: 'field',
-      id: '20202020-ad10-4117-a039-3f04b7a5f939',
-      type: 'TEXT',
-      name: 'address',
-      label: 'Address',
-      description: 'The company address',
-      icon: 'IconMap',
-      isCustom: false,
-      isActive: true,
-      isSystem: false,
-      isNullable: true,
-      createdAt: '2023-11-23T15:38:02.292Z',
-      updatedAt: '2023-11-23T15:38:02.292Z',
-      fromRelationMetadata: null,
-      toRelationMetadata: null,
-    },
-    {
-      __typename: 'field',
-      id: '20202020-0739-495d-8e70-c0807f6b2268',
-      type: 'RELATION',
-      name: 'accountOwner',
-      label: 'Account Owner',
-      description:
-        'Your team member responsible for managing the company account',
-      icon: 'IconUserCircle',
-      isCustom: false,
-      isActive: true,
-      isSystem: false,
-      isNullable: true,
-      createdAt: '2023-11-23T15:38:02.292Z',
-      updatedAt: '2023-11-23T15:38:02.292Z',
-      fromRelationMetadata: null,
-      toRelationMetadata: {
-        __typename: 'relation',
-        id: '729283e1-8134-494d-9df5-24a44e92c38b',
-        relationType: 'ONE_TO_MANY',
-        fromObjectMetadata: {
-          __typename: 'object',
-          id: '20202020-b550-40bb-a96b-9ab54b664753',
-          dataSourceId: '20202020-7f63-47a9-b1b3-6c7290ca9fb1',
-          nameSingular: 'workspaceMember',
-          namePlural: 'workspaceMembers',
-        },
-        fromFieldMetadataId: '20202020-41bb-4c17-8979-40fa915df9e1',
-      },
-    },
-    {
-      __typename: 'field',
-      id: '20202020-68b4-4c8e-af19-738eba2a42a5',
-      type: 'RELATION',
-      name: 'people',
-      label: 'People',
-      description: 'People linked to the company.',
-      icon: 'IconUsers',
-      isCustom: false,
-      isActive: true,
-      isSystem: false,
-      isNullable: true,
-      createdAt: '2023-11-23T15:38:02.292Z',
-      updatedAt: '2023-11-23T15:38:02.292Z',
-      fromRelationMetadata: {
-        __typename: 'relation',
-        id: '8256c11a-710d-48b5-bc86-f607895abec4',
-        relationType: 'ONE_TO_MANY',
-        toObjectMetadata: {
-          __typename: 'object',
-          id: '20202020-c64b-44bc-bd2c-502c99f49dca',
-          dataSourceId: '20202020-7f63-47a9-b1b3-6c7290ca9fb1',
-          nameSingular: 'person',
-          namePlural: 'people',
-        },
-        toFieldMetadataId: '20202020-64e1-4080-b6ad-db03c3809885',
-      },
-      toRelationMetadata: null,
-    },
-    {
-      __typename: 'field',
-      id: '20202020-61af-4ffd-b79b-baed6db8ad11',
-      type: 'RELATION',
-      name: 'attachments',
-      label: 'Attachments',
-      description: 'Attachments linked to the company.',
-      icon: 'IconFileImport',
-      isCustom: false,
-      isActive: true,
-      isSystem: false,
-      isNullable: true,
-      createdAt: '2023-11-23T15:38:02.292Z',
-      updatedAt: '2023-11-23T15:38:02.292Z',
-      fromRelationMetadata: {
-        __typename: 'relation',
-        id: '54c7c707-09f8-4ce0-b2f6-0161443fffa8',
-        relationType: 'ONE_TO_MANY',
-        toObjectMetadata: {
-          __typename: 'object',
-          id: '20202020-5f98-4317-915d-3779bb821be2',
-          dataSourceId: '20202020-7f63-47a9-b1b3-6c7290ca9fb1',
-          nameSingular: 'attachment',
-          namePlural: 'attachments',
-        },
-        toFieldMetadataId: '20202020-5463-4d03-9124-1775b9b7f955',
-      },
-      toRelationMetadata: null,
-    },
-    {
-      __typename: 'field',
-      id: '20202020-4dc2-47c9-bb15-6e6f19ba9e46',
-      type: 'DATE_TIME',
-      name: 'createdAt',
-      label: 'Creation date',
-      description: null,
-      icon: 'IconCalendar',
-      isCustom: false,
-      isActive: true,
-      isSystem: false,
-      isNullable: false,
-      createdAt: '2023-11-23T15:38:02.292Z',
-      updatedAt: '2023-11-23T15:38:02.292Z',
-      fromRelationMetadata: null,
-      toRelationMetadata: null,
-    },
-    {
-      __typename: 'field',
-      id: '20202020-9e9f-4235-98b2-c76f3e2d281e',
-      type: 'BOOLEAN',
-      name: 'idealCustomerProfile',
-      label: 'ICP',
-      description:
-        'Ideal Customer Profile:  Indicates whether the company is the most suitable and valuable customer for you',
-      icon: 'IconTarget',
-      isCustom: false,
-      isActive: true,
-      isSystem: false,
-      isNullable: true,
-      createdAt: '2023-11-23T15:38:02.292Z',
-      updatedAt: '2023-11-23T15:38:02.292Z',
-      fromRelationMetadata: null,
-      toRelationMetadata: null,
-    },
-    {
-      __typename: 'field',
-      id: '20202020-8169-44a3-9e0b-6bad1ac50f87',
-      type: 'UUID',
-      name: 'id',
-      label: 'Id',
-      description: null,
-      icon: null,
-      isCustom: false,
-      isActive: true,
-      isSystem: true,
-      isNullable: false,
-      createdAt: '2023-11-23T15:38:02.292Z',
-      updatedAt: '2023-11-23T15:38:02.292Z',
-      fromRelationMetadata: null,
-      toRelationMetadata: null,
-    },
-    {
-      __typename: 'field',
-      id: '20202020-a61d-4b78-b998-3fd88b4f73a1',
-      type: 'LINK',
-      name: 'linkedinLink',
-      label: 'Linkedin',
-      description: 'The company Linkedin account',
-      icon: 'IconBrandLinkedin',
-      isCustom: false,
-      isActive: true,
-      isSystem: false,
-      isNullable: true,
-      createdAt: '2023-11-23T15:38:02.292Z',
-      updatedAt: '2023-11-23T15:38:02.292Z',
-      fromRelationMetadata: null,
-      toRelationMetadata: null,
-    },
-    {
-      __typename: 'field',
-      id: '20202020-e3fc-46ff-b552-3e757843f06e',
-      type: 'RELATION',
-      name: 'opportunities',
-      label: 'Opportunities',
-      description: 'Opportunities linked to the company.',
-      icon: 'IconTargetArrow',
-      isCustom: false,
-      isActive: true,
-      isSystem: false,
-      isNullable: true,
-      createdAt: '2023-11-23T15:38:02.292Z',
-      updatedAt: '2023-11-23T15:38:02.292Z',
-      fromRelationMetadata: {
-        __typename: 'relation',
-        id: '831b6b14-125c-4563-83a3-99d5e07c0a85',
-        relationType: 'ONE_TO_MANY',
-        toObjectMetadata: {
-          __typename: 'object',
-          id: '20202020-cae9-4ff4-9579-f7d9fe44c937',
-          dataSourceId: '20202020-7f63-47a9-b1b3-6c7290ca9fb1',
-          nameSingular: 'opportunity',
-          namePlural: 'opportunities',
-        },
-        toFieldMetadataId: '20202020-31d5-4af5-b016-c61c1c265706',
-      },
-      toRelationMetadata: null,
-    },
-    {
-      __typename: 'field',
-      id: '20202020-0b9e-4b9e-8b0a-5b0b5b0b5b0b',
-      type: 'UUID',
-      name: 'accountOwnerId',
-      label: 'Account Owner ID (foreign key)',
-      description: 'Foreign key for account owner',
-      icon: null,
-      isCustom: false,
-      isActive: true,
-      isSystem: true,
-      isNullable: true,
-      createdAt: '2023-11-23T15:38:02.292Z',
-      updatedAt: '2023-11-23T15:38:02.292Z',
-      fromRelationMetadata: null,
-      toRelationMetadata: null,
-    },
-    {
-      __typename: 'field',
-      id: '20202020-46e3-479a-b8f4-77137c74daa6',
-      type: 'LINK',
-      name: 'xLink',
-      label: 'X',
-      description: 'The company Twitter/X account',
-      icon: 'IconBrandX',
-      isCustom: false,
-      isActive: true,
-      isSystem: false,
-      isNullable: true,
-      createdAt: '2023-11-23T15:38:02.292Z',
-      updatedAt: '2023-11-23T15:38:02.292Z',
-      fromRelationMetadata: null,
-      toRelationMetadata: null,
-    },
-    {
-      __typename: 'field',
-      id: '20202020-4a2e-4b41-8562-279963e8947e',
-      type: 'RELATION',
-      name: 'activityTargets',
-      label: 'Activities',
-      description: 'Activities tied to the company',
-      icon: 'IconCheckbox',
-      isCustom: false,
-      isActive: true,
-      isSystem: false,
-      isNullable: true,
-      createdAt: '2023-11-23T15:38:02.292Z',
-      updatedAt: '2023-11-23T15:38:02.292Z',
-      fromRelationMetadata: {
-        __typename: 'relation',
-        id: '56e2ab44-4718-4c05-b61c-a7f978d7bdd1',
-        relationType: 'ONE_TO_MANY',
-        toObjectMetadata: {
-          __typename: 'object',
-          id: '20202020-439a-4a41-83a3-3cda03d01d38',
-          dataSourceId: '20202020-7f63-47a9-b1b3-6c7290ca9fb1',
-          nameSingular: 'activityTarget',
-          namePlural: 'activityTargets',
-        },
-        toFieldMetadataId: '20202020-9408-4cc0-9fe1-51467edb530b',
-      },
-      toRelationMetadata: null,
-    },
-    {
-      __typename: 'field',
-      id: '20202020-4a5a-466f-92d9-c3870d9502a9',
-      type: 'CURRENCY',
-      name: 'annualRecurringRevenue',
-      label: 'ARR',
-      description:
-        'Annual Recurring Revenue: The actual or estimated annual revenue of the company',
-      icon: 'IconMoneybag',
-      isCustom: false,
-      isActive: true,
-      isSystem: false,
-      isNullable: true,
-      createdAt: '2023-11-23T15:38:02.292Z',
-      updatedAt: '2023-11-23T15:38:02.292Z',
-      fromRelationMetadata: null,
-      toRelationMetadata: null,
-    },
-  ],
-};

front/src/modules/ui/input/components/internal/relation-picker/components/RelationPicker.tsx

@@ -2,6 +2,7 @@ import { useEffect } from 'react';
 import { useQuery } from '@apollo/client';
 
 import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem';
+import { useObjectNameSingularFromPlural } from '@/object-metadata/hooks/useObjectNameSingularFromPlural';
 import { useFilteredSearchEntityQuery } from '@/search/hooks/useFilteredSearchEntityQuery';
 import { IconForbid } from '@/ui/display/icon';
 import { useRelationPicker } from '@/ui/input/components/internal/relation-picker/hooks/useRelationPicker';
@@ -49,6 +50,12 @@ export const RelationPicker = ({
 
   const { identifiersMapper, searchQuery } = useRelationPicker();
 
+  const { objectNameSingular: relationObjectNameSingular } =
+    useObjectNameSingularFromPlural({
+      objectNamePlural:
+        fieldDefinition.metadata.relationObjectMetadataNamePlural,
+    });
+
   const records = useFilteredSearchEntityQuery({
     queryHook: useFindManyQuery,
     filters: [
@@ -68,7 +75,7 @@ export const RelationPicker = ({
       ),
     selectedIds: recordId ? [recordId] : [],
     excludeEntityIds: excludeRecordIds,
-    objectNamePlural: fieldDefinition.metadata.relationObjectMetadataNamePlural,
+    objectNameSingular: relationObjectNameSingular,
   });
 
   const handleEntitySelected = async (selectedUser: any | null | undefined) => {

front/src/modules/ui/layout/page/DefaultLayout.tsx

@@ -6,6 +6,7 @@ import { AuthModal } from '@/auth/components/Modal';
 import { useOnboardingStatus } from '@/auth/hooks/useOnboardingStatus';
 import { OnboardingStatus } from '@/auth/utils/getOnboardingStatus';
 import { CommandMenu } from '@/command-menu/components/CommandMenu';
+import { AppErrorBoundary } from '@/error-handler/components/AppErrorBoundary';
 import { KeyboardShortcutMenu } from '@/keyboard-shortcut-menu/components/KeyboardShortcutMenu';
 import { SignInBackgroundMockPage } from '@/sign-in-background-mock/components/SignInBackgroundMockPage';
 import { NavbarAnimatedContainer } from '@/ui/navigation/navbar/components/NavbarAnimatedContainer';
@@ -74,7 +75,7 @@ export const DefaultLayout = ({ children }: DefaultLayoutProps) => {
             </AnimatePresence>
           </>
         ) : (
-          <>{children}</>
+          <AppErrorBoundary>{children}</AppErrorBoundary>
         )}
       </StyledMainContainer>
     </StyledLayout>

front/src/modules/ui/object/object-filter-dropdown/components/ObjectFilterDropdownEntitySelect.tsx

@@ -16,9 +16,6 @@ export const ObjectFilterDropdownEntitySelect = () => {
   const objectMetadataNameSingular =
     filterDefinitionUsedInDropdown?.relationObjectMetadataNameSingular ?? '';
 
-  const objectMetadataNamePlural =
-    filterDefinitionUsedInDropdown?.relationObjectMetadataNamePlural ?? '';
-
   // TODO: refactor useFilteredSearchEntityQuery
   const { findManyRecordsQuery } = useObjectMetadataItem({
     objectNameSingular: objectMetadataNameSingular,
@@ -44,7 +41,7 @@ export const ObjectFilterDropdownEntitySelect = () => {
       : [],
     mappingFunction: (record: any) =>
       identifiersMapper?.(record, objectMetadataNameSingular),
-    objectNamePlural: objectMetadataNamePlural,
+    objectNameSingular: objectMetadataNameSingular,
   });
 
   if (filterDefinitionUsedInDropdown?.type !== 'RELATION') {

front/src/modules/ui/object/record-table/components/RecordTableBody.tsx

@@ -3,6 +3,7 @@ import { useInView } from 'react-intersection-observer';
 import { useRecoilState, useRecoilValue } from 'recoil';
 
 import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem';
+import { useObjectNameSingularFromPlural } from '@/object-metadata/hooks/useObjectNameSingularFromPlural';
 import { useObjectRecordTable } from '@/object-record/hooks/useObjectRecordTable';
 import { isFetchingMoreRecordsFamilyState } from '@/object-record/states/isFetchingMoreRecordsFamilyState';
 import { isDefined } from '~/utils/isDefined';
@@ -22,9 +23,13 @@ export const RecordTableBody = () => {
 
   const { scopeId: objectNamePlural } = useRecordTable();
 
+  const { objectNameSingular } = useObjectNameSingularFromPlural({
+    objectNamePlural,
+  });
+
   const { objectMetadataItem: foundObjectMetadataItem } = useObjectMetadataItem(
     {
-      objectNamePlural,
+      objectNameSingular,
     },
   );
 

front/src/modules/ui/theme/components/AppThemeProvider.tsx

@@ -16,6 +16,7 @@ export const AppThemeProvider = ({ children }: AppThemeProviderProps) => {
 
   const computedColorScheme =
     colorScheme === 'System' ? systemColorScheme : colorScheme;
+
   const theme = computedColorScheme === 'Dark' ? darkTheme : lightTheme;
 
   return <ThemeProvider theme={theme}>{children}</ThemeProvider>;

front/src/modules/views/components/ViewBarEffect.tsx

@@ -32,7 +32,7 @@ export const ViewBarEffect = () => {
 
   useFindManyRecords({
     skip: !viewObjectMetadataId,
-    objectNamePlural: 'views',
+    objectNameSingular: 'view',
     filter: {
       type: { eq: viewType },
       objectMetadataId: { eq: viewObjectMetadataId },

front/src/modules/views/hooks/internal/useViews.ts

@@ -14,6 +14,7 @@ export const useViews = (scopeId: string) => {
   } = useObjectMetadataItem({
     objectNameSingular: 'view',
   });
+
   const apolloClient = useApolloClient();
 
   const createView = useRecoilCallback(

front/src/pages/auth/CreateProfile.tsx

@@ -62,10 +62,9 @@ export const CreateProfile = () => {
     currentWorkspaceMemberState,
   );
 
-  const { updateOneRecord, objectMetadataItemNotFound } =
+  const { updateOneRecord } = useUpdateOneRecord<WorkspaceMember>({
-    useUpdateOneRecord<WorkspaceMember>({
+    objectNameSingular: 'workspaceMember',
-      objectNameSingular: 'workspaceMember',
+  });
-    });
 
   // Form
   const {
@@ -91,9 +90,6 @@ export const CreateProfile = () => {
         if (!data.firstName || !data.lastName) {
           throw new Error('First name or last name is missing');
         }
-        if (!updateOneRecord || objectMetadataItemNotFound) {
-          throw new Error('Object not found in metadata');
-        }
 
         await updateOneRecord({
           idToUpdate: currentWorkspaceMember?.id,
@@ -127,7 +123,6 @@ export const CreateProfile = () => {
       currentWorkspaceMember?.id,
       enqueueSnackBar,
       navigate,
-      objectMetadataItemNotFound,
       setCurrentWorkspaceMember,
       updateOneRecord,
     ],

front/src/pages/settings/SettingsWorkspaceMembers.tsx

@@ -35,7 +35,7 @@ export const SettingsWorkspaceMembers = () => {
   >();
 
   const { records: workspaceMembers } = useFindManyRecords<WorkspaceMember>({
-    objectNamePlural: 'workspaceMembers',
+    objectNameSingular: 'workspaceMember',
   });
   const { deleteOneRecord: deleteOneWorkspaceMember } =
     useDeleteOneRecord<WorkspaceMember>({

front/src/pages/settings/data-model/SettingsObjectNewField/SettingsObjectNewFieldStep2.tsx

@@ -79,7 +79,7 @@ export const SettingsObjectNewFieldStep2 = () => {
   });
 
   useFindManyRecords({
-    objectNamePlural: 'views',
+    objectNameSingular: 'view',
     filter: {
       type: { eq: ViewType.Table },
       objectMetadataId: { eq: activeObjectMetadataItem?.id },
@@ -94,7 +94,7 @@ export const SettingsObjectNewFieldStep2 = () => {
   });
 
   useFindManyRecords({
-    objectNamePlural: 'views',
+    objectNameSingular: 'view',
     skip: !formValues.relation?.objectMetadataId,
     filter: {
       type: { eq: ViewType.Table },

front/src/pages/settings/developers/api-keys/SettingsDevelopersApiKeys.tsx

@@ -43,8 +43,9 @@ export const SettingsDevelopersApiKeys = () => {
   const [apiKeys, setApiKeys] = useState<Array<ApiFieldItem>>([]);
 
   const filter = { revokedAt: { is: 'NULL' } };
+
   useFindManyRecords({
-    objectNamePlural: 'apiKeys',
+    objectNameSingular: 'apiKey',
     filter,
     orderBy: {},
     onCompleted: (data) => {

front/src/pages/settings/developers/api-keys/SettingsDevelopersApiKeysNew.tsx

@@ -33,6 +33,7 @@ export const SettingsDevelopersApiKeysNew = () => {
   const { createOneRecord: createOneApiKey } = useCreateOneRecord<ApiKey>({
     objectNameSingular: 'apiKey',
   });
+
   const onSave = async () => {
     const expiresAt = DateTime.now()
       .plus({ days: formValues.expirationDate ?? 30 })

front/src/utils/string/capitalize.ts

@@ -2,5 +2,6 @@ import { isNonEmptyString } from '@sniptt/guards';
 
 export const capitalize = (stringToCapitalize: string) => {
   if (!isNonEmptyString(stringToCapitalize)) return '';
+
   return stringToCapitalize[0].toUpperCase() + stringToCapitalize.slice(1);
 };

front/yarn.lock

@@ -16476,6 +16476,13 @@ react-element-to-jsx-string@^15.0.0:
     is-plain-object "5.0.0"
     react-is "18.1.0"
 
+react-error-boundary@^4.0.11:
+  version "4.0.11"
+  resolved "https://registry.yarnpkg.com/react-error-boundary/-/react-error-boundary-4.0.11.tgz#36bf44de7746714725a814630282fee83a7c9a1c"
+  integrity sha512-U13ul67aP5DOSPNSCWQ/eO0AQEYzEFkVljULQIjMV0KlffTAhxuDoBKdO0pb/JZ8mDhMKFZ9NZi0BmLGUiNphw==
+  dependencies:
+    "@babel/runtime" "^7.12.5"
+
 react-error-overlay@^6.0.11:
   version "6.0.11"
   resolved "https://registry.yarnpkg.com/react-error-overlay/-/react-error-overlay-6.0.11.tgz#92835de5841c5cf08ba00ddd2d677b6d17ff9adb"