admin/twenty
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Feat/error boundaries (#2779)

Browse Source 
* - 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>
This commit is contained in:
Lucas Bordeau
2023-12-01 22:06:38 +01:00
committed by GitHub
parent a301f451f9
commit 74b077f3ca
75 changed files with 4213 additions and 674 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
front/package.json
View File

@ -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"
}
}
}

68
front/src/index.tsx
View File

@ -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 />
<BrowserRouter>
<ApolloProvider>
<HelmetProvider>
<ClientConfigProvider>
<UserProvider>
<ApolloMetadataClientProvider>
<SnackBarProviderScope snackBarManagerScopeId="snack-bar-manager">
<ObjectMetadataItemsProvider>
<PageChangeEffect />
<AppThemeProvider>
<SnackBarProvider>
<DialogManagerScope dialogManagerScopeId="dialog-manager">
<DialogManager>
<StrictMode>
<App />
</StrictMode>
</DialogManager>
</DialogManagerScope>
</SnackBarProvider>
</AppThemeProvider>
</ObjectMetadataItemsProvider>
</SnackBarProviderScope>
</ApolloMetadataClientProvider>
</UserProvider>
</ClientConfigProvider>
</HelmetProvider>
</ApolloProvider>
</BrowserRouter>
<AppErrorBoundary>
<RecoilDebugObserverEffect />
<BrowserRouter>
<SnackBarProviderScope snackBarManagerScopeId="snack-bar-manager">
<ApolloProvider>
<HelmetProvider>
<ClientConfigProvider>
<UserProvider>
<ApolloMetadataClientProvider>
<ObjectMetadataItemsProvider>
<AppThemeProvider>
<SnackBarProvider>
<DialogManagerScope dialogManagerScopeId="dialog-manager">
<DialogManager>
<StrictMode>
<PromiseRejectionEffect />
<App />
</StrictMode>
</DialogManager>
</DialogManagerScope>
</SnackBarProvider>
</AppThemeProvider>
<PageChangeEffect />
</ObjectMetadataItemsProvider>
</ApolloMetadataClientProvider>
</UserProvider>
</ClientConfigProvider>
</HelmetProvider>
</ApolloProvider>
</SnackBarProviderScope>
</BrowserRouter>
</AppErrorBoundary>
</RecoilRoot>,
);

2
front/src/modules/activities/components/ActivityComments.tsx
View File

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

2
front/src/modules/activities/files/hooks/useAttachments.tsx
View File

@ -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 },
},

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

@ -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,
});

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

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

4
front/src/modules/activities/notes/hooks/useNotes.ts
View File

@ -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,
});

2
front/src/modules/activities/tasks/components/TaskRow.tsx
View File

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

2
front/src/modules/activities/tasks/hooks/useCurrentUserDueTaskCount.ts
View File

@ -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' },

6
front/src/modules/activities/tasks/hooks/useTasks.ts
View File

@ -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' },

4
front/src/modules/activities/timeline/components/Timeline.tsx
View File

@ -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),

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

