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

Fix Activities and Tasks modules (#2561)

Browse Source 
* Fix activities

* Fix Timeline

* Refactor useCreateOne and useUpdateOne records

* Fix seeds
This commit is contained in:
Charles Bochet
2023-11-17 16:24:58 +01:00
committed by GitHub
parent a6d8cdb116
commit baf1260443
23 changed files with 259 additions and 222 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@ -63,7 +63,7 @@ export const ActivityComments = ({
}: ActivityCommentsProps) => {
const currentUser = useRecoilValue(currentUserState);
const { createOneObject } = useCreateOneObjectRecord({
objectNamePlural: 'commentsV2',
objectNameSingular: 'commentV2',
});
if (!currentUser) {

4
front/src/modules/activities/components/ActivityEditor.tsx
View File

@ -86,8 +86,8 @@ export const ActivityEditor = ({
activity.completedAt ?? '',
);
const containerRef = useRef<HTMLDivElement>(null);
const { updateOneObject } = useUpdateOneObjectRecord({
objectNamePlural: 'activitiesV2',
const { updateOneObject } = useUpdateOneObjectRecord<Activity>({
objectNameSingular: 'activityV2',
});
const updateTitle = useCallback(

4
front/src/modules/activities/hooks/useHandleCheckableActivityTargetChange.ts
View File

@ -16,8 +16,8 @@ export const useHandleCheckableActivityTargetChange = ({
> | null;
};
}) => {
const { createOneObject } = useCreateOneObjectRecord({
objectNamePlural: 'activityTargetV2',
const { createOneObject } = useCreateOneObjectRecord<ActivityTarget>({
objectNameSingular: 'activityTargetV2',
});
const { deleteOneObject } = useDeleteOneObjectRecord({
objectNamePlural: 'activityTargetV2',

71
front/src/modules/activities/hooks/useOpenCreateActivityDrawer.ts
View File

@ -1,8 +1,7 @@
import { useRecoilState, useRecoilValue } from 'recoil';
import { v4 } from 'uuid';
import { Activity, ActivityType } from '@/activities/types/Activity';
import { currentUserState } from '@/auth/states/currentUserState';
import { ActivityTarget } from '@/activities/types/ActivityTarget';
import { currentWorkspaceMemberState } from '@/auth/states/currentWorkspaceMemberState';
import { useCreateOneObjectRecord } from '@/object-record/hooks/useCreateOneObjectRecord';
import { useRightDrawer } from '@/ui/layout/right-drawer/hooks/useRightDrawer';
@ -13,14 +12,18 @@ import { useSetHotkeyScope } from '@/ui/utilities/hotkey/hooks/useSetHotkeyScope
import { activityTargetableEntityArrayState } from '../states/activityTargetableEntityArrayState';
import { viewableActivityIdState } from '../states/viewableActivityIdState';
import { ActivityTargetableEntity } from '../types/ActivityTargetableEntity';
import { getRelationData } from '../utils/getRelationData';
import { getTargetableEntitiesWithParents } from '../utils/getTargetableEntitiesWithParents';
export const useOpenCreateActivityDrawer = () => {
const { openRightDrawer } = useRightDrawer();
const { createOneObject } = useCreateOneObjectRecord({
objectNamePlural: 'activitiesV2',
});
const currentUser = useRecoilValue(currentUserState);
const { createOneObject: createOneActivityTarget } =
useCreateOneObjectRecord<ActivityTarget>({
objectNameSingular: 'activityTargetV2',
});
const { createOneObject: createOneActivity } =
useCreateOneObjectRecord<Activity>({
objectNameSingular: 'activityV2',
});
const currentWorkspaceMember = useRecoilValue(currentWorkspaceMemberState);
const setHotkeyScope = useSetHotkeyScope();
@ -29,7 +32,7 @@ export const useOpenCreateActivityDrawer = () => {
);
const [, setViewableActivityId] = useRecoilState(viewableActivityIdState);
return ({
return async ({
type,
targetableEntities,
assigneeId,
@ -38,33 +41,35 @@ export const useOpenCreateActivityDrawer = () => {
targetableEntities?: ActivityTargetableEntity[];
assigneeId?: string;
}) => {
const now = new Date().toISOString();
const targetableEntitiesWithRelations = targetableEntities
? getTargetableEntitiesWithParents(targetableEntities)
: [];
createOneObject?.({
id: v4(),
createdAt: now,
updatedAt: now,
author: { connect: { id: currentUser?.id ?? '' } },
workspaceMemberAuthor: {
connect: { id: currentWorkspaceMember?.id ?? '' },
},
assignee: { connect: { id: assigneeId ?? currentUser?.id ?? '' } },
workspaceMemberAssignee: {
connect: { id: currentWorkspaceMember?.id ?? '' },
},
const createdActivity = await createOneActivity?.({
authorId: currentWorkspaceMember?.id,
assigneeId: assigneeId ?? currentWorkspaceMember?.id,
type: type,
activityTargets: {
createMany: {
data: targetableEntities ? getRelationData(targetableEntities) : [],
skipDuplicates: true,
},
},
onCompleted: (data: Activity) => {
setHotkeyScope(RightDrawerHotkeyScope.RightDrawer, { goto: false });
setViewableActivityId(data.id);
setActivityTargetableEntityArray(targetableEntities ?? []);
openRightDrawer(RightDrawerPages.CreateActivity);
},
});
if (!createdActivity) {
return;
}
await Promise.all(
targetableEntitiesWithRelations.map(async (targetableEntity) => {
await createOneActivityTarget?.({
companyId:
targetableEntity.type === 'Company' ? targetableEntity.id : null,
personId:
targetableEntity.type === 'Person' ? targetableEntity.id : null,
activityId: createdActivity.id,
});
}),
);
setHotkeyScope(RightDrawerHotkeyScope.RightDrawer, { goto: false });
setViewableActivityId(createdActivity.id);
setActivityTargetableEntityArray(targetableEntities ?? []);
openRightDrawer(RightDrawerPages.CreateActivity);
};
};

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

@ -1,45 +1,20 @@
import { DateTime } from 'luxon';
import { useRecoilState, useRecoilValue } from 'recoil';
import { useRecoilValue } from 'recoil';
import { currentUserState } from '@/auth/states/currentUserState';
import { currentWorkspaceMemberState } from '@/auth/states/currentWorkspaceMemberState';
import { useFindManyObjectRecords } from '@/object-record/hooks/useFindManyObjectRecords';
import { turnFilterIntoWhereClause } from '@/ui/object/object-filter-dropdown/utils/turnFilterIntoWhereClause';
import { ViewFilterOperand } from '@/views/types/ViewFilterOperand';
import { SortOrder } from '~/generated/graphql';
import { ActivityType } from '~/generated-metadata/graphql';
import { parseDate } from '~/utils/date-utils';
export const useCurrentUserTaskCount = () => {
const [currentUser] = useRecoilState(currentUserState);
const currentWorkspaceMember = useRecoilValue(currentWorkspaceMemberState);
const { objects } = useFindManyObjectRecords({
objectNamePlural: 'activitiesV2',
filter: {
type: { equals: ActivityType.Task },
type: { eq: 'Task' },
completedAt: { eq: null },
...(currentUser
? turnFilterIntoWhereClause({
fieldMetadataId: 'assigneeId',
value: currentUser.id,
operand: ViewFilterOperand.Is,
displayValue:
currentWorkspaceMember?.firstName +
' ' +
currentWorkspaceMember?.lastName,
displayAvatarUrl: currentWorkspaceMember?.avatarUrl ?? undefined,
definition: {
type: 'ENTITY',
},
})
: {}),
assigneeId: { eq: currentWorkspaceMember?.id },
},
orderBy: [
{
createdAt: SortOrder.Desc,
},
],
});
const currentUserDueTaskCount = objects.filter((task) => {

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

@ -4,11 +4,9 @@ import styled from '@emotion/styled';
import { ActivityCreateButton } from '@/activities/components/ActivityCreateButton';
import { useOpenCreateActivityDrawer } from '@/activities/hooks/useOpenCreateActivityDrawer';
import { Activity } from '@/activities/types/Activity';
import { ActivityForDrawer } from '@/activities/types/ActivityForDrawer';
import { ActivityTargetableEntity } from '@/activities/types/ActivityTargetableEntity';
import { useFindManyObjectRecords } from '@/object-record/hooks/useFindManyObjectRecords';
import { useIsMobile } from '@/ui/utilities/responsive/hooks/useIsMobile';
import { SortOrder } from '~/generated/graphql';
import { TimelineItemsContainer } from './TimelineItemsContainer';
@ -50,22 +48,29 @@ const StyledEmptyTimelineSubTitle = styled.div`
`;
export const Timeline = ({ entity }: { entity: ActivityTargetableEntity }) => {
const { objects, loading } = useFindManyObjectRecords({
const { objects: activityTargets, loading } = useFindManyObjectRecords({
objectNamePlural: 'activityTargetsV2',
filter: {
or: {
companyId: { eq: entity.id },
personId: { eq: entity.id },
},
},
});
const { objects: activities } = useFindManyObjectRecords({
skip: !activityTargets?.length,
objectNamePlural: 'activitiesV2',
filter: {
companyId: { eq: entity.id },
activityTargets: { in: activityTargets?.map((at) => at.id) },
},
orderBy: {
createdAt: 'AscNullsFirst',
},
orderBy: [
{
createdAt: SortOrder.Desc,
},
],
});
const openCreateActivity = useOpenCreateActivityDrawer();
const activities: ActivityForDrawer[] = (objects ?? []) as Activity[];
if (loading) {
return <></>;
}
@ -95,7 +100,7 @@ export const Timeline = ({ entity }: { entity: ActivityTargetableEntity }) => {
return (
<StyledMainContainer>
<TimelineItemsContainer activities={activities} />
<TimelineItemsContainer activities={activities as Activity[]} />
</StyledMainContainer>
);
};

32
front/src/modules/activities/utils/getRelationData.ts
View File

@ -1,32 +0,0 @@
import { v4 } from 'uuid';
import { ActivityTargetCreateManyActivityInput } from '~/generated/graphql';
import { ActivityTargetableEntity } from '../types/ActivityTargetableEntity';
export const getRelationData = (
entities: ActivityTargetableEntity[],
): ActivityTargetCreateManyActivityInput[] => {
const now = new Date().toISOString();
const relationData: ActivityTargetCreateManyActivityInput[] = [];
for (const entity of entities ?? []) {
relationData.push({
companyId: entity.type === 'Company' ? entity.id : null,
personId: entity.type === 'Person' ? entity.id : null,
id: v4(),
createdAt: now,
});
if (entity.relatedEntities) {
for (const relatedEntity of entity.relatedEntities ?? []) {
relationData.push({
companyId: relatedEntity.type === 'Company' ? relatedEntity.id : null,
personId: relatedEntity.type === 'Person' ? relatedEntity.id : null,
id: v4(),
createdAt: now,
});
}
}
}
return relationData;
};

16
front/src/modules/activities/utils/getTargetableEntitiesWithParents.ts Normal file
View File

@ -0,0 +1,16 @@
import { ActivityTargetableEntity } from '../types/ActivityTargetableEntity';
export const getTargetableEntitiesWithParents = (
entities: ActivityTargetableEntity[],
): ActivityTargetableEntity[] => {
const entitiesWithRelations: ActivityTargetableEntity[] = [];
for (const entity of entities ?? []) {
entitiesWithRelations.push(entity);
if (entity.relatedEntities) {
for (const relatedEntity of entity.relatedEntities ?? []) {
entitiesWithRelations.push(relatedEntity);
}
}
}
return entitiesWithRelations;
};

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

@ -8,7 +8,10 @@ import { isNonEmptyArray } from '@sniptt/guards';
import { useRecoilCallback } from 'recoil';
import { GET_COMPANIES } from '@/companies/graphql/queries/getCompanies';
import { useFindOneObjectMetadataItem } from '@/object-metadata/hooks/useFindOneObjectMetadataItem';
import {
EMPTY_QUERY,
useFindOneObjectMetadataItem,
} from '@/object-metadata/hooks/useFindOneObjectMetadataItem';
import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem';
import { GET_PEOPLE } from '@/people/graphql/queries/getPeople';
import { GET_API_KEYS } from '@/settings/developers/graphql/queries/getApiKeys';
@ -22,7 +25,7 @@ import { optimisticEffectState } from '../states/optimisticEffectState';
import { OptimisticEffect } from '../types/internal/OptimisticEffect';
import { OptimisticEffectDefinition } from '../types/OptimisticEffectDefinition';
export const useOptimisticEffect = (objectNameSingular: string) => {
export const useOptimisticEffect = (objectNameSingular?: string) => {
const apolloClient = useApolloClient();
const { findManyQuery } = useFindOneObjectMetadataItem({
objectNameSingular,
@ -37,6 +40,12 @@ export const useOptimisticEffect = (objectNameSingular: string) => {
variables: OperationVariables;
definition: OptimisticEffectDefinition;
}) => {
if (findManyQuery === EMPTY_QUERY) {
throw new Error(
`Trying to register an optimistic effect for unknown object ${objectNameSingular}`,
);
}
const optimisticEffects = snapshot
.getLoadable(optimisticEffectState)
.getValue();

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

@ -38,7 +38,6 @@ export const RecordTableContainer = ({
});
const { updateOneObject } = useUpdateOneObjectRecord({
objectNamePlural,
objectNameSingular: foundObjectMetadataItem?.nameSingular,
});

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

@ -30,9 +30,10 @@ export type RecordTablePageProps = Pick<
export const RecordTablePage = () => {
const objectNamePlural = useParams().objectNamePlural ?? '';
const { objectNotFoundInMetadata, loading } = useFindOneObjectMetadataItem({
objectNamePlural,
});
const { objectNotFoundInMetadata, loading, foundObjectMetadataItem } =
useFindOneObjectMetadataItem({
objectNamePlural,
});
const navigate = useNavigate();
@ -43,7 +44,7 @@ export const RecordTablePage = () => {
}, [objectNotFoundInMetadata, loading, navigate]);
const { createOneObject } = useCreateOneObjectRecord({
objectNamePlural,
objectNameSingular: foundObjectMetadataItem?.nameSingular,
});
const handleAddButtonClick = async () => {

64
front/src/modules/object-record/hooks/useCreateOneObjectRecord.ts
View File

@ -4,60 +4,44 @@ import { v4 } from 'uuid';
import { useOptimisticEffect } from '@/apollo/optimistic-effect/hooks/useOptimisticEffect';
import { useFindOneObjectMetadataItem } from '@/object-metadata/hooks/useFindOneObjectMetadataItem';
import { ObjectMetadataItemIdentifier } from '@/object-metadata/types/ObjectMetadataItemIdentifier';
import { CurrencyCode, FieldMetadataType } from '~/generated-metadata/graphql';
import { capitalize } from '~/utils/string/capitalize';
const defaultFieldValues: Record<FieldMetadataType, unknown> = {
[FieldMetadataType.Currency]: {
amountMicros: null,
currencyCode: CurrencyCode.Usd,
},
[FieldMetadataType.Boolean]: false,
[FieldMetadataType.Date]: null,
[FieldMetadataType.Email]: '',
[FieldMetadataType.Enum]: null,
[FieldMetadataType.Number]: null,
[FieldMetadataType.Probability]: null,
[FieldMetadataType.Relation]: null,
[FieldMetadataType.Phone]: '',
[FieldMetadataType.Text]: '',
[FieldMetadataType.Link]: { url: '', label: '' },
[FieldMetadataType.Uuid]: '',
};
export const useCreateOneObjectRecord = ({
objectNamePlural,
}: Pick<ObjectMetadataItemIdentifier, 'objectNamePlural'>) => {
const { triggerOptimisticEffects } = useOptimisticEffect('CompanyV2');
export const useCreateOneObjectRecord = <T>({
objectNameSingular,
}: Pick<ObjectMetadataItemIdentifier, 'objectNameSingular'>) => {
const { triggerOptimisticEffects } = useOptimisticEffect(objectNameSingular);
const {
foundObjectMetadataItem,
objectNotFoundInMetadata,
createOneMutation,
} = useFindOneObjectMetadataItem({
objectNamePlural,
objectNameSingular,
});
// TODO: type this with a minimal type at least with Record<string, any>
const [mutate] = useMutation(createOneMutation);
const createOneObject = foundObjectMetadataItem
? async (input: Record<string, any>) => {
const createdObject = await mutate({
variables: {
input: { ...input, id: v4() },
},
});
const createOneObject =
objectNameSingular && foundObjectMetadataItem
? async (input: Record<string, any>) => {
const createdObject = await mutate({
variables: {
input: { ...input, id: v4() },
},
});
triggerOptimisticEffects(
`${capitalize(foundObjectMetadataItem.nameSingular)}Edge`,
createdObject.data[
`create${capitalize(foundObjectMetadataItem.nameSingular)}`
],
);
return createdObject.data;
}
: undefined;
triggerOptimisticEffects(
`${capitalize(foundObjectMetadataItem.nameSingular)}Edge`,
createdObject.data[
`create${capitalize(foundObjectMetadataItem.nameSingular)}`
],
);
return createdObject.data[
`create${capitalize(objectNameSingular)}`
] as T;
}
: undefined;
return {
createOneObject,

46
front/src/modules/object-record/hooks/useUpdateOneObjectRecord.ts
View File

@ -2,41 +2,45 @@ import { useMutation } from '@apollo/client';
import { useFindOneObjectMetadataItem } from '@/object-metadata/hooks/useFindOneObjectMetadataItem';
import { ObjectMetadataItemIdentifier } from '@/object-metadata/types/ObjectMetadataItemIdentifier';
import { capitalize } from '~/utils/string/capitalize';
export const useUpdateOneObjectRecord = ({
objectNamePlural,
export const useUpdateOneObjectRecord = <T>({
objectNameSingular,
}: ObjectMetadataItemIdentifier) => {
}: Pick<ObjectMetadataItemIdentifier, 'objectNameSingular'>) => {
const {
foundObjectMetadataItem,
objectNotFoundInMetadata,
updateOneMutation,
} = useFindOneObjectMetadataItem({
objectNamePlural,
objectNameSingular,
});
// TODO: type this with a minimal type at least with Record<string, any>
const [mutate] = useMutation(updateOneMutation);
const updateOneObject = foundObjectMetadataItem
? ({
idToUpdate,
input,
}: {
idToUpdate: string;
input: Record<string, any>;
}) => {
return mutate({
variables: {
idToUpdate: idToUpdate,
input: {
...input,
const updateOneObject =
objectNameSingular && foundObjectMetadataItem
? async ({
idToUpdate,
input,
}: {
idToUpdate: string;
input: Record<string, any>;
}) => {
const updatedObject = await mutate({
variables: {
idToUpdate: idToUpdate,
input: {
...input,
},
},
},
});
}
: undefined;
});
return updatedObject.data[
`update${capitalize(objectNameSingular)}`
] as T;
}
: undefined;
return {
updateOneObject,

2
front/src/modules/ui/theme/hooks/useColorScheme.ts
View File

@ -10,7 +10,7 @@ export const useColorScheme = () => {
const { updateOneObject: updateOneWorkspaceMember } =
useUpdateOneObjectRecord({
objectNamePlural: 'workspaceMembersV2',
objectNameSingular: 'workspaceMemberV2',
});
const colorScheme = currentWorkspaceMember?.colorScheme ?? 'System';