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

Improve Jotai work (#18205)

Browse Source
This commit is contained in:
Charles Bochet
2026-02-24 20:38:30 +01:00
committed by GitHub
parent b339c93699
commit eaf9fe27b2
210 changed files with 1714 additions and 1662 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/twenty-front/src/modules/workflow/hooks/__tests__/useGetUpdatableWorkflowVersion.test.ts
+3 -6
View File
@@ -18,12 +18,9 @@ jest.mock('@/workflow/hooks/useCreateDraftFromWorkflowVersion', () => ({
}),
}));
jest.mock(
'@/ui/utilities/state/component-state/hooks/useRecoilComponentValue',
() => ({
useRecoilComponentValue: jest.fn(() => mockWorkflowId),
}),
);
jest.mock('@/ui/utilities/state/jotai/hooks/useRecoilComponentValueV2', () => ({
useRecoilComponentValueV2: jest.fn(() => mockWorkflowId),
}));
jest.mock('@/workflow/hooks/useWorkflowWithCurrentVersion', () => ({
useWorkflowWithCurrentVersion: jest.fn((workflowId) =>
packages/twenty-front/src/modules/workflow/hooks/useRunWorkflowRunOpeningInCommandMenuSideEffects.ts
+9 -7
View File
@@ -4,7 +4,6 @@ import { objectMetadataItemsState } from '@/object-metadata/states/objectMetadat
import { type ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem';
import { getRecordFromCache } from '@/object-record/cache/utils/getRecordFromCache';
import { useObjectPermissions } from '@/object-record/hooks/useObjectPermissions';
import { jotaiStore } from '@/ui/utilities/state/jotai/jotaiStore';
import { flowComponentState } from '@/workflow/states/flowComponentState';
import { workflowVisualizerWorkflowIdComponentState } from '@/workflow/states/workflowVisualizerWorkflowIdComponentState';
import { workflowVisualizerWorkflowRunIdComponentState } from '@/workflow/states/workflowVisualizerWorkflowRunIdComponentState';
@@ -17,8 +16,10 @@ import { getWorkflowNodeIconKey } from '@/workflow/workflow-diagram/utils/getWor
import { useCallback } from 'react';
import { isDefined } from 'twenty-shared/utils';
import { useIcons } from 'twenty-ui/display';
import { useStore } from 'jotai';
export const useRunWorkflowRunOpeningInCommandMenuSideEffects = () => {
const store = useStore();
const apolloCoreClient = useApolloCoreClient();
const { openWorkflowRunViewStepInCommandMenu } = useWorkflowCommandMenu();
const { getIcon } = useIcons();
@@ -33,7 +34,7 @@ export const useRunWorkflowRunOpeningInCommandMenuSideEffects = () => {
objectMetadataItem: ObjectMetadataItem;
recordId: string;
}) => {
const objectMetadataItems = jotaiStore.get(objectMetadataItemsState.atom);
const objectMetadataItems = store.get(objectMetadataItemsState.atom);
const workflowRunRecord = getRecordFromCache<WorkflowRun>({
objectMetadataItem,
@@ -62,19 +63,19 @@ export const useRunWorkflowRunOpeningInCommandMenuSideEffects = () => {
recordId,
});
jotaiStore.set(
store.set(
workflowVisualizerWorkflowRunIdComponentState.atomFamily({
instanceId,
}),
workflowRunRecord.id,
);
jotaiStore.set(
store.set(
workflowVisualizerWorkflowIdComponentState.atomFamily({
instanceId,
}),
workflowRunRecord.workflowId,
);
jotaiStore.set(
store.set(
flowComponentState.atomFamily({
instanceId,
}),
@@ -84,14 +85,14 @@ export const useRunWorkflowRunOpeningInCommandMenuSideEffects = () => {
steps: workflowRunRecord.state.flow.steps,
},
);
jotaiStore.set(
store.set(
workflowSelectedNodeComponentState.atomFamily({
instanceId,
}),
stepToOpenByDefault.id,
);
jotaiStore.set(
store.set(
workflowRunDiagramAutomaticallyOpenedStepsComponentState.atomFamily({
instanceId,
}),
@@ -117,6 +118,7 @@ export const useRunWorkflowRunOpeningInCommandMenuSideEffects = () => {
objectPermissionsByObjectMetadataId,
openWorkflowRunViewStepInCommandMenu,
getIcon,
store,
],
);
packages/twenty-front/src/modules/workflow/hooks/useRunWorkflowVersion.tsx
+8 -7
View File
@@ -13,7 +13,6 @@ import { useGenerateDepthRecordGqlFieldsFromObject } from '@/object-record/graph
import { useObjectPermissions } from '@/object-record/hooks/useObjectPermissions';
import { useUpsertRecordsInStore } from '@/object-record/record-store/hooks/useUpsertRecordsInStore';
import { recordStoreFamilyState } from '@/object-record/record-store/states/recordStoreFamilyState';
import { jotaiStore } from '@/ui/utilities/state/jotai/jotaiStore';
import { computeOptimisticCreateRecordBaseRecordInput } from '@/object-record/utils/computeOptimisticCreateRecordBaseRecordInput';
import { computeOptimisticRecordFromInput } from '@/object-record/utils/computeOptimisticRecordFromInput';
import { RUN_WORKFLOW_VERSION } from '@/workflow/graphql/mutations/runWorkflowVersion';
@@ -27,8 +26,10 @@ import {
type RunWorkflowVersionMutation,
type RunWorkflowVersionMutationVariables,
} from '~/generated/graphql';
import { useStore } from 'jotai';
export const useRunWorkflowVersion = () => {
const store = useStore();
const apolloCoreClient = useApolloCoreClient();
const { upsertRecordsInStore } = useUpsertRecordsInStore();
@@ -63,12 +64,12 @@ export const useRunWorkflowVersion = () => {
const { openRecordInCommandMenu } = useOpenRecordInCommandMenu();
const setRecordInStore = useCallback((workflowRun: WorkflowRun) => {
jotaiStore.set(
recordStoreFamilyState.atomFamily(workflowRun.id),
workflowRun,
);
}, []);
const setRecordInStore = useCallback(
(workflowRun: WorkflowRun) => {
store.set(recordStoreFamilyState.atomFamily(workflowRun.id), workflowRun);
},
[store],
);
const runWorkflowVersion = async ({
workflowId,
packages/twenty-front/src/modules/workflow/workflow-diagram/components/WorkflowDiagramCanvasBase.tsx
+28 -23
View File
@@ -1,7 +1,6 @@
import { ActionMenuContext } from '@/action-menu/contexts/ActionMenuContext';
import { commandMenuWidthState } from '@/command-menu/states/commandMenuWidthState';
import { isCommandMenuOpenedStateV2 } from '@/command-menu/states/isCommandMenuOpenedStateV2';
import { jotaiStore } from '@/ui/utilities/state/jotai/jotaiStore';
import { useListenToSidePanelClosing } from '@/ui/layout/right-drawer/hooks/useListenToSidePanelClosing';
import { useRecoilComponentStateCallbackStateV2 } from '@/ui/utilities/state/jotai/hooks/useRecoilComponentStateCallbackStateV2';
import { useRecoilComponentValueV2 } from '@/ui/utilities/state/jotai/hooks/useRecoilComponentValueV2';
@@ -64,6 +63,7 @@ import React, {
import { useRecoilValueV2 } from '@/ui/utilities/state/jotai/hooks/useRecoilValueV2';
import { isDefined } from 'twenty-shared/utils';
import { Tag, type TagColor } from 'twenty-ui/components';
import { useStore } from 'jotai';
const StyledResetReactflowStyles = styled.div`
height: 100%;
@@ -165,17 +165,18 @@ export const WorkflowDiagramCanvasBase = ({
event: MouseEvent | React.MouseEvent<Element, MouseEvent>;
}) => void;
}) => {
const store = useStore();
const theme = useTheme();
const reactflow = useReactFlow();
const workflowDiagram = useRecoilComponentValueV2(
const currentWorkflowDiagram = useRecoilComponentValueV2(
workflowDiagramComponentState,
);
const workflowDiagramPanOnDrag = useRecoilComponentValueV2(
workflowDiagramPanOnDragComponentState,
);
const workflowDiagramAtom = useRecoilComponentStateCallbackStateV2(
const workflowDiagram = useRecoilComponentStateCallbackStateV2(
workflowDiagramComponentState,
);
const setWorkflowDiagram = useSetRecoilComponentStateV2(
@@ -185,7 +186,7 @@ export const WorkflowDiagramCanvasBase = ({
workflowSelectedNodeComponentState,
);
const { resetWorkflowInsertStepIds } = useResetWorkflowInsertStepIds();
const workflowDiagramWaitingNodesDimensionsAtom =
const workflowDiagramWaitingNodesDimensions =
useRecoilComponentStateCallbackStateV2(
workflowDiagramWaitingNodesDimensionsComponentState,
);
@@ -212,12 +213,12 @@ export const WorkflowDiagramCanvasBase = ({
} | null>(null);
const { nodes, edges } = useMemo(() => {
if (!isDefined(workflowDiagram)) {
if (!isDefined(currentWorkflowDiagram)) {
return { nodes: [], edges: [] };
}
const nodes = [...workflowDiagram.nodes];
const edges = [...workflowDiagram.edges];
const nodes = [...currentWorkflowDiagram.nodes];
const edges = [...currentWorkflowDiagram.edges];
if (
isDefined(workflowInsertStepIds.position) &&
@@ -254,7 +255,7 @@ export const WorkflowDiagramCanvasBase = ({
}
return { nodes, edges };
}, [workflowDiagram, workflowInsertStepIds]);
}, [currentWorkflowDiagram, workflowInsertStepIds]);
const isCommandMenuOpened = useRecoilValueV2(isCommandMenuOpenedStateV2);
const { isInRightDrawer } = useContext(ActionMenuContext);
@@ -318,7 +319,7 @@ export const WorkflowDiagramCanvasBase = ({
let adjustedContainerWidth = baseContainerWidth;
const commandMenuWidth = jotaiStore.get(commandMenuWidthState.atom);
const commandMenuWidth = store.get(commandMenuWidthState.atom);
if (!isInRightDrawer && isCommandMenuOpened) {
adjustedContainerWidth = baseContainerWidth - commandMenuWidth;
@@ -339,7 +340,7 @@ export const WorkflowDiagramCanvasBase = ({
{ duration: hasViewportBeenMoved ? 300 : 0 },
);
},
[reactflow, setWorkflowDiagramWaitingNodesDimensions],
[reactflow, setWorkflowDiagramWaitingNodesDimensions, store],
);
const handleSetFlowViewportOnChange = useCallback(
@@ -356,10 +357,10 @@ export const WorkflowDiagramCanvasBase = ({
isInRightDrawer,
isCommandMenuOpened,
workflowDiagramFlowInitialized,
workflowDiagram: jotaiStore.get(workflowDiagramAtom),
workflowDiagram: store.get(workflowDiagram),
});
},
[setFlowViewport, workflowDiagramAtom],
[setFlowViewport, workflowDiagram, store],
);
useEffect(() => {
@@ -377,7 +378,7 @@ export const WorkflowDiagramCanvasBase = ({
const handleNodesChanges = useCallback(
(changes: NodeChange<WorkflowDiagramNode>[]) => {
const workflowDiagram = jotaiStore.get(workflowDiagramAtom);
const existingWorkflowDiagram = store.get(workflowDiagram);
const filteredChanges = changes.filter(
(change) =>
@@ -387,20 +388,23 @@ export const WorkflowDiagramCanvasBase = ({
),
);
let updatedWorkflowDiagram = workflowDiagram;
if (isDefined(workflowDiagram) && filteredChanges.length > 0) {
let updatedWorkflowDiagram = existingWorkflowDiagram;
if (isDefined(existingWorkflowDiagram) && filteredChanges.length > 0) {
updatedWorkflowDiagram = {
...workflowDiagram,
nodes: applyNodeChanges(filteredChanges, workflowDiagram.nodes),
...existingWorkflowDiagram,
nodes: applyNodeChanges(
filteredChanges,
existingWorkflowDiagram.nodes,
),
};
}
jotaiStore.set(workflowDiagramAtom, updatedWorkflowDiagram);
store.set(workflowDiagram, updatedWorkflowDiagram);
const workflowDiagramWaitingNodesDimensions = jotaiStore.get(
workflowDiagramWaitingNodesDimensionsAtom,
const currentWorkflowDiagramWaitingNodesDimensions = store.get(
workflowDiagramWaitingNodesDimensions,
);
if (!workflowDiagramWaitingNodesDimensions) {
if (!currentWorkflowDiagramWaitingNodesDimensions) {
return;
}
@@ -415,9 +419,10 @@ export const WorkflowDiagramCanvasBase = ({
isCommandMenuOpened,
setFlowViewport,
workflowDiagramFlowInitialized,
workflowDiagramAtom,
workflowDiagramWaitingNodesDimensionsAtom,
workflowDiagram,
workflowDiagramWaitingNodesDimensions,
isInRightDrawer,
store,
],
);
packages/twenty-front/src/modules/workflow/workflow-diagram/components/WorkflowDiagramEffect.tsx
+7 -7
View File
@@ -24,13 +24,13 @@ export const WorkflowDiagramEffect = () => {
workflowVisualizerWorkflowId,
);
const workflowDiagramAtom = useRecoilComponentStateCallbackStateV2(
const workflowDiagram = useRecoilComponentStateCallbackStateV2(
workflowDiagramComponentState,
);
const setFlow = useSetRecoilComponentStateV2(flowComponentState);
const { populateStepsOutputSchema } = useStepsOutputSchema();
const workflowLastCreatedStepIdAtom = useRecoilComponentStateCallbackStateV2(
const workflowLastCreatedStepId = useRecoilComponentStateCallbackStateV2(
workflowLastCreatedStepIdComponentState,
);
@@ -39,7 +39,7 @@ export const WorkflowDiagramEffect = () => {
const computeAndMergeNewWorkflowDiagram = useCallback(
(version: WorkflowVersion) => {
const previousWorkflowDiagram = store.get(workflowDiagramAtom);
const previousWorkflowDiagram = store.get(workflowDiagram);
const nextWorkflowDiagram = getWorkflowVersionDiagram({
workflowVersion: version,
@@ -55,7 +55,7 @@ export const WorkflowDiagramEffect = () => {
);
}
const lastCreatedStepId = store.get(workflowLastCreatedStepIdAtom);
const lastCreatedStepId = store.get(workflowLastCreatedStepId);
if (isDefined(lastCreatedStepId)) {
mergedWorkflowDiagram.nodes = mergedWorkflowDiagram.nodes.map(
@@ -67,12 +67,12 @@ export const WorkflowDiagramEffect = () => {
},
);
store.set(workflowLastCreatedStepIdAtom, undefined);
store.set(workflowLastCreatedStepId, undefined);
}
store.set(workflowDiagramAtom, mergedWorkflowDiagram);
store.set(workflowDiagram, mergedWorkflowDiagram);
},
[workflowDiagramAtom, workflowLastCreatedStepIdAtom, store],
[workflowDiagram, workflowLastCreatedStepId, store],
);
useEffect(() => {
packages/twenty-front/src/modules/workflow/workflow-diagram/components/WorkflowRunVisualizerEffect.tsx
+21 -22
View File
@@ -40,19 +40,18 @@ export const WorkflowRunVisualizerEffect = ({
workflowVisualizerWorkflowVersionIdComponentState,
);
const workflowVisualizerWorkflowIdAtom =
useRecoilComponentStateCallbackStateV2(
workflowVisualizerWorkflowIdComponentState,
);
const workflowVisualizerWorkflowId = useRecoilComponentStateCallbackStateV2(
workflowVisualizerWorkflowIdComponentState,
);
const setWorkflowVisualizerWorkflowId = useSetRecoilComponentStateV2(
workflowVisualizerWorkflowIdComponentState,
);
const flowAtom = useRecoilComponentStateCallbackStateV2(flowComponentState);
const workflowDiagramAtom = useRecoilComponentStateCallbackStateV2(
const flow = useRecoilComponentStateCallbackStateV2(flowComponentState);
const workflowDiagram = useRecoilComponentStateCallbackStateV2(
workflowDiagramComponentState,
);
const workflowSelectedNodeAtom = useRecoilComponentStateCallbackStateV2(
const workflowSelectedNode = useRecoilComponentStateCallbackStateV2(
workflowSelectedNodeComponentState,
);
@@ -103,8 +102,8 @@ export const WorkflowRunVisualizerEffect = ({
isInRightDrawer: boolean;
}) => {
if (!(isDefined(workflowRunState) && isDefined(versionId))) {
store.set(flowAtom, undefined);
store.set(workflowDiagramAtom, undefined);
store.set(flow, undefined);
store.set(workflowDiagram, undefined);
return;
}
@@ -115,7 +114,7 @@ export const WorkflowRunVisualizerEffect = ({
store.set(workflowDiagramStatusState, 'computing-diagram');
}
store.set(flowAtom, {
store.set(flow, {
workflowVersionId: versionId,
trigger: workflowRunState.flow.trigger,
steps: workflowRunState.flow.steps,
@@ -133,7 +132,7 @@ export const WorkflowRunVisualizerEffect = ({
}
if (!isDefined(stepToOpenByDefault)) {
store.set(workflowDiagramAtom, baseWorkflowRunDiagram);
store.set(workflowDiagram, baseWorkflowRunDiagram);
return;
}
@@ -148,31 +147,31 @@ export const WorkflowRunVisualizerEffect = ({
step.isInRightDrawer === inRightDrawer,
);
const workflowVisualizerWorkflowId = store.get(
workflowVisualizerWorkflowIdAtom,
const currentWorkflowVisualizerWorkflowId = store.get(
workflowVisualizerWorkflowId,
);
if (!isDefined(workflowVisualizerWorkflowId)) {
if (!isDefined(currentWorkflowVisualizerWorkflowId)) {
throw new Error(
'The workflow id must be set; ensure the workflow id is always set before rendering the workflow diagram.',
);
}
if (inRightDrawer) {
store.set(workflowDiagramAtom, baseWorkflowRunDiagram);
store.set(workflowDiagram, baseWorkflowRunDiagram);
} else {
const workflowRunDiagram = selectWorkflowDiagramNode({
diagram: baseWorkflowRunDiagram,
nodeIdToSelect: stepToOpenByDefault.id,
});
store.set(workflowDiagramAtom, workflowRunDiagram);
store.set(workflowDiagram, workflowRunDiagram);
}
if (hasStepAlreadyBeenOpenedAutomatically) {
return;
}
store.set(workflowSelectedNodeAtom, stepToOpenByDefault.id);
store.set(workflowSelectedNode, stepToOpenByDefault.id);
store.set(workflowRunDiagramAutomaticallyOpenedStepsState, [
...workflowRunDiagramAutomaticallyOpenedSteps,
@@ -183,7 +182,7 @@ export const WorkflowRunVisualizerEffect = ({
]);
openWorkflowRunViewStepInCommandMenu({
workflowId: workflowVisualizerWorkflowId,
workflowId: currentWorkflowVisualizerWorkflowId,
workflowRunId,
title: stepToOpenByDefault.data.name,
icon: getIcon(getWorkflowNodeIconKey(stepToOpenByDefault.data)),
@@ -192,15 +191,15 @@ export const WorkflowRunVisualizerEffect = ({
});
},
[
flowAtom,
flow,
getIcon,
openWorkflowRunViewStepInCommandMenu,
workflowDiagramAtom,
workflowDiagram,
workflowDiagramStatusState,
workflowRunDiagramAutomaticallyOpenedStepsState,
workflowRunId,
workflowSelectedNodeAtom,
workflowVisualizerWorkflowIdAtom,
workflowSelectedNode,
workflowVisualizerWorkflowId,
store,
],
);
packages/twenty-front/src/modules/workflow/workflow-diagram/hooks/useSetInitialWorkflowRunRightDrawerTab.ts
+9 -8
View File
@@ -2,13 +2,14 @@ import { getIsInputTabDisabled } from '@/command-menu/pages/workflow/step/view-r
import { getIsOutputTabDisabled } from '@/command-menu/pages/workflow/step/view-run/utils/getIsOutputTabDisabled';
import { commandMenuPageInfoState } from '@/command-menu/states/commandMenuPageInfoState';
import { activeTabIdComponentState } from '@/ui/layout/tab-list/states/activeTabIdComponentState';
import { jotaiStore } from '@/ui/utilities/state/jotai/jotaiStore';
import { WorkflowRunTabId } from '@/workflow/workflow-steps/types/WorkflowRunTabId';
import { useCallback } from 'react';
import { isDefined } from 'twenty-shared/utils';
import { type WorkflowRunStepStatus } from '@/workflow/types/Workflow';
import { useStore } from 'jotai';
export const useSetInitialWorkflowRunRightDrawerTab = () => {
const store = useStore();
const setInitialWorkflowRunRightDrawerTab = useCallback(
({
workflowSelectedNode,
@@ -17,14 +18,14 @@ export const useSetInitialWorkflowRunRightDrawerTab = () => {
workflowSelectedNode: string;
stepExecutionStatus: WorkflowRunStepStatus;
}) => {
const commandMenuPageInfo = jotaiStore.get(commandMenuPageInfoState.atom);
const commandMenuPageInfo = store.get(commandMenuPageInfoState.atom);
const activeTabIdAtom = activeTabIdComponentState.atomFamily({
const activeTabId = activeTabIdComponentState.atomFamily({
instanceId: commandMenuPageInfo.instanceId,
});
const activeWorkflowRunRightDrawerTab = jotaiStore.get(
activeTabIdAtom,
const activeWorkflowRunRightDrawerTab = store.get(
activeTabId,
) as WorkflowRunTabId | null;
const isInputTabDisabled = getIsInputTabDisabled({
@@ -40,7 +41,7 @@ export const useSetInitialWorkflowRunRightDrawerTab = () => {
? WorkflowRunTabId.NODE
: WorkflowRunTabId.OUTPUT;
jotaiStore.set(activeTabIdAtom, defaultTabId);
store.set(activeTabId, defaultTabId);
return;
}
@@ -51,10 +52,10 @@ export const useSetInitialWorkflowRunRightDrawerTab = () => {
(isOutputTabDisabled &&
activeWorkflowRunRightDrawerTab === WorkflowRunTabId.OUTPUT)
) {
jotaiStore.set(activeTabIdAtom, WorkflowRunTabId.NODE);
store.set(activeTabId, WorkflowRunTabId.NODE);
}
},
[],
[store],
);
return {
packages/twenty-front/src/modules/workflow/workflow-steps/filters/hooks/useAddRootStepFilter.ts
+6 -6
View File
@@ -19,11 +19,11 @@ export const useAddRootStepFilter = () => {
const { stepId, onFilterSettingsUpdate } = useContext(
WorkflowStepFilterContext,
);
const currentStepFilterGroupsAtom = useRecoilComponentStateCallbackStateV2(
const currentStepFilterGroups = useRecoilComponentStateCallbackStateV2(
currentStepFilterGroupsComponentState,
);
const currentStepFiltersAtom = useRecoilComponentStateCallbackStateV2(
const currentStepFilters = useRecoilComponentStateCallbackStateV2(
currentStepFiltersComponentState,
);
@@ -57,8 +57,8 @@ export const useAddRootStepFilter = () => {
positionInStepFilterGroup: 0,
};
store.set(currentStepFilterGroupsAtom, [newStepFilterGroup]);
store.set(currentStepFiltersAtom, [newStepFilter]);
store.set(currentStepFilterGroups, [newStepFilterGroup]);
store.set(currentStepFilters, [newStepFilter]);
setHasInitializedCurrentStepFilters(true);
setHasInitializedCurrentStepFilterGroups(true);
@@ -69,8 +69,8 @@ export const useAddRootStepFilter = () => {
});
}, [
onFilterSettingsUpdate,
currentStepFilterGroupsAtom,
currentStepFiltersAtom,
currentStepFilterGroups,
currentStepFilters,
setHasInitializedCurrentStepFilters,
setHasInitializedCurrentStepFilterGroups,
store,
packages/twenty-front/src/modules/workflow/workflow-steps/filters/hooks/useRemoveStepFilter.ts
+10 -10
View File
@@ -9,11 +9,11 @@ import { WorkflowStepFilterContext } from '@/workflow/workflow-steps/filters/sta
export const useRemoveStepFilter = () => {
const { onFilterSettingsUpdate } = useContext(WorkflowStepFilterContext);
const currentStepFiltersAtom = useRecoilComponentStateCallbackStateV2(
const currentStepFilters = useRecoilComponentStateCallbackStateV2(
currentStepFiltersComponentState,
);
const currentStepFilterGroupsAtom = useRecoilComponentStateCallbackStateV2(
const currentStepFilterGroups = useRecoilComponentStateCallbackStateV2(
currentStepFilterGroupsComponentState,
);
@@ -21,8 +21,8 @@ export const useRemoveStepFilter = () => {
const removeStepFilter = useCallback(
(stepFilterId: string) => {
const stepFilters = store.get(currentStepFiltersAtom);
const stepFilterGroups = store.get(currentStepFilterGroupsAtom);
const stepFilters = store.get(currentStepFilters);
const stepFilterGroups = store.get(currentStepFilterGroups);
const rootStepFilterGroup = stepFilterGroups.find(
(filterGroup) => !isDefined(filterGroup.parentStepFilterGroupId),
@@ -69,16 +69,16 @@ export const useRemoveStepFilter = () => {
updatedStepFilters.length === 0;
if (shouldResetStepFilterSettings) {
store.set(currentStepFilterGroupsAtom, []);
store.set(currentStepFiltersAtom, []);
store.set(currentStepFilterGroups, []);
store.set(currentStepFilters, []);
onFilterSettingsUpdate({
stepFilterGroups: [],
stepFilters: [],
});
} else {
store.set(currentStepFilterGroupsAtom, updatedStepFilterGroups);
store.set(currentStepFiltersAtom, updatedStepFilters);
store.set(currentStepFilterGroups, updatedStepFilterGroups);
store.set(currentStepFilters, updatedStepFilters);
onFilterSettingsUpdate({
stepFilters: updatedStepFilters,
@@ -88,8 +88,8 @@ export const useRemoveStepFilter = () => {
},
[
onFilterSettingsUpdate,
currentStepFilterGroupsAtom,
currentStepFiltersAtom,
currentStepFilterGroups,
currentStepFilters,
store,
],
);
packages/twenty-front/src/modules/workflow/workflow-steps/filters/hooks/useRemoveStepFilterGroup.ts
+10 -10
View File
@@ -9,11 +9,11 @@ import { isDefined } from 'twenty-shared/utils';
export const useRemoveStepFilterGroup = () => {
const { onFilterSettingsUpdate } = useContext(WorkflowStepFilterContext);
const currentStepFilterGroupsAtom = useRecoilComponentStateCallbackStateV2(
const currentStepFilterGroups = useRecoilComponentStateCallbackStateV2(
currentStepFilterGroupsComponentState,
);
const currentStepFiltersAtom = useRecoilComponentStateCallbackStateV2(
const currentStepFilters = useRecoilComponentStateCallbackStateV2(
currentStepFiltersComponentState,
);
@@ -21,8 +21,8 @@ export const useRemoveStepFilterGroup = () => {
const removeStepFilterGroup = useCallback(
(stepFilterGroupId: string) => {
const stepFilterGroups = store.get(currentStepFilterGroupsAtom);
const stepFilters = store.get(currentStepFiltersAtom);
const stepFilterGroups = store.get(currentStepFilterGroups);
const stepFilters = store.get(currentStepFilters);
const rootStepFilterGroup = stepFilterGroups.find(
(filterGroup) => !isDefined(filterGroup.parentStepFilterGroupId),
@@ -42,16 +42,16 @@ export const useRemoveStepFilterGroup = () => {
updatedStepFilters.length === 0;
if (shouldResetStepFilterSettings) {
store.set(currentStepFilterGroupsAtom, []);
store.set(currentStepFiltersAtom, []);
store.set(currentStepFilterGroups, []);
store.set(currentStepFilters, []);
onFilterSettingsUpdate({
stepFilterGroups: [],
stepFilters: [],
});
} else {
store.set(currentStepFilterGroupsAtom, updatedStepFilterGroups);
store.set(currentStepFiltersAtom, updatedStepFilters);
store.set(currentStepFilterGroups, updatedStepFilterGroups);
store.set(currentStepFilters, updatedStepFilters);
onFilterSettingsUpdate({
stepFilterGroups: updatedStepFilterGroups,
@@ -61,8 +61,8 @@ export const useRemoveStepFilterGroup = () => {
},
[
onFilterSettingsUpdate,
currentStepFilterGroupsAtom,
currentStepFiltersAtom,
currentStepFilterGroups,
currentStepFilters,
store,
],
);
packages/twenty-front/src/modules/workflow/workflow-steps/filters/hooks/useUpsertStepFilterSettings.ts
+8 -8
View File
@@ -8,11 +8,11 @@ import { type StepFilter, type StepFilterGroup } from 'twenty-shared/types';
import { isDefined } from 'twenty-shared/utils';
export const useUpsertStepFilterSettings = () => {
const currentStepFilterGroupsAtom = useRecoilComponentStateCallbackStateV2(
const currentStepFilterGroups = useRecoilComponentStateCallbackStateV2(
currentStepFilterGroupsComponentState,
);
const currentStepFiltersAtom = useRecoilComponentStateCallbackStateV2(
const currentStepFilters = useRecoilComponentStateCallbackStateV2(
currentStepFiltersComponentState,
);
const { onFilterSettingsUpdate } = useContext(WorkflowStepFilterContext);
@@ -27,8 +27,8 @@ export const useUpsertStepFilterSettings = () => {
stepFilterGroupToUpsert?: StepFilterGroup;
stepFilterToUpsert?: StepFilter;
}) => {
const stepFilterGroups = store.get(currentStepFilterGroupsAtom);
const stepFilters = store.get(currentStepFiltersAtom);
const stepFilterGroups = store.get(currentStepFilterGroups);
const stepFilters = store.get(currentStepFilters);
const updatedStepFilterGroups = [...stepFilterGroups];
const updatedStepFilters = [...stepFilters];
@@ -43,7 +43,7 @@ export const useUpsertStepFilterSettings = () => {
} else {
updatedStepFilterGroups.push(stepFilterGroupToUpsert);
}
store.set(currentStepFilterGroupsAtom, updatedStepFilterGroups);
store.set(currentStepFilterGroups, updatedStepFilterGroups);
}
if (isDefined(stepFilterToUpsert)) {
@@ -56,7 +56,7 @@ export const useUpsertStepFilterSettings = () => {
} else {
updatedStepFilters.push(stepFilterToUpsert);
}
store.set(currentStepFiltersAtom, updatedStepFilters);
store.set(currentStepFilters, updatedStepFilters);
}
onFilterSettingsUpdate({
@@ -66,8 +66,8 @@ export const useUpsertStepFilterSettings = () => {
},
[
onFilterSettingsUpdate,
currentStepFilterGroupsAtom,
currentStepFiltersAtom,
currentStepFilterGroups,
currentStepFilters,
store,
],
);
packages/twenty-front/src/modules/workflow/workflow-steps/workflow-actions/find-records-action/components/WorkflowFindRecordsFilters.tsx
+7 -12
View File
@@ -20,33 +20,28 @@ export const WorkflowFindRecordsFilters = ({
onChange: (filter: FindRecordsActionFilter) => void;
readonly?: boolean;
}) => {
const currentRecordFilterGroupsAtom = useRecoilComponentStateCallbackStateV2(
const currentRecordFilterGroups = useRecoilComponentStateCallbackStateV2(
currentRecordFilterGroupsComponentState,
);
const currentRecordFiltersAtom = useRecoilComponentStateCallbackStateV2(
const currentRecordFilters = useRecoilComponentStateCallbackStateV2(
currentRecordFiltersComponentState,
);
const store = useStore();
const onUpdate = useCallback(() => {
const currentRecordFilterGroups = store.get(currentRecordFilterGroupsAtom);
const existingRecordFilterGroups = store.get(currentRecordFilterGroups);
const currentRecordFilters = store.get(currentRecordFiltersAtom);
const existingRecordFilters = store.get(currentRecordFilters);
const newFilter = {
recordFilterGroups: currentRecordFilterGroups,
recordFilters: currentRecordFilters,
recordFilterGroups: existingRecordFilterGroups,
recordFilters: existingRecordFilters,
} satisfies FindRecordsActionFilter;
onChange(newFilter);
}, [
currentRecordFilterGroupsAtom,
currentRecordFiltersAtom,
onChange,
store,
]);
}, [currentRecordFilterGroups, currentRecordFilters, onChange, store]);
return (
<AdvancedFilterCommandMenuContainer
packages/twenty-front/src/modules/workflow/workflow-trigger/components/CronExpressionHelper.tsx
+2 -2
View File
@@ -9,7 +9,7 @@ import { useRecoilValueV2 } from '@/ui/utilities/state/jotai/hooks/useRecoilValu
import styled from '@emotion/styled';
import { t } from '@lingui/core/macro';
import { CronExpressionParser } from 'cron-parser';
import { dateLocaleStateV2 } from '~/localization/states/dateLocaleStateV2';
import { dateLocaleState } from '~/localization/states/dateLocaleState';
import { formatDateTimeString } from '~/utils/string/formatDateTimeString';
const getNextExecutions = (
@@ -93,7 +93,7 @@ export const CronExpressionHelper = ({
isUpcomingExecutionVisible = true,
}: CronExpressionHelperProps) => {
const { timeZone, dateFormat, timeFormat } = useDateTimeFormat();
const dateLocale = useRecoilValueV2(dateLocaleStateV2);
const dateLocale = useRecoilValueV2(dateLocaleState);
if (!isVisible) {
return null;
packages/twenty-front/src/modules/workflow/workflow-trigger/components/WorkflowEditTriggerCronForm.tsx
+2 -2
View File
@@ -17,7 +17,7 @@ import { isNumber } from '@sniptt/guards';
import { useState } from 'react';
import { isDefined } from 'twenty-shared/utils';
import { TRIGGER_STEP_ID } from 'twenty-shared/workflow';
import { dateLocaleStateV2 } from '~/localization/states/dateLocaleStateV2';
import { dateLocaleState } from '~/localization/states/dateLocaleState';
type WorkflowEditTriggerCronFormProps = {
trigger: WorkflowCronTrigger;
@@ -48,7 +48,7 @@ export const WorkflowEditTriggerCronForm = ({
}: WorkflowEditTriggerCronFormProps) => {
const [errorMessages, setErrorMessages] = useState<FormErrorMessages>({});
const [errorMessagesVisible, setErrorMessagesVisible] = useState(false);
const dateLocale = useRecoilValueV2(dateLocaleStateV2);
const dateLocale = useRecoilValueV2(dateLocaleState);
const customDescription = getTriggerScheduleDescription(
trigger,