@ -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,
}: {
objectNameSingular: string | undefined;
}) => {
}: ObjectMetadataItemIdentifier) => {
const apolloClient = useApolloClient();
const { findManyRecordsQuery } = useObjectMetadataItem({
objectNameSingular,
});

1
front/src/modules/auth/hooks/useAuth.ts
View File

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

6
front/src/modules/command-menu/components/CommandMenu.tsx
View File

@ -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}%` } },

8
front/src/modules/companies/components/HooksCompanyBoardEffect.tsx
View File

@ -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 || ''),

2
front/src/modules/companies/components/NewOpportunityButton.tsx
View File

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

2
front/src/modules/companies/components/OpportunityPicker.tsx
View File

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

19
front/src/modules/error-handler/components/AppErrorBoundary.tsx Normal file
View File

@ -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>
);
};

26
front/src/modules/error-handler/components/GenericErrorFallback.tsx Normal file
View File

@ -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>
);
};

39
front/src/modules/error-handler/components/PromiseRejectionEffect.tsx Normal file
View File

@ -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 <></>;
};

13
front/src/modules/favorites/hooks/useFavorites.ts
View File

@ -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>>) => {

1
front/src/modules/object-metadata/components/ApolloMetadataClientProvider.tsx
View File

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

7
front/src/modules/object-metadata/components/ObjectMetadataItemsLoadEffect.tsx Normal file
View File

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

15
front/src/modules/object-metadata/components/ObjectMetadataItemsProvider.tsx
View File

@ -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 />

13
front/src/modules/object-metadata/errors/ObjectMetadataNotFoundError.ts Normal file
View File

@ -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);
}
}

38
front/src/modules/object-metadata/hooks/useObjectMetadataItem.ts
View File

@ -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,
objectNameSingular,
objectName: 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,

38
front/src/modules/object-metadata/hooks/useObjectNamePluralFromSingular.ts Normal file
View File

@ -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 };
};

38
front/src/modules/object-metadata/hooks/useObjectNameSingularFromPlural.ts Normal file
View File

@ -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 };
};

40
front/src/modules/object-metadata/states/objectMetadataItemFamilySelector.ts
View File

@ -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:
({
objectNameSingular,
objectNamePlural,
}: {
objectNameSingular?: string;
objectNamePlural?: string;
}) =>
({ objectNameType, objectName }: ObjectMetadataItemSelector) =>
({ get }) => {
const objectMetadataItems = get(objectMetadataItemsState);
return (
objectMetadataItems.find(
(objectMetadataItem) =>
objectMetadataItem.nameSingular === objectNameSingular ||
objectMetadataItem.namePlural === objectNamePlural,
) ?? null
);
if (objectNameType === 'singular') {
return (
objectMetadataItems.find(
(objectMetadataItem) =>
objectMetadataItem.nameSingular === objectName,
) ?? null
);
} else if (objectNameType === 'plural') {
return (
objectMetadataItems.find(
(objectMetadataItem) =>
objectMetadataItem.namePlural === objectName,
) ?? null
);
}
return null;
},
});

3
front/src/modules/object-metadata/types/ObjectMetadataItemIdentifier.ts
View File

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

3676
front/src/modules/object-metadata/utils/getObjectMetadataItemsMock.ts Normal file
View File

File diff suppressed because it is too large Load Diff

6
front/src/modules/object-record/components/RecordShowPage.tsx
View File

@ -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(

21
front/src/modules/object-record/components/RecordTableContainer.tsx
View File

@ -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(
{
objectNamePlural,
},
);
const { columnDefinitions } = useColumnDefinitionsFromFieldMetadata(
foundObjectMetadataItem,
);
const { objectNameSingular } = useObjectNameSingularFromPlural({
objectNamePlural,
});
const { objectMetadataItem } = useObjectMetadataItem({
objectNameSingular,
});
const { columnDefinitions } =
useColumnDefinitionsFromFieldMetadata(objectMetadataItem);
const { updateOneRecord } = useUpdateOneRecord({
objectNameSingular: foundObjectMetadataItem?.nameSingular,
objectNameSingular,
});
const recordTableId = objectNamePlural ?? '';

8
front/src/modules/object-record/components/RecordTableEffect.tsx
View File

@ -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 } =

22
front/src/modules/object-record/components/RecordTablePage.tsx
View File

@ -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 { ObjectMetadataItemIdentifier } from '@/object-metadata/types/ObjectMetadataItemIdentifier';
import { useObjectNameSingularFromPlural } from '@/object-metadata/hooks/useObjectNameSingularFromPlural';
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 } =
useObjectMetadataItem({
objectNamePlural,
});
const { objectNameSingular } = useObjectNameSingularFromPlural({
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 () => {

31
front/src/modules/object-record/hooks/useCreateOneRecord.ts
View File

@ -8,42 +8,39 @@ import { capitalize } from '~/utils/string/capitalize';
export const useCreateOneRecord = <T>({
objectNameSingular,
}: Pick<ObjectMetadataItemIdentifier, 'objectNameSingular'>) => {
}: ObjectMetadataItemIdentifier) => {
const { triggerOptimisticEffects } = useOptimisticEffect({
objectNameSingular,
});
const {
objectMetadataItem,
objectMetadataItemNotFound,
createOneRecordMutation,
} = useObjectMetadataItem({
objectNameSingular,
});
const { objectMetadataItem, 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) {
return null;
}
const createdRecord = await mutate({
const createdObject = await mutate({
variables: {
input: { ...input, id: v4() },
},
});
triggerOptimisticEffects(
`${capitalize(objectNameSingular)}Edge`,
createdRecord.data[`create${capitalize(objectNameSingular)}`],
`${capitalize(objectMetadataItem.nameSingular)}Edge`,
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,
};
};

31
front/src/modules/object-record/hooks/useDeleteOneRecord.ts
View File

@ -8,41 +8,40 @@ import { capitalize } from '~/utils/string/capitalize';
export const useDeleteOneRecord = <T>({
objectNameSingular,
}: Pick<ObjectMetadataItemIdentifier, 'objectNameSingular'>) => {
}: ObjectMetadataItemIdentifier) => {
const { performOptimisticEvict } = useOptimisticEvict();
const {
objectMetadataItem,
objectMetadataItemNotFound,
deleteOneRecordMutation,
} = useObjectMetadataItem({
objectNameSingular,
});
const { objectMetadataItem, 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,
};
};

83
front/src/modules/object-record/hooks/useFindManyRecords.ts
View File

@ -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 {
objectMetadataItem,
objectMetadataItemNotFound,
findManyRecordsQuery,
} = useObjectMetadataItem({
objectNamePlural,
const { objectMetadataItem, findManyRecordsQuery } = useObjectMetadataItem({
objectNameSingular,
});
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[objectNamePlural]);
onCompleted?.(data[objectMetadataItem.namePlural]);
if (objectNamePlural && data?.[objectNamePlural]) {
setLastCursor(data?.[objectNamePlural]?.pageInfo.endCursor);
setHasNextPage(data?.[objectNamePlural]?.pageInfo.hasNextPage);
}
if (data?.[objectMetadataItem.namePlural]) {
setLastCursor(
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 nextEdges = fetchMoreResult?.[objectNamePlural]?.edges;
const previousEdges = prev?.[objectMetadataItem.namePlural]?.edges;
const nextEdges =
fetchMoreResult?.[objectMetadataItem.namePlural]?.edges;
let newEdges: PaginatedRecordTypeEdge<RecordType>[] = [];
if (isNonEmptyArray(previousEdges) && isNonEmptyArray(nextEdges)) {
newEdges = filterUniqueRecordEdgesByCursor([
...prev?.[objectNamePlural]?.edges,
...fetchMoreResult?.[objectNamePlural]?.edges,
...prev?.[objectMetadataItem.namePlural]?.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({
pagedRecords: data,
objectNamePlural,
})
: [],
[data, objectNamePlural],
mapPaginatedRecordsToRecords({
pagedRecords: data,
objectNamePlural: objectMetadataItem.namePlural,
}),
[data, objectMetadataItem],
);
return {
@ -189,7 +195,6 @@ export const useFindManyRecords = <
records,
loading,
error,
objectMetadataItemNotFound,
fetchMoreRecords,
};
};

21
front/src/modules/object-record/hooks/useFindOneRecord.ts
View File

@ -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 } =
useObjectMetadataItem(
{
objectNameSingular,
},
depth,
);
const { objectMetadataItem, findOneRecordQuery } = useObjectMetadataItem(
{
objectNameSingular,
},
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 =
objectNameSingular && data ? data[objectNameSingular] : undefined;
const record = data ? data[objectNameSingular] : undefined;
return {
record,
loading,
error,
objectMetadataItemNotFound,
};
};

2
front/src/modules/object-record/hooks/useGenerateCreateOneRecordMutation.ts
View File

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

2
front/src/modules/object-record/hooks/useGenerateFindManyRecordsQuery.ts
View File

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

2
front/src/modules/object-record/hooks/useGenerateFindOneRecordQuery.ts
View File

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

2
front/src/modules/object-record/hooks/useGenerateUpdateOneRecordMutation.ts
View File

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

4
front/src/modules/object-record/hooks/useGetRecordFromCache.ts
View File

@ -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,
});

4
front/src/modules/object-record/hooks/useModifyRecordFromCache.ts
View File

@ -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,
});

11
front/src/modules/object-record/hooks/useObjectRecordTable.ts
View File

@ -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) => {

6
front/src/modules/object-record/hooks/useRecordTableContextMenuEntries.tsx
View File

@ -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 () => {

14
front/src/modules/object-record/hooks/useUpdateOneRecord.ts
View File

@ -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,
};
};

8
front/src/modules/object-record/types/PaginatedRecordTypeResults.ts
View File

@ -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: {

4
front/src/modules/object-record/utils/generateDeleteOneRecordMutation.ts
View File

@ -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!) {

1
front/src/modules/people/components/PeopleCard.tsx
View File

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

15
front/src/modules/search/hooks/useFilteredSearchEntityQuery.ts
View File

@ -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)

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

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

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

@ -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,
});

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

@ -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,
});

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

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

5
front/src/modules/settings/profile/components/NameFields.tsx
View File

@ -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: {

10
front/src/modules/settings/profile/components/ProfilePictureUploader.tsx
View File

@ -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: {

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

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

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

@ -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);

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

@ -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,
},
],
};

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

@ -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) => {

3
front/src/modules/ui/layout/page/DefaultLayout.tsx
View File

@ -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>

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

@ -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') {

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

@ -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,
},
);

1
front/src/modules/ui/theme/components/AppThemeProvider.tsx
View File

@ -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>;

2
front/src/modules/views/components/ViewBarEffect.tsx
View File

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

1
front/src/modules/views/hooks/internal/useViews.ts
View File

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

11
front/src/pages/auth/CreateProfile.tsx
View File

@ -62,10 +62,9 @@ export const CreateProfile = () => {
currentWorkspaceMemberState,
);
const { updateOneRecord, objectMetadataItemNotFound } =
useUpdateOneRecord<WorkspaceMember>({
objectNameSingular: 'workspaceMember',
});
const { updateOneRecord } = useUpdateOneRecord<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,
],

2
front/src/pages/settings/SettingsWorkspaceMembers.tsx
View File

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

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

@ -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 },

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

@ -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) => {

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

@ -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 })

1
front/src/utils/string/capitalize.ts
View File

@ -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);
};

7
front/yarn.lock
View File

@ -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"