From bc4ae35bc4e1ceaba7a8e1052e592bb6e169fba3 Mon Sep 17 00:00:00 2001 From: Charles Bochet Date: Wed, 25 Feb 2026 22:28:25 +0100 Subject: [PATCH] Rework atom naming (#18240) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ## Summary - **Enhanced the `matching-state-variable` ESLint rule** to enforce consistent naming for `ComponentState`, `FamilyState`, and `ComponentFamilyState` hooks — previously it only covered `useAtomState` and `useAtomStateValue` - **The rule now checks 12 hooks** across three categories: value hooks (`useAtomComponentStateValue`, `useAtomFamilyStateValue`, etc.), state hooks (`useAtomComponentState`, `useAtomComponentFamilyState`), and setter hooks (`useSetAtomState`, `useSetAtomComponentState`, `useSetAtomFamilyState`, `useSetAtomComponentFamilyState`) - **Fixed all 225 resulting lint violations** across 151 files, renaming variables to match their state atom names (e.g. `currentViewId` → `contextStoreCurrentViewId`, `selectedRecord` → `recordStore`). Cases where the same state is accessed with different family keys/instance IDs are suppressed with `eslint-disable-next-line`. ## Naming convention | Hook | State argument | Valid | Invalid | |------|---------------|-------|---------| | `useAtomStateValue` | `fooState` | `const foo = ...` | `const bar = ...` | | `useAtomComponentStateValue` | `fooComponentState` | `const foo = ...` | `const bar = ...` | | `useAtomFamilyStateValue` | `fooFamilyState` | `const foo = ...` | `const bar = ...` | | `useAtomComponentFamilyStateValue` | `fooComponentFamilyState` | `const foo = ...` | `const bar = ...` | | `useAtomState` | `fooState` | `const [foo, setFoo] = ...` | `const [bar, setBar] = ...` | | `useAtomComponentState` | `fooComponentState` | `const [foo, setFoo] = ...` | `const [bar, setBar] = ...` | | `useAtomComponentFamilyState` | `fooComponentFamilyState` | `const [foo, setFoo] = ...` | `const [bar, setBar] = ...` | | `useSetAtomState` | `fooState` | `const setFoo = ...` | `const setBar = ...` | | `useSetAtomComponentState` | `fooComponentState` | `const setFoo = ...` | `const setBar = ...` | | `useSetAtomFamilyState` | `fooFamilyState` | `const setFoo = ...` | `const setBar = ...` | | `useSetAtomComponentFamilyState` | `fooComponentFamilyState` | `const setFoo = ...` | `const setBar = ...` | --- .../rules/matching-state-variable.spec.ts | 119 ++++++++-- .../rules/matching-state-variable.ts | 211 ++++++++++++------ .../components/ActionOpenSidePanelPage.tsx | 4 +- .../display/components/ActionDropdownItem.tsx | 4 +- .../CreateNewViewNoSelectionRecord.tsx | 8 +- ...eDeletedRecordsNoSelectionRecordAction.tsx | 6 +- ...eDeletedRecordsNoSelectionRecordAction.tsx | 6 +- .../hooks/useRunWorkflowRecordActions.tsx | 4 +- .../AddToFavoritesSingleRecordAction.tsx | 9 +- .../ExportNoteActionSingleRecordAction.tsx | 11 +- .../CancelDashboardSingleRecordAction.tsx | 7 +- .../EditDashboardSingleRecordAction.tsx | 7 +- .../SaveDashboardSingleRecordAction.tsx | 7 +- ...eeVersionWorkflowRunSingleRecordAction.tsx | 6 +- ...eWorkflowWorkflowRunSingleRecordAction.tsx | 6 +- ...eRunsWorkflowVersionSingleRecordAction.tsx | 9 +- ...sionsWorkflowVersionSingleRecordAction.tsx | 9 +- ...kflowWorkflowVersionSingleRecordAction.tsx | 7 +- .../useRunWorkflowRecordAgnosticActions.tsx | 4 +- .../RecordIndexActionMenuDropdown.tsx | 6 +- .../RecordShowRightDrawerOpenRecordButton.tsx | 14 +- .../action-menu/hooks/useRegisteredActions.ts | 4 +- .../useShouldActionBeRegisteredParams.ts | 4 +- .../useActivityTargetObjectRecords.test.tsx | 6 +- .../hooks/useUpdateActivityTargetFromCell.ts | 6 +- .../components/EventRow.tsx | 9 +- .../components/EventFieldDiffValueEffect.tsx | 6 +- .../ai/components/ThinkingStepsDisplay.tsx | 4 +- .../ai/hooks/useAgentChatScrollToBottom.ts | 4 +- ...TwoFactorAuthenticationProvisionEffect.tsx | 4 +- .../components/CustomSlashMenuListItem.tsx | 4 +- .../client-config/hooks/useClientConfig.ts | 24 +- ...seCommandMenuItemFrontComponentActions.tsx | 17 +- .../command-menu/components/CommandMenu.tsx | 5 +- .../components/CommandMenuContainer.tsx | 9 +- .../components/CommandMenuFolderInfo.tsx | 16 +- ...CommandMenuItemWithAddToNavigationDrag.tsx | 6 +- .../components/CommandMenuLinkInfo.tsx | 16 +- .../components/CommandMenuPageLayoutInfo.tsx | 6 +- .../CommandMenuPageLayoutInfoContent.tsx | 24 +- .../CommandMenuWorkflowStepInfo.tsx | 10 +- .../useOpenRecordInCommandMenu.test.tsx | 33 +-- .../useSetGlobalCommandMenuContext.test.tsx | 50 +++-- .../__tests__/useWorkflowCommandMenu.test.tsx | 50 ++--- .../hooks/useCommandMenuHotKeys.ts | 9 +- .../CommandMenuPageLayoutChartSettings.tsx | 4 +- .../CommandMenuPageLayoutGraphFilter.tsx | 4 +- .../CommandMenuPageLayoutTabSettings.tsx | 21 +- .../CommandMenuPageLayoutWidgetTypeSelect.tsx | 4 +- .../components/WidgetSettingsFooter.tsx | 10 +- ...ageLayoutFromContextStoreTargetedRecord.ts | 14 +- ...ageLayoutFromContextStoreTargetedRecord.ts | 12 +- .../hooks/useUpdateCurrentWidgetConfig.ts | 6 +- .../page-layout/hooks/useWidgetInEditMode.ts | 4 +- .../hooks/useCommandMenuWorkflowIdOrThrow.ts | 6 +- .../useCommandMenuWorkflowRunIdOrThrow.ts | 6 +- .../useCommandMenuWorkflowVersionIdOrThrow.ts | 6 +- .../components/MainContextStoreProvider.tsx | 4 +- .../useContextStoreObjectMetadataItem.ts | 4 +- ...seContextStoreObjectMetadataItemOrThrow.ts | 4 +- .../useGetPublicWorkspaceDataByDomain.ts | 4 +- .../CurrentWorkspaceMemberFavorites.tsx | 10 +- .../components/FavoritesBackButton.tsx | 6 +- .../components/FavoriteFolderPicker.tsx | 8 +- .../components/FavoriteFolderPickerEffect.tsx | 6 +- .../components/FavoriteFolderPickerList.tsx | 8 +- .../FavoriteFolderPickerSearchInput.tsx | 6 +- .../components/FrontComponentRenderer.tsx | 4 +- .../useFrontComponentExecutionContext.ts | 4 +- .../components/InformationBanner.tsx | 4 +- .../hooks/useDismissReconnectAccountBanner.ts | 4 +- .../IsAppMetadataReadyEffect.tsx | 16 +- .../UserMetadataProviderInitialEffect.tsx | 6 +- ...rentWorkspaceMemberNavigationMenuItems.tsx | 10 +- .../NavigationMenuItemBackButton.tsx | 4 +- .../WorkspaceNavigationMenuItemsFolder.tsx | 6 +- ...emoveNavigationMenuItemByTargetRecordId.ts | 6 +- .../useFetchMoreRecordsWithPagination.ts | 8 +- ...bjectFilterDropdownAnyFieldSearchInput.tsx | 9 +- ...jectFilterDropdownFilterSelectMenuItem.tsx | 4 +- .../useObjectFilterDropdownFilterValue.ts | 5 +- .../ObjectOptionsDropdownCustomView.tsx | 8 +- ...tionsDropdownHiddenRecordGroupsContent.tsx | 8 +- .../ObjectOptionsDropdownLayoutContent.tsx | 8 +- ...ptionsDropdownRecordGroupFieldsContent.tsx | 10 +- ...tOptionsDropdownRecordGroupSortContent.tsx | 18 +- ...jectOptionsDropdownRecordGroupsContent.tsx | 16 +- .../hooks/useSearchRecordGroupField.ts | 14 +- .../hooks/useUpdateObjectViewOptions.ts | 12 +- .../components/ObjectSortDropdownButton.tsx | 4 +- .../components/RecordBoardContainer.tsx | 6 +- ...rdBoardFetchMoreInViewTriggerComponent.tsx | 26 ++- .../components/RecordBoardQueryEffect.tsx | 14 +- .../RecordBoardScrollToFocusedCardEffect.tsx | 10 +- .../RecordBoardSelectRecordsEffect.tsx | 8 +- .../RecordBoardStickyHeaderEffect.tsx | 6 +- ...useRemoveSelectedRecordsFromRecordBoard.ts | 6 +- .../RecordBoardCardCellEditModePortal.tsx | 7 +- .../components/RecordBoardCard.tsx | 33 +-- .../RecordBoardCardDraggableContainer.tsx | 4 +- .../components/RecordBoardCardHeader.tsx | 21 +- .../useRecordBoardCardMetadataFromPosition.ts | 12 +- .../components/RecordBoardColumn.tsx | 4 +- .../RecordBoardColumnCardsContainer.tsx | 6 +- ...mnHeaderAggregateDropdownFieldsContent.tsx | 4 +- ...nHeaderAggregateDropdownOptionsContent.tsx | 4 +- .../RecordBoardColumnHeaderWrapper.tsx | 4 +- .../RecordIndexCalendarDataLoaderEffect.tsx | 8 +- .../RecordCalendarMonth.stories.tsx | 6 +- .../RecordCalendarCardCellEditModePortal.tsx | 7 +- .../RecordCalendarCardCellHoveredPortal.tsx | 7 +- .../components/RecordCalendarCard.tsx | 10 +- .../components/RecordCalendarCardHeader.tsx | 12 +- ...eRecordCalendarCardMetadataFromPosition.ts | 12 +- .../hooks/__tests__/useEndRecordDrag.test.tsx | 19 +- .../__tests__/useStartRecordDrag.test.tsx | 36 +-- .../useProcessTableWithGroupRecordDrop.ts | 6 +- .../RecordFieldListCellEditModePortal.tsx | 7 +- .../RecordFieldListCellHoveredPortal.tsx | 7 +- .../useFieldListFieldMetadataFromPosition.ts | 12 +- .../components/FormSingleRecordPicker.tsx | 10 +- .../hooks/__tests__/useIsFieldEmpty.test.tsx | 6 +- .../display/components/ChipFieldDisplay.tsx | 2 +- .../display/components/FilesFieldDisplay.tsx | 6 +- ...ationFromManyFieldDisplay.perf.stories.tsx | 6 +- .../ui/meta-types/hooks/useAddressField.ts | 4 +- .../ui/meta-types/hooks/useArrayField.ts | 4 +- .../ui/meta-types/hooks/useChipField.ts | 4 +- .../meta-types/hooks/useChipFieldDisplay.ts | 4 +- .../ui/meta-types/hooks/useCurrencyField.ts | 4 +- .../ui/meta-types/hooks/useEmailsField.ts | 4 +- .../ui/meta-types/hooks/useFilesField.ts | 4 +- .../ui/meta-types/hooks/useFullNameField.ts | 4 +- .../ui/meta-types/hooks/useJsonField.ts | 6 +- .../ui/meta-types/hooks/useLinksField.ts | 4 +- .../meta-types/hooks/useMorphRelationField.ts | 4 +- .../meta-types/hooks/useMultiSelectField.ts | 4 +- .../ui/meta-types/hooks/useNumberField.ts | 4 +- .../ui/meta-types/hooks/usePhonesField.ts | 4 +- .../ui/meta-types/hooks/useRelationField.ts | 4 +- .../ui/meta-types/hooks/useSelectField.ts | 4 +- .../ui/meta-types/hooks/useTextField.ts | 4 +- .../input/components/EmailsFieldInput.tsx | 4 +- .../input/components/FilesFieldInput.tsx | 4 +- .../input/components/LinksFieldInput.tsx | 4 +- .../MorphRelationManyToOneFieldInput.tsx | 8 +- .../MorphRelationOneToManyFieldInput.tsx | 4 +- .../input/components/PhonesFieldInput.tsx | 4 +- .../RelationManyToOneFieldInput.tsx | 8 +- .../RelationOneToManyFieldInput.tsx | 4 +- .../__stories__/BooleanFieldInput.stories.tsx | 9 +- .../RecordGroupMenuItemDraggable.tsx | 43 ++-- .../RecordGroupReorderConfirmationModal.tsx | 4 +- .../hooks/useRecordGroupFilter.ts | 13 +- .../useRecordGroupReorderConfirmationModal.ts | 4 +- .../hooks/useReorderRecordGroups.ts | 8 +- .../hooks/useShouldHideRecordGroup.ts | 6 +- ...RecordIndexFiltersToContextStoreEffect.tsx | 12 +- .../components/RecordIndexTableContainer.tsx | 6 +- .../hooks/useRecordIndexLazyFetchRecords.ts | 5 +- .../hooks/useHandleIndexIdentifierClick.ts | 4 +- ...useRecordIndexGroupCommonQueryVariables.ts | 6 +- .../components/RecordInlineCellEditMode.tsx | 12 +- .../hooks/useMergeRecordsActions.ts | 6 +- ...RecordAndObjectMetadataItemFromRecordId.ts | 6 +- .../MultipleRecordPickerFetchMoreLoader.tsx | 18 +- .../MultipleRecordPickerLoadingEffect.tsx | 18 +- .../MultipleRecordPickerMenuItemContent.tsx | 16 +- .../MultipleRecordPickerSearchInput.tsx | 10 +- .../components/SingleRecordPicker.tsx | 6 +- .../components/SingleRecordPickerMenuItem.tsx | 32 +-- .../SingleRecordPickerMenuItems.tsx | 19 +- .../SingleRecordPickerMenuItemsWithSearch.tsx | 4 +- .../useSingleRecordPickerRecords.test.tsx | 6 +- .../hooks/useSingleRecordPickerRecords.ts | 10 +- .../hooks/useSingleRecordPickerSearch.ts | 8 +- .../useUpsertRecordsInStore.test.tsx | 28 +-- .../RecordTableColumnWidthEffect.tsx | 6 +- .../components/RecordTableRecordGroupRows.tsx | 4 +- .../RecordTableScrollToFocusedCellEffect.tsx | 10 +- .../RecordTableScrollToFocusedRowEffect.tsx | 14 +- .../perf/RecordTableCell.perf.stories.tsx | 13 +- .../components/RecordTableEmptyState.tsx | 4 +- .../RecordTableRecordGroupBodyEffect.tsx | 6 +- .../components/RecordTableCellEditMode.tsx | 12 +- .../RecordTableCellEditModePortal.tsx | 10 +- .../RecordTableCellFirstRowFirstColumn.tsx | 10 +- .../RecordTableCellFocusedPortal.tsx | 20 +- .../RecordTableCellFocusedPortalContent.tsx | 24 +- .../RecordTableCellHoveredPortal.tsx | 10 +- .../RecordTableCellHoveredPortalContent.tsx | 20 +- .../components/RecordTableCellPortals.tsx | 4 +- .../useCloseRecordTableCellInGroup.test.tsx | 6 +- .../useCloseRecordTableCellNoGroup.test.tsx | 6 +- ...eCurrentlyFocusedRecordTableCellFocusId.ts | 6 +- .../hooks/useMoveHoverToCurrentCell.ts | 6 +- .../hooks/useOpenRecordTableCell.ts | 12 +- ...egateRecordsForRecordTableColumnFooter.tsx | 18 +- .../hooks/useViewFieldAggregateOperation.tsx | 4 +- .../RecordTableHeaderAddColumnButton.tsx | 15 +- .../components/RecordTableHeaderCell.tsx | 19 +- .../RecordTableHeaderCheckboxColumn.tsx | 15 +- .../RecordTableHeaderDragDropColumn.tsx | 15 +- .../components/RecordTableHeaderFirstCell.tsx | 19 +- .../RecordTableHeaderFirstScrollableCell.tsx | 21 +- .../RecordTableHeaderLastEmptyColumn.tsx | 15 +- .../RecordTableHeaderResizeHandler.tsx | 6 +- .../hooks/useResizeTableHeader.ts | 16 +- .../RecordTableDraggableTrFirstRowOfGroup.tsx | 4 +- .../components/RecordTableFirstRowOfGroup.tsx | 4 +- .../components/RecordTableRow.tsx | 8 +- .../components/RecordTableTr.tsx | 39 ++-- .../hooks/useIsRecordSecondaryDragged.ts | 4 +- .../hooks/useRecordTableRowHotkeys.ts | 4 +- .../RecordTableRecordGroupSection.tsx | 14 +- .../RecordTableRecordGroupSectionAddNew.tsx | 8 +- .../RecordTableRecordGroupSectionLoadMore.tsx | 11 +- .../RecordTableRowVirtualizedContainer.tsx | 14 +- ...ecordTableRowVirtualizedDebugRowHelper.tsx | 23 +- .../RecordTableRowVirtualizedFullData.tsx | 6 +- ...dTableVirtualizedInitialDataLoadEffect.tsx | 16 +- .../RecordTitleCellTextFieldDisplay.tsx | 6 +- .../RecordTitleCellUuidFieldDisplay.tsx | 4 +- ...penObjectRecordsSpreadsheetImportDialog.ts | 4 +- .../components/PageLayoutGridLayout.tsx | 16 +- .../PageLayoutInitializationQueryEffect.tsx | 13 +- .../PageLayoutRelationWidgetsSyncEffect.tsx | 6 +- .../components/PageLayoutRendererContent.tsx | 4 +- .../components/PageLayoutTabList.tsx | 26 ++- ...youtTabListReorderableOverflowDropdown.tsx | 12 +- .../PageLayoutTabListReorderableTab.tsx | 4 +- .../PageLayoutVerticalListEditor.tsx | 6 +- .../__tests__/useCreatePageLayoutTab.test.tsx | 4 +- .../hooks/useDuplicatePageLayoutTab.ts | 6 +- .../hooks/useDuplicatePageLayoutWidget.ts | 6 +- .../widgets/components/WidgetRenderer.tsx | 18 +- .../FieldWidgetCellEditModePortal.tsx | 6 +- .../field/components/FieldWidgetDisplay.tsx | 8 +- .../FieldWidgetRelationEditAction.tsx | 4 +- .../FieldsWidgetCellEditModePortal.tsx | 11 +- .../FieldsWidgetCellHoveredPortal.tsx | 11 +- .../hooks/useFieldsWidgetGroupsDraft.ts | 6 +- .../hooks/useFieldsWidgetGroupsForDisplay.ts | 4 +- .../graph/components/GraphWidgetLegend.tsx | 19 +- .../components/BarChart.tsx | 4 +- .../components/BarChartTooltip.tsx | 16 +- .../components/GraphWidgetBarChart.tsx | 24 +- .../hooks/useBarChartData.ts | 8 +- .../components/CustomCrosshairLayer.tsx | 22 +- .../components/CustomLinesLayer.tsx | 6 +- .../components/GraphLineChartTooltip.tsx | 21 +- .../components/GraphWidgetLineChart.tsx | 14 +- .../components/LineAnimatedAreaPath.tsx | 6 +- .../hooks/useLineChartData.ts | 6 +- .../components/CustomArcsLayer.tsx | 6 +- .../components/GraphPieChartTooltip.tsx | 16 +- .../components/GraphWidgetPieChart.tsx | 10 +- .../hooks/usePieChartData.ts | 4 +- .../graph/hooks/useLegendItemToggle.ts | 6 +- .../components/StandaloneRichTextWidget.tsx | 4 +- .../components/WidgetCardHeader.tsx | 4 +- .../PrefetchRunFavoriteQueriesEffect.tsx | 31 ++- ...etchRunNavigationMenuItemQueriesEffect.tsx | 12 +- .../prefetch/hooks/useIsPrefetchLoading.ts | 10 +- ...ttingsAccountsMessageChannelsContainer.tsx | 8 +- ...ataModelSetLabelIdentifierRecordEffect.tsx | 9 +- .../SettingsObjectFieldItemTableRow.tsx | 4 +- .../SettingsRoleAssignment.stories.tsx | 4 +- .../SettingsRolePermissions.stories.tsx | 4 +- .../stories/SettingsRoleSettings.stories.tsx | 4 +- .../components/SettingsRoleEditEffect.tsx | 13 +- .../SignInBackgroundMockContainer.tsx | 5 +- .../hooks/useOpenSpreadsheetImportDialog.ts | 6 +- .../components/SpreadsheetImportProvider.tsx | 4 +- .../ui/input/components/IconPicker.tsx | 4 +- .../hooks/__tests__/useCloseDropdown.test.tsx | 18 +- .../hooks/__tests__/useOpenDropdown.test.tsx | 18 +- .../__tests__/useToggleDropdown.test.tsx | 26 ++- ...ultiWorkspaceDropdownDefaultComponents.tsx | 8 +- ...MultiWorkspaceDropdownThemesComponents.tsx | 4 +- ...kspaceDropdownWorkspacesListComponents.tsx | 4 +- .../scroll/components/ScrollWrapper.tsx | 12 +- .../scroll/hooks/useScrollRestoration.ts | 8 +- .../components/UpdateViewButtonGroup.tsx | 6 +- .../ViewBarAnyFieldFilterEffect.tsx | 8 +- .../views/components/ViewBarDetails.tsx | 4 +- ...wBarFilterDropdownAdvancedFilterButton.tsx | 4 +- ...erDropdownAnyFieldSearchButtonMenuItem.tsx | 4 +- ...ewBarFilterDropdownFieldSelectMenuItem.tsx | 4 +- .../components/ViewBarRecordFieldEffect.tsx | 8 +- .../components/ViewBarRecordFilterEffect.tsx | 8 +- .../ViewBarRecordFilterGroupEffect.tsx | 8 +- .../components/ViewBarRecordSortEffect.tsx | 6 +- .../ViewBarFilterDropdown.stories.tsx | 6 +- ...ViewFiltersToCurrentRecordFilters.test.tsx | 18 +- ...rentViewSortsToCurrentRecordSorts.test.tsx | 18 +- ...ViewFiltersToCurrentRecordFilters.test.tsx | 12 +- ...pplyViewSortsToCurrentRecordSorts.test.tsx | 12 +- ...rrentViewAnyFieldFilterToAnyFieldFilter.ts | 6 +- ...FilterGroupsToCurrentRecordFilterGroups.ts | 6 +- ...urrentViewFiltersToCurrentRecordFilters.ts | 6 +- ...plyCurrentViewSortsToCurrentRecordSorts.ts | 4 +- .../views/hooks/useGetCurrentViewOnly.ts | 4 +- .../useOpenAnyFieldSearchFilterFromViewBar.ts | 4 +- .../hooks/useQueryVariablesFromParentView.ts | 9 +- .../views/hooks/useUpdateViewAggregate.ts | 8 +- .../workflow/hooks/useWorkflowRunIdOrThrow.ts | 6 +- .../hooks/useWorkflowVersionIdOrThrow.ts | 6 +- .../components/WorkflowDiagramCanvasBase.tsx | 22 +- .../WorkflowRunVisualizerEffect.tsx | 6 +- .../components/WorkflowRunDiagramStepNode.tsx | 6 +- ...hildStepFiltersAndChildStepFilterGroups.ts | 10 +- ...AgentPermissionsStateOnCommandMenuClose.ts | 14 +- .../object-record/RecordShowPageTitle.tsx | 9 +- .../SettingsAccountsConfiguration.tsx | 4 +- .../SettingsApplicationPermissionsTab.tsx | 6 +- .../pages/settings/roles/SettingsRoleEdit.tsx | 4 +- .../decorators/ContextStoreDecorator.tsx | 6 +- .../decorators/PrefetchLoadedDecorator.tsx | 9 +- .../decorators/PrefetchLoadingDecorator.tsx | 13 +- .../testing/jest/JestContextStoreSetter.tsx | 12 +- 321 files changed, 1824 insertions(+), 1518 deletions(-) diff --git a/packages/twenty-eslint-rules/rules/matching-state-variable.spec.ts b/packages/twenty-eslint-rules/rules/matching-state-variable.spec.ts index de1c55b0a7..0d4325aaf2 100644 --- a/packages/twenty-eslint-rules/rules/matching-state-variable.spec.ts +++ b/packages/twenty-eslint-rules/rules/matching-state-variable.spec.ts @@ -5,58 +5,131 @@ const ruleTester = new TSESLint.RuleTester(); ruleTester.run(RULE_NAME, rule, { valid: [ + // useAtomState / useAtomStateValue (existing) { code: 'const variable = useAtomStateValue(variableState);', }, { code: 'const [variable, setVariable] = useAtomState(variableState);', }, - // Component/Family hooks are not checked by this rule + + // useAtomComponentStateValue / useAtomComponentState { - code: 'const anything = useAtomComponentStateValue(variableComponentState);', + code: 'const variable = useAtomComponentStateValue(variableComponentState);', }, { - code: 'const anything = useAtomFamilyStateValue(variableFamilyState);', + code: 'const [variable, setVariable] = useAtomComponentState(variableComponentState);', + }, + + // useAtomFamilyStateValue + { + code: 'const variable = useAtomFamilyStateValue(variableFamilyState, key);', + }, + + // useAtomComponentFamilyStateValue / useAtomComponentFamilyState + { + code: 'const variable = useAtomComponentFamilyStateValue(variableComponentFamilyState, key);', }, { - code: 'const [anything, setAnything] = useAtomComponentFamilyState(variableComponentFamilyState);', + code: 'const [variable, setVariable] = useAtomComponentFamilyState(variableComponentFamilyState, key);', + }, + + // Setter hooks + { + code: 'const setVariable = useSetAtomState(variableState);', + }, + { + code: 'const setVariable = useSetAtomComponentState(variableComponentState);', + }, + { + code: 'const setVariable = useSetAtomFamilyState(variableFamilyState, key);', + }, + { + code: 'const setVariable = useSetAtomComponentFamilyState(variableComponentFamilyState, key);', }, ], invalid: [ + // useAtomStateValue - wrong variable name { code: 'const myValue = useAtomStateValue(variableState);', - errors: [ - { - messageId: 'invalidVariableName', - }, - ], + errors: [{ messageId: 'invalidVariableName' }], }, + + // useAtomState - wrong variable and setter { code: 'const [myValue, setMyValue] = useAtomState(variableState);', errors: [ - { - messageId: 'invalidVariableName', - }, - { - messageId: 'invalidSetterName', - }, + { messageId: 'invalidVariableName' }, + { messageId: 'invalidSetterName' }, ], }, { code: 'const [myValue] = useAtomState(variableState);', - errors: [ - { - messageId: 'invalidVariableName', - }, - ], + errors: [{ messageId: 'invalidVariableName' }], }, { code: 'const [, setMyValue] = useAtomState(variableState);', + errors: [{ messageId: 'invalidSetterName' }], + }, + + // useAtomComponentStateValue - wrong variable name + { + code: 'const myValue = useAtomComponentStateValue(variableComponentState);', + errors: [{ messageId: 'invalidVariableName' }], + }, + + // useAtomComponentState - wrong variable and setter + { + code: 'const [myValue, setMyValue] = useAtomComponentState(variableComponentState);', errors: [ - { - messageId: 'invalidSetterName', - }, + { messageId: 'invalidVariableName' }, + { messageId: 'invalidSetterName' }, ], }, + + // useAtomFamilyStateValue - wrong variable name + { + code: 'const myValue = useAtomFamilyStateValue(variableFamilyState, key);', + errors: [{ messageId: 'invalidVariableName' }], + }, + + // useAtomComponentFamilyStateValue - wrong variable name + { + code: 'const myValue = useAtomComponentFamilyStateValue(variableComponentFamilyState, key);', + errors: [{ messageId: 'invalidVariableName' }], + }, + + // useAtomComponentFamilyState - wrong variable and setter + { + code: 'const [myValue, setMyValue] = useAtomComponentFamilyState(variableComponentFamilyState, key);', + errors: [ + { messageId: 'invalidVariableName' }, + { messageId: 'invalidSetterName' }, + ], + }, + + // useSetAtomState - wrong setter name + { + code: 'const myValue = useSetAtomState(variableState);', + errors: [{ messageId: 'invalidSetterName' }], + }, + + // useSetAtomComponentState - wrong setter name + { + code: 'const myValue = useSetAtomComponentState(variableComponentState);', + errors: [{ messageId: 'invalidSetterName' }], + }, + + // useSetAtomFamilyState - wrong setter name + { + code: 'const myValue = useSetAtomFamilyState(variableFamilyState, key);', + errors: [{ messageId: 'invalidSetterName' }], + }, + + // useSetAtomComponentFamilyState - wrong setter name + { + code: 'const myValue = useSetAtomComponentFamilyState(variableComponentFamilyState, key);', + errors: [{ messageId: 'invalidSetterName' }], + }, ], }); diff --git a/packages/twenty-eslint-rules/rules/matching-state-variable.ts b/packages/twenty-eslint-rules/rules/matching-state-variable.ts index ce9bf18483..48a0e6e55f 100644 --- a/packages/twenty-eslint-rules/rules/matching-state-variable.ts +++ b/packages/twenty-eslint-rules/rules/matching-state-variable.ts @@ -8,6 +8,37 @@ import { isIdentifier } from '@typescript-eslint/utils/ast-utils'; // NOTE: The rule will be available in ESLint configs as "@nx/workspace-matching-state-variable" export const RULE_NAME = 'matching-state-variable'; +const VALUE_HOOKS = [ + 'useAtomStateValue', + 'useAtomComponentStateValue', + 'useAtomFamilyStateValue', + 'useAtomComponentFamilyStateValue', +]; + +const STATE_HOOKS = [ + 'useAtomState', + 'useAtomComponentState', + 'useAtomComponentFamilyState', +]; + +const SETTER_HOOKS = [ + 'useSetAtomState', + 'useSetAtomComponentState', + 'useSetAtomFamilyState', + 'useSetAtomComponentFamilyState', +]; + +const ALL_HOOKS = [...VALUE_HOOKS, ...STATE_HOOKS, ...SETTER_HOOKS]; + +const SUFFIX_PATTERN = + /(ComponentFamilyState|ComponentState|ScopedFamilyState|FamilyState|ScopedState|ScopedSelector|Selector|State)$/; + +const getExpectedBaseName = (stateArgName: string): string => + stateArgName.replace(SUFFIX_PATTERN, ''); + +const getExpectedSetterName = (baseName: string): string => + `set${baseName.charAt(0).toUpperCase()}${baseName.slice(1)}`; + export const rule = ESLintUtils.RuleCreator(() => __filename)({ name: RULE_NAME, meta: { @@ -30,104 +61,148 @@ export const rule = ESLintUtils.RuleCreator(() => __filename)({ return { VariableDeclarator: (node: TSESTree.VariableDeclarator) => { if ( - node?.init?.type === AST_NODE_TYPES.CallExpression && - isIdentifier(node.init.callee) && - ['useAtomState', 'useAtomStateValue'].includes( - node.init.callee.name, - ) + node?.init?.type !== AST_NODE_TYPES.CallExpression || + !isIdentifier(node.init.callee) || + !ALL_HOOKS.includes(node.init.callee.name) ) { - const stateNameBase = isIdentifier(node.init.arguments[0]) - ? node.init.arguments[0].name - : undefined; + return; + } - if (!stateNameBase) { - return; - } + const hookName = node.init.callee.name; - const expectedVariableNameBase = stateNameBase.replace( - /(State|Selector|ScopedState|ScopedFamilyState|ScopedSelector)$/, - '', - ); + const stateNameBase = isIdentifier(node.init.arguments[0]) + ? node.init.arguments[0].name + : undefined; + if (!stateNameBase) { + return; + } + + const expectedVariableNameBase = getExpectedBaseName(stateNameBase); + + if (SETTER_HOOKS.includes(hookName)) { if (isIdentifier(node.id)) { - const actualVariableName = node.id.name; + const actualName = node.id.name; + const expectedSetterName = + getExpectedSetterName(expectedVariableNameBase); - if (actualVariableName !== expectedVariableNameBase) { + if (actualName !== expectedSetterName) { context.report({ node, - messageId: 'invalidVariableName', + messageId: 'invalidSetterName', data: { - actualName: actualVariableName, - expectedName: expectedVariableNameBase, hookName: stateNameBase, - callee: node.init.callee.name, - }, - fix: (fixer) => { - return fixer.replaceText(node.id, expectedVariableNameBase); + actualName, + expectedName: expectedSetterName, }, + fix: (fixer) => fixer.replaceText(node.id, expectedSetterName), }); } - - return; } - if (node.id.type === AST_NODE_TYPES.ArrayPattern) { - const actualVariableName = - node.id.elements?.[0]?.type === AST_NODE_TYPES.Identifier - ? node.id.elements[0].name - : undefined; + return; + } - if ( - actualVariableName && - actualVariableName !== expectedVariableNameBase - ) { + if (VALUE_HOOKS.includes(hookName)) { + if (isIdentifier(node.id)) { + const actualName = node.id.name; + + if (actualName !== expectedVariableNameBase) { context.report({ node, messageId: 'invalidVariableName', data: { - actual: actualVariableName, - expected: expectedVariableNameBase, - callee: node.init.callee.name, + actualName, + expectedName: expectedVariableNameBase, + hookName: stateNameBase, + callee: hookName, + }, + fix: (fixer) => + fixer.replaceText(node.id, expectedVariableNameBase), + }); + } + } + + return; + } + + if (isIdentifier(node.id)) { + const actualVariableName = node.id.name; + + if (actualVariableName !== expectedVariableNameBase) { + context.report({ + node, + messageId: 'invalidVariableName', + data: { + actualName: actualVariableName, + expectedName: expectedVariableNameBase, + hookName: stateNameBase, + callee: hookName, + }, + fix: (fixer) => + fixer.replaceText(node.id, expectedVariableNameBase), + }); + } + + return; + } + + if (node.id.type === AST_NODE_TYPES.ArrayPattern) { + const actualVariableName = + node.id.elements?.[0]?.type === AST_NODE_TYPES.Identifier + ? node.id.elements[0].name + : undefined; + + if ( + actualVariableName && + actualVariableName !== expectedVariableNameBase + ) { + context.report({ + node, + messageId: 'invalidVariableName', + data: { + actualName: actualVariableName, + expectedName: expectedVariableNameBase, + hookName: stateNameBase, + callee: hookName, + }, + fix: (fixer) => { + if (node.id.type === AST_NODE_TYPES.ArrayPattern) { + return fixer.replaceText( + node.id.elements[0] as TSESTree.Node, + expectedVariableNameBase, + ); + } + return null; + }, + }); + } + + if (isIdentifier(node.id.elements[1])) { + const actualSetterName = node.id.elements[1].name; + const expectedSetterName = + getExpectedSetterName(expectedVariableNameBase); + + if (actualSetterName !== expectedSetterName) { + context.report({ + node, + messageId: 'invalidSetterName', + data: { + hookName: stateNameBase, + actualName: actualSetterName, + expectedName: expectedSetterName, }, fix: (fixer) => { if (node.id.type === AST_NODE_TYPES.ArrayPattern) { return fixer.replaceText( - node.id.elements[0] as TSESTree.Node, - expectedVariableNameBase, + node.id.elements[1]!, + expectedSetterName, ); } return null; }, }); } - - if (isIdentifier(node.id.elements[1])) { - const actualSetterName = node.id.elements[1].name; - const expectedSetterName = `set${expectedVariableNameBase - .charAt(0) - .toUpperCase()}${expectedVariableNameBase.slice(1)}`; - - if (actualSetterName !== expectedSetterName) { - context.report({ - node, - messageId: 'invalidSetterName', - data: { - hookName: stateNameBase, - actualName: actualSetterName, - expectedName: expectedSetterName, - }, - fix: (fixer) => { - if (node.id.type === AST_NODE_TYPES.ArrayPattern) { - return fixer.replaceText( - node.id.elements[1]!, - expectedSetterName, - ); - } - return null; - }, - }); - } - } } } }, diff --git a/packages/twenty-front/src/modules/action-menu/actions/components/ActionOpenSidePanelPage.tsx b/packages/twenty-front/src/modules/action-menu/actions/components/ActionOpenSidePanelPage.tsx index 0ed770838c..ce8b2bc1f1 100644 --- a/packages/twenty-front/src/modules/action-menu/actions/components/ActionOpenSidePanelPage.tsx +++ b/packages/twenty-front/src/modules/action-menu/actions/components/ActionOpenSidePanelPage.tsx @@ -26,7 +26,7 @@ export const ActionOpenSidePanelPage = ({ const { navigateCommandMenu } = useNavigateCommandMenu(); - const setCommandMenuSearchState = useSetAtomState(commandMenuSearchState); + const setCommandMenuSearch = useSetAtomState(commandMenuSearchState); if (!actionConfig) { return null; @@ -42,7 +42,7 @@ export const ActionOpenSidePanelPage = ({ }); if (shouldResetSearchState) { - setCommandMenuSearchState(''); + setCommandMenuSearch(''); } }; diff --git a/packages/twenty-front/src/modules/action-menu/actions/display/components/ActionDropdownItem.tsx b/packages/twenty-front/src/modules/action-menu/actions/display/components/ActionDropdownItem.tsx index 55abb466e5..539374d895 100644 --- a/packages/twenty-front/src/modules/action-menu/actions/display/components/ActionDropdownItem.tsx +++ b/packages/twenty-front/src/modules/action-menu/actions/display/components/ActionDropdownItem.tsx @@ -31,7 +31,7 @@ export const ActionDropdownItem = ({ SelectableListComponentInstanceContext, ); - const isSelected = useAtomComponentFamilyStateValue( + const isSelectedItemId = useAtomComponentFamilyStateValue( isSelectedItemIdComponentFamilyState, action.key, selectableListInstanceId, @@ -40,7 +40,7 @@ export const ActionDropdownItem = ({ return ( { const { objectMetadataItem } = useContextStoreObjectMetadataItemOrThrow(); const { openDropdown } = useOpenDropdown(); - const currentViewId = useAtomComponentStateValue( + const contextStoreCurrentViewId = useAtomComponentStateValue( contextStoreCurrentViewIdComponentState, ); - if (!currentViewId) { + if (!contextStoreCurrentViewId) { throw new Error('Current view ID is not defined'); } const recordIndexId = getRecordIndexIdFromObjectNamePluralAndViewId( objectMetadataItem.namePlural, - currentViewId, + contextStoreCurrentViewId, ); const setViewPickerReferenceViewId = useSetAtomComponentState( @@ -34,7 +34,7 @@ export const CreateNewViewNoSelectionRecord = () => { const { setViewPickerMode } = useViewPickerMode(recordIndexId); const handleAddViewButtonClick = () => { - setViewPickerReferenceViewId(currentViewId); + setViewPickerReferenceViewId(contextStoreCurrentViewId); setViewPickerMode('create-empty'); openDropdown({ dropdownComponentInstanceIdFromProps: VIEW_PICKER_DROPDOWN_ID, diff --git a/packages/twenty-front/src/modules/action-menu/actions/record-actions/no-selection/components/HideDeletedRecordsNoSelectionRecordAction.tsx b/packages/twenty-front/src/modules/action-menu/actions/record-actions/no-selection/components/HideDeletedRecordsNoSelectionRecordAction.tsx index 512e157699..ed425948ef 100644 --- a/packages/twenty-front/src/modules/action-menu/actions/record-actions/no-selection/components/HideDeletedRecordsNoSelectionRecordAction.tsx +++ b/packages/twenty-front/src/modules/action-menu/actions/record-actions/no-selection/components/HideDeletedRecordsNoSelectionRecordAction.tsx @@ -12,17 +12,17 @@ import { isDefined } from 'twenty-shared/utils'; export const HideDeletedRecordsNoSelectionRecordAction = () => { const { objectMetadataItem } = useContextStoreObjectMetadataItemOrThrow(); - const currentViewId = useAtomComponentStateValue( + const contextStoreCurrentViewId = useAtomComponentStateValue( contextStoreCurrentViewIdComponentState, ); - if (!currentViewId) { + if (!contextStoreCurrentViewId) { throw new Error('Current view ID is not defined'); } const recordIndexId = getRecordIndexIdFromObjectNamePluralAndViewId( objectMetadataItem.namePlural, - currentViewId, + contextStoreCurrentViewId, ); const { toggleSoftDeleteFilterState } = useHandleToggleTrashColumnFilter({ diff --git a/packages/twenty-front/src/modules/action-menu/actions/record-actions/no-selection/components/SeeDeletedRecordsNoSelectionRecordAction.tsx b/packages/twenty-front/src/modules/action-menu/actions/record-actions/no-selection/components/SeeDeletedRecordsNoSelectionRecordAction.tsx index b457b269d3..8f079b0c50 100644 --- a/packages/twenty-front/src/modules/action-menu/actions/record-actions/no-selection/components/SeeDeletedRecordsNoSelectionRecordAction.tsx +++ b/packages/twenty-front/src/modules/action-menu/actions/record-actions/no-selection/components/SeeDeletedRecordsNoSelectionRecordAction.tsx @@ -8,17 +8,17 @@ import { useAtomComponentStateValue } from '@/ui/utilities/state/jotai/hooks/use export const SeeDeletedRecordsNoSelectionRecordAction = () => { const { objectMetadataItem } = useContextStoreObjectMetadataItemOrThrow(); - const currentViewId = useAtomComponentStateValue( + const contextStoreCurrentViewId = useAtomComponentStateValue( contextStoreCurrentViewIdComponentState, ); - if (!currentViewId) { + if (!contextStoreCurrentViewId) { throw new Error('Current view ID is not defined'); } const recordIndexId = getRecordIndexIdFromObjectNamePluralAndViewId( objectMetadataItem.namePlural, - currentViewId, + contextStoreCurrentViewId, ); const { handleToggleTrashColumnFilter, toggleSoftDeleteFilterState } = diff --git a/packages/twenty-front/src/modules/action-menu/actions/record-actions/run-workflow-actions/hooks/useRunWorkflowRecordActions.tsx b/packages/twenty-front/src/modules/action-menu/actions/record-actions/run-workflow-actions/hooks/useRunWorkflowRecordActions.tsx index 097ddb8e02..c5fdb79e6c 100644 --- a/packages/twenty-front/src/modules/action-menu/actions/record-actions/run-workflow-actions/hooks/useRunWorkflowRecordActions.tsx +++ b/packages/twenty-front/src/modules/action-menu/actions/record-actions/run-workflow-actions/hooks/useRunWorkflowRecordActions.tsx @@ -35,7 +35,7 @@ export const useRunWorkflowRecordActions = ({ contextStoreTargetedRecordsRuleComponentState, ); - const isPageInEditMode = useAtomComponentStateValue( + const contextStoreIsPageInEditMode = useAtomComponentStateValue( contextStoreIsPageInEditModeComponentState, ); @@ -138,7 +138,7 @@ export const useRunWorkflowRecordActions = ({ position: index, Icon, isPinned: - !isPageInEditMode && + !contextStoreIsPageInEditMode && activeWorkflowVersion.trigger?.settings?.isPinned, shouldBeRegistered: () => true, component: ( diff --git a/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/components/AddToFavoritesSingleRecordAction.tsx b/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/components/AddToFavoritesSingleRecordAction.tsx index 40c043c09a..ea30d8916d 100644 --- a/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/components/AddToFavoritesSingleRecordAction.tsx +++ b/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/components/AddToFavoritesSingleRecordAction.tsx @@ -13,17 +13,14 @@ export const AddToFavoritesSingleRecordAction = () => { const { createFavorite } = useCreateFavorite(); - const selectedRecord = useAtomFamilyStateValue( - recordStoreFamilyState, - recordId, - ); + const recordStore = useAtomFamilyStateValue(recordStoreFamilyState, recordId); const handleClick = () => { - if (!isDefined(selectedRecord)) { + if (!isDefined(recordStore)) { return; } - createFavorite(selectedRecord, objectMetadataItem.nameSingular); + createFavorite(recordStore, objectMetadataItem.nameSingular); }; return ; diff --git a/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/components/ExportNoteActionSingleRecordAction.tsx b/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/components/ExportNoteActionSingleRecordAction.tsx index 88c85b7862..57c8b537eb 100644 --- a/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/components/ExportNoteActionSingleRecordAction.tsx +++ b/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/components/ExportNoteActionSingleRecordAction.tsx @@ -7,19 +7,16 @@ import { isDefined } from 'twenty-shared/utils'; export const ExportNoteActionSingleRecordAction = () => { const recordId = useSelectedRecordIdOrThrow(); - const selectedRecord = useAtomFamilyStateValue( - recordStoreFamilyState, - recordId, - ); + const recordStore = useAtomFamilyStateValue(recordStoreFamilyState, recordId); - const filename = `${(selectedRecord?.title || 'Untitled Note').replace(/[<>:"/\\|?*]/g, '-')}`; + const filename = `${(recordStore?.title || 'Untitled Note').replace(/[<>:"/\\|?*]/g, '-')}`; const handleClick = async () => { - if (!isDefined(selectedRecord)) { + if (!isDefined(recordStore)) { return; } - const initialBody = selectedRecord.bodyV2?.blocknote; + const initialBody = recordStore.bodyV2?.blocknote; let parsedBody = []; diff --git a/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/dashboard-actions/components/CancelDashboardSingleRecordAction.tsx b/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/dashboard-actions/components/CancelDashboardSingleRecordAction.tsx index cf35093ea6..6c29dd8b41 100644 --- a/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/dashboard-actions/components/CancelDashboardSingleRecordAction.tsx +++ b/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/dashboard-actions/components/CancelDashboardSingleRecordAction.tsx @@ -9,12 +9,9 @@ import { useAtomFamilyStateValue } from '@/ui/utilities/state/jotai/hooks/useAto export const CancelDashboardSingleRecordAction = () => { const recordId = useSelectedRecordIdOrThrow(); - const selectedRecord = useAtomFamilyStateValue( - recordStoreFamilyState, - recordId, - ); + const recordStore = useAtomFamilyStateValue(recordStoreFamilyState, recordId); - const pageLayoutId = selectedRecord?.pageLayoutId; + const pageLayoutId = recordStore?.pageLayoutId; const { closeCommandMenu } = useCommandMenu(); diff --git a/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/dashboard-actions/components/EditDashboardSingleRecordAction.tsx b/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/dashboard-actions/components/EditDashboardSingleRecordAction.tsx index 9c7649910f..2c77a80ee9 100644 --- a/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/dashboard-actions/components/EditDashboardSingleRecordAction.tsx +++ b/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/dashboard-actions/components/EditDashboardSingleRecordAction.tsx @@ -8,12 +8,9 @@ import { useResetLocationHash } from 'twenty-ui/utilities'; export const EditDashboardSingleRecordAction = () => { const recordId = useSelectedRecordIdOrThrow(); - const selectedRecord = useAtomFamilyStateValue( - recordStoreFamilyState, - recordId, - ); + const recordStore = useAtomFamilyStateValue(recordStoreFamilyState, recordId); - const pageLayoutId = selectedRecord?.pageLayoutId; + const pageLayoutId = recordStore?.pageLayoutId; const { setIsPageLayoutInEditMode } = useSetIsPageLayoutInEditMode(pageLayoutId); diff --git a/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/dashboard-actions/components/SaveDashboardSingleRecordAction.tsx b/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/dashboard-actions/components/SaveDashboardSingleRecordAction.tsx index 2967c689c9..92ead9ea54 100644 --- a/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/dashboard-actions/components/SaveDashboardSingleRecordAction.tsx +++ b/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/dashboard-actions/components/SaveDashboardSingleRecordAction.tsx @@ -9,12 +9,9 @@ import { useAtomFamilyStateValue } from '@/ui/utilities/state/jotai/hooks/useAto export const SaveDashboardSingleRecordAction = () => { const recordId = useSelectedRecordIdOrThrow(); - const selectedRecord = useAtomFamilyStateValue( - recordStoreFamilyState, - recordId, - ); + const recordStore = useAtomFamilyStateValue(recordStoreFamilyState, recordId); - const pageLayoutId = selectedRecord?.pageLayoutId; + const pageLayoutId = recordStore?.pageLayoutId; const { savePageLayout } = useSavePageLayout(pageLayoutId); diff --git a/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/workflow-run-actions/components/SeeVersionWorkflowRunSingleRecordAction.tsx b/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/workflow-run-actions/components/SeeVersionWorkflowRunSingleRecordAction.tsx index ae9d135400..8c58229188 100644 --- a/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/workflow-run-actions/components/SeeVersionWorkflowRunSingleRecordAction.tsx +++ b/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/workflow-run-actions/components/SeeVersionWorkflowRunSingleRecordAction.tsx @@ -8,9 +8,9 @@ import { isDefined } from 'twenty-shared/utils'; export const SeeVersionWorkflowRunSingleRecordAction = () => { const recordId = useSelectedRecordIdOrThrow(); - const workflowRun = useAtomFamilyStateValue(recordStoreFamilyState, recordId); + const recordStore = useAtomFamilyStateValue(recordStoreFamilyState, recordId); - if (!isDefined(workflowRun) || !isDefined(workflowRun?.workflowVersion?.id)) { + if (!isDefined(recordStore) || !isDefined(recordStore?.workflowVersion?.id)) { return null; } @@ -19,7 +19,7 @@ export const SeeVersionWorkflowRunSingleRecordAction = () => { to={AppPath.RecordShowPage} params={{ objectNameSingular: CoreObjectNameSingular.WorkflowVersion, - objectRecordId: workflowRun.workflowVersion.id, + objectRecordId: recordStore.workflowVersion.id, }} /> ); diff --git a/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/workflow-run-actions/components/SeeWorkflowWorkflowRunSingleRecordAction.tsx b/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/workflow-run-actions/components/SeeWorkflowWorkflowRunSingleRecordAction.tsx index 0b48c2556a..b80aa519b1 100644 --- a/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/workflow-run-actions/components/SeeWorkflowWorkflowRunSingleRecordAction.tsx +++ b/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/workflow-run-actions/components/SeeWorkflowWorkflowRunSingleRecordAction.tsx @@ -8,9 +8,9 @@ import { isDefined } from 'twenty-shared/utils'; export const SeeWorkflowWorkflowRunSingleRecordAction = () => { const recordId = useSelectedRecordIdOrThrow(); - const workflowRun = useAtomFamilyStateValue(recordStoreFamilyState, recordId); + const recordStore = useAtomFamilyStateValue(recordStoreFamilyState, recordId); - if (!isDefined(workflowRun) || !isDefined(workflowRun?.workflow?.id)) { + if (!isDefined(recordStore) || !isDefined(recordStore?.workflow?.id)) { return null; } @@ -19,7 +19,7 @@ export const SeeWorkflowWorkflowRunSingleRecordAction = () => { to={AppPath.RecordShowPage} params={{ objectNameSingular: CoreObjectNameSingular.Workflow, - objectRecordId: workflowRun.workflow.id, + objectRecordId: recordStore.workflow.id, }} /> ); diff --git a/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/workflow-version-actions/components/SeeRunsWorkflowVersionSingleRecordAction.tsx b/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/workflow-version-actions/components/SeeRunsWorkflowVersionSingleRecordAction.tsx index dcc90967b9..4eb73199fd 100644 --- a/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/workflow-version-actions/components/SeeRunsWorkflowVersionSingleRecordAction.tsx +++ b/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/workflow-version-actions/components/SeeRunsWorkflowVersionSingleRecordAction.tsx @@ -27,7 +27,7 @@ const SeeRunsWorkflowVersionSingleRecordActionContent = ({ selectedRecordIds: [workflowWithCurrentVersion?.id], }, }, - workflowVersion: { + recordStore: { [ViewFilterOperand.IS]: { selectedRecordIds: [recordId], }, @@ -40,12 +40,9 @@ const SeeRunsWorkflowVersionSingleRecordActionContent = ({ export const SeeRunsWorkflowVersionSingleRecordAction = () => { const recordId = useSelectedRecordIdOrThrow(); - const workflowVersion = useAtomFamilyStateValue( - recordStoreFamilyState, - recordId, - ); + const recordStore = useAtomFamilyStateValue(recordStoreFamilyState, recordId); - const workflowId = workflowVersion?.workflow?.id; + const workflowId = recordStore?.workflow?.id; if (!isDefined(workflowId)) { return null; diff --git a/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/workflow-version-actions/components/SeeVersionsWorkflowVersionSingleRecordAction.tsx b/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/workflow-version-actions/components/SeeVersionsWorkflowVersionSingleRecordAction.tsx index 44b40f01cf..c2621c3814 100644 --- a/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/workflow-version-actions/components/SeeVersionsWorkflowVersionSingleRecordAction.tsx +++ b/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/workflow-version-actions/components/SeeVersionsWorkflowVersionSingleRecordAction.tsx @@ -33,18 +33,15 @@ const SeeVersionsWorkflowVersionSingleRecordActionContent = ({ export const SeeVersionsWorkflowVersionSingleRecordAction = () => { const recordId = useSelectedRecordIdOrThrow(); - const workflowVersion = useAtomFamilyStateValue( - recordStoreFamilyState, - recordId, - ); + const recordStore = useAtomFamilyStateValue(recordStoreFamilyState, recordId); - if (!isDefined(workflowVersion) || !isDefined(workflowVersion.workflowId)) { + if (!isDefined(recordStore) || !isDefined(recordStore.workflowId)) { return null; } return ( ); }; diff --git a/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/workflow-version-actions/components/SeeWorkflowWorkflowVersionSingleRecordAction.tsx b/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/workflow-version-actions/components/SeeWorkflowWorkflowVersionSingleRecordAction.tsx index 77a3666cb0..3cf8c39d5d 100644 --- a/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/workflow-version-actions/components/SeeWorkflowWorkflowVersionSingleRecordAction.tsx +++ b/packages/twenty-front/src/modules/action-menu/actions/record-actions/single-record/workflow-version-actions/components/SeeWorkflowWorkflowVersionSingleRecordAction.tsx @@ -7,17 +7,14 @@ import { AppPath } from 'twenty-shared/types'; export const SeeWorkflowWorkflowVersionSingleRecordAction = () => { const recordId = useSelectedRecordIdOrThrow(); - const workflowVersion = useAtomFamilyStateValue( - recordStoreFamilyState, - recordId, - ); + const recordStore = useAtomFamilyStateValue(recordStoreFamilyState, recordId); return ( ); diff --git a/packages/twenty-front/src/modules/action-menu/actions/record-agnostic-actions/run-workflow-actions/hooks/useRunWorkflowRecordAgnosticActions.tsx b/packages/twenty-front/src/modules/action-menu/actions/record-agnostic-actions/run-workflow-actions/hooks/useRunWorkflowRecordAgnosticActions.tsx index 5c305c9673..7a4332f1ec 100644 --- a/packages/twenty-front/src/modules/action-menu/actions/record-agnostic-actions/run-workflow-actions/hooks/useRunWorkflowRecordAgnosticActions.tsx +++ b/packages/twenty-front/src/modules/action-menu/actions/record-agnostic-actions/run-workflow-actions/hooks/useRunWorkflowRecordAgnosticActions.tsx @@ -14,7 +14,7 @@ import { useIcons } from 'twenty-ui/display'; export const useRunWorkflowRecordAgnosticActions = () => { const { getIcon } = useIcons(); - const isPageInEditMode = useAtomComponentStateValue( + const contextStoreIsPageInEditMode = useAtomComponentStateValue( contextStoreIsPageInEditModeComponentState, ); @@ -50,7 +50,7 @@ export const useRunWorkflowRecordAgnosticActions = () => { shortLabel: name, position: index, isPinned: - !isPageInEditMode && + !contextStoreIsPageInEditMode && activeWorkflowVersion.trigger?.settings?.isPinned, Icon, shouldBeRegistered: () => true, diff --git a/packages/twenty-front/src/modules/action-menu/components/RecordIndexActionMenuDropdown.tsx b/packages/twenty-front/src/modules/action-menu/components/RecordIndexActionMenuDropdown.tsx index d371fd2127..142927ef30 100644 --- a/packages/twenty-front/src/modules/action-menu/components/RecordIndexActionMenuDropdown.tsx +++ b/packages/twenty-front/src/modules/action-menu/components/RecordIndexActionMenuDropdown.tsx @@ -49,7 +49,7 @@ export const RecordIndexActionMenuDropdown = () => { const dropdownId = getActionMenuDropdownIdFromActionMenuId(actionMenuId); const { closeDropdown } = useCloseDropdown(); - const actionMenuDropdownPosition = useAtomComponentStateValue( + const recordIndexActionMenuDropdownPosition = useAtomComponentStateValue( recordIndexActionMenuDropdownPositionComponentState, dropdownId, ); @@ -73,8 +73,8 @@ export const RecordIndexActionMenuDropdown = () => { dropdownPlacement="bottom-start" dropdownStrategy="absolute" dropdownOffset={{ - x: actionMenuDropdownPosition.x ?? 0, - y: actionMenuDropdownPosition.y ?? 0, + x: recordIndexActionMenuDropdownPosition.x ?? 0, + y: recordIndexActionMenuDropdownPosition.y ?? 0, }} dropdownComponents={ diff --git a/packages/twenty-front/src/modules/action-menu/components/RecordShowRightDrawerOpenRecordButton.tsx b/packages/twenty-front/src/modules/action-menu/components/RecordShowRightDrawerOpenRecordButton.tsx index 1cc2722196..aecfae3915 100644 --- a/packages/twenty-front/src/modules/action-menu/components/RecordShowRightDrawerOpenRecordButton.tsx +++ b/packages/twenty-front/src/modules/action-menu/components/RecordShowRightDrawerOpenRecordButton.tsx @@ -52,7 +52,7 @@ export const RecordShowRightDrawerOpenRecordButton = ({ targetObjectId: recordId, }); - const activeTabIdInRightDrawer = useAtomComponentStateValue( + const activeTabId = useAtomComponentStateValue( activeTabIdComponentState, tabListComponentId, ); @@ -61,7 +61,7 @@ export const RecordShowRightDrawerOpenRecordButton = ({ targetObjectId: recordId, }); - const setActiveTabIdInRecordPage = useSetAtomComponentState( + const setActiveTabId = useSetAtomComponentState( activeTabIdComponentState, tabListComponentIdInRecordPage, ); @@ -83,14 +83,14 @@ export const RecordShowRightDrawerOpenRecordButton = ({ const handleOpenRecord = useCallback(() => { const tabIdToOpen = - activeTabIdInRightDrawer === 'home' + activeTabId === 'home' ? objectNameSingular === CoreObjectNameSingular.Note || objectNameSingular === CoreObjectNameSingular.Task ? 'richText' : 'timeline' - : activeTabIdInRightDrawer; + : activeTabId; - setActiveTabIdInRecordPage(tabIdToOpen); + setActiveTabId(tabIdToOpen); const parentView = store.get(parentViewState); @@ -110,14 +110,14 @@ export const RecordShowRightDrawerOpenRecordButton = ({ closeCommandMenu(); }, [ actionMenuId, - activeTabIdInRightDrawer, + activeTabId, closeCommandMenu, closeDropdown, navigate, objectNameSingular, parentViewState, recordId, - setActiveTabIdInRecordPage, + setActiveTabId, store, ]); diff --git a/packages/twenty-front/src/modules/action-menu/hooks/useRegisteredActions.ts b/packages/twenty-front/src/modules/action-menu/hooks/useRegisteredActions.ts index 9dfada0045..f9be2a54aa 100644 --- a/packages/twenty-front/src/modules/action-menu/hooks/useRegisteredActions.ts +++ b/packages/twenty-front/src/modules/action-menu/hooks/useRegisteredActions.ts @@ -28,7 +28,7 @@ export const useRegisteredActions = ( contextStoreCurrentViewTypeComponentState, ); - const isFullTabWidgetInEditMode = useAtomComponentStateValue( + const contextStoreIsPageInEditMode = useAtomComponentStateValue( contextStoreIsPageInEditModeComponentState, ); @@ -58,7 +58,7 @@ export const useRegisteredActions = ( const permissionMap = usePermissionFlagMap(); const actionsToRegister = Object.values(actionsConfig).filter((action) => { - if (isFullTabWidgetInEditMode) { + if (contextStoreIsPageInEditMode) { return ( isDefined(action.availableOn) && action.availableOn.includes(ActionViewType.PAGE_EDIT_MODE) diff --git a/packages/twenty-front/src/modules/action-menu/hooks/useShouldActionBeRegisteredParams.ts b/packages/twenty-front/src/modules/action-menu/hooks/useShouldActionBeRegisteredParams.ts index b8496723d4..5859bc2385 100644 --- a/packages/twenty-front/src/modules/action-menu/hooks/useShouldActionBeRegisteredParams.ts +++ b/packages/twenty-front/src/modules/action-menu/hooks/useShouldActionBeRegisteredParams.ts @@ -98,7 +98,7 @@ export const useShouldActionBeRegisteredParams = ({ useAtomComponentStateValue(contextStoreCurrentViewTypeComponentState) === ContextStoreViewType.ShowPage; - const numberOfSelectedRecords = useAtomComponentStateValue( + const contextStoreNumberOfSelectedRecords = useAtomComponentStateValue( contextStoreNumberOfSelectedRecordsComponentState, ); @@ -159,7 +159,7 @@ export const useShouldActionBeRegisteredParams = ({ isShowPage, isSelectAll, selectedRecord, - numberOfSelectedRecords, + numberOfSelectedRecords: contextStoreNumberOfSelectedRecords, viewType: viewType ?? undefined, getTargetObjectReadPermission: getObjectReadPermission, getTargetObjectWritePermission: getObjectWritePermission, diff --git a/packages/twenty-front/src/modules/activities/hooks/__tests__/useActivityTargetObjectRecords.test.tsx b/packages/twenty-front/src/modules/activities/hooks/__tests__/useActivityTargetObjectRecords.test.tsx index d46db433c3..58ad90b01b 100644 --- a/packages/twenty-front/src/modules/activities/hooks/__tests__/useActivityTargetObjectRecords.test.tsx +++ b/packages/twenty-front/src/modules/activities/hooks/__tests__/useActivityTargetObjectRecords.test.tsx @@ -140,7 +140,7 @@ describe('useActivityTargetObjectRecords', () => { const { result } = renderHook( () => { - const setRecordFromStore = useSetAtomFamilyState( + const setRecordStore = useSetAtomFamilyState( recordStoreFamilyState, task.id, ); @@ -151,14 +151,14 @@ describe('useActivityTargetObjectRecords', () => { return { activityTargetObjectRecords, - setRecordFromStore, + setRecordStore, }; }, { wrapper: Wrapper }, ); act(() => { - result.current.setRecordFromStore(task); + result.current.setRecordStore(task); }); const activityTargetObjectRecords = diff --git a/packages/twenty-front/src/modules/activities/inline-cell/hooks/useUpdateActivityTargetFromCell.ts b/packages/twenty-front/src/modules/activities/inline-cell/hooks/useUpdateActivityTargetFromCell.ts index bea4a1e29f..60b16af638 100644 --- a/packages/twenty-front/src/modules/activities/inline-cell/hooks/useUpdateActivityTargetFromCell.ts +++ b/packages/twenty-front/src/modules/activities/inline-cell/hooks/useUpdateActivityTargetFromCell.ts @@ -66,7 +66,7 @@ export const useUpdateActivityTargetFromCell = ({ : isNoteTargetMigrated; const store = useStore(); - const setActivityFromStore = useSetAtomFamilyState( + const setRecordStore = useSetAtomFamilyState( recordStoreFamilyState, activityId, ); @@ -194,7 +194,7 @@ export const useUpdateActivityTargetFromCell = ({ await createOneActivityTarget(activityTargetInput); } - setActivityFromStore((currentActivity) => { + setRecordStore((currentActivity) => { if (!isDefined(currentActivity)) { return null; } @@ -212,7 +212,7 @@ export const useUpdateActivityTargetFromCell = ({ createOneActivityTarget, deleteOneActivityTarget, isMorphRelation, - setActivityFromStore, + setRecordStore, ], ); diff --git a/packages/twenty-front/src/modules/activities/timeline-activities/components/EventRow.tsx b/packages/twenty-front/src/modules/activities/timeline-activities/components/EventRow.tsx index 4ebb5ddfdc..a61b063a50 100644 --- a/packages/twenty-front/src/modules/activities/timeline-activities/components/EventRow.tsx +++ b/packages/twenty-front/src/modules/activities/timeline-activities/components/EventRow.tsx @@ -103,10 +103,7 @@ export const EventRow = ({ const { recordId } = useContext(TimelineActivityContext); - const recordFromStore = useAtomFamilyStateValue( - recordStoreFamilyState, - recordId, - ); + const recordStore = useAtomFamilyStateValue(recordStoreFamilyState, recordId); const beautifiedCreatedAt = beautifyPastDateRelativeToNow( event.createdAt, @@ -120,7 +117,7 @@ export const EventRow = ({ return null; } - if (isUndefinedOrNull(recordFromStore)) { + if (isUndefinedOrNull(recordStore)) { return null; } if (isUndefinedOrNull(mainObjectMetadataItem)) { @@ -129,7 +126,7 @@ export const EventRow = ({ const labelIdentifier = getObjectRecordIdentifier({ objectMetadataItem: mainObjectMetadataItem, - record: recordFromStore, + record: recordStore, allowRequestsToTwentyIcons, }); diff --git a/packages/twenty-front/src/modules/activities/timeline-activities/rows/main-object/components/EventFieldDiffValueEffect.tsx b/packages/twenty-front/src/modules/activities/timeline-activities/rows/main-object/components/EventFieldDiffValueEffect.tsx index d559eed26b..35e6cd1983 100644 --- a/packages/twenty-front/src/modules/activities/timeline-activities/rows/main-object/components/EventFieldDiffValueEffect.tsx +++ b/packages/twenty-front/src/modules/activities/timeline-activities/rows/main-object/components/EventFieldDiffValueEffect.tsx @@ -17,7 +17,7 @@ export const EventFieldDiffValueEffect = ({ mainObjectMetadataItem: ObjectMetadataItem; fieldMetadataItem: FieldMetadataItem; }) => { - const setEntity = useSetAtomFamilyState( + const setRecordStore = useSetAtomFamilyState( recordStoreFamilyState, diffArtificialRecordStoreId, ); @@ -31,13 +31,13 @@ export const EventFieldDiffValueEffect = ({ [fieldMetadataItem.name]: diffRecord, }; - setEntity(forgedObjectRecord); + setRecordStore(forgedObjectRecord); }, [ diffRecord, diffArtificialRecordStoreId, fieldMetadataItem.name, mainObjectMetadataItem.nameSingular, - setEntity, + setRecordStore, ]); return <>; diff --git a/packages/twenty-front/src/modules/ai/components/ThinkingStepsDisplay.tsx b/packages/twenty-front/src/modules/ai/components/ThinkingStepsDisplay.tsx index 99d60caaec..ff615e8459 100644 --- a/packages/twenty-front/src/modules/ai/components/ThinkingStepsDisplay.tsx +++ b/packages/twenty-front/src/modules/ai/components/ThinkingStepsDisplay.tsx @@ -277,12 +277,12 @@ const ThinkingToolStepRow = ({ ? unwrappedResult.data.result : unwrappedOutput; const toolTabListComponentInstanceId = `ai-thinking-tool-tabs-${part.toolCallId ?? rawToolName}-${rowIndex}`; - const activeToolTabId = useAtomComponentStateValue( + const activeTabId = useAtomComponentStateValue( activeTabIdComponentState, toolTabListComponentInstanceId, ); const activeTab: ToolDetailsTab = - activeToolTabId === 'input' ? 'input' : 'output'; + activeTabId === 'input' ? 'input' : 'output'; const toolTabs = [ { id: 'output', title: t`Output` }, { id: 'input', title: t`Input` }, diff --git a/packages/twenty-front/src/modules/ai/hooks/useAgentChatScrollToBottom.ts b/packages/twenty-front/src/modules/ai/hooks/useAgentChatScrollToBottom.ts index c659891c65..c61e4132ba 100644 --- a/packages/twenty-front/src/modules/ai/hooks/useAgentChatScrollToBottom.ts +++ b/packages/twenty-front/src/modules/ai/hooks/useAgentChatScrollToBottom.ts @@ -11,12 +11,12 @@ export const useAgentChatScrollToBottom = () => { AI_CHAT_SCROLL_WRAPPER_ID, ); - const scrollBottom = useAtomComponentStateValue( + const scrollWrapperScrollBottom = useAtomComponentStateValue( scrollWrapperScrollBottomComponentState, AI_CHAT_SCROLL_WRAPPER_ID, ); - const isNearBottom = scrollBottom <= SCROLL_BOTTOM_THRESHOLD_PX; + const isNearBottom = scrollWrapperScrollBottom <= SCROLL_BOTTOM_THRESHOLD_PX; const scrollToBottom = () => { const { scrollWrapperElement } = getScrollWrapperElement(); diff --git a/packages/twenty-front/src/modules/auth/components/TwoFactorAuthenticationProvisionEffect.tsx b/packages/twenty-front/src/modules/auth/components/TwoFactorAuthenticationProvisionEffect.tsx index cb5f3295b4..243f90b3d4 100644 --- a/packages/twenty-front/src/modules/auth/components/TwoFactorAuthenticationProvisionEffect.tsx +++ b/packages/twenty-front/src/modules/auth/components/TwoFactorAuthenticationProvisionEffect.tsx @@ -20,7 +20,7 @@ export const TwoFactorAuthenticationSetupEffect = () => { const { origin } = useOrigin(); const loginToken = useAtomStateValue(loginTokenState); const qrCode = useAtomStateValue(qrCodeState); - const setQrCodeState = useSetAtomState(qrCodeState); + const setQrCode = useSetAtomState(qrCodeState); const { t } = useLingui(); @@ -52,7 +52,7 @@ export const TwoFactorAuthenticationSetupEffect = () => { if (!initiateOTPProvisioningResult.data?.initiateOTPProvisioning.uri) return; - setQrCodeState( + setQrCode( initiateOTPProvisioningResult.data?.initiateOTPProvisioning.uri, ); } catch { diff --git a/packages/twenty-front/src/modules/blocknote-editor/components/CustomSlashMenuListItem.tsx b/packages/twenty-front/src/modules/blocknote-editor/components/CustomSlashMenuListItem.tsx index 4851f3c31a..2ce91eb735 100644 --- a/packages/twenty-front/src/modules/blocknote-editor/components/CustomSlashMenuListItem.tsx +++ b/packages/twenty-front/src/modules/blocknote-editor/components/CustomSlashMenuListItem.tsx @@ -15,7 +15,7 @@ export const CustomSlashMenuListItem = ({ }: CustomSlashMenuListItemProps) => { const { resetSelectedItem } = useSelectableList(SLASH_MENU_LIST_ID); - const isSelectedItem = useAtomComponentFamilyStateValue( + const isSelectedItemId = useAtomComponentFamilyStateValue( isSelectedItemIdComponentFamilyState, item.title, ); @@ -28,7 +28,7 @@ export const CustomSlashMenuListItem = ({ return ( { const setLabPublicFeatureFlags = useSetAtomState(labPublicFeatureFlagsState); - const setMicrosoftMessagingEnabled = useSetAtomState( + const setIsMicrosoftMessagingEnabled = useSetAtomState( isMicrosoftMessagingEnabledState, ); - const setMicrosoftCalendarEnabled = useSetAtomState( + const setIsMicrosoftCalendarEnabled = useSetAtomState( isMicrosoftCalendarEnabledState, ); - const setGoogleMessagingEnabled = useSetAtomState( + const setIsGoogleMessagingEnabled = useSetAtomState( isGoogleMessagingEnabledState, ); - const setGoogleCalendarEnabled = useSetAtomState( + const setIsGoogleCalendarEnabled = useSetAtomState( isGoogleCalendarEnabledState, ); @@ -178,10 +178,10 @@ export const useClientConfig = (): UseClientConfigResult => { }); setCanManageFeatureFlags(clientConfig?.canManageFeatureFlags); setLabPublicFeatureFlags(clientConfig?.publicFeatureFlags); - setMicrosoftMessagingEnabled(clientConfig?.isMicrosoftMessagingEnabled); - setMicrosoftCalendarEnabled(clientConfig?.isMicrosoftCalendarEnabled); - setGoogleMessagingEnabled(clientConfig?.isGoogleMessagingEnabled); - setGoogleCalendarEnabled(clientConfig?.isGoogleCalendarEnabled); + setIsMicrosoftMessagingEnabled(clientConfig?.isMicrosoftMessagingEnabled); + setIsMicrosoftCalendarEnabled(clientConfig?.isMicrosoftCalendarEnabled); + setIsGoogleMessagingEnabled(clientConfig?.isGoogleMessagingEnabled); + setIsGoogleCalendarEnabled(clientConfig?.isGoogleCalendarEnabled); setIsAttachmentPreviewEnabled(clientConfig?.isAttachmentPreviewEnabled); setIsConfigVariablesInDbEnabled( clientConfig?.isConfigVariablesInDbEnabled, @@ -222,8 +222,8 @@ export const useClientConfig = (): UseClientConfigResult => { setChromeExtensionId, setClientConfigApiStatus, setDomainConfiguration, - setGoogleCalendarEnabled, - setGoogleMessagingEnabled, + setIsGoogleCalendarEnabled, + setIsGoogleMessagingEnabled, setIsAnalyticsEnabled, setIsAttachmentPreviewEnabled, setIsConfigVariablesInDbEnabled, @@ -235,8 +235,8 @@ export const useClientConfig = (): UseClientConfigResult => { setIsClickHouseConfigured, setIsCloudflareIntegrationEnabled, setLabPublicFeatureFlags, - setMicrosoftCalendarEnabled, - setMicrosoftMessagingEnabled, + setIsMicrosoftCalendarEnabled, + setIsMicrosoftMessagingEnabled, setSentryConfig, setSupportChat, setAllowRequestsToTwentyIcons, diff --git a/packages/twenty-front/src/modules/command-menu-item/hooks/useCommandMenuItemFrontComponentActions.tsx b/packages/twenty-front/src/modules/command-menu-item/hooks/useCommandMenuItemFrontComponentActions.tsx index 0143308a1a..a6f251a2cf 100644 --- a/packages/twenty-front/src/modules/command-menu-item/hooks/useCommandMenuItemFrontComponentActions.tsx +++ b/packages/twenty-front/src/modules/command-menu-item/hooks/useCommandMenuItemFrontComponentActions.tsx @@ -94,17 +94,17 @@ export const useCommandMenuItemFrontComponentActions = () => { useOpenFrontComponentInCommandMenu(); const mountHeadlessFrontComponent = useMountHeadlessFrontComponent(); - const isPageInEditMode = useAtomComponentStateValue( + const contextStoreIsPageInEditMode = useAtomComponentStateValue( contextStoreIsPageInEditModeComponentState, ); const { actionMenuType } = useContext(ActionMenuContext); - const currentObjectMetadataItemId = useAtomComponentStateValue( + const contextStoreCurrentObjectMetadataItemId = useAtomComponentStateValue( contextStoreCurrentObjectMetadataItemIdComponentState, ); - const targetedRecordsRule = useAtomComponentStateValue( + const contextStoreTargetedRecordsRule = useAtomComponentStateValue( contextStoreTargetedRecordsRuleComponentState, ); @@ -126,13 +126,14 @@ export const useCommandMenuItemFrontComponentActions = () => { ) ?? []; const selectedRecordCount = - targetedRecordsRule.mode === 'selection' - ? targetedRecordsRule.selectedRecordIds.length + contextStoreTargetedRecordsRule.mode === 'selection' + ? contextStoreTargetedRecordsRule.selectedRecordIds.length : 0; const objectMatches = (item: CommandMenuItemWithFrontComponent) => !isDefined(item.availabilityObjectMetadataId) || - item.availabilityObjectMetadataId === currentObjectMetadataItemId; + item.availabilityObjectMetadataId === + contextStoreCurrentObjectMetadataItemId; const globalItems = frontComponentItems.filter( (item) => item.availabilityType === CommandMenuItemAvailabilityType.GLOBAL, @@ -152,7 +153,7 @@ export const useCommandMenuItemFrontComponentActions = () => { item, scope: ActionScope.Global, index, - isPinned: !isPageInEditMode && item.isPinned, + isPinned: !contextStoreIsPageInEditMode && item.isPinned, getIcon, openFrontComponentInCommandMenu, mountHeadlessFrontComponent, @@ -164,7 +165,7 @@ export const useCommandMenuItemFrontComponentActions = () => { item, scope: ActionScope.RecordSelection, index, - isPinned: !isPageInEditMode && item.isPinned, + isPinned: !contextStoreIsPageInEditMode && item.isPinned, getIcon, openFrontComponentInCommandMenu, mountHeadlessFrontComponent, diff --git a/packages/twenty-front/src/modules/command-menu/components/CommandMenu.tsx b/packages/twenty-front/src/modules/command-menu/components/CommandMenu.tsx index e6931f1712..7073987a82 100644 --- a/packages/twenty-front/src/modules/command-menu/components/CommandMenu.tsx +++ b/packages/twenty-front/src/modules/command-menu/components/CommandMenu.tsx @@ -39,17 +39,18 @@ export const CommandMenu = () => { commandMenuSearch, }); + // eslint-disable-next-line twenty/matching-state-variable const previousContextStoreCurrentObjectMetadataItemId = useAtomComponentStateValue( contextStoreCurrentObjectMetadataItemIdComponentState, 'command-menu-previous', ); - const objectMetadataItemId = useAtomComponentStateValue( + const contextStoreCurrentObjectMetadataItemId = useAtomComponentStateValue( contextStoreCurrentObjectMetadataItemIdComponentState, ); const currentObjectMetadataItem = objectMetadataItems.find( - (item) => item.id === objectMetadataItemId, + (item) => item.id === contextStoreCurrentObjectMetadataItemId, ); const commandGroups: ActionGroupConfig[] = [ diff --git a/packages/twenty-front/src/modules/command-menu/components/CommandMenuContainer.tsx b/packages/twenty-front/src/modules/command-menu/components/CommandMenuContainer.tsx index e54b2fbd46..c4d7f5333f 100644 --- a/packages/twenty-front/src/modules/command-menu/components/CommandMenuContainer.tsx +++ b/packages/twenty-front/src/modules/command-menu/components/CommandMenuContainer.tsx @@ -29,7 +29,7 @@ type CommandMenuContainerProps = { export const CommandMenuContainer = ({ children, }: CommandMenuContainerProps) => { - const objectMetadataItemId = useAtomComponentStateValue( + const contextStoreCurrentObjectMetadataItemId = useAtomComponentStateValue( contextStoreCurrentObjectMetadataItemIdComponentState, COMMAND_MENU_COMPONENT_INSTANCE_ID, ); @@ -38,17 +38,18 @@ export const CommandMenuContainer = ({ const objectMetadataItems = useAtomStateValue(objectMetadataItemsState); const objectMetadataItem = objectMetadataItems.find( - (objectMetadataItem) => objectMetadataItem.id === objectMetadataItemId, + (objectMetadataItem) => + objectMetadataItem.id === contextStoreCurrentObjectMetadataItemId, ); - const currentViewId = useAtomComponentStateValue( + const contextStoreCurrentViewId = useAtomComponentStateValue( contextStoreCurrentViewIdComponentState, COMMAND_MENU_COMPONENT_INSTANCE_ID, ); const recordIndexId = getRecordIndexIdFromObjectNamePluralAndViewId( objectMetadataItem?.namePlural ?? '', - currentViewId ?? '', + contextStoreCurrentViewId ?? '', ); return ( diff --git a/packages/twenty-front/src/modules/command-menu/components/CommandMenuFolderInfo.tsx b/packages/twenty-front/src/modules/command-menu/components/CommandMenuFolderInfo.tsx index 8ff2a81309..e98b02655c 100644 --- a/packages/twenty-front/src/modules/command-menu/components/CommandMenuFolderInfo.tsx +++ b/packages/twenty-front/src/modules/command-menu/components/CommandMenuFolderInfo.tsx @@ -27,11 +27,13 @@ export const CommandMenuFolderInfo = () => { const { t } = useLingui(); const { getIcon } = useIcons(); const commandMenuPageInfo = useAtomStateValue(commandMenuPageInfoState); - const [shouldFocusTitleInput, setShouldFocusTitleInput] = - useAtomComponentState( - commandMenuShouldFocusTitleInputComponentState, - commandMenuPageInfo.instanceId, - ); + const [ + commandMenuShouldFocusTitleInput, + setCommandMenuShouldFocusTitleInput, + ] = useAtomComponentState( + commandMenuShouldFocusTitleInputComponentState, + commandMenuPageInfo.instanceId, + ); const selectedNavigationMenuItemInEditMode = useAtomStateValue( selectedNavigationMenuItemInEditModeState, ); @@ -106,8 +108,8 @@ export const CommandMenuFolderInfo = () => { onClickOutside={handleSave} onTab={handleSave} onShiftTab={handleSave} - shouldFocus={shouldFocusTitleInput} - onFocus={() => setShouldFocusTitleInput(false)} + shouldFocus={commandMenuShouldFocusTitleInput} + onFocus={() => setCommandMenuShouldFocusTitleInput(false)} /> } /> diff --git a/packages/twenty-front/src/modules/command-menu/components/CommandMenuItemWithAddToNavigationDrag.tsx b/packages/twenty-front/src/modules/command-menu/components/CommandMenuItemWithAddToNavigationDrag.tsx index aa0061cd4f..10abb650af 100644 --- a/packages/twenty-front/src/modules/command-menu/components/CommandMenuItemWithAddToNavigationDrag.tsx +++ b/packages/twenty-front/src/modules/command-menu/components/CommandMenuItemWithAddToNavigationDrag.tsx @@ -41,7 +41,9 @@ export const CommandMenuItemWithAddToNavigationDrag = ({ dragIndex, }: CommandMenuItemWithAddToNavigationDragProps) => { const { t } = useLingui(); - const setRegistry = useSetAtomState(addToNavPayloadRegistryState); + const setAddToNavPayloadRegistry = useSetAtomState( + addToNavPayloadRegistryState, + ); const [isHovered, setIsHovered] = useState(false); const contextualDescription = isHovered @@ -59,7 +61,7 @@ export const CommandMenuItemWithAddToNavigationDrag = ({ const registerPayload = () => { if (dragIndex !== undefined) { - setRegistry((prev) => new Map(prev).set(id, payload)); + setAddToNavPayloadRegistry((prev) => new Map(prev).set(id, payload)); } }; diff --git a/packages/twenty-front/src/modules/command-menu/components/CommandMenuLinkInfo.tsx b/packages/twenty-front/src/modules/command-menu/components/CommandMenuLinkInfo.tsx index edd72a6387..bc74cfa0f1 100644 --- a/packages/twenty-front/src/modules/command-menu/components/CommandMenuLinkInfo.tsx +++ b/packages/twenty-front/src/modules/command-menu/components/CommandMenuLinkInfo.tsx @@ -19,11 +19,13 @@ export const CommandMenuLinkInfo = () => { const theme = useTheme(); const { t } = useLingui(); const commandMenuPageInfo = useAtomStateValue(commandMenuPageInfoState); - const [shouldFocusTitleInput, setShouldFocusTitleInput] = - useAtomComponentState( - commandMenuShouldFocusTitleInputComponentState, - commandMenuPageInfo.instanceId, - ); + const [ + commandMenuShouldFocusTitleInput, + setCommandMenuShouldFocusTitleInput, + ] = useAtomComponentState( + commandMenuShouldFocusTitleInputComponentState, + commandMenuPageInfo.instanceId, + ); const selectedNavigationMenuItemInEditMode = useAtomStateValue( selectedNavigationMenuItemInEditModeState, ); @@ -84,8 +86,8 @@ export const CommandMenuLinkInfo = () => { onClickOutside={handleSave} onTab={handleSave} onShiftTab={handleSave} - shouldFocus={shouldFocusTitleInput} - onFocus={() => setShouldFocusTitleInput(false)} + shouldFocus={commandMenuShouldFocusTitleInput} + onFocus={() => setCommandMenuShouldFocusTitleInput(false)} /> } label={t`link`} diff --git a/packages/twenty-front/src/modules/command-menu/components/CommandMenuPageLayoutInfo.tsx b/packages/twenty-front/src/modules/command-menu/components/CommandMenuPageLayoutInfo.tsx index 50180f8e25..b898d6c989 100644 --- a/packages/twenty-front/src/modules/command-menu/components/CommandMenuPageLayoutInfo.tsx +++ b/packages/twenty-front/src/modules/command-menu/components/CommandMenuPageLayoutInfo.tsx @@ -7,16 +7,16 @@ import { useAtomComponentStateValue } from '@/ui/utilities/state/jotai/hooks/use import { isDefined } from 'twenty-shared/utils'; export const CommandMenuPageLayoutInfo = () => { - const objectMetadataId = useAtomComponentStateValue( + const contextStoreCurrentObjectMetadataItemId = useAtomComponentStateValue( contextStoreCurrentObjectMetadataItemIdComponentState, ); - if (!isDefined(objectMetadataId)) { + if (!isDefined(contextStoreCurrentObjectMetadataItemId)) { throw new Error('Object metadata ID is not defined'); } const { objectMetadataItem } = useObjectMetadataItemById({ - objectId: objectMetadataId, + objectId: contextStoreCurrentObjectMetadataItemId, }); const isDashboardContext = diff --git a/packages/twenty-front/src/modules/command-menu/components/CommandMenuPageLayoutInfoContent.tsx b/packages/twenty-front/src/modules/command-menu/components/CommandMenuPageLayoutInfoContent.tsx index bc0a7c4d82..15c2a07d4b 100644 --- a/packages/twenty-front/src/modules/command-menu/components/CommandMenuPageLayoutInfoContent.tsx +++ b/packages/twenty-front/src/modules/command-menu/components/CommandMenuPageLayoutInfoContent.tsx @@ -30,17 +30,19 @@ export const CommandMenuPageLayoutInfoContent = ({ const commandMenuPage = useAtomStateValue(commandMenuPageState); const commandMenuPageInfo = useAtomStateValue(commandMenuPageInfoState); - const [shouldFocusTitleInput, setShouldFocusTitleInput] = - useAtomComponentState( - commandMenuShouldFocusTitleInputComponentState, - commandMenuPageInfo.instanceId, - ); + const [ + commandMenuShouldFocusTitleInput, + setCommandMenuShouldFocusTitleInput, + ] = useAtomComponentState( + commandMenuShouldFocusTitleInputComponentState, + commandMenuPageInfo.instanceId, + ); const handleTitleInputOpen = () => { - setShouldFocusTitleInput(false); + setCommandMenuShouldFocusTitleInput(false); }; - const draftPageLayout = useAtomComponentStateValue( + const pageLayoutDraft = useAtomComponentStateValue( pageLayoutDraftComponentState, pageLayoutId, ); @@ -50,7 +52,7 @@ export const CommandMenuPageLayoutInfoContent = ({ pageLayoutId, ); - const [openTabId] = useAtomComponentState( + const [pageLayoutTabSettingsOpenTabId] = useAtomComponentState( pageLayoutTabSettingsOpenTabIdComponentState, pageLayoutId, ); @@ -63,9 +65,9 @@ export const CommandMenuPageLayoutInfoContent = ({ const headerInfo = usePageLayoutHeaderInfo({ commandMenuPage, - draftPageLayout, + draftPageLayout: pageLayoutDraft, pageLayoutEditingWidgetId, - openTabId, + openTabId: pageLayoutTabSettingsOpenTabId, editedTitle, }); @@ -136,7 +138,7 @@ export const CommandMenuPageLayoutInfoContent = ({ onClickOutside={saveTitle} onTab={saveTitle} onShiftTab={saveTitle} - shouldFocus={shouldFocusTitleInput} + shouldFocus={commandMenuShouldFocusTitleInput} onFocus={handleTitleInputOpen} /> } diff --git a/packages/twenty-front/src/modules/command-menu/components/CommandMenuWorkflowStepInfo.tsx b/packages/twenty-front/src/modules/command-menu/components/CommandMenuWorkflowStepInfo.tsx index d6481a68d5..580c9e3e88 100644 --- a/packages/twenty-front/src/modules/command-menu/components/CommandMenuWorkflowStepInfo.tsx +++ b/packages/twenty-front/src/modules/command-menu/components/CommandMenuWorkflowStepInfo.tsx @@ -39,7 +39,7 @@ export const CommandMenuWorkflowStepInfo = ({ const workflowId = useCommandMenuWorkflowIdOrThrow(); - const workflowStepId = useAtomComponentStateValue( + const commandMenuWorkflowStepId = useAtomComponentStateValue( commandMenuWorkflowStepIdComponentState, commandMenuPageInstanceId, ); @@ -71,13 +71,13 @@ export const CommandMenuWorkflowStepInfo = ({ id: undefined, }; - const isTriggerStep = workflowStepId === TRIGGER_STEP_ID; + const isTriggerStep = commandMenuWorkflowStepId === TRIGGER_STEP_ID; const stepDefinition = - isDefined(workflowStepId) && isDefined(trigger) + isDefined(commandMenuWorkflowStepId) && isDefined(trigger) ? isTriggerStep || isDefined(steps) ? getStepDefinitionOrThrow({ - stepId: workflowStepId, + stepId: commandMenuWorkflowStepId, trigger, steps, }) @@ -109,7 +109,7 @@ export const CommandMenuWorkflowStepInfo = ({ if ( !isDefined(workflowId) || - !isDefined(workflowStepId) || + !isDefined(commandMenuWorkflowStepId) || !isDefined(workflowWithCurrentVersion?.currentVersion) || !isDefined(stepDefinition) || !isDefined(stepDefinition.definition) diff --git a/packages/twenty-front/src/modules/command-menu/hooks/__tests__/useOpenRecordInCommandMenu.test.tsx b/packages/twenty-front/src/modules/command-menu/hooks/__tests__/useOpenRecordInCommandMenu.test.tsx index 18941f08d8..bb2181970e 100644 --- a/packages/twenty-front/src/modules/command-menu/hooks/__tests__/useOpenRecordInCommandMenu.test.tsx +++ b/packages/twenty-front/src/modules/command-menu/hooks/__tests__/useOpenRecordInCommandMenu.test.tsx @@ -60,19 +60,20 @@ const renderHooks = () => { viewableRecordNameSingularComponentState, 'mocked-uuid', ); - const currentObjectMetadataItemId = useAtomComponentStateValue( - contextStoreCurrentObjectMetadataItemIdComponentState, - 'mocked-uuid', - ); - const targetedRecordsRule = useAtomComponentStateValue( + const contextStoreCurrentObjectMetadataItemId = + useAtomComponentStateValue( + contextStoreCurrentObjectMetadataItemIdComponentState, + 'mocked-uuid', + ); + const contextStoreTargetedRecordsRule = useAtomComponentStateValue( contextStoreTargetedRecordsRuleComponentState, 'mocked-uuid', ); - const numberOfSelectedRecords = useAtomComponentStateValue( + const contextStoreNumberOfSelectedRecords = useAtomComponentStateValue( contextStoreNumberOfSelectedRecordsComponentState, 'mocked-uuid', ); - const currentViewType = useAtomComponentStateValue( + const contextStoreCurrentViewType = useAtomComponentStateValue( contextStoreCurrentViewTypeComponentState, 'mocked-uuid', ); @@ -82,10 +83,10 @@ const renderHooks = () => { openRecordInCommandMenu, viewableRecordId, viewableRecordNameSingular, - currentObjectMetadataItemId, - targetedRecordsRule, - numberOfSelectedRecords, - currentViewType, + contextStoreCurrentObjectMetadataItemId, + contextStoreTargetedRecordsRule, + contextStoreNumberOfSelectedRecords, + contextStoreCurrentViewType, getIcon, }; }, @@ -116,15 +117,17 @@ describe('useOpenRecordInCommandMenu', () => { expect(result.current.viewableRecordId).toBe(recordId); expect(result.current.viewableRecordNameSingular).toBe(objectNameSingular); - expect(result.current.currentObjectMetadataItemId).toBe( + expect(result.current.contextStoreCurrentObjectMetadataItemId).toBe( personMockObjectMetadataItem.id, ); - expect(result.current.targetedRecordsRule).toEqual({ + expect(result.current.contextStoreTargetedRecordsRule).toEqual({ mode: 'selection', selectedRecordIds: [recordId], }); - expect(result.current.numberOfSelectedRecords).toBe(1); - expect(result.current.currentViewType).toBe(ContextStoreViewType.ShowPage); + expect(result.current.contextStoreNumberOfSelectedRecords).toBe(1); + expect(result.current.contextStoreCurrentViewType).toBe( + ContextStoreViewType.ShowPage, + ); const commandMenuNavigationMorphItemsByPage = jotaiStore.get( commandMenuNavigationMorphItemsByPageState.atom, diff --git a/packages/twenty-front/src/modules/command-menu/hooks/__tests__/useSetGlobalCommandMenuContext.test.tsx b/packages/twenty-front/src/modules/command-menu/hooks/__tests__/useSetGlobalCommandMenuContext.test.tsx index b2b0125bce..c0f1ed611e 100644 --- a/packages/twenty-front/src/modules/command-menu/hooks/__tests__/useSetGlobalCommandMenuContext.test.tsx +++ b/packages/twenty-front/src/modules/command-menu/hooks/__tests__/useSetGlobalCommandMenuContext.test.tsx @@ -60,44 +60,44 @@ describe('useSetGlobalCommandMenuContext', () => { const { setGlobalCommandMenuContext } = useSetGlobalCommandMenuContext(); - const targetedRecordsRule = useAtomComponentStateValue( + const contextStoreTargetedRecordsRule = useAtomComponentStateValue( contextStoreTargetedRecordsRuleComponentState, COMMAND_MENU_COMPONENT_INSTANCE_ID, ); - const numberOfSelectedRecords = useAtomComponentStateValue( + const contextStoreNumberOfSelectedRecords = useAtomComponentStateValue( contextStoreNumberOfSelectedRecordsComponentState, COMMAND_MENU_COMPONENT_INSTANCE_ID, ); - const filters = useAtomComponentStateValue( + const contextStoreFilters = useAtomComponentStateValue( contextStoreFiltersComponentState, COMMAND_MENU_COMPONENT_INSTANCE_ID, ); - const filterGroups = useAtomComponentStateValue( + const contextStoreFilterGroups = useAtomComponentStateValue( contextStoreFilterGroupsComponentState, COMMAND_MENU_COMPONENT_INSTANCE_ID, ); - const anyFieldFilterValue = useAtomComponentStateValue( + const contextStoreAnyFieldFilterValue = useAtomComponentStateValue( contextStoreAnyFieldFilterValueComponentState, COMMAND_MENU_COMPONENT_INSTANCE_ID, ); - const currentViewType = useAtomComponentStateValue( + const contextStoreCurrentViewType = useAtomComponentStateValue( contextStoreCurrentViewTypeComponentState, COMMAND_MENU_COMPONENT_INSTANCE_ID, ); return { setGlobalCommandMenuContext, - targetedRecordsRule, - numberOfSelectedRecords, - filters, - filterGroups, - currentViewType, - anyFieldFilterValue, + contextStoreTargetedRecordsRule, + contextStoreNumberOfSelectedRecords, + contextStoreFilters, + contextStoreFilterGroups, + contextStoreCurrentViewType, + contextStoreAnyFieldFilterValue, }; }, { @@ -105,14 +105,16 @@ describe('useSetGlobalCommandMenuContext', () => { }, ); - expect(result.current.targetedRecordsRule).toEqual({ + expect(result.current.contextStoreTargetedRecordsRule).toEqual({ mode: 'selection', selectedRecordIds: [peopleMock[0].id, peopleMock[1].id], }); - expect(result.current.numberOfSelectedRecords).toBe(2); - expect(result.current.filters).toEqual([]); - expect(result.current.anyFieldFilterValue).toEqual(''); - expect(result.current.currentViewType).toBe(ContextStoreViewType.Table); + expect(result.current.contextStoreNumberOfSelectedRecords).toBe(2); + expect(result.current.contextStoreFilters).toEqual([]); + expect(result.current.contextStoreAnyFieldFilterValue).toEqual(''); + expect(result.current.contextStoreCurrentViewType).toBe( + ContextStoreViewType.Table, + ); const commandMenuPageInfo = jotaiStore.get(commandMenuPageInfoState.atom); expect(commandMenuPageInfo).toEqual({ title: undefined, @@ -128,14 +130,16 @@ describe('useSetGlobalCommandMenuContext', () => { result.current.setGlobalCommandMenuContext(); }); - expect(result.current.targetedRecordsRule).toEqual({ + expect(result.current.contextStoreTargetedRecordsRule).toEqual({ mode: 'selection', selectedRecordIds: [], }); - expect(result.current.numberOfSelectedRecords).toBe(0); - expect(result.current.filters).toEqual([]); - expect(result.current.anyFieldFilterValue).toEqual(''); - expect(result.current.currentViewType).toBe(ContextStoreViewType.Table); + expect(result.current.contextStoreNumberOfSelectedRecords).toBe(0); + expect(result.current.contextStoreFilters).toEqual([]); + expect(result.current.contextStoreAnyFieldFilterValue).toEqual(''); + expect(result.current.contextStoreCurrentViewType).toBe( + ContextStoreViewType.Table, + ); const commandMenuPageInfoAfter = jotaiStore.get( commandMenuPageInfoState.atom, ); @@ -156,11 +160,13 @@ describe('useSetGlobalCommandMenuContext', () => { const { setGlobalCommandMenuContext } = useSetGlobalCommandMenuContext(); + // eslint-disable-next-line twenty/matching-state-variable const previousTargetedRecordsRule = useAtomComponentStateValue( contextStoreTargetedRecordsRuleComponentState, COMMAND_MENU_PREVIOUS_COMPONENT_INSTANCE_ID, ); + // eslint-disable-next-line twenty/matching-state-variable const previousNumberOfSelectedRecords = useAtomComponentStateValue( contextStoreNumberOfSelectedRecordsComponentState, COMMAND_MENU_PREVIOUS_COMPONENT_INSTANCE_ID, diff --git a/packages/twenty-front/src/modules/command-menu/hooks/__tests__/useWorkflowCommandMenu.test.tsx b/packages/twenty-front/src/modules/command-menu/hooks/__tests__/useWorkflowCommandMenu.test.tsx index e621ce2223..ec31da767e 100644 --- a/packages/twenty-front/src/modules/command-menu/hooks/__tests__/useWorkflowCommandMenu.test.tsx +++ b/packages/twenty-front/src/modules/command-menu/hooks/__tests__/useWorkflowCommandMenu.test.tsx @@ -2,7 +2,6 @@ import { renderHook } from '@testing-library/react'; import { COMMAND_MENU_COMPONENT_INSTANCE_ID } from '@/command-menu/constants/CommandMenuComponentInstanceId'; import { useWorkflowCommandMenu } from '@/command-menu/hooks/useWorkflowCommandMenu'; -import { viewableRecordIdComponentState } from '@/command-menu/pages/record-page/states/viewableRecordIdComponentState'; import { viewableRecordNameSingularComponentState } from '@/command-menu/pages/record-page/states/viewableRecordNameSingularComponentState'; import { commandMenuWorkflowIdComponentState } from '@/command-menu/pages/workflow/states/commandMenuWorkflowIdComponentState'; import { commandMenuWorkflowVersionIdComponentState } from '@/command-menu/pages/workflow/states/commandMenuWorkflowVersionIdComponentState'; @@ -65,35 +64,32 @@ const renderHooks = () => { openWorkflowViewStepInCommandMenu, } = useWorkflowCommandMenu(); - const _viewableRecordId = useAtomComponentStateValue( - viewableRecordIdComponentState, - 'mocked-uuid', - ); const viewableRecordNameSingular = useAtomComponentStateValue( viewableRecordNameSingularComponentState, 'mocked-uuid', ); - const currentObjectMetadataItemId = useAtomComponentStateValue( - contextStoreCurrentObjectMetadataItemIdComponentState, - 'mocked-uuid', - ); - const targetedRecordsRule = useAtomComponentStateValue( + const contextStoreCurrentObjectMetadataItemId = + useAtomComponentStateValue( + contextStoreCurrentObjectMetadataItemIdComponentState, + 'mocked-uuid', + ); + const contextStoreTargetedRecordsRule = useAtomComponentStateValue( contextStoreTargetedRecordsRuleComponentState, 'mocked-uuid', ); - const numberOfSelectedRecords = useAtomComponentStateValue( + const contextStoreNumberOfSelectedRecords = useAtomComponentStateValue( contextStoreNumberOfSelectedRecordsComponentState, 'mocked-uuid', ); - const currentViewType = useAtomComponentStateValue( + const contextStoreCurrentViewType = useAtomComponentStateValue( contextStoreCurrentViewTypeComponentState, 'mocked-uuid', ); - const workflowId = useAtomComponentStateValue( + const commandMenuWorkflowId = useAtomComponentStateValue( commandMenuWorkflowIdComponentState, 'mocked-uuid', ); - const workflowVersionId = useAtomComponentStateValue( + const commandMenuWorkflowVersionId = useAtomComponentStateValue( commandMenuWorkflowVersionIdComponentState, 'mocked-uuid', ); @@ -105,13 +101,13 @@ const renderHooks = () => { openWorkflowEditStepInCommandMenu, openWorkflowEditStepTypeInCommandMenu, openWorkflowViewStepInCommandMenu, - workflowId, - workflowVersionId, + commandMenuWorkflowId, + commandMenuWorkflowVersionId, viewableRecordNameSingular, - currentObjectMetadataItemId, - targetedRecordsRule, - numberOfSelectedRecords, - currentViewType, + contextStoreCurrentObjectMetadataItemId, + contextStoreTargetedRecordsRule, + contextStoreNumberOfSelectedRecords, + contextStoreCurrentViewType, getIcon, }; }, @@ -134,7 +130,7 @@ describe('useWorkflowCommandMenu', () => { result.current.openWorkflowTriggerTypeInCommandMenu('test-workflow-id'); }); - expect(result.current.workflowId).toBe('test-workflow-id'); + expect(result.current.commandMenuWorkflowId).toBe('test-workflow-id'); expect(mockNavigateCommandMenu).toHaveBeenCalledWith({ page: CommandMenuPages.WorkflowTriggerSelectType, @@ -151,7 +147,7 @@ describe('useWorkflowCommandMenu', () => { result.current.openWorkflowCreateStepInCommandMenu('test-workflow-id'); }); - expect(result.current.workflowId).toBe('test-workflow-id'); + expect(result.current.commandMenuWorkflowId).toBe('test-workflow-id'); expect(mockNavigateCommandMenu).toHaveBeenCalledWith({ page: CommandMenuPages.WorkflowStepCreate, @@ -168,7 +164,7 @@ describe('useWorkflowCommandMenu', () => { result.current.openWorkflowEditStepTypeInCommandMenu('test-workflow-id'); }); - expect(result.current.workflowId).toBe('test-workflow-id'); + expect(result.current.commandMenuWorkflowId).toBe('test-workflow-id'); expect(mockNavigateCommandMenu).toHaveBeenCalledWith({ page: CommandMenuPages.WorkflowStepEditType, @@ -189,7 +185,7 @@ describe('useWorkflowCommandMenu', () => { ); }); - expect(result.current.workflowId).toBe('test-workflow-id'); + expect(result.current.commandMenuWorkflowId).toBe('test-workflow-id'); expect(mockNavigateCommandMenu).toHaveBeenCalledWith({ page: CommandMenuPages.WorkflowStepEdit, @@ -211,8 +207,10 @@ describe('useWorkflowCommandMenu', () => { }); }); - expect(result.current.workflowId).toBe('test-workflow-id'); - expect(result.current.workflowVersionId).toBe('test-workflow-version-id'); + expect(result.current.commandMenuWorkflowId).toBe('test-workflow-id'); + expect(result.current.commandMenuWorkflowVersionId).toBe( + 'test-workflow-version-id', + ); expect(mockNavigateCommandMenu).toHaveBeenCalledWith({ page: CommandMenuPages.WorkflowStepView, diff --git a/packages/twenty-front/src/modules/command-menu/hooks/useCommandMenuHotKeys.ts b/packages/twenty-front/src/modules/command-menu/hooks/useCommandMenuHotKeys.ts index 06ff285c14..84d6a131ea 100644 --- a/packages/twenty-front/src/modules/command-menu/hooks/useCommandMenuHotKeys.ts +++ b/packages/twenty-front/src/modules/command-menu/hooks/useCommandMenuHotKeys.ts @@ -38,7 +38,7 @@ export const useCommandMenuHotKeys = () => { const isAiEnabled = useIsFeatureEnabled(FeatureFlagKey.IS_AI_ENABLED); - const contextStoreTargetedRecordsRuleComponent = useAtomComponentStateValue( + const contextStoreTargetedRecordsRule = useAtomComponentStateValue( contextStoreTargetedRecordsRuleComponentState, COMMAND_MENU_COMPONENT_INSTANCE_ID, ); @@ -101,9 +101,8 @@ export const useCommandMenuHotKeys = () => { if ( commandMenuPage === CommandMenuPages.Root && !( - contextStoreTargetedRecordsRuleComponent.mode === 'selection' && - contextStoreTargetedRecordsRuleComponent.selectedRecordIds.length === - 0 + contextStoreTargetedRecordsRule.mode === 'selection' && + contextStoreTargetedRecordsRule.selectedRecordIds.length === 0 ) ) { setGlobalCommandMenuContext(); @@ -116,7 +115,7 @@ export const useCommandMenuHotKeys = () => { dependencies: [ commandMenuPage, commandMenuSearch, - contextStoreTargetedRecordsRuleComponent, + contextStoreTargetedRecordsRule, goBackFromCommandMenu, setGlobalCommandMenuContext, ], diff --git a/packages/twenty-front/src/modules/command-menu/pages/page-layout/components/CommandMenuPageLayoutChartSettings.tsx b/packages/twenty-front/src/modules/command-menu/pages/page-layout/components/CommandMenuPageLayoutChartSettings.tsx index cac2c26059..f839f41d2c 100644 --- a/packages/twenty-front/src/modules/command-menu/pages/page-layout/components/CommandMenuPageLayoutChartSettings.tsx +++ b/packages/twenty-front/src/modules/command-menu/pages/page-layout/components/CommandMenuPageLayoutChartSettings.tsx @@ -18,7 +18,7 @@ const StyledContainer = styled.div` export const CommandMenuPageLayoutChartSettings = () => { const { pageLayoutId } = usePageLayoutIdFromContextStoreTargetedRecord(); - const draftPageLayout = useAtomComponentStateValue( + const pageLayoutDraft = useAtomComponentStateValue( pageLayoutDraftComponentState, pageLayoutId, ); @@ -28,7 +28,7 @@ export const CommandMenuPageLayoutChartSettings = () => { pageLayoutId, ); - const widgetInEditMode = draftPageLayout.tabs + const widgetInEditMode = pageLayoutDraft.tabs .flatMap((tab) => tab.widgets) .find((widget) => widget.id === pageLayoutEditingWidgetId); diff --git a/packages/twenty-front/src/modules/command-menu/pages/page-layout/components/CommandMenuPageLayoutGraphFilter.tsx b/packages/twenty-front/src/modules/command-menu/pages/page-layout/components/CommandMenuPageLayoutGraphFilter.tsx index 6465507cec..557c7cd389 100644 --- a/packages/twenty-front/src/modules/command-menu/pages/page-layout/components/CommandMenuPageLayoutGraphFilter.tsx +++ b/packages/twenty-front/src/modules/command-menu/pages/page-layout/components/CommandMenuPageLayoutGraphFilter.tsx @@ -11,7 +11,7 @@ import { isDefined } from 'twenty-shared/utils'; export const CommandMenuPageLayoutGraphFilter = () => { const { pageLayoutId } = usePageLayoutIdFromContextStoreTargetedRecord(); - const draftPageLayout = useAtomComponentStateValue( + const pageLayoutDraft = useAtomComponentStateValue( pageLayoutDraftComponentState, pageLayoutId, ); @@ -21,7 +21,7 @@ export const CommandMenuPageLayoutGraphFilter = () => { pageLayoutId, ); - const widgetInEditMode = draftPageLayout.tabs + const widgetInEditMode = pageLayoutDraft.tabs .flatMap((tab) => tab.widgets) .find((widget) => widget.id === pageLayoutEditingWidgetId); diff --git a/packages/twenty-front/src/modules/command-menu/pages/page-layout/components/CommandMenuPageLayoutTabSettings.tsx b/packages/twenty-front/src/modules/command-menu/pages/page-layout/components/CommandMenuPageLayoutTabSettings.tsx index cd05609a07..0de75cb603 100644 --- a/packages/twenty-front/src/modules/command-menu/pages/page-layout/components/CommandMenuPageLayoutTabSettings.tsx +++ b/packages/twenty-front/src/modules/command-menu/pages/page-layout/components/CommandMenuPageLayoutTabSettings.tsx @@ -26,26 +26,29 @@ export const CommandMenuPageLayoutTabSettings = () => { const { closeCommandMenu } = useCommandMenu(); const { pageLayoutId } = usePageLayoutIdFromContextStoreTargetedRecord(); - const draft = useAtomComponentStateValue( + const pageLayoutDraft = useAtomComponentStateValue( pageLayoutDraftComponentState, pageLayoutId, ); - const [openTabId, setOpenTabId] = useAtomComponentState( - pageLayoutTabSettingsOpenTabIdComponentState, - pageLayoutId, - ); + const [pageLayoutTabSettingsOpenTabId, setPageLayoutTabSettingsOpenTabId] = + useAtomComponentState( + pageLayoutTabSettingsOpenTabIdComponentState, + pageLayoutId, + ); const { moveLeft, moveRight } = useMovePageLayoutTab(pageLayoutId); const { deleteTab } = useDeletePageLayoutTab(pageLayoutId); const { duplicateTab } = useDuplicatePageLayoutTab(pageLayoutId); - if (!isDefined(openTabId)) { + if (!isDefined(pageLayoutTabSettingsOpenTabId)) { return null; } - const tabsSorted = sortTabsByPosition(draft.tabs); - const currentIndex = tabsSorted.findIndex((t) => t.id === openTabId); + const tabsSorted = sortTabsByPosition(pageLayoutDraft.tabs); + const currentIndex = tabsSorted.findIndex( + (t) => t.id === pageLayoutTabSettingsOpenTabId, + ); if (currentIndex < 0) return null; const tab = tabsSorted[currentIndex]; const canMoveLeft = currentIndex > 0; @@ -54,7 +57,7 @@ export const CommandMenuPageLayoutTabSettings = () => { const handleDelete = () => { deleteTab(tab.id); - setOpenTabId(null); + setPageLayoutTabSettingsOpenTabId(null); closeCommandMenu(); }; diff --git a/packages/twenty-front/src/modules/command-menu/pages/page-layout/components/CommandMenuPageLayoutWidgetTypeSelect.tsx b/packages/twenty-front/src/modules/command-menu/pages/page-layout/components/CommandMenuPageLayoutWidgetTypeSelect.tsx index ad241d3512..6e8e296d53 100644 --- a/packages/twenty-front/src/modules/command-menu/pages/page-layout/components/CommandMenuPageLayoutWidgetTypeSelect.tsx +++ b/packages/twenty-front/src/modules/command-menu/pages/page-layout/components/CommandMenuPageLayoutWidgetTypeSelect.tsx @@ -84,13 +84,13 @@ export const CommandMenuPageLayoutWidgetTypeSelect = () => { pageLayoutId, ); - const draftPageLayout = useAtomComponentStateValue( + const pageLayoutDraft = useAtomComponentStateValue( pageLayoutDraftComponentState, pageLayoutId, ); const existingWidget = isDefined(pageLayoutEditingWidgetId) - ? draftPageLayout.tabs + ? pageLayoutDraft.tabs .flatMap((tab) => tab.widgets) .find((widget) => widget.id === pageLayoutEditingWidgetId) : undefined; diff --git a/packages/twenty-front/src/modules/command-menu/pages/page-layout/components/WidgetSettingsFooter.tsx b/packages/twenty-front/src/modules/command-menu/pages/page-layout/components/WidgetSettingsFooter.tsx index da6903aef1..7f4f315999 100644 --- a/packages/twenty-front/src/modules/command-menu/pages/page-layout/components/WidgetSettingsFooter.tsx +++ b/packages/twenty-front/src/modules/command-menu/pages/page-layout/components/WidgetSettingsFooter.tsx @@ -23,21 +23,21 @@ export const WidgetSettingsFooter = ({ const { closeDropdown } = useCloseDropdown(); const { duplicateWidget } = useDuplicatePageLayoutWidget(pageLayoutId); const { deletePageLayoutWidget } = useDeletePageLayoutWidget(pageLayoutId); - const editingWidgetId = useAtomComponentStateValue( + const pageLayoutEditingWidgetId = useAtomComponentStateValue( pageLayoutEditingWidgetIdComponentState, pageLayoutId, ); const handleDuplicateWidget = () => { - if (isDefined(editingWidgetId)) { - duplicateWidget(editingWidgetId); + if (isDefined(pageLayoutEditingWidgetId)) { + duplicateWidget(pageLayoutEditingWidgetId); } closeDropdown(dropdownId); }; const handleDeleteWidget = () => { - if (isDefined(editingWidgetId)) { - deletePageLayoutWidget(editingWidgetId); + if (isDefined(pageLayoutEditingWidgetId)) { + deletePageLayoutWidget(pageLayoutEditingWidgetId); } closeDropdown(dropdownId); }; diff --git a/packages/twenty-front/src/modules/command-menu/pages/page-layout/hooks/usePageLayoutFromContextStoreTargetedRecord.ts b/packages/twenty-front/src/modules/command-menu/pages/page-layout/hooks/usePageLayoutFromContextStoreTargetedRecord.ts index 1c75867a35..bb2b2640f7 100644 --- a/packages/twenty-front/src/modules/command-menu/pages/page-layout/hooks/usePageLayoutFromContextStoreTargetedRecord.ts +++ b/packages/twenty-front/src/modules/command-menu/pages/page-layout/hooks/usePageLayoutFromContextStoreTargetedRecord.ts @@ -4,22 +4,22 @@ import { useAtomFamilyStateValue } from '@/ui/utilities/state/jotai/hooks/useAto import { useAtomComponentStateValue } from '@/ui/utilities/state/jotai/hooks/useAtomComponentStateValue'; export const usePageLayoutIdFromContextStoreTargetedRecord = () => { - const targetedRecordsRule = useAtomComponentStateValue( + const contextStoreTargetedRecordsRule = useAtomComponentStateValue( contextStoreTargetedRecordsRuleComponentState, ); if ( !( - targetedRecordsRule.mode === 'selection' && - targetedRecordsRule.selectedRecordIds.length === 1 + contextStoreTargetedRecordsRule.mode === 'selection' && + contextStoreTargetedRecordsRule.selectedRecordIds.length === 1 ) ) { - throw new Error('Only one record should be selected'); + throw new Error('Only one recordStore should be selected'); } - const recordId: string = targetedRecordsRule.selectedRecordIds[0]; + const recordId: string = contextStoreTargetedRecordsRule.selectedRecordIds[0]; - const record = useAtomFamilyStateValue(recordStoreFamilyState, recordId); + const recordStore = useAtomFamilyStateValue(recordStoreFamilyState, recordId); - return { pageLayoutId: record?.pageLayoutId }; + return { pageLayoutId: recordStore?.pageLayoutId }; }; diff --git a/packages/twenty-front/src/modules/command-menu/pages/page-layout/hooks/usePageLayoutIdForRecordPageLayoutFromContextStoreTargetedRecord.ts b/packages/twenty-front/src/modules/command-menu/pages/page-layout/hooks/usePageLayoutIdForRecordPageLayoutFromContextStoreTargetedRecord.ts index 99da7e7d93..f90027d2b6 100644 --- a/packages/twenty-front/src/modules/command-menu/pages/page-layout/hooks/usePageLayoutIdForRecordPageLayoutFromContextStoreTargetedRecord.ts +++ b/packages/twenty-front/src/modules/command-menu/pages/page-layout/hooks/usePageLayoutIdForRecordPageLayoutFromContextStoreTargetedRecord.ts @@ -7,26 +7,26 @@ import { isDefined } from 'twenty-shared/utils'; export const usePageLayoutIdForRecordPageLayoutFromContextStoreTargetedRecord = () => { - const targetedRecordsRule = useAtomComponentStateValue( + const contextStoreTargetedRecordsRule = useAtomComponentStateValue( contextStoreTargetedRecordsRuleComponentState, ); - const objectMetadataId = useAtomComponentStateValue( + const contextStoreCurrentObjectMetadataItemId = useAtomComponentStateValue( contextStoreCurrentObjectMetadataItemIdComponentState, ); - if (!isDefined(objectMetadataId)) { + if (!isDefined(contextStoreCurrentObjectMetadataItemId)) { throw new Error('Object metadata ID is not defined'); } const { objectMetadataItem } = useObjectMetadataItemById({ - objectId: objectMetadataId ?? undefined, + objectId: contextStoreCurrentObjectMetadataItemId ?? undefined, }); if ( !( - targetedRecordsRule.mode === 'selection' && - targetedRecordsRule.selectedRecordIds.length === 1 + contextStoreTargetedRecordsRule.mode === 'selection' && + contextStoreTargetedRecordsRule.selectedRecordIds.length === 1 ) ) { throw new Error('Only one record should be selected'); diff --git a/packages/twenty-front/src/modules/command-menu/pages/page-layout/hooks/useUpdateCurrentWidgetConfig.ts b/packages/twenty-front/src/modules/command-menu/pages/page-layout/hooks/useUpdateCurrentWidgetConfig.ts index fbfcdc00e0..879260eeea 100644 --- a/packages/twenty-front/src/modules/command-menu/pages/page-layout/hooks/useUpdateCurrentWidgetConfig.ts +++ b/packages/twenty-front/src/modules/command-menu/pages/page-layout/hooks/useUpdateCurrentWidgetConfig.ts @@ -12,7 +12,7 @@ export const useUpdateCurrentWidgetConfig = (pageLayoutIdFromProps: string) => { pageLayoutIdFromProps, ); - const currentlyEditingWidgetId = useAtomComponentStateValue( + const pageLayoutEditingWidgetId = useAtomComponentStateValue( pageLayoutEditingWidgetIdComponentState, pageLayoutIdFromProps, ); @@ -33,7 +33,7 @@ export const useUpdateCurrentWidgetConfig = (pageLayoutIdFromProps: string) => { tabs: prev.tabs.map((tab) => ({ ...tab, widgets: tab.widgets.map((widget) => - widget.id === currentlyEditingWidgetId + widget.id === pageLayoutEditingWidgetId ? { ...widget, objectMetadataId: objectMetadataId ?? widget.objectMetadataId, @@ -47,7 +47,7 @@ export const useUpdateCurrentWidgetConfig = (pageLayoutIdFromProps: string) => { })), }); }, - [pageLayoutDraft, currentlyEditingWidgetId, store], + [pageLayoutDraft, pageLayoutEditingWidgetId, store], ); return { updateCurrentWidgetConfig }; diff --git a/packages/twenty-front/src/modules/command-menu/pages/page-layout/hooks/useWidgetInEditMode.ts b/packages/twenty-front/src/modules/command-menu/pages/page-layout/hooks/useWidgetInEditMode.ts index a0b837e470..be5eab8ea9 100644 --- a/packages/twenty-front/src/modules/command-menu/pages/page-layout/hooks/useWidgetInEditMode.ts +++ b/packages/twenty-front/src/modules/command-menu/pages/page-layout/hooks/useWidgetInEditMode.ts @@ -3,7 +3,7 @@ import { pageLayoutEditingWidgetIdComponentState } from '@/page-layout/states/pa import { useAtomComponentStateValue } from '@/ui/utilities/state/jotai/hooks/useAtomComponentStateValue'; export const useWidgetInEditMode = (pageLayoutId: string) => { - const draftPageLayout = useAtomComponentStateValue( + const pageLayoutDraft = useAtomComponentStateValue( pageLayoutDraftComponentState, pageLayoutId, ); @@ -13,7 +13,7 @@ export const useWidgetInEditMode = (pageLayoutId: string) => { pageLayoutId, ); - const widgetInEditMode = draftPageLayout.tabs + const widgetInEditMode = pageLayoutDraft.tabs .flatMap((tab) => tab.widgets) .find((widget) => widget.id === pageLayoutEditingWidgetId); diff --git a/packages/twenty-front/src/modules/command-menu/pages/workflow/hooks/useCommandMenuWorkflowIdOrThrow.ts b/packages/twenty-front/src/modules/command-menu/pages/workflow/hooks/useCommandMenuWorkflowIdOrThrow.ts index 19ac2d58b3..2a075cf5b2 100644 --- a/packages/twenty-front/src/modules/command-menu/pages/workflow/hooks/useCommandMenuWorkflowIdOrThrow.ts +++ b/packages/twenty-front/src/modules/command-menu/pages/workflow/hooks/useCommandMenuWorkflowIdOrThrow.ts @@ -3,14 +3,14 @@ import { useAtomComponentStateValue } from '@/ui/utilities/state/jotai/hooks/use import { isDefined } from 'twenty-shared/utils'; export const useCommandMenuWorkflowIdOrThrow = () => { - const workflowId = useAtomComponentStateValue( + const commandMenuWorkflowId = useAtomComponentStateValue( commandMenuWorkflowIdComponentState, ); - if (!isDefined(workflowId)) { + if (!isDefined(commandMenuWorkflowId)) { throw new Error( 'Expected commandMenuWorkflowIdComponentState to be defined', ); } - return workflowId; + return commandMenuWorkflowId; }; diff --git a/packages/twenty-front/src/modules/command-menu/pages/workflow/step/view-run/hooks/useCommandMenuWorkflowRunIdOrThrow.ts b/packages/twenty-front/src/modules/command-menu/pages/workflow/step/view-run/hooks/useCommandMenuWorkflowRunIdOrThrow.ts index 43ce756f17..998910f035 100644 --- a/packages/twenty-front/src/modules/command-menu/pages/workflow/step/view-run/hooks/useCommandMenuWorkflowRunIdOrThrow.ts +++ b/packages/twenty-front/src/modules/command-menu/pages/workflow/step/view-run/hooks/useCommandMenuWorkflowRunIdOrThrow.ts @@ -3,14 +3,14 @@ import { useAtomComponentStateValue } from '@/ui/utilities/state/jotai/hooks/use import { isDefined } from 'twenty-shared/utils'; export const useCommandMenuWorkflowRunIdOrThrow = () => { - const workflowRunId = useAtomComponentStateValue( + const commandMenuWorkflowRunId = useAtomComponentStateValue( commandMenuWorkflowRunIdComponentState, ); - if (!isDefined(workflowRunId)) { + if (!isDefined(commandMenuWorkflowRunId)) { throw new Error( 'Expected the commandMenuWorkflowRunIdComponentState to be defined.', ); } - return workflowRunId; + return commandMenuWorkflowRunId; }; diff --git a/packages/twenty-front/src/modules/command-menu/pages/workflow/step/view/hooks/useCommandMenuWorkflowVersionIdOrThrow.ts b/packages/twenty-front/src/modules/command-menu/pages/workflow/step/view/hooks/useCommandMenuWorkflowVersionIdOrThrow.ts index 561c637c13..d9a89385fb 100644 --- a/packages/twenty-front/src/modules/command-menu/pages/workflow/step/view/hooks/useCommandMenuWorkflowVersionIdOrThrow.ts +++ b/packages/twenty-front/src/modules/command-menu/pages/workflow/step/view/hooks/useCommandMenuWorkflowVersionIdOrThrow.ts @@ -3,14 +3,14 @@ import { useAtomComponentStateValue } from '@/ui/utilities/state/jotai/hooks/use import { isDefined } from 'twenty-shared/utils'; export const useCommandMenuWorkflowVersionIdOrThrow = () => { - const workflowVersionId = useAtomComponentStateValue( + const commandMenuWorkflowVersionId = useAtomComponentStateValue( commandMenuWorkflowVersionIdComponentState, ); - if (!isDefined(workflowVersionId)) { + if (!isDefined(commandMenuWorkflowVersionId)) { throw new Error( 'Expected commandMenuWorkflowVersionIdComponentState to be defined', ); } - return workflowVersionId; + return commandMenuWorkflowVersionId; }; diff --git a/packages/twenty-front/src/modules/context-store/components/MainContextStoreProvider.tsx b/packages/twenty-front/src/modules/context-store/components/MainContextStoreProvider.tsx index ab60d68611..51e3f5ecd2 100644 --- a/packages/twenty-front/src/modules/context-store/components/MainContextStoreProvider.tsx +++ b/packages/twenty-front/src/modules/context-store/components/MainContextStoreProvider.tsx @@ -49,7 +49,7 @@ export const MainContextStoreProvider = () => { const viewIdQueryParam = searchParams.get('viewId'); const objectMetadataItems = useAtomStateValue(objectMetadataItemsState); - const viewsEntry = useAtomFamilyStateValue(metadataStoreState, 'views'); + const metadataStore = useAtomFamilyStateValue(metadataStoreState, 'views'); const coreViews = useAtomStateValue(coreViewsState); const objectMetadataItem = objectMetadataItems.find( @@ -76,7 +76,7 @@ export const MainContextStoreProvider = () => { const shouldComputeContextStore = (isRecordIndexPage || isRecordShowPage || isSettingsPage) && !showAuthModal && - viewsEntry.status === 'up-to-date'; + metadataStore.status === 'up-to-date'; if (!shouldComputeContextStore) { return null; diff --git a/packages/twenty-front/src/modules/context-store/hooks/useContextStoreObjectMetadataItem.ts b/packages/twenty-front/src/modules/context-store/hooks/useContextStoreObjectMetadataItem.ts index 17cde7b30b..d94af2b809 100644 --- a/packages/twenty-front/src/modules/context-store/hooks/useContextStoreObjectMetadataItem.ts +++ b/packages/twenty-front/src/modules/context-store/hooks/useContextStoreObjectMetadataItem.ts @@ -6,7 +6,7 @@ import { useAtomStateValue } from '@/ui/utilities/state/jotai/hooks/useAtomState export const useContextStoreObjectMetadataItem = ( contextStoreInstanceId?: string, ) => { - const objectMetadataItemId = useAtomComponentStateValue( + const contextStoreCurrentObjectMetadataItemId = useAtomComponentStateValue( contextStoreCurrentObjectMetadataItemIdComponentState, contextStoreInstanceId, ); @@ -15,7 +15,7 @@ export const useContextStoreObjectMetadataItem = ( const objectMetadataItem = objectMetadataItems.find( (objectMetadataItemToFind) => - objectMetadataItemToFind.id === objectMetadataItemId, + objectMetadataItemToFind.id === contextStoreCurrentObjectMetadataItemId, ); return { objectMetadataItem }; diff --git a/packages/twenty-front/src/modules/context-store/hooks/useContextStoreObjectMetadataItemOrThrow.ts b/packages/twenty-front/src/modules/context-store/hooks/useContextStoreObjectMetadataItemOrThrow.ts index cd897a82e5..6072028750 100644 --- a/packages/twenty-front/src/modules/context-store/hooks/useContextStoreObjectMetadataItemOrThrow.ts +++ b/packages/twenty-front/src/modules/context-store/hooks/useContextStoreObjectMetadataItemOrThrow.ts @@ -5,13 +5,13 @@ import { useAtomComponentStateValue } from '@/ui/utilities/state/jotai/hooks/use export const useContextStoreObjectMetadataItemOrThrow = ( contextStoreInstanceId?: string, ) => { - const objectMetadataItemId = useAtomComponentStateValue( + const contextStoreCurrentObjectMetadataItemId = useAtomComponentStateValue( contextStoreCurrentObjectMetadataItemIdComponentState, contextStoreInstanceId, ); const { objectMetadataItem } = useObjectMetadataItemById({ - objectId: objectMetadataItemId ?? '', + objectId: contextStoreCurrentObjectMetadataItemId ?? '', }); if (!objectMetadataItem) { diff --git a/packages/twenty-front/src/modules/domain-manager/hooks/useGetPublicWorkspaceDataByDomain.ts b/packages/twenty-front/src/modules/domain-manager/hooks/useGetPublicWorkspaceDataByDomain.ts index 2d7f5a3fb6..f5000cb8a6 100644 --- a/packages/twenty-front/src/modules/domain-manager/hooks/useGetPublicWorkspaceDataByDomain.ts +++ b/packages/twenty-front/src/modules/domain-manager/hooks/useGetPublicWorkspaceDataByDomain.ts @@ -25,7 +25,7 @@ export const useGetPublicWorkspaceDataByDomain = () => { ); const workspacePublicData = useAtomStateValue(workspacePublicDataState); const { redirectToDefaultDomain } = useRedirectToDefaultDomain(); - const setWorkspacePublicDataState = useSetAtomState(workspacePublicDataState); + const setWorkspacePublicData = useSetAtomState(workspacePublicDataState); const clientConfigApiStatus = useAtomStateValue(clientConfigApiStatusState); const { loading, data, error } = useGetPublicWorkspaceDataByDomainQuery({ @@ -43,7 +43,7 @@ export const useGetPublicWorkspaceDataByDomain = () => { setWorkspaceAuthBypassProviders( data.getPublicWorkspaceDataByDomain.authBypassProviders ?? null, ); - setWorkspacePublicDataState(data.getPublicWorkspaceDataByDomain); + setWorkspacePublicData(data.getPublicWorkspaceDataByDomain); }, onError: (error) => { // Only redirect to default domain if it's a workspace not found error diff --git a/packages/twenty-front/src/modules/favorites/components/CurrentWorkspaceMemberFavorites.tsx b/packages/twenty-front/src/modules/favorites/components/CurrentWorkspaceMemberFavorites.tsx index 2d09d5d1f4..86f8c51398 100644 --- a/packages/twenty-front/src/modules/favorites/components/CurrentWorkspaceMemberFavorites.tsx +++ b/packages/twenty-front/src/modules/favorites/components/CurrentWorkspaceMemberFavorites.tsx @@ -68,13 +68,15 @@ export const CurrentWorkspaceMemberFavorites = ({ openFavoriteFolderIdsState, ); - const setCurrentFolderId = useSetAtomState(currentFavoriteFolderIdState); + const setCurrentFavoriteFolderId = useSetAtomState( + currentFavoriteFolderIdState, + ); const isOpen = openFavoriteFolderIds.includes(folder.folderId); const handleToggle = () => { if (isMobile) { - setCurrentFolderId((prev) => + setCurrentFavoriteFolderId((prev) => prev === folder.folderId ? null : folder.folderId, ); } else { @@ -93,7 +95,7 @@ export const CurrentWorkspaceMemberFavorites = ({ const dropdownId = `favorite-folder-edit-${folder.folderId}`; - const isDropdownOpenComponent = useAtomComponentStateValue( + const isDropdownOpen = useAtomComponentStateValue( isDropdownOpenComponentState, dropdownId, ); @@ -190,7 +192,7 @@ export const CurrentWorkspaceMemberFavorites = ({ onClick={handleToggle} rightOptions={rightOptions} className="navigation-drawer-item" - isRightOptionsDropdownOpen={isDropdownOpenComponent} + isRightOptionsDropdownOpen={isDropdownOpen} triggerEvent="CLICK" preventCollapseOnMobile={isMobile} /> diff --git a/packages/twenty-front/src/modules/favorites/components/FavoritesBackButton.tsx b/packages/twenty-front/src/modules/favorites/components/FavoritesBackButton.tsx index 6bb25d235c..daf1c01719 100644 --- a/packages/twenty-front/src/modules/favorites/components/FavoritesBackButton.tsx +++ b/packages/twenty-front/src/modules/favorites/components/FavoritesBackButton.tsx @@ -35,12 +35,14 @@ export const FavoritesBackButton = ({ folderName, }: FavoritesBackButtonProps) => { const theme = useTheme(); - const setCurrentFolderId = useSetAtomState(currentFavoriteFolderIdState); + const setCurrentFavoriteFolderId = useSetAtomState( + currentFavoriteFolderIdState, + ); const handleClick = (e: React.MouseEvent) => { e.preventDefault(); e.stopPropagation(); - setCurrentFolderId(null); + setCurrentFavoriteFolderId(null); }; return ( diff --git a/packages/twenty-front/src/modules/favorites/favorite-folder-picker/components/FavoriteFolderPicker.tsx b/packages/twenty-front/src/modules/favorites/favorite-folder-picker/components/FavoriteFolderPicker.tsx index 903cd0c38b..d7f93a3a5f 100644 --- a/packages/twenty-front/src/modules/favorites/favorite-folder-picker/components/FavoriteFolderPicker.tsx +++ b/packages/twenty-front/src/modules/favorites/favorite-folder-picker/components/FavoriteFolderPicker.tsx @@ -43,19 +43,19 @@ export const FavoriteFolderPicker = ({ objectNameSingular, }); - const [favoriteFoldersSearchFilter] = useAtomComponentState( + const [favoriteFolderSearchFilter] = useAtomComponentState( favoriteFolderSearchFilterComponentState, ); const filteredFolders = favoriteFolders.filter((folder) => folder.name .toLowerCase() - .includes(favoriteFoldersSearchFilter.toLowerCase()), + .includes(favoriteFolderSearchFilter.toLowerCase()), ); const showNoFolderOption = - !favoriteFoldersSearchFilter || - 'no folder'.includes(favoriteFoldersSearchFilter.toLowerCase()); + !favoriteFolderSearchFilter || + 'no folder'.includes(favoriteFolderSearchFilter.toLowerCase()); useHotkeysOnFocusedElement({ keys: [Key.Escape], diff --git a/packages/twenty-front/src/modules/favorites/favorite-folder-picker/components/FavoriteFolderPickerEffect.tsx b/packages/twenty-front/src/modules/favorites/favorite-folder-picker/components/FavoriteFolderPickerEffect.tsx index 40617bb4d2..6f0a3f5d65 100644 --- a/packages/twenty-front/src/modules/favorites/favorite-folder-picker/components/FavoriteFolderPickerEffect.tsx +++ b/packages/twenty-front/src/modules/favorites/favorite-folder-picker/components/FavoriteFolderPickerEffect.tsx @@ -32,7 +32,7 @@ export const FavoriteFolderPickerEffect = ({ const { favoriteFolders } = usePrefetchedFavoritesFoldersData(); const { sortedFavorites: favorites } = useFavorites(); - const setCheckedState = useSetAtomComponentState( + const setFavoriteFolderPickerChecked = useSetAtomComponentState( favoriteFolderPickerCheckedComponentState, ); @@ -74,8 +74,8 @@ export const FavoriteFolderPickerEffect = ({ favorite.recordId === targetId && favorite.forWorkspaceMemberId, ) .map((favorite) => favorite.favoriteFolderId || 'no-folder'); - setCheckedState(checkedFolderIds); - }, [favorites, setCheckedState, record?.id]); + setFavoriteFolderPickerChecked(checkedFolderIds); + }, [favorites, setFavoriteFolderPickerChecked, record?.id]); return null; }; diff --git a/packages/twenty-front/src/modules/favorites/favorite-folder-picker/components/FavoriteFolderPickerList.tsx b/packages/twenty-front/src/modules/favorites/favorite-folder-picker/components/FavoriteFolderPickerList.tsx index a1ada657b0..89fcdad4d5 100644 --- a/packages/twenty-front/src/modules/favorites/favorite-folder-picker/components/FavoriteFolderPickerList.tsx +++ b/packages/twenty-front/src/modules/favorites/favorite-folder-picker/components/FavoriteFolderPickerList.tsx @@ -28,7 +28,7 @@ export const FavoriteFolderPickerList = ({ toggleFolderSelection, }: FavoriteFolderPickerListProps) => { const { t } = useLingui(); - const [favoriteFoldersSearchFilter] = useAtomComponentState( + const [favoriteFolderSearchFilter] = useAtomComponentState( favoriteFolderSearchFilterComponentState, ); @@ -39,12 +39,12 @@ export const FavoriteFolderPickerList = ({ const filteredFolders = folders.filter((folder) => folder.name .toLowerCase() - .includes(favoriteFoldersSearchFilter.toLowerCase()), + .includes(favoriteFolderSearchFilter.toLowerCase()), ); const showNoFolderOption = - !favoriteFoldersSearchFilter || - 'no folder'.includes(favoriteFoldersSearchFilter.toLowerCase()); + !favoriteFolderSearchFilter || + 'no folder'.includes(favoriteFolderSearchFilter.toLowerCase()); return ( diff --git a/packages/twenty-front/src/modules/favorites/favorite-folder-picker/components/FavoriteFolderPickerSearchInput.tsx b/packages/twenty-front/src/modules/favorites/favorite-folder-picker/components/FavoriteFolderPickerSearchInput.tsx index 83a87c8661..e407f2469b 100644 --- a/packages/twenty-front/src/modules/favorites/favorite-folder-picker/components/FavoriteFolderPickerSearchInput.tsx +++ b/packages/twenty-front/src/modules/favorites/favorite-folder-picker/components/FavoriteFolderPickerSearchInput.tsx @@ -5,11 +5,11 @@ import { useCallback } from 'react'; import { useDebouncedCallback } from 'use-debounce'; export const FavoriteFolderPickerSearchInput = () => { - const [favoriteFoldersSearchFilter, setFavoriteFoldersSearchFilter] = + const [favoriteFolderSearchFilter, setFavoriteFolderSearchFilter] = useAtomComponentState(favoriteFolderSearchFilterComponentState); const debouncedSetSearchFilter = useDebouncedCallback( - setFavoriteFoldersSearchFilter, + setFavoriteFolderSearchFilter, 100, { leading: true }, ); @@ -23,7 +23,7 @@ export const FavoriteFolderPickerSearchInput = () => { return ( diff --git a/packages/twenty-front/src/modules/front-components/components/FrontComponentRenderer.tsx b/packages/twenty-front/src/modules/front-components/components/FrontComponentRenderer.tsx index a320001d0e..32d6de909a 100644 --- a/packages/twenty-front/src/modules/front-components/components/FrontComponentRenderer.tsx +++ b/packages/twenty-front/src/modules/front-components/components/FrontComponentRenderer.tsx @@ -23,7 +23,7 @@ export const FrontComponentRenderer = ({ const theme = useTheme(); const { enqueueErrorSnackBar } = useSnackBar(); - const setApplicationTokenPair = useSetAtomComponentState( + const setFrontComponentApplicationTokenPair = useSetAtomComponentState( frontComponentApplicationTokenPairComponentState, frontComponentId, ); @@ -53,7 +53,7 @@ export const FrontComponentRenderer = ({ const tokenPair = completedData.frontComponent?.applicationTokenPair; if (isDefined(tokenPair)) { - setApplicationTokenPair(tokenPair); + setFrontComponentApplicationTokenPair(tokenPair); } }, }); diff --git a/packages/twenty-front/src/modules/front-components/hooks/useFrontComponentExecutionContext.ts b/packages/twenty-front/src/modules/front-components/hooks/useFrontComponentExecutionContext.ts index 7d822a2147..e57e0ba709 100644 --- a/packages/twenty-front/src/modules/front-components/hooks/useFrontComponentExecutionContext.ts +++ b/packages/twenty-front/src/modules/front-components/hooks/useFrontComponentExecutionContext.ts @@ -31,7 +31,7 @@ export const useFrontComponentExecutionContext = ({ frontComponentId, }); const { navigateCommandMenu } = useNavigateCommandMenu(); - const setCommandMenuSearchState = useSetAtomState(commandMenuSearchState); + const setCommandMenuSearch = useSetAtomState(commandMenuSearchState); const { getIcon } = useIcons(); const unmountHeadlessFrontComponent = useUnmountHeadlessFrontComponent(); const { @@ -65,7 +65,7 @@ export const useFrontComponentExecutionContext = ({ }); if (shouldResetSearchState === true) { - setCommandMenuSearchState(''); + setCommandMenuSearch(''); } }; diff --git a/packages/twenty-front/src/modules/information-banner/components/InformationBanner.tsx b/packages/twenty-front/src/modules/information-banner/components/InformationBanner.tsx index bf3d20c800..5b771222da 100644 --- a/packages/twenty-front/src/modules/information-banner/components/InformationBanner.tsx +++ b/packages/twenty-front/src/modules/information-banner/components/InformationBanner.tsx @@ -51,7 +51,7 @@ export const InformationBanner = ({ onClose?: () => void; componentInstanceId: string; }) => { - const informationBannerIsOpenComponent = useAtomComponentStateValue( + const informationBannerIsOpen = useAtomComponentStateValue( informationBannerIsOpenComponentState, componentInstanceId, ); @@ -62,7 +62,7 @@ export const InformationBanner = ({ instanceId: componentInstanceId, }} > - {informationBannerIsOpenComponent && ( + {informationBannerIsOpen && ( {message} diff --git a/packages/twenty-front/src/modules/information-banner/hooks/useDismissReconnectAccountBanner.ts b/packages/twenty-front/src/modules/information-banner/hooks/useDismissReconnectAccountBanner.ts index 714d370836..6b6e1fa5c5 100644 --- a/packages/twenty-front/src/modules/information-banner/hooks/useDismissReconnectAccountBanner.ts +++ b/packages/twenty-front/src/modules/information-banner/hooks/useDismissReconnectAccountBanner.ts @@ -25,7 +25,7 @@ export const useDismissReconnectAccountBanner = ( client: apolloCoreClient, }); - const setInformationBannerIsOpenComponent = useSetAtomComponentState( + const setInformationBannerIsOpen = useSetAtomComponentState( informationBannerIsOpenComponentState, componentInstanceId, ); @@ -36,7 +36,7 @@ export const useDismissReconnectAccountBanner = ( connectedAccountId, }, }); - setInformationBannerIsOpenComponent(false); + setInformationBannerIsOpen(false); }; return { diff --git a/packages/twenty-front/src/modules/metadata-store/effect-components/IsAppMetadataReadyEffect.tsx b/packages/twenty-front/src/modules/metadata-store/effect-components/IsAppMetadataReadyEffect.tsx index 3a72877161..869175af54 100644 --- a/packages/twenty-front/src/modules/metadata-store/effect-components/IsAppMetadataReadyEffect.tsx +++ b/packages/twenty-front/src/modules/metadata-store/effect-components/IsAppMetadataReadyEffect.tsx @@ -14,18 +14,22 @@ export const IsAppMetadataReadyEffect = () => { const isLoggedIn = useIsLogged(); const currentUser = useAtomStateValue(currentUserState); const currentWorkspace = useAtomStateValue(currentWorkspaceState); - const objectMetadataItemsEntry = useAtomFamilyStateValue( + const metadataStore = useAtomFamilyStateValue( metadataStoreState, 'objectMetadataItems', ); - const viewsEntry = useAtomFamilyStateValue(metadataStoreState, 'views'); + // eslint-disable-next-line twenty/matching-state-variable + const metadataStoreViews = useAtomFamilyStateValue( + metadataStoreState, + 'views', + ); const setIsAppMetadataReady = useSetAtomState(isAppMetadataReadyState); useEffect(() => { const hasActiveWorkspace = isWorkspaceActiveOrSuspended(currentWorkspace); - const areObjectsLoaded = objectMetadataItemsEntry.status === 'up-to-date'; - const areViewsLoaded = viewsEntry.status === 'up-to-date'; + const areObjectsLoaded = metadataStore.status === 'up-to-date'; + const areViewsLoaded = metadataStoreViews.status === 'up-to-date'; if (!areObjectsLoaded) { setIsAppMetadataReady(false); @@ -41,8 +45,8 @@ export const IsAppMetadataReadyEffect = () => { isLoggedIn, currentUser, currentWorkspace, - objectMetadataItemsEntry.status, - viewsEntry.status, + metadataStore.status, + metadataStoreViews.status, setIsAppMetadataReady, ]); diff --git a/packages/twenty-front/src/modules/metadata-store/effect-components/UserMetadataProviderInitialEffect.tsx b/packages/twenty-front/src/modules/metadata-store/effect-components/UserMetadataProviderInitialEffect.tsx index 23becbc987..750c88672e 100644 --- a/packages/twenty-front/src/modules/metadata-store/effect-components/UserMetadataProviderInitialEffect.tsx +++ b/packages/twenty-front/src/modules/metadata-store/effect-components/UserMetadataProviderInitialEffect.tsx @@ -41,7 +41,7 @@ export const UserMetadataProviderInitialEffect = () => { const setCurrentWorkspaceMembers = useSetAtomState( currentWorkspaceMembersState, ); - const setCurrentWorkspaceMembersWithDeleted = useSetAtomState( + const setCurrentWorkspaceDeletedMembers = useSetAtomState( currentWorkspaceDeletedMembersState, ); const setIsCurrentUserLoaded = useSetAtomState(isCurrentUserLoadedState); @@ -151,7 +151,7 @@ export const UserMetadataProviderInitialEffect = () => { } if (isDefined(deletedWorkspaceMembers)) { - setCurrentWorkspaceMembersWithDeleted(deletedWorkspaceMembers); + setCurrentWorkspaceDeletedMembers(deletedWorkspaceMembers); } if (isDefined(availableWorkspaces)) { @@ -172,7 +172,7 @@ export const UserMetadataProviderInitialEffect = () => { setCurrentWorkspace, setCurrentWorkspaceMember, initializeFormatPreferences, - setCurrentWorkspaceMembersWithDeleted, + setCurrentWorkspaceDeletedMembers, updateLocaleCatalog, setIsCurrentUserLoaded, ]); diff --git a/packages/twenty-front/src/modules/navigation-menu-item/components/CurrentWorkspaceMemberNavigationMenuItems.tsx b/packages/twenty-front/src/modules/navigation-menu-item/components/CurrentWorkspaceMemberNavigationMenuItems.tsx index b039d837e7..8ecc9f0a70 100644 --- a/packages/twenty-front/src/modules/navigation-menu-item/components/CurrentWorkspaceMemberNavigationMenuItems.tsx +++ b/packages/twenty-front/src/modules/navigation-menu-item/components/CurrentWorkspaceMemberNavigationMenuItems.tsx @@ -85,7 +85,7 @@ export const CurrentWorkspaceMemberNavigationMenuItems = ({ const [openNavigationMenuItemFolderIds, setOpenNavigationMenuItemFolderIds] = useAtomState(openNavigationMenuItemFolderIdsState); - const setCurrentFolderId = useSetAtomState( + const setCurrentNavigationMenuItemFolderId = useSetAtomState( currentNavigationMenuItemFolderIdState, ); @@ -93,7 +93,9 @@ export const CurrentWorkspaceMemberNavigationMenuItems = ({ const handleToggle = () => { if (isMobile) { - setCurrentFolderId((prev) => (prev === folder.id ? null : folder.id)); + setCurrentNavigationMenuItemFolderId((prev) => + prev === folder.id ? null : folder.id, + ); } else { setOpenNavigationMenuItemFolderIds((currentOpenFolders) => { if (isOpen) { @@ -123,7 +125,7 @@ export const CurrentWorkspaceMemberNavigationMenuItems = ({ const dropdownId = `navigation-menu-item-folder-edit-${folder.id}`; - const isDropdownOpenComponent = useAtomComponentStateValue( + const isDropdownOpen = useAtomComponentStateValue( isDropdownOpenComponentState, dropdownId, ); @@ -237,7 +239,7 @@ export const CurrentWorkspaceMemberNavigationMenuItems = ({ onClick={handleToggle} rightOptions={rightOptions} className="navigation-drawer-item" - isRightOptionsDropdownOpen={isDropdownOpenComponent} + isRightOptionsDropdownOpen={isDropdownOpen} triggerEvent="CLICK" preventCollapseOnMobile={isMobile} /> diff --git a/packages/twenty-front/src/modules/navigation-menu-item/components/NavigationMenuItemBackButton.tsx b/packages/twenty-front/src/modules/navigation-menu-item/components/NavigationMenuItemBackButton.tsx index 5245975f45..f789ec84ff 100644 --- a/packages/twenty-front/src/modules/navigation-menu-item/components/NavigationMenuItemBackButton.tsx +++ b/packages/twenty-front/src/modules/navigation-menu-item/components/NavigationMenuItemBackButton.tsx @@ -36,14 +36,14 @@ export const NavigationMenuItemBackButton = ({ folderName, }: NavigationMenuItemBackButtonProps) => { const theme = useTheme(); - const setCurrentFolderId = useSetAtomState( + const setCurrentNavigationMenuItemFolderId = useSetAtomState( currentNavigationMenuItemFolderIdState, ); const handleClick = (e: React.MouseEvent) => { e.preventDefault(); e.stopPropagation(); - setCurrentFolderId(null); + setCurrentNavigationMenuItemFolderId(null); }; return ( diff --git a/packages/twenty-front/src/modules/navigation-menu-item/components/WorkspaceNavigationMenuItemsFolder.tsx b/packages/twenty-front/src/modules/navigation-menu-item/components/WorkspaceNavigationMenuItemsFolder.tsx index 456b9aaf7e..6a74c92e7b 100644 --- a/packages/twenty-front/src/modules/navigation-menu-item/components/WorkspaceNavigationMenuItemsFolder.tsx +++ b/packages/twenty-front/src/modules/navigation-menu-item/components/WorkspaceNavigationMenuItemsFolder.tsx @@ -110,7 +110,7 @@ export const WorkspaceNavigationMenuItemsFolder = ({ const [openNavigationMenuItemFolderIds, setOpenNavigationMenuItemFolderIds] = useAtomState(openNavigationMenuItemFolderIdsState); - const setCurrentFolderId = useSetAtomState( + const setCurrentNavigationMenuItemFolderId = useSetAtomState( currentNavigationMenuItemFolderIdState, ); @@ -118,7 +118,9 @@ export const WorkspaceNavigationMenuItemsFolder = ({ const handleToggle = () => { if (isMobile) { - setCurrentFolderId((prev) => (prev === folderId ? null : folderId)); + setCurrentNavigationMenuItemFolderId((prev) => + prev === folderId ? null : folderId, + ); } else { setOpenNavigationMenuItemFolderIds((current) => isOpen diff --git a/packages/twenty-front/src/modules/navigation-menu-item/hooks/useRemoveNavigationMenuItemByTargetRecordId.ts b/packages/twenty-front/src/modules/navigation-menu-item/hooks/useRemoveNavigationMenuItemByTargetRecordId.ts index 81e284ca02..edd725563d 100644 --- a/packages/twenty-front/src/modules/navigation-menu-item/hooks/useRemoveNavigationMenuItemByTargetRecordId.ts +++ b/packages/twenty-front/src/modules/navigation-menu-item/hooks/useRemoveNavigationMenuItemByTargetRecordId.ts @@ -12,7 +12,7 @@ export const useRemoveNavigationMenuItemByTargetRecordId = () => { const apolloCoreClient = useApolloCoreClient(); const cache = apolloCoreClient.cache; - const setNavigationMenuItemsState = useSetAtomState( + const setPrefetchNavigationMenuItems = useSetAtomState( prefetchNavigationMenuItemsState, ); @@ -29,7 +29,7 @@ export const useRemoveNavigationMenuItemByTargetRecordId = () => { !targetRecordIdsSet.has(item.targetRecordId), ); - setNavigationMenuItemsState(updatedNavigationMenuItems); + setPrefetchNavigationMenuItems(updatedNavigationMenuItems); cache.updateQuery({ query: FIND_MANY_NAVIGATION_MENU_ITEMS }, (data) => { if (!isDefined(data?.navigationMenuItems)) { @@ -42,7 +42,7 @@ export const useRemoveNavigationMenuItemByTargetRecordId = () => { }; }); }, - [cache, setNavigationMenuItemsState, store], + [cache, setPrefetchNavigationMenuItems, store], ); return { diff --git a/packages/twenty-front/src/modules/object-record/hooks/useFetchMoreRecordsWithPagination.ts b/packages/twenty-front/src/modules/object-record/hooks/useFetchMoreRecordsWithPagination.ts index 42e1713ff2..7d78d5f236 100644 --- a/packages/twenty-front/src/modules/object-record/hooks/useFetchMoreRecordsWithPagination.ts +++ b/packages/twenty-front/src/modules/object-record/hooks/useFetchMoreRecordsWithPagination.ts @@ -94,7 +94,7 @@ export const useFetchMoreRecordsWithPagination = < queryIdentifier, ); - const setIsFetchingMoreObjects = useSetAtomFamilyState( + const setIsFetchingMoreRecords = useSetAtomFamilyState( isFetchingMoreRecordsFamilyState, queryIdentifier, ); @@ -119,7 +119,7 @@ export const useFetchMoreRecordsWithPagination = < hasNextPageLocal || (!isAggregationEnabled(objectMetadataItem) && !error) ) { - setIsFetchingMoreObjects(true); + setIsFetchingMoreRecords(true); try { const { data: fetchMoreDataResult } = await fetchMore({ @@ -193,13 +193,13 @@ export const useFetchMoreRecordsWithPagination = < handleFindManyRecordsError(error as ApolloError); return { error: error as ApolloError }; } finally { - setIsFetchingMoreObjects(false); + setIsFetchingMoreRecords(false); } } }, [ objectMetadataItem, error, - setIsFetchingMoreObjects, + setIsFetchingMoreRecords, fetchMore, filter, orderBy, diff --git a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownAnyFieldSearchInput.tsx b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownAnyFieldSearchInput.tsx index 829528e738..aea11a81be 100644 --- a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownAnyFieldSearchInput.tsx +++ b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownAnyFieldSearchInput.tsx @@ -6,20 +6,21 @@ import { useLingui } from '@lingui/react/macro'; export const ObjectFilterDropdownAnyFieldSearchInput = () => { const { t } = useLingui(); - const [anyFieldFilterSearchValue, setAnyFieldFilterSearchValue] = - useAtomComponentState(anyFieldFilterValueComponentState); + const [anyFieldFilterValue, setAnyFieldFilterValue] = useAtomComponentState( + anyFieldFilterValueComponentState, + ); const handleSearchChange = (event: React.ChangeEvent) => { const inputValue = event.target.value; - setAnyFieldFilterSearchValue(inputValue); + setAnyFieldFilterValue(inputValue); }; return ( diff --git a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownFilterSelectMenuItem.tsx b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownFilterSelectMenuItem.tsx index 1ebc8821a5..092fe7cbce 100644 --- a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownFilterSelectMenuItem.tsx +++ b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownFilterSelectMenuItem.tsx @@ -18,7 +18,7 @@ export const ObjectFilterDropdownFilterSelectMenuItem = ({ }: ObjectFilterDropdownFilterSelectMenuItemProps) => { const { resetSelectedItem } = useSelectableList(FILTER_FIELD_LIST_ID); - const isSelectedItem = useAtomComponentFamilyStateValue( + const isSelectedItemId = useAtomComponentFamilyStateValue( isSelectedItemIdComponentFamilyState, fieldMetadataItemToSelect.id, ); @@ -39,7 +39,7 @@ export const ObjectFilterDropdownFilterSelectMenuItem = ({ return ( { - const currentRecordFilter = useAtomComponentStateValue( + const objectFilterDropdownCurrentRecordFilter = useAtomComponentStateValue( objectFilterDropdownCurrentRecordFilterComponentState, ); - const objectFilterDropdownFilterValue = currentRecordFilter?.value; + const objectFilterDropdownFilterValue = + objectFilterDropdownCurrentRecordFilter?.value; return { objectFilterDropdownFilterValue }; }; diff --git a/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownCustomView.tsx b/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownCustomView.tsx index 5a4b23be44..fd0533d21d 100644 --- a/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownCustomView.tsx +++ b/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownCustomView.tsx @@ -54,7 +54,7 @@ export const ObjectOptionsDropdownCustomView = ({ } : null; - const recordGroupFieldMetadata = useAtomComponentStateValue( + const recordIndexGroupFieldMetadataItem = useAtomComponentStateValue( recordIndexGroupFieldMetadataItemComponentState, ); @@ -224,7 +224,7 @@ export const ObjectOptionsDropdownCustomView = ({ - isDefined(recordGroupFieldMetadata) + isDefined(recordIndexGroupFieldMetadataItem) ? onContentChange('recordGroups') : onContentChange('recordGroupFields') } @@ -232,7 +232,7 @@ export const ObjectOptionsDropdownCustomView = ({ - isDefined(recordGroupFieldMetadata) + isDefined(recordIndexGroupFieldMetadataItem) ? onContentChange('recordGroups') : onContentChange('recordGroupFields') } @@ -241,7 +241,7 @@ export const ObjectOptionsDropdownCustomView = ({ contextualText={ isDefaultView ? t`Not available on Default View` - : recordGroupFieldMetadata?.label + : recordIndexGroupFieldMetadataItem?.label } contextualTextPosition="right" hasSubMenu diff --git a/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownHiddenRecordGroupsContent.tsx b/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownHiddenRecordGroupsContent.tsx index cd4f86a297..5b54617da9 100644 --- a/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownHiddenRecordGroupsContent.tsx +++ b/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownHiddenRecordGroupsContent.tsx @@ -36,7 +36,7 @@ export const ObjectOptionsDropdownHiddenRecordGroupsContent = () => { viewType, } = useObjectOptionsDropdown(); - const recordGroupFieldMetadata = useAtomComponentStateValue( + const recordIndexGroupFieldMetadataItem = useAtomComponentStateValue( recordIndexGroupFieldMetadataItemComponentState, ); @@ -61,7 +61,7 @@ export const ObjectOptionsDropdownHiddenRecordGroupsContent = () => { const viewGroupSettingsUrl = getSettingsPath(SettingsPath.ObjectFieldEdit, { objectNamePlural, - fieldName: recordGroupFieldMetadata?.name ?? '', + fieldName: recordIndexGroupFieldMetadataItem?.name ?? '', }); const location = useLocation(); @@ -88,10 +88,10 @@ export const ObjectOptionsDropdownHiddenRecordGroupsContent = () => { /> } > - {t`Hidden`} {recordGroupFieldMetadata?.label} + {t`Hidden`} {recordIndexGroupFieldMetadataItem?.label} { const recordIndexCalendarLayout = useAtomStateValue( recordIndexCalendarLayoutState, ); - const recordGroupFieldMetadata = useAtomComponentStateValue( + const recordIndexGroupFieldMetadataItem = useAtomComponentStateValue( recordIndexGroupFieldMetadataItemComponentState, ); @@ -282,7 +282,7 @@ export const ObjectOptionsDropdownLayoutContent = () => { { - isDefined(recordGroupFieldMetadata) + isDefined(recordIndexGroupFieldMetadataItem) ? onContentChange('recordGroups') : onContentChange('recordGroupFields'); }} @@ -290,13 +290,13 @@ export const ObjectOptionsDropdownLayoutContent = () => { - isDefined(recordGroupFieldMetadata) + isDefined(recordIndexGroupFieldMetadataItem) ? onContentChange('recordGroups') : onContentChange('recordGroupFields') } LeftIcon={IconLayoutList} text={t`Group`} - contextualText={recordGroupFieldMetadata?.label} + contextualText={recordIndexGroupFieldMetadataItem?.label} contextualTextPosition="right" hasSubMenu /> diff --git a/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownRecordGroupFieldsContent.tsx b/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownRecordGroupFieldsContent.tsx index c6cdbee6f1..e2e8e176a4 100644 --- a/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownRecordGroupFieldsContent.tsx +++ b/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownRecordGroupFieldsContent.tsx @@ -52,7 +52,7 @@ export const ObjectOptionsDropdownRecordGroupFieldsContent = () => { hiddenRecordGroupIdsComponentSelector, ); - const recordGroupFieldMetadata = useAtomComponentStateValue( + const recordIndexGroupFieldMetadataItem = useAtomComponentStateValue( recordIndexGroupFieldMetadataItemComponentState, ); @@ -109,7 +109,7 @@ export const ObjectOptionsDropdownRecordGroupFieldsContent = () => { StartComponent={ - isDefined(recordGroupFieldMetadata) + isDefined(recordIndexGroupFieldMetadataItem) ? onContentChange('recordGroups') : resetContent() } @@ -130,14 +130,16 @@ export const ObjectOptionsDropdownRecordGroupFieldsContent = () => { {viewType === ViewType.Table && ( )} {filteredRecordGroupFieldMetadataItems.map((fieldMetadataItem) => ( handleRecordGroupFieldChange(fieldMetadataItem)} LeftIcon={getIcon(fieldMetadataItem.icon)} text={fieldMetadataItem.label} diff --git a/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownRecordGroupSortContent.tsx b/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownRecordGroupSortContent.tsx index 9f8ff6caeb..432ec23f02 100644 --- a/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownRecordGroupSortContent.tsx +++ b/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownRecordGroupSortContent.tsx @@ -31,12 +31,11 @@ export const ObjectOptionsDropdownRecordGroupSortContent = () => { hiddenRecordGroupIdsComponentSelector, ); - const [recordGroupSort, setRecordGroupSort] = useAtomComponentState( - recordIndexRecordGroupSortComponentState, - ); + const [recordIndexRecordGroupSort, setRecordIndexRecordGroupSort] = + useAtomComponentState(recordIndexRecordGroupSortComponentState); const handleRecordGroupSortChange = (sort: RecordGroupSort) => { - setRecordGroupSort(sort); + setRecordIndexRecordGroupSort(sort); }; const selectedItemId = useAtomComponentStateValue( @@ -87,7 +86,7 @@ export const ObjectOptionsDropdownRecordGroupSortContent = () => { } LeftIcon={IconHandMove} text={RecordGroupSort.Manual} - selected={recordGroupSort === RecordGroupSort.Manual} + selected={recordIndexRecordGroupSort === RecordGroupSort.Manual} focused={selectedItemId === RecordGroupSort.Manual} /> @@ -103,7 +102,9 @@ export const ObjectOptionsDropdownRecordGroupSortContent = () => { } LeftIcon={IconSortAZ} text={RecordGroupSort.Alphabetical} - selected={recordGroupSort === RecordGroupSort.Alphabetical} + selected={ + recordIndexRecordGroupSort === RecordGroupSort.Alphabetical + } focused={selectedItemId === RecordGroupSort.Alphabetical} /> @@ -119,7 +120,10 @@ export const ObjectOptionsDropdownRecordGroupSortContent = () => { } LeftIcon={IconSortZA} text={RecordGroupSort.ReverseAlphabetical} - selected={recordGroupSort === RecordGroupSort.ReverseAlphabetical} + selected={ + recordIndexRecordGroupSort === + RecordGroupSort.ReverseAlphabetical + } focused={selectedItemId === RecordGroupSort.ReverseAlphabetical} /> diff --git a/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownRecordGroupsContent.tsx b/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownRecordGroupsContent.tsx index c3ddf229c6..38d4a236c8 100644 --- a/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownRecordGroupsContent.tsx +++ b/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownRecordGroupsContent.tsx @@ -48,7 +48,7 @@ export const ObjectOptionsDropdownRecordGroupsContent = () => { const { currentView } = useGetCurrentViewOnly(); - const recordGroupFieldMetadata = useAtomComponentStateValue( + const recordIndexGroupFieldMetadataItem = useAtomComponentStateValue( recordIndexGroupFieldMetadataItemComponentState, ); @@ -61,14 +61,16 @@ export const ObjectOptionsDropdownRecordGroupsContent = () => { hiddenRecordGroupIdsComponentSelector, ); - const hideEmptyRecordGroup = useAtomComponentStateValue( + const recordIndexShouldHideEmptyRecordGroups = useAtomComponentStateValue( recordIndexShouldHideEmptyRecordGroupsComponentState, ); const shouldHideEmptyGroups = - hideEmptyRecordGroup ?? currentView?.shouldHideEmptyGroups ?? false; + recordIndexShouldHideEmptyRecordGroups ?? + currentView?.shouldHideEmptyGroups ?? + false; - const recordGroupSort = useAtomComponentStateValue( + const recordIndexRecordGroupSort = useAtomComponentStateValue( recordIndexRecordGroupSortComponentState, ); @@ -136,7 +138,7 @@ export const ObjectOptionsDropdownRecordGroupsContent = () => { onClick={() => onContentChange('recordGroupFields')} LeftIcon={IconLayoutList} text={t`Group by`} - contextualText={recordGroupFieldMetadata?.label} + contextualText={recordIndexGroupFieldMetadataItem?.label} contextualTextPosition="right" hasSubMenu /> @@ -150,7 +152,7 @@ export const ObjectOptionsDropdownRecordGroupsContent = () => { onClick={() => onContentChange('recordGroupSort')} LeftIcon={IconSortDescending} text={t`Sort`} - contextualText={recordGroupSort} + contextualText={recordIndexRecordGroupSort} contextualTextPosition="right" hasSubMenu /> @@ -201,7 +203,7 @@ export const ObjectOptionsDropdownRecordGroupsContent = () => { onContentChange('hiddenRecordGroups')} LeftIcon={IconEyeOff} - text={`${t`Hidden`} ${recordGroupFieldMetadata?.label ?? ''}`} + text={`${t`Hidden`} ${recordIndexGroupFieldMetadataItem?.label ?? ''}`} /> diff --git a/packages/twenty-front/src/modules/object-record/object-options-dropdown/hooks/useSearchRecordGroupField.ts b/packages/twenty-front/src/modules/object-record/object-options-dropdown/hooks/useSearchRecordGroupField.ts index 31ec829f8c..c516cacdc7 100644 --- a/packages/twenty-front/src/modules/object-record/object-options-dropdown/hooks/useSearchRecordGroupField.ts +++ b/packages/twenty-front/src/modules/object-record/object-options-dropdown/hooks/useSearchRecordGroupField.ts @@ -7,12 +7,14 @@ import { FieldMetadataType } from '~/generated-metadata/graphql'; export const useSearchRecordGroupField = () => { const { objectMetadataItem } = useRecordIndexContextOrThrow(); - const [recordGroupFieldSearchInput, setRecordGroupFieldSearchInput] = - useAtomComponentState(objectOptionsDropdownSearchInputComponentState); + const [ + objectOptionsDropdownSearchInput, + setObjectOptionsDropdownSearchInput, + ] = useAtomComponentState(objectOptionsDropdownSearchInputComponentState); const filteredRecordGroupFieldMetadataItems = useMemo(() => { const searchInputLowerCase = - recordGroupFieldSearchInput.toLocaleLowerCase(); + objectOptionsDropdownSearchInput.toLocaleLowerCase(); return objectMetadataItem.readableFields.filter( (field) => @@ -20,11 +22,11 @@ export const useSearchRecordGroupField = () => { field.isActive && field.label.toLocaleLowerCase().includes(searchInputLowerCase), ); - }, [objectMetadataItem.readableFields, recordGroupFieldSearchInput]); + }, [objectMetadataItem.readableFields, objectOptionsDropdownSearchInput]); return { - recordGroupFieldSearchInput, - setRecordGroupFieldSearchInput, + recordGroupFieldSearchInput: objectOptionsDropdownSearchInput, + setRecordGroupFieldSearchInput: setObjectOptionsDropdownSearchInput, filteredRecordGroupFieldMetadataItems, }; }; diff --git a/packages/twenty-front/src/modules/object-record/object-options-dropdown/hooks/useUpdateObjectViewOptions.ts b/packages/twenty-front/src/modules/object-record/object-options-dropdown/hooks/useUpdateObjectViewOptions.ts index afc4984aaa..2bea119576 100644 --- a/packages/twenty-front/src/modules/object-record/object-options-dropdown/hooks/useUpdateObjectViewOptions.ts +++ b/packages/twenty-front/src/modules/object-record/object-options-dropdown/hooks/useUpdateObjectViewOptions.ts @@ -16,11 +16,11 @@ export const useUpdateObjectViewOptions = () => { recordIndexOpenRecordInState, ); - const setRecordIndexViewName = useSetAtomComponentState( + const setViewPickerInputName = useSetAtomComponentState( viewPickerInputNameComponentState, ); - const setRecordIndexViewIcon = useSetAtomComponentState( + const setViewPickerSelectedIcon = useSetAtomComponentState( viewPickerSelectedIconComponentState, ); @@ -41,23 +41,23 @@ export const useUpdateObjectViewOptions = () => { const setAndPersistViewName = useCallback( (viewName: string, view: GraphQLView | undefined) => { if (!view) return; - setRecordIndexViewName(viewName); + setViewPickerInputName(viewName); updateCurrentView({ name: viewName, }); }, - [setRecordIndexViewName, updateCurrentView], + [setViewPickerInputName, updateCurrentView], ); const setAndPersistViewIcon = useCallback( (viewIcon: string, view: GraphQLView | undefined) => { if (!view) return; - setRecordIndexViewIcon(viewIcon); + setViewPickerSelectedIcon(viewIcon); updateCurrentView({ icon: viewIcon, }); }, - [setRecordIndexViewIcon, updateCurrentView], + [setViewPickerSelectedIcon, updateCurrentView], ); return { diff --git a/packages/twenty-front/src/modules/object-record/object-sort-dropdown/components/ObjectSortDropdownButton.tsx b/packages/twenty-front/src/modules/object-record/object-sort-dropdown/components/ObjectSortDropdownButton.tsx index c0e82decfc..877b9f646d 100644 --- a/packages/twenty-front/src/modules/object-record/object-sort-dropdown/components/ObjectSortDropdownButton.tsx +++ b/packages/twenty-front/src/modules/object-record/object-sort-dropdown/components/ObjectSortDropdownButton.tsx @@ -131,13 +131,13 @@ export const ObjectSortDropdownButton = () => { const [selectedRecordSortDirection, setSelectedRecordSortDirection] = useAtomComponentState(selectedRecordSortDirectionComponentState); - const setIsRecordSortDirectionMenuUnfolded = useSetAtomComponentState( + const setIsRecordSortDirectionDropdownMenuUnfolded = useSetAtomComponentState( isRecordSortDirectionDropdownMenuUnfoldedComponentState, ); const handleSortDirectionClick = (sortDirection: ViewSortDirection) => { setSelectedRecordSortDirection(sortDirection); - setIsRecordSortDirectionMenuUnfolded(false); + setIsRecordSortDirectionDropdownMenuUnfolded(false); }; const isDropdownOpen = useAtomComponentStateValue( diff --git a/packages/twenty-front/src/modules/object-record/record-board/components/RecordBoardContainer.tsx b/packages/twenty-front/src/modules/object-record/record-board/components/RecordBoardContainer.tsx index 6db4308fac..6263d027d8 100644 --- a/packages/twenty-front/src/modules/object-record/record-board/components/RecordBoardContainer.tsx +++ b/packages/twenty-front/src/modules/object-record/record-board/components/RecordBoardContainer.tsx @@ -55,7 +55,7 @@ export const RecordBoardContainer = ({ ...args, }); - const isRecordIndexRemoveSortingModalOpened = useAtomComponentStateValue( + const isModalOpened = useAtomComponentStateValue( isModalOpenedComponentState, RECORD_INDEX_REMOVE_SORTING_MODAL_ID, ); @@ -80,9 +80,7 @@ export const RecordBoardContainer = ({ value={{ instanceId: recordBoardId }} > - {isRecordIndexRemoveSortingModalOpened && ( - - )} + {isModalOpened && } diff --git a/packages/twenty-front/src/modules/object-record/record-board/components/RecordBoardFetchMoreInViewTriggerComponent.tsx b/packages/twenty-front/src/modules/object-record/record-board/components/RecordBoardFetchMoreInViewTriggerComponent.tsx index 5bd76a72d5..b9df7a5b93 100644 --- a/packages/twenty-front/src/modules/object-record/record-board/components/RecordBoardFetchMoreInViewTriggerComponent.tsx +++ b/packages/twenty-front/src/modules/object-record/record-board/components/RecordBoardFetchMoreInViewTriggerComponent.tsx @@ -21,15 +21,14 @@ const StyledFetchMoreTriggerDiv = styled.div<{ width: number }>` `; export const RecordBoardFetchMoreInViewTriggerComponent = () => { - const [shouldFetchMore, setShouldFetchMore] = useAtomComponentState( - recordBoardShouldFetchMoreComponentState, - ); + const [recordBoardShouldFetchMore, setRecordBoardShouldFetchMore] = + useAtomComponentState(recordBoardShouldFetchMoreComponentState); - const isInitialLoading = useAtomComponentStateValue( + const recordIndexRecordGroupsAreInInitialLoading = useAtomComponentStateValue( recordIndexRecordGroupsAreInInitialLoadingComponentState, ); - const isFetchingMore = useAtomComponentStateValue( + const recordBoardIsFetchingMore = useAtomComponentStateValue( recordBoardIsFetchingMoreComponentState, ); @@ -52,19 +51,22 @@ export const RecordBoardFetchMoreInViewTriggerComponent = () => { 1; useEffect(() => { - if (!isInitialLoading && !isFetchingMore) { + if ( + !recordIndexRecordGroupsAreInInitialLoading && + !recordBoardIsFetchingMore + ) { const newShouldFetchMore = inView; - if (shouldFetchMore !== newShouldFetchMore) { - setShouldFetchMore(newShouldFetchMore); + if (recordBoardShouldFetchMore !== newShouldFetchMore) { + setRecordBoardShouldFetchMore(newShouldFetchMore); } } }, [ - shouldFetchMore, - setShouldFetchMore, + recordBoardShouldFetchMore, + setRecordBoardShouldFetchMore, inView, - isInitialLoading, - isFetchingMore, + recordIndexRecordGroupsAreInInitialLoading, + recordBoardIsFetchingMore, ]); return ( diff --git a/packages/twenty-front/src/modules/object-record/record-board/components/RecordBoardQueryEffect.tsx b/packages/twenty-front/src/modules/object-record/record-board/components/RecordBoardQueryEffect.tsx index 832a523eee..74af4fcf6d 100644 --- a/packages/twenty-front/src/modules/object-record/record-board/components/RecordBoardQueryEffect.tsx +++ b/packages/twenty-front/src/modules/object-record/record-board/components/RecordBoardQueryEffect.tsx @@ -51,7 +51,7 @@ export const RecordBoardQueryEffect = () => { const { scrollWrapperHTMLElement } = useScrollWrapperHTMLElement(); - const [shouldFetchMore] = useAtomComponentState( + const [recordBoardShouldFetchMore] = useAtomComponentState( recordBoardShouldFetchMoreComponentState, ); @@ -64,11 +64,11 @@ export const RecordBoardQueryEffect = () => { const { triggerRecordBoardInitialQuery } = useTriggerRecordBoardInitialQuery(); - const recordGroupdIds = useAtomComponentStateValue( + const recordGroupIds = useAtomComponentStateValue( recordGroupIdsComponentState, ); const recordGroupIdsHaveChanged = !isDeeplyEqual( - [...recordGroupdIds].sort(), + [...recordGroupIds].sort(), [...lastRecordGroupIds].sort(), ); @@ -78,10 +78,10 @@ export const RecordBoardQueryEffect = () => { (queryIdentifierHasChanged || recordGroupIdsHaveChanged) ) { triggerRecordBoardInitialQuery(); - setLastRecordGroupIds(recordGroupdIds); + setLastRecordGroupIds(recordGroupIds); } else if ( !recordIndexRecordGroupsAreInInitialLoading && - shouldFetchMore && + recordBoardShouldFetchMore && !queryIdentifierHasChanged && !recordBoardIsFetchingMore ) { @@ -95,11 +95,11 @@ export const RecordBoardQueryEffect = () => { setRecordBoardCurrentGroupByQueryOffset, scrollWrapperHTMLElement, recordIndexRecordGroupsAreInInitialLoading, - shouldFetchMore, + recordBoardShouldFetchMore, recordBoardIsFetchingMore, triggerRecordBoardFetchMore, setLastRecordGroupIds, - recordGroupdIds, + recordGroupIds, recordGroupIdsHaveChanged, ]); diff --git a/packages/twenty-front/src/modules/object-record/record-board/components/RecordBoardScrollToFocusedCardEffect.tsx b/packages/twenty-front/src/modules/object-record/record-board/components/RecordBoardScrollToFocusedCardEffect.tsx index c83a2d4bfc..0198804f98 100644 --- a/packages/twenty-front/src/modules/object-record/record-board/components/RecordBoardScrollToFocusedCardEffect.tsx +++ b/packages/twenty-front/src/modules/object-record/record-board/components/RecordBoardScrollToFocusedCardEffect.tsx @@ -8,22 +8,22 @@ import { useAtomComponentStateValue } from '@/ui/utilities/state/jotai/hooks/use export const RecordBoardScrollToFocusedCardEffect = () => { const { recordBoardId } = useContext(RecordBoardContext); - const focusedCardIndexes = useAtomComponentStateValue( + const focusedRecordBoardCardIndexes = useAtomComponentStateValue( focusedRecordBoardCardIndexesComponentState, recordBoardId, ); - const isFocusActive = useAtomComponentStateValue( + const isRecordBoardCardFocusActive = useAtomComponentStateValue( isRecordBoardCardFocusActiveComponentState, recordBoardId, ); useEffect(() => { - if (!isFocusActive || !focusedCardIndexes) { + if (!isRecordBoardCardFocusActive || !focusedRecordBoardCardIndexes) { return; } - const { rowIndex, columnIndex } = focusedCardIndexes; + const { rowIndex, columnIndex } = focusedRecordBoardCardIndexes; const focusElement = document.getElementById( `record-board-card-${columnIndex}-${rowIndex}`, @@ -36,7 +36,7 @@ export const RecordBoardScrollToFocusedCardEffect = () => { if (focusElement instanceof HTMLElement) { focusElement.scrollIntoView({ behavior: 'smooth', block: 'nearest' }); } - }, [focusedCardIndexes, isFocusActive]); + }, [focusedRecordBoardCardIndexes, isRecordBoardCardFocusActive]); return null; }; diff --git a/packages/twenty-front/src/modules/object-record/record-board/components/RecordBoardSelectRecordsEffect.tsx b/packages/twenty-front/src/modules/object-record/record-board/components/RecordBoardSelectRecordsEffect.tsx index 327ddbe375..7450167693 100644 --- a/packages/twenty-front/src/modules/object-record/record-board/components/RecordBoardSelectRecordsEffect.tsx +++ b/packages/twenty-front/src/modules/object-record/record-board/components/RecordBoardSelectRecordsEffect.tsx @@ -10,23 +10,23 @@ export const RecordBoardSelectRecordsEffect = () => { recordBoardSelectedRecordIdsComponentSelector, ); - const setContextStoreTargetedRecords = useSetAtomComponentState( + const setContextStoreTargetedRecordsRule = useSetAtomComponentState( contextStoreTargetedRecordsRuleComponentState, ); useEffect(() => { - setContextStoreTargetedRecords({ + setContextStoreTargetedRecordsRule({ mode: 'selection', selectedRecordIds: selectedRecordIds, }); return () => { - setContextStoreTargetedRecords({ + setContextStoreTargetedRecordsRule({ mode: 'selection', selectedRecordIds: [], }); }; - }, [selectedRecordIds, setContextStoreTargetedRecords]); + }, [selectedRecordIds, setContextStoreTargetedRecordsRule]); return <>; }; diff --git a/packages/twenty-front/src/modules/object-record/record-board/components/RecordBoardStickyHeaderEffect.tsx b/packages/twenty-front/src/modules/object-record/record-board/components/RecordBoardStickyHeaderEffect.tsx index 837c306080..ebfd43351c 100644 --- a/packages/twenty-front/src/modules/object-record/record-board/components/RecordBoardStickyHeaderEffect.tsx +++ b/packages/twenty-front/src/modules/object-record/record-board/components/RecordBoardStickyHeaderEffect.tsx @@ -3,13 +3,13 @@ import { useAtomComponentStateValue } from '@/ui/utilities/state/jotai/hooks/use import { useEffect } from 'react'; export const RecordBoardStickyHeaderEffect = () => { - const scrollTop = useAtomComponentStateValue( + const scrollWrapperScrollTop = useAtomComponentStateValue( scrollWrapperScrollTopComponentState, ); // TODO: move this outside because it might cause way too many re-renders for other hooks useEffect(() => { - if (scrollTop > 0) { + if (scrollWrapperScrollTop > 0) { document .getElementById('record-board-header') ?.classList.add('header-sticky'); @@ -18,7 +18,7 @@ export const RecordBoardStickyHeaderEffect = () => { .getElementById('record-board-header') ?.classList.remove('header-sticky'); } - }, [scrollTop]); + }, [scrollWrapperScrollTop]); return <>; }; diff --git a/packages/twenty-front/src/modules/object-record/record-board/hooks/useRemoveSelectedRecordsFromRecordBoard.ts b/packages/twenty-front/src/modules/object-record/record-board/hooks/useRemoveSelectedRecordsFromRecordBoard.ts index d5ee347e08..1b81d2337f 100644 --- a/packages/twenty-front/src/modules/object-record/record-board/hooks/useRemoveSelectedRecordsFromRecordBoard.ts +++ b/packages/twenty-front/src/modules/object-record/record-board/hooks/useRemoveSelectedRecordsFromRecordBoard.ts @@ -21,7 +21,7 @@ export const useRemoveSelectedRecordsFromRecordBoard = ( recordBoardIndexId, ); - const groupByFieldMetadataItem = useAtomComponentStateValue( + const recordIndexGroupFieldMetadataItem = useAtomComponentStateValue( recordIndexGroupFieldMetadataItemComponentState, recordBoardIndexId, ); @@ -46,7 +46,7 @@ export const useRemoveSelectedRecordsFromRecordBoard = ( ) as string[]; if ( - !isDefined(groupByFieldMetadataItem) || + !isDefined(recordIndexGroupFieldMetadataItem) || !isNonEmptyArray(recordGroupDefinitions) || !isNonEmptyArray(deletedRecordIds) ) { @@ -86,7 +86,7 @@ export const useRemoveSelectedRecordsFromRecordBoard = ( resetRecordBoardSelection(); }, [ store, - groupByFieldMetadataItem, + recordIndexGroupFieldMetadataItem, recordIndexRecordIdsByGroupCallbackState, recordGroupDefinitions, recordBoardSelectedRecordIds, diff --git a/packages/twenty-front/src/modules/object-record/record-board/record-board-card/anchored-portal/components/RecordBoardCardCellEditModePortal.tsx b/packages/twenty-front/src/modules/object-record/record-board/record-board-card/anchored-portal/components/RecordBoardCardCellEditModePortal.tsx index 2d7add27c9..606fdb1eaa 100644 --- a/packages/twenty-front/src/modules/object-record/record-board/record-board-card/anchored-portal/components/RecordBoardCardCellEditModePortal.tsx +++ b/packages/twenty-front/src/modules/object-record/record-board/record-board-card/anchored-portal/components/RecordBoardCardCellEditModePortal.tsx @@ -16,13 +16,16 @@ export const RecordBoardCardCellEditModePortal = () => { const { objectMetadataItem } = useContext(RecordBoardContext); const { recordId } = useContext(RecordBoardCardContext); - const editModePosition = useAtomComponentStateValue( + const recordBoardCardEditModePosition = useAtomComponentStateValue( recordBoardCardEditModePositionComponentState, ); const { editedFieldMetadataItem } = useRecordBoardCardMetadataFromPosition(); - if (!isDefined(editModePosition) || !isDefined(editedFieldMetadataItem)) { + if ( + !isDefined(recordBoardCardEditModePosition) || + !isDefined(editedFieldMetadataItem) + ) { return null; } diff --git a/packages/twenty-front/src/modules/object-record/record-board/record-board-card/components/RecordBoardCard.tsx b/packages/twenty-front/src/modules/object-record/record-board/record-board-card/components/RecordBoardCard.tsx index b8e345c6a0..be40c552b3 100644 --- a/packages/twenty-front/src/modules/object-record/record-board/record-board-card/components/RecordBoardCard.tsx +++ b/packages/twenty-front/src/modules/object-record/record-board/record-board-card/components/RecordBoardCard.tsx @@ -73,18 +73,19 @@ export const RecordBoardCard = () => { const isCompactModeActive = currentView?.isCompact ?? false; - const [isCardExpanded, setIsCardExpanded] = useAtomComponentState( - recordBoardCardIsExpandedComponentState, - `record-board-card-${recordId}`, - ); + const [recordBoardCardIsExpanded, setRecordBoardCardIsExpanded] = + useAtomComponentState( + recordBoardCardIsExpandedComponentState, + `record-board-card-${recordId}`, + ); - const [isCurrentCardSelected, setIsCurrentCardSelected] = + const [isRecordBoardCardSelected, setIsRecordBoardCardSelected] = useAtomComponentFamilyState( isRecordBoardCardSelectedComponentFamilyState, recordId, ); - const isCurrentCardFocused = useAtomComponentFamilyStateValue( + const isRecordBoardCardFocused = useAtomComponentFamilyStateValue( isRecordBoardCardFocusedComponentFamilyState, { rowIndex, @@ -92,7 +93,7 @@ export const RecordBoardCard = () => { }, ); - const isCurrentCardActive = useAtomComponentFamilyStateValue( + const isRecordBoardCardActive = useAtomComponentFamilyStateValue( isRecordBoardCardActiveComponentFamilyState, { rowIndex, @@ -105,7 +106,7 @@ export const RecordBoardCard = () => { const actionMenuDropdownId = getActionMenuDropdownIdFromActionMenuId(actionMenuId); - const setActionMenuDropdownPosition = useSetAtomComponentState( + const setRecordIndexActionMenuDropdownPosition = useSetAtomComponentState( recordIndexActionMenuDropdownPositionComponentState, actionMenuDropdownId, ); @@ -118,8 +119,8 @@ export const RecordBoardCard = () => { const handleContextMenuOpen = (event: React.MouseEvent) => { event.preventDefault(); - setIsCurrentCardSelected(true); - setActionMenuDropdownPosition({ + setIsRecordBoardCardSelected(true); + setRecordIndexActionMenuDropdownPosition({ x: event.clientX, y: event.clientY, }); @@ -139,8 +140,8 @@ export const RecordBoardCard = () => { }; const onMouseLeaveBoard = useDebouncedCallback(() => { - if (isCompactModeActive && isCardExpanded) { - setIsCardExpanded(false); + if (isCompactModeActive && recordBoardCardIsExpanded) { + setRecordBoardCardIsExpanded(false); } }, 800); @@ -165,9 +166,9 @@ export const RecordBoardCard = () => { > {isRecordIdPrimaryDragMultiple && } { > diff --git a/packages/twenty-front/src/modules/object-record/record-board/record-board-card/components/RecordBoardCardDraggableContainer.tsx b/packages/twenty-front/src/modules/object-record/record-board/record-board-card/components/RecordBoardCardDraggableContainer.tsx index 4083d59c38..cfbb276dcb 100644 --- a/packages/twenty-front/src/modules/object-record/record-board/record-board-card/components/RecordBoardCardDraggableContainer.tsx +++ b/packages/twenty-front/src/modules/object-record/record-board/record-board-card/components/RecordBoardCardDraggableContainer.tsx @@ -36,7 +36,7 @@ export const RecordBoardCardDraggableContainer = ({ const { columnIndex } = useContext(RecordBoardColumnContext); - const isRecordBoardCardFocusActive = useAtomComponentFamilyStateValue( + const isRecordBoardCardFocused = useAtomComponentFamilyStateValue( isRecordBoardCardFocusedComponentFamilyState, { rowIndex, @@ -61,7 +61,7 @@ export const RecordBoardCardDraggableContainer = ({ data-select-disable > - {isRecordBoardCardFocusActive && } + {isRecordBoardCardFocused && } diff --git a/packages/twenty-front/src/modules/object-record/record-board/record-board-card/components/RecordBoardCardHeader.tsx b/packages/twenty-front/src/modules/object-record/record-board/record-board-card/components/RecordBoardCardHeader.tsx index d0cb6c1695..38f5db67c6 100644 --- a/packages/twenty-front/src/modules/object-record/record-board/record-board-card/components/RecordBoardCardHeader.tsx +++ b/packages/twenty-front/src/modules/object-record/record-board/record-board-card/components/RecordBoardCardHeader.tsx @@ -54,14 +54,13 @@ export const RecordBoardCardHeader = () => { const isCompactModeActive = currentView?.isCompact ?? false; - const [isCardExpanded, setIsCardExpanded] = useAtomComponentState( - recordBoardCardIsExpandedComponentState, - ); + const [recordBoardCardIsExpanded, setRecordBoardCardIsExpanded] = + useAtomComponentState(recordBoardCardIsExpandedComponentState); const { checkIfLastUnselectAndCloseDropdown } = useRecordBoardSelection(recordBoardId); - const [isCurrentCardSelected, setIsCurrentCardSelected] = + const [isRecordBoardCardSelected, setIsRecordBoardCardSelected] = useAtomComponentFamilyState( isRecordBoardCardSelectedComponentFamilyState, recordId, @@ -73,7 +72,7 @@ export const RecordBoardCardHeader = () => { recordIndexOpenRecordInState, ); - const record = useAtomFamilyStateValue(recordStoreFamilyState, recordId); + const recordStore = useAtomFamilyStateValue(recordStoreFamilyState, recordId); const triggerEvent = recordIndexOpenRecordIn === ViewOpenRecordInType.SIDE_PANEL @@ -84,10 +83,10 @@ export const RecordBoardCardHeader = () => { - {isDefined(record) && ( + {isDefined(recordStore) && ( { activateBoardCard({ rowIndex, columnIndex }); @@ -104,10 +103,10 @@ export const RecordBoardCardHeader = () => { { - setIsCardExpanded(!isCardExpanded); + setRecordBoardCardIsExpanded(!recordBoardCardIsExpanded); }} /> @@ -117,9 +116,9 @@ export const RecordBoardCardHeader = () => { { - setIsCurrentCardSelected(value.target.checked); + setIsRecordBoardCardSelected(value.target.checked); checkIfLastUnselectAndCloseDropdown(); }} variant={CheckboxVariant.Secondary} diff --git a/packages/twenty-front/src/modules/object-record/record-board/record-board-card/hooks/useRecordBoardCardMetadataFromPosition.ts b/packages/twenty-front/src/modules/object-record/record-board/record-board-card/hooks/useRecordBoardCardMetadataFromPosition.ts index d6bb3826a2..483ac3831c 100644 --- a/packages/twenty-front/src/modules/object-record/record-board/record-board-card/hooks/useRecordBoardCardMetadataFromPosition.ts +++ b/packages/twenty-front/src/modules/object-record/record-board/record-board-card/hooks/useRecordBoardCardMetadataFromPosition.ts @@ -11,11 +11,11 @@ import { isDefined } from 'twenty-shared/utils'; export const useRecordBoardCardMetadataFromPosition = () => { const { objectMetadataItem } = useContext(RecordBoardContext); - const hoverPosition = useAtomComponentStateValue( + const recordBoardCardHoverPosition = useAtomComponentStateValue( recordBoardCardHoverPositionComponentState, ); - const editModePosition = useAtomComponentStateValue( + const recordBoardCardEditModePosition = useAtomComponentStateValue( recordBoardCardEditModePositionComponentState, ); @@ -30,12 +30,12 @@ export const useRecordBoardCardMetadataFromPosition = () => { labelIdentifierFieldMetadataItem?.id !== recordField.fieldMetadataItemId, ); - const hoveredRecordField = isDefined(hoverPosition) - ? visibleRecordFieldsFiltered.at(hoverPosition) + const hoveredRecordField = isDefined(recordBoardCardHoverPosition) + ? visibleRecordFieldsFiltered.at(recordBoardCardHoverPosition) : undefined; - const editedRecordField = isDefined(editModePosition) - ? visibleRecordFieldsFiltered.at(editModePosition) + const editedRecordField = isDefined(recordBoardCardEditModePosition) + ? visibleRecordFieldsFiltered.at(recordBoardCardEditModePosition) : undefined; const hoveredFieldMetadataItem = isDefined(hoveredRecordField) diff --git a/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumn.tsx b/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumn.tsx index 67c5a233aa..e7000513c7 100644 --- a/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumn.tsx +++ b/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumn.tsx @@ -38,7 +38,7 @@ export const RecordBoardColumn = ({ recordGroupDefinitionFamilyState, recordBoardColumnId, ); - const recordIdsByGroup = useAtomComponentFamilyStateValue( + const recordIndexRecordIdsByGroup = useAtomComponentFamilyStateValue( recordIndexRecordIdsByGroupComponentFamilyState, recordBoardColumnId, ); @@ -58,7 +58,7 @@ export const RecordBoardColumn = ({ value={{ columnDefinition: recordGroupDefinition, columnId: recordBoardColumnId, - recordIds: recordIdsByGroup, + recordIds: recordIndexRecordIdsByGroup, columnIndex: recordBoardColumnIndex, }} > diff --git a/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnCardsContainer.tsx b/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnCardsContainer.tsx index bd3a5a90fa..e78ef43fef 100644 --- a/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnCardsContainer.tsx +++ b/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnCardsContainer.tsx @@ -33,7 +33,7 @@ export const RecordBoardColumnCardsContainer = ({ }: RecordBoardColumnCardsContainerProps) => { const { columnDefinition } = useContext(RecordBoardColumnContext); - const recordIds = useAtomComponentFamilyStateValue( + const recordIndexRecordIdsByGroup = useAtomComponentFamilyStateValue( recordIndexRecordIdsByGroupComponentFamilyState, recordBoardColumnId, ); @@ -49,7 +49,7 @@ export const RecordBoardColumnCardsContainer = ({ // eslint-disable-next-line react/jsx-props-no-spreading {...droppableProvided?.droppableProps} > - {recordIds.map((recordId, index) => ( + {recordIndexRecordIdsByGroup.map((recordId, index) => ( {(draggableProvided) => ( diff --git a/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnHeaderAggregateDropdownFieldsContent.tsx b/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnHeaderAggregateDropdownFieldsContent.tsx index e97188f221..1931d07031 100644 --- a/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnHeaderAggregateDropdownFieldsContent.tsx +++ b/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnHeaderAggregateDropdownFieldsContent.tsx @@ -39,7 +39,7 @@ export const RecordBoardColumnHeaderAggregateDropdownFieldsContent = () => { aggregateOperationComponentState, ); - const availableFieldsIdsForAggregateOperation = useAtomComponentStateValue( + const availableFieldIdsForAggregateOperation = useAtomComponentStateValue( availableFieldIdsForAggregateOperationComponentState, ); @@ -72,7 +72,7 @@ export const RecordBoardColumnHeaderAggregateDropdownFieldsContent = () => { {getAggregateOperationLabel(aggregateOperation)} - {availableFieldsIdsForAggregateOperation.map((fieldId) => { + {availableFieldIdsForAggregateOperation.map((fieldId) => { const fieldMetadata = objectMetadataItem.fields.find( (field) => field.id === fieldId, ); diff --git a/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnHeaderAggregateDropdownOptionsContent.tsx b/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnHeaderAggregateDropdownOptionsContent.tsx index ab0d601285..411e144f77 100644 --- a/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnHeaderAggregateDropdownOptionsContent.tsx +++ b/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnHeaderAggregateDropdownOptionsContent.tsx @@ -39,7 +39,7 @@ export const RecordBoardColumnHeaderAggregateDropdownOptionsContent = ({ aggregateOperationComponentState, ); - const setAvailableFieldsForAggregateOperation = useSetAtomComponentState( + const setAvailableFieldIdsForAggregateOperation = useSetAtomComponentState( availableFieldIdsForAggregateOperationComponentState, ); @@ -79,7 +79,7 @@ export const RecordBoardColumnHeaderAggregateDropdownOptionsContent = ({ availableAggregationOperation as ExtendedAggregateOperations, ); - setAvailableFieldsForAggregateOperation( + setAvailableFieldIdsForAggregateOperation( availableAggregationFieldsIdsForOperation, ); onContentChange('aggregateFields'); diff --git a/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnHeaderWrapper.tsx b/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnHeaderWrapper.tsx index e2e10b8b99..019e28c7f6 100644 --- a/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnHeaderWrapper.tsx +++ b/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnHeaderWrapper.tsx @@ -21,7 +21,7 @@ export const RecordBoardColumnHeaderWrapper = ({ columnId, ); - const recordIdsByGroup = useAtomComponentFamilyStateValue( + const recordIndexRecordIdsByGroup = useAtomComponentFamilyStateValue( recordIndexRecordIdsByGroupComponentFamilyState, columnId, ); @@ -41,7 +41,7 @@ export const RecordBoardColumnHeaderWrapper = ({ value={{ columnId, columnDefinition: recordGroupDefinition, - recordIds: recordIdsByGroup, + recordIds: recordIndexRecordIdsByGroup, columnIndex, }} > diff --git a/packages/twenty-front/src/modules/object-record/record-calendar/components/RecordIndexCalendarDataLoaderEffect.tsx b/packages/twenty-front/src/modules/object-record/record-calendar/components/RecordIndexCalendarDataLoaderEffect.tsx index 8dc88dd5e4..a85557035d 100644 --- a/packages/twenty-front/src/modules/object-record/record-calendar/components/RecordIndexCalendarDataLoaderEffect.tsx +++ b/packages/twenty-front/src/modules/object-record/record-calendar/components/RecordIndexCalendarDataLoaderEffect.tsx @@ -29,7 +29,7 @@ export const RecordIndexCalendarDataLoaderEffect = () => { const { upsertRecordsInStore } = useUpsertRecordsInStore(); - const setContextStoreTargetedRecords = useSetAtomComponentState( + const setContextStoreTargetedRecordsRule = useSetAtomComponentState( contextStoreTargetedRecordsRuleComponentState, recordCalendarId, ); @@ -64,18 +64,18 @@ export const RecordIndexCalendarDataLoaderEffect = () => { ]); useEffect(() => { - setContextStoreTargetedRecords({ + setContextStoreTargetedRecordsRule({ mode: 'selection', selectedRecordIds, }); return () => { - setContextStoreTargetedRecords({ + setContextStoreTargetedRecordsRule({ mode: 'selection', selectedRecordIds: [], }); }; - }, [selectedRecordIds, setContextStoreTargetedRecords]); + }, [selectedRecordIds, setContextStoreTargetedRecordsRule]); return <>; }; diff --git a/packages/twenty-front/src/modules/object-record/record-calendar/month/components/__stories__/RecordCalendarMonth.stories.tsx b/packages/twenty-front/src/modules/object-record/record-calendar/month/components/__stories__/RecordCalendarMonth.stories.tsx index 48f59c0276..482e1eb636 100644 --- a/packages/twenty-front/src/modules/object-record/record-calendar/month/components/__stories__/RecordCalendarMonth.stories.tsx +++ b/packages/twenty-front/src/modules/object-record/record-calendar/month/components/__stories__/RecordCalendarMonth.stories.tsx @@ -48,7 +48,7 @@ const meta: Meta = { const mockCoreView = mockedCoreViewsData[0]; - const setCurrentViewId = useSetAtomComponentState( + const setContextStoreCurrentViewId = useSetAtomComponentState( contextStoreCurrentViewIdComponentState, MAIN_CONTEXT_STORE_INSTANCE_ID, ); @@ -72,12 +72,12 @@ const meta: Meta = { useEffect(() => { setCoreViews([mockCoreView]); - setCurrentViewId(mockCoreView.id); + setContextStoreCurrentViewId(mockCoreView.id); setCurrentRecordFields(columns); setIsLoaded(true); }, [ setCoreViews, - setCurrentViewId, + setContextStoreCurrentViewId, setCurrentRecordFields, mockCoreView, columns, diff --git a/packages/twenty-front/src/modules/object-record/record-calendar/record-calendar-card/anchored-portal/components/RecordCalendarCardCellEditModePortal.tsx b/packages/twenty-front/src/modules/object-record/record-calendar/record-calendar-card/anchored-portal/components/RecordCalendarCardCellEditModePortal.tsx index 1de59477c4..b30be91da9 100644 --- a/packages/twenty-front/src/modules/object-record/record-calendar/record-calendar-card/anchored-portal/components/RecordCalendarCardCellEditModePortal.tsx +++ b/packages/twenty-front/src/modules/object-record/record-calendar/record-calendar-card/anchored-portal/components/RecordCalendarCardCellEditModePortal.tsx @@ -19,14 +19,17 @@ export const RecordCalendarCardCellEditModePortal = ({ }: RecordCalendarCardCellEditModePortalProps) => { const { objectMetadataItem } = useRecordCalendarContextOrThrow(); - const editModePosition = useAtomComponentStateValue( + const recordCalendarCardEditModePosition = useAtomComponentStateValue( recordCalendarCardEditModePositionComponentState, ); const { editedFieldMetadataItem } = useRecordCalendarCardMetadataFromPosition(); - if (!isDefined(editModePosition) || !isDefined(editedFieldMetadataItem)) { + if ( + !isDefined(recordCalendarCardEditModePosition) || + !isDefined(editedFieldMetadataItem) + ) { return null; } diff --git a/packages/twenty-front/src/modules/object-record/record-calendar/record-calendar-card/anchored-portal/components/RecordCalendarCardCellHoveredPortal.tsx b/packages/twenty-front/src/modules/object-record/record-calendar/record-calendar-card/anchored-portal/components/RecordCalendarCardCellHoveredPortal.tsx index 2dd8717b53..ddcbb8e107 100644 --- a/packages/twenty-front/src/modules/object-record/record-calendar/record-calendar-card/anchored-portal/components/RecordCalendarCardCellHoveredPortal.tsx +++ b/packages/twenty-front/src/modules/object-record/record-calendar/record-calendar-card/anchored-portal/components/RecordCalendarCardCellHoveredPortal.tsx @@ -18,14 +18,17 @@ export const RecordCalendarCardCellHoveredPortal = ({ }: RecordCalendarCardCellHoveredPortalProps) => { const { objectMetadataItem } = useRecordCalendarContextOrThrow(); - const hoverPosition = useAtomComponentStateValue( + const recordCalendarCardHoverPosition = useAtomComponentStateValue( recordCalendarCardHoverPositionComponentState, ); const { hoveredFieldMetadataItem } = useRecordCalendarCardMetadataFromPosition(); - if (!isDefined(hoverPosition) || !isDefined(hoveredFieldMetadataItem)) { + if ( + !isDefined(recordCalendarCardHoverPosition) || + !isDefined(hoveredFieldMetadataItem) + ) { return null; } diff --git a/packages/twenty-front/src/modules/object-record/record-calendar/record-calendar-card/components/RecordCalendarCard.tsx b/packages/twenty-front/src/modules/object-record/record-calendar/record-calendar-card/components/RecordCalendarCard.tsx index 6db54d8208..b873ebbb0b 100644 --- a/packages/twenty-front/src/modules/object-record/record-calendar/record-calendar-card/components/RecordCalendarCard.tsx +++ b/packages/twenty-front/src/modules/object-record/record-calendar/record-calendar-card/components/RecordCalendarCard.tsx @@ -36,7 +36,7 @@ export const RecordCalendarCard = ({ recordId }: RecordCalendarCardProps) => { const { currentView } = useGetCurrentViewOnly(); const isCompactModeActive = currentView?.isCompact ?? false; - const [isCurrentCardSelected, setIsCurrentCardSelected] = + const [isRecordCalendarCardSelected, setIsRecordCalendarCardSelected] = useAtomComponentFamilyState( isRecordCalendarCardSelectedComponentFamilyState, recordId, @@ -51,7 +51,7 @@ export const RecordCalendarCard = ({ recordId }: RecordCalendarCardProps) => { const actionMenuDropdownId = getActionMenuDropdownIdFromActionMenuId(actionMenuId); - const setActionMenuDropdownPosition = useSetAtomComponentState( + const setRecordIndexActionMenuDropdownPosition = useSetAtomComponentState( recordIndexActionMenuDropdownPositionComponentState, actionMenuDropdownId, ); @@ -60,8 +60,8 @@ export const RecordCalendarCard = ({ recordId }: RecordCalendarCardProps) => { const handleContextMenuOpen = (event: React.MouseEvent) => { event.preventDefault(); - setIsCurrentCardSelected(true); - setActionMenuDropdownPosition({ + setIsRecordCalendarCardSelected(true); + setRecordIndexActionMenuDropdownPosition({ x: event.clientX, y: event.clientY, }); @@ -85,7 +85,7 @@ export const RecordCalendarCard = ({ recordId }: RecordCalendarCardProps) => { > diff --git a/packages/twenty-front/src/modules/object-record/record-calendar/record-calendar-card/components/RecordCalendarCardHeader.tsx b/packages/twenty-front/src/modules/object-record/record-calendar/record-calendar-card/components/RecordCalendarCardHeader.tsx index 5f76340b3a..7c24567129 100644 --- a/packages/twenty-front/src/modules/object-record/record-calendar/record-calendar-card/components/RecordCalendarCardHeader.tsx +++ b/packages/twenty-front/src/modules/object-record/record-calendar/record-calendar-card/components/RecordCalendarCardHeader.tsx @@ -38,7 +38,7 @@ export const RecordCalendarCardHeader = ({ recordId, }: RecordCalendarCardHeaderProps) => { const { objectMetadataItem } = useRecordCalendarContextOrThrow(); - const record = useAtomFamilyStateValue(recordStoreFamilyState, recordId); + const recordStore = useAtomFamilyStateValue(recordStoreFamilyState, recordId); const { openRecordFromIndexView } = useOpenRecordFromIndexView(); const { currentView } = useGetCurrentViewOnly(); @@ -49,7 +49,7 @@ export const RecordCalendarCardHeader = ({ isDraggingRecordComponentState, ); - const [isCurrentCardSelected, setIsCurrentCardSelected] = + const [isRecordCalendarCardSelected, setIsRecordCalendarCardSelected] = useAtomComponentFamilyState( isRecordCalendarCardSelectedComponentFamilyState, recordId, @@ -62,7 +62,7 @@ export const RecordCalendarCardHeader = ({ openRecordFromIndexView({ recordId }); }; - if (!isDefined(record)) { + if (!isDefined(recordStore)) { return null; } @@ -72,7 +72,7 @@ export const RecordCalendarCardHeader = ({ { - setIsCurrentCardSelected(value.target.checked); + setIsRecordCalendarCardSelected(value.target.checked); }} variant={CheckboxVariant.Secondary} /> diff --git a/packages/twenty-front/src/modules/object-record/record-calendar/record-calendar-card/hooks/useRecordCalendarCardMetadataFromPosition.ts b/packages/twenty-front/src/modules/object-record/record-calendar/record-calendar-card/hooks/useRecordCalendarCardMetadataFromPosition.ts index 2ae39b7376..f974cb9992 100644 --- a/packages/twenty-front/src/modules/object-record/record-calendar/record-calendar-card/hooks/useRecordCalendarCardMetadataFromPosition.ts +++ b/packages/twenty-front/src/modules/object-record/record-calendar/record-calendar-card/hooks/useRecordCalendarCardMetadataFromPosition.ts @@ -10,11 +10,11 @@ import { isDefined } from 'twenty-shared/utils'; export const useRecordCalendarCardMetadataFromPosition = () => { const { objectMetadataItem } = useRecordCalendarContextOrThrow(); - const hoverPosition = useAtomComponentStateValue( + const recordCalendarCardHoverPosition = useAtomComponentStateValue( recordCalendarCardHoverPositionComponentState, ); - const editModePosition = useAtomComponentStateValue( + const recordCalendarCardEditModePosition = useAtomComponentStateValue( recordCalendarCardEditModePositionComponentState, ); @@ -29,12 +29,12 @@ export const useRecordCalendarCardMetadataFromPosition = () => { labelIdentifierFieldMetadataItem?.id !== recordField.fieldMetadataItemId, ); - const hoveredRecordField = isDefined(hoverPosition) - ? visibleRecordFieldsFiltered.at(hoverPosition) + const hoveredRecordField = isDefined(recordCalendarCardHoverPosition) + ? visibleRecordFieldsFiltered.at(recordCalendarCardHoverPosition) : undefined; - const editedRecordField = isDefined(editModePosition) - ? visibleRecordFieldsFiltered.at(editModePosition) + const editedRecordField = isDefined(recordCalendarCardEditModePosition) + ? visibleRecordFieldsFiltered.at(recordCalendarCardEditModePosition) : undefined; const hoveredFieldMetadataItem = isDefined(hoveredRecordField) diff --git a/packages/twenty-front/src/modules/object-record/record-drag/hooks/__tests__/useEndRecordDrag.test.tsx b/packages/twenty-front/src/modules/object-record/record-drag/hooks/__tests__/useEndRecordDrag.test.tsx index 5e81152b13..7c1d5a7aa1 100644 --- a/packages/twenty-front/src/modules/object-record/record-drag/hooks/__tests__/useEndRecordDrag.test.tsx +++ b/packages/twenty-front/src/modules/object-record/record-drag/hooks/__tests__/useEndRecordDrag.test.tsx @@ -26,9 +26,8 @@ describe('useEndRecordDrag', () => { const [primaryDraggedRecordId, setPrimaryDraggedRecordId] = useAtomComponentState(primaryDraggedRecordIdComponentState); - const [originalSelection, setOriginalSelection] = useAtomComponentState( - originalDragSelectionComponentState, - ); + const [originalDragSelection, setOriginalDragSelection] = + useAtomComponentState(originalDragSelectionComponentState); const { endRecordDrag } = useEndRecordDrag(); @@ -37,11 +36,11 @@ describe('useEndRecordDrag', () => { isMultiDragActive, draggedRecordIds, primaryDraggedRecordId, - originalSelection, + originalDragSelection, setIsMultiDragActive, setDraggedRecordIds, setPrimaryDraggedRecordId, - setOriginalSelection, + setOriginalDragSelection, }; }, { wrapper: Wrapper }, @@ -51,13 +50,17 @@ describe('useEndRecordDrag', () => { result.current.setIsMultiDragActive(true); result.current.setDraggedRecordIds(['record-1', 'record-2']); result.current.setPrimaryDraggedRecordId('record-1'); - result.current.setOriginalSelection(['record-1', 'record-2', 'record-3']); + result.current.setOriginalDragSelection([ + 'record-1', + 'record-2', + 'record-3', + ]); }); expect(result.current.isMultiDragActive).toBe(true); expect(result.current.draggedRecordIds).toEqual(['record-1', 'record-2']); expect(result.current.primaryDraggedRecordId).toBe('record-1'); - expect(result.current.originalSelection).toEqual([ + expect(result.current.originalDragSelection).toEqual([ 'record-1', 'record-2', 'record-3', @@ -70,6 +73,6 @@ describe('useEndRecordDrag', () => { expect(result.current.isMultiDragActive).toBe(false); expect(result.current.draggedRecordIds).toEqual([]); expect(result.current.primaryDraggedRecordId).toBeNull(); - expect(result.current.originalSelection).toEqual([]); + expect(result.current.originalDragSelection).toEqual([]); }); }); diff --git a/packages/twenty-front/src/modules/object-record/record-drag/hooks/__tests__/useStartRecordDrag.test.tsx b/packages/twenty-front/src/modules/object-record/record-drag/hooks/__tests__/useStartRecordDrag.test.tsx index 28c9329412..8a4973aec9 100644 --- a/packages/twenty-front/src/modules/object-record/record-drag/hooks/__tests__/useStartRecordDrag.test.tsx +++ b/packages/twenty-front/src/modules/object-record/record-drag/hooks/__tests__/useStartRecordDrag.test.tsx @@ -35,7 +35,7 @@ describe('useStartRecordDrag', () => { const primaryDraggedRecordId = useAtomComponentStateValue( primaryDraggedRecordIdComponentState, ); - const originalSelection = useAtomComponentStateValue( + const originalDragSelection = useAtomComponentStateValue( originalDragSelectionComponentState, ); @@ -46,7 +46,7 @@ describe('useStartRecordDrag', () => { isMultiDragActive, draggedRecordIds, primaryDraggedRecordId, - originalSelection, + originalDragSelection, }; }, { wrapper: Wrapper }, @@ -62,7 +62,7 @@ describe('useStartRecordDrag', () => { expect(result.current.isMultiDragActive).toBe(true); expect(result.current.draggedRecordIds).toEqual(['record-1']); expect(result.current.primaryDraggedRecordId).toBe('record-1'); - expect(result.current.originalSelection).toEqual(['record-1']); + expect(result.current.originalDragSelection).toEqual(['record-1']); }); it('should set single drag state when only one record is selected', () => { @@ -77,7 +77,7 @@ describe('useStartRecordDrag', () => { const primaryDraggedRecordId = useAtomComponentStateValue( primaryDraggedRecordIdComponentState, ); - const originalSelection = useAtomComponentStateValue( + const originalDragSelection = useAtomComponentStateValue( originalDragSelectionComponentState, ); @@ -88,7 +88,7 @@ describe('useStartRecordDrag', () => { isMultiDragActive, draggedRecordIds, primaryDraggedRecordId, - originalSelection, + originalDragSelection, }; }, { wrapper: Wrapper }, @@ -104,7 +104,7 @@ describe('useStartRecordDrag', () => { expect(result.current.isMultiDragActive).toBe(true); expect(result.current.draggedRecordIds).toEqual(['record-1']); expect(result.current.primaryDraggedRecordId).toBe('record-1'); - expect(result.current.originalSelection).toEqual(['record-1']); + expect(result.current.originalDragSelection).toEqual(['record-1']); }); it('should set multi drag state when multiple records are selected', () => { @@ -119,7 +119,7 @@ describe('useStartRecordDrag', () => { const primaryDraggedRecordId = useAtomComponentStateValue( primaryDraggedRecordIdComponentState, ); - const originalSelection = useAtomComponentStateValue( + const originalDragSelection = useAtomComponentStateValue( originalDragSelectionComponentState, ); @@ -130,7 +130,7 @@ describe('useStartRecordDrag', () => { isMultiDragActive, draggedRecordIds, primaryDraggedRecordId, - originalSelection, + originalDragSelection, }; }, { wrapper: Wrapper }, @@ -150,7 +150,7 @@ describe('useStartRecordDrag', () => { 'record-3', ]); expect(result.current.primaryDraggedRecordId).toBe('record-2'); - expect(result.current.originalSelection).toEqual([ + expect(result.current.originalDragSelection).toEqual([ 'record-1', 'record-2', 'record-3', @@ -169,7 +169,7 @@ describe('useStartRecordDrag', () => { const primaryDraggedRecordId = useAtomComponentStateValue( primaryDraggedRecordIdComponentState, ); - const originalSelection = useAtomComponentStateValue( + const originalDragSelection = useAtomComponentStateValue( originalDragSelectionComponentState, ); @@ -180,7 +180,7 @@ describe('useStartRecordDrag', () => { isMultiDragActive, draggedRecordIds, primaryDraggedRecordId, - originalSelection, + originalDragSelection, }; }, { wrapper: Wrapper }, @@ -196,7 +196,7 @@ describe('useStartRecordDrag', () => { expect(result.current.isMultiDragActive).toBe(true); expect(result.current.draggedRecordIds).toEqual(['record-1']); expect(result.current.primaryDraggedRecordId).toBe('record-1'); - expect(result.current.originalSelection).toEqual(['record-1']); + expect(result.current.originalDragSelection).toEqual(['record-1']); }); it('should set single drag state when dragged record is not in selection', () => { @@ -211,7 +211,7 @@ describe('useStartRecordDrag', () => { const primaryDraggedRecordId = useAtomComponentStateValue( primaryDraggedRecordIdComponentState, ); - const originalSelection = useAtomComponentStateValue( + const originalDragSelection = useAtomComponentStateValue( originalDragSelectionComponentState, ); @@ -222,7 +222,7 @@ describe('useStartRecordDrag', () => { isMultiDragActive, draggedRecordIds, primaryDraggedRecordId, - originalSelection, + originalDragSelection, }; }, { wrapper: Wrapper }, @@ -238,7 +238,7 @@ describe('useStartRecordDrag', () => { expect(result.current.isMultiDragActive).toBe(true); expect(result.current.draggedRecordIds).toEqual(['record-1']); expect(result.current.primaryDraggedRecordId).toBe('record-1'); - expect(result.current.originalSelection).toEqual(['record-1']); + expect(result.current.originalDragSelection).toEqual(['record-1']); }); it('should set multi drag state when multiple records are selected', () => { @@ -253,7 +253,7 @@ describe('useStartRecordDrag', () => { const primaryDraggedRecordId = useAtomComponentStateValue( primaryDraggedRecordIdComponentState, ); - const originalSelection = useAtomComponentStateValue( + const originalDragSelection = useAtomComponentStateValue( originalDragSelectionComponentState, ); @@ -264,7 +264,7 @@ describe('useStartRecordDrag', () => { isMultiDragActive, draggedRecordIds, primaryDraggedRecordId, - originalSelection, + originalDragSelection, }; }, { wrapper: Wrapper }, @@ -284,7 +284,7 @@ describe('useStartRecordDrag', () => { 'record-3', ]); expect(result.current.primaryDraggedRecordId).toBe('record-2'); - expect(result.current.originalSelection).toEqual([ + expect(result.current.originalDragSelection).toEqual([ 'record-1', 'record-2', 'record-3', diff --git a/packages/twenty-front/src/modules/object-record/record-drag/hooks/useProcessTableWithGroupRecordDrop.ts b/packages/twenty-front/src/modules/object-record/record-drag/hooks/useProcessTableWithGroupRecordDrop.ts index bc4f883187..a7ebfdc533 100644 --- a/packages/twenty-front/src/modules/object-record/record-drag/hooks/useProcessTableWithGroupRecordDrop.ts +++ b/packages/twenty-front/src/modules/object-record/record-drag/hooks/useProcessTableWithGroupRecordDrop.ts @@ -55,7 +55,7 @@ export const useProcessTableWithGroupRecordDrop = () => { recordIndexId, ); - const groupFieldMetadata = useAtomComponentStateValue( + const recordIndexGroupFieldMetadataItem = useAtomComponentStateValue( recordIndexGroupFieldMetadataItemComponentState, ); @@ -73,7 +73,7 @@ export const useProcessTableWithGroupRecordDrop = () => { } const fieldMetadata = objectMetadataItem.fields.find( - (field) => field.id === groupFieldMetadata?.id, + (field) => field.id === recordIndexGroupFieldMetadataItem?.id, ); if (!isDefined(fieldMetadata)) { @@ -121,7 +121,7 @@ export const useProcessTableWithGroupRecordDrop = () => { isDraggingRecord, selectedRowIds, recordIdsByGroupFamilyState, - groupFieldMetadata?.id, + recordIndexGroupFieldMetadataItem?.id, openModal, updateOneRecord, ], diff --git a/packages/twenty-front/src/modules/object-record/record-field-list/anchored-portal/components/RecordFieldListCellEditModePortal.tsx b/packages/twenty-front/src/modules/object-record/record-field-list/anchored-portal/components/RecordFieldListCellEditModePortal.tsx index 0aea4d968a..96668e8602 100644 --- a/packages/twenty-front/src/modules/object-record/record-field-list/anchored-portal/components/RecordFieldListCellEditModePortal.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field-list/anchored-portal/components/RecordFieldListCellEditModePortal.tsx @@ -24,7 +24,7 @@ export const RecordFieldListCellEditModePortal = ({ RecordFieldListComponentInstanceContext, ); - const editModePosition = useAtomComponentStateValue( + const recordFieldListCellEditModePosition = useAtomComponentStateValue( recordFieldListCellEditModePositionComponentState, ); @@ -32,7 +32,10 @@ export const RecordFieldListCellEditModePortal = ({ objectNameSingular: objectMetadataItem.nameSingular, }); - if (!isDefined(editModePosition) || !isDefined(editedFieldMetadataItem)) { + if ( + !isDefined(recordFieldListCellEditModePosition) || + !isDefined(editedFieldMetadataItem) + ) { return null; } diff --git a/packages/twenty-front/src/modules/object-record/record-field-list/anchored-portal/components/RecordFieldListCellHoveredPortal.tsx b/packages/twenty-front/src/modules/object-record/record-field-list/anchored-portal/components/RecordFieldListCellHoveredPortal.tsx index 6839378159..37e472c6a2 100644 --- a/packages/twenty-front/src/modules/object-record/record-field-list/anchored-portal/components/RecordFieldListCellHoveredPortal.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field-list/anchored-portal/components/RecordFieldListCellHoveredPortal.tsx @@ -23,7 +23,7 @@ export const RecordFieldListCellHoveredPortal = ({ RecordFieldListComponentInstanceContext, ); - const hoverPosition = useAtomComponentStateValue( + const recordFieldListHoverPosition = useAtomComponentStateValue( recordFieldListHoverPositionComponentState, ); @@ -31,7 +31,10 @@ export const RecordFieldListCellHoveredPortal = ({ objectNameSingular: objectMetadataItem.nameSingular, }); - if (!isDefined(hoverPosition) || !isDefined(hoveredFieldMetadataItem)) { + if ( + !isDefined(recordFieldListHoverPosition) || + !isDefined(hoveredFieldMetadataItem) + ) { return null; } diff --git a/packages/twenty-front/src/modules/object-record/record-field-list/hooks/useFieldListFieldMetadataFromPosition.ts b/packages/twenty-front/src/modules/object-record/record-field-list/hooks/useFieldListFieldMetadataFromPosition.ts index 6c482da99d..d5daa306e5 100644 --- a/packages/twenty-front/src/modules/object-record/record-field-list/hooks/useFieldListFieldMetadataFromPosition.ts +++ b/packages/twenty-front/src/modules/object-record/record-field-list/hooks/useFieldListFieldMetadataFromPosition.ts @@ -11,11 +11,11 @@ type UseFieldListFieldMetadataFromPositionProps = { export const useFieldListFieldMetadataFromPosition = ({ objectNameSingular, }: UseFieldListFieldMetadataFromPositionProps) => { - const hoverPosition = useAtomComponentStateValue( + const recordFieldListHoverPosition = useAtomComponentStateValue( recordFieldListHoverPositionComponentState, ); - const editModePosition = useAtomComponentStateValue( + const recordFieldListCellEditModePosition = useAtomComponentStateValue( recordFieldListCellEditModePositionComponentState, ); @@ -33,12 +33,12 @@ export const useFieldListFieldMetadataFromPosition = ({ ...boxedRelationFieldMetadataItems, ]; - const hoveredFieldMetadataItem = isDefined(hoverPosition) - ? fieldMetadataItems.at(hoverPosition) + const hoveredFieldMetadataItem = isDefined(recordFieldListHoverPosition) + ? fieldMetadataItems.at(recordFieldListHoverPosition) : undefined; - const editedFieldMetadataItem = isDefined(editModePosition) - ? fieldMetadataItems.at(editModePosition) + const editedFieldMetadataItem = isDefined(recordFieldListCellEditModePosition) + ? fieldMetadataItems.at(recordFieldListCellEditModePosition) : undefined; return { diff --git a/packages/twenty-front/src/modules/object-record/record-field/ui/form-types/components/FormSingleRecordPicker.tsx b/packages/twenty-front/src/modules/object-record/record-field/ui/form-types/components/FormSingleRecordPicker.tsx index 47f8a26999..02d2c3bd26 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/ui/form-types/components/FormSingleRecordPicker.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field/ui/form-types/components/FormSingleRecordPicker.tsx @@ -116,14 +116,14 @@ export const FormSingleRecordPicker = ({ const { closeDropdown } = useCloseDropdown(); - const setRecordPickerSearchFilter = useSetAtomComponentState( + const setSingleRecordPickerSearchFilter = useSetAtomComponentState( singleRecordPickerSearchFilterComponentState, dropdownId, ); const handleCloseRelationPickerDropdown = useCallback(() => { - setRecordPickerSearchFilter(''); - }, [setRecordPickerSearchFilter]); + setSingleRecordPickerSearchFilter(''); + }, [setSingleRecordPickerSearchFilter]); const handleMorphItemSelected = ( selectedMorphItem: RecordPickerPickableMorphItem | null | undefined, @@ -148,7 +148,7 @@ export const FormSingleRecordPicker = ({ onClear?.(); }; - const setRecordPickerSelectedId = useSetAtomComponentState( + const setSingleRecordPickerSelectedId = useSetAtomComponentState( singleRecordPickerSelectedIdComponentState, dropdownId, ); @@ -158,7 +158,7 @@ export const FormSingleRecordPicker = ({ isDefined(draftValue?.value) && !isStandaloneVariableString(draftValue.value) ) { - setRecordPickerSelectedId(draftValue.value); + setSingleRecordPickerSelectedId(draftValue.value); } }; diff --git a/packages/twenty-front/src/modules/object-record/record-field/ui/hooks/__tests__/useIsFieldEmpty.test.tsx b/packages/twenty-front/src/modules/object-record/record-field/ui/hooks/__tests__/useIsFieldEmpty.test.tsx index bc09aad656..611f9119fd 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/ui/hooks/__tests__/useIsFieldEmpty.test.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field/ui/hooks/__tests__/useIsFieldEmpty.test.tsx @@ -30,12 +30,12 @@ describe('useIsFieldEmpty', () => { it('should work as expected', () => { const { result } = renderHook( () => { - const setFieldState = useSetAtomFamilyState( + const setRecordStore = useSetAtomFamilyState( recordStoreFamilyState, recordId, ); return { - setFieldState, + setRecordStore, isFieldEditModeValueEmpty: useIsFieldEmpty(), }; }, @@ -47,7 +47,7 @@ describe('useIsFieldEmpty', () => { expect(result.current.isFieldEditModeValueEmpty).toBe(true); act(() => { - result.current.setFieldState({ + result.current.setRecordStore({ id: 'id', phone: '+1 233223', __typename: 'Person', diff --git a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/display/components/ChipFieldDisplay.tsx b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/display/components/ChipFieldDisplay.tsx index 8df8c06ba8..2a981969d8 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/display/components/ChipFieldDisplay.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/display/components/ChipFieldDisplay.tsx @@ -5,7 +5,7 @@ import { ChipSize } from 'twenty-ui/components'; export const ChipFieldDisplay = () => { const { - recordValue, + recordStore: recordValue, objectNameSingular, labelIdentifierLink, disableChipClick, diff --git a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/display/components/FilesFieldDisplay.tsx b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/display/components/FilesFieldDisplay.tsx index f07438d670..cfcf78267b 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/display/components/FilesFieldDisplay.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/display/components/FilesFieldDisplay.tsx @@ -9,13 +9,13 @@ export const FilesFieldDisplay = () => { const { recordId, fieldDefinition } = useContext(FieldContext); const { fieldValue, disableChipClick } = useFilesFieldDisplay(); - const uploadState = useAtomFamilyStateValue(filesFieldUploadState, { + const filesFieldUpload = useAtomFamilyStateValue(filesFieldUploadState, { recordId, fieldName: fieldDefinition.metadata.fieldName, }); - const isUploadWindowOpen = uploadState === 'UPLOAD_WINDOW_OPEN'; - const isFileUploading = uploadState === 'UPLOADING_FILE'; + const isUploadWindowOpen = filesFieldUpload === 'UPLOAD_WINDOW_OPEN'; + const isFileUploading = filesFieldUpload === 'UPLOADING_FILE'; return ( { - const setEntity = useSetAtomFamilyState( + const setRecordStore = useSetAtomFamilyState( recordStoreFamilyState, relationFromManyFieldDisplayMock.entityValue.id, ); useEffect(() => { - setEntity({ + setRecordStore({ __typename: relationFromManyFieldDisplayMock.entityValue.__typename, id: relationFromManyFieldDisplayMock.entityValue.id, company: [relationFromManyFieldDisplayMock.entityValue], } satisfies ObjectRecord); - }, [setEntity]); + }, [setRecordStore]); return null; }; diff --git a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useAddressField.ts b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useAddressField.ts index b98aa2caa6..0795babf68 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useAddressField.ts +++ b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useAddressField.ts @@ -30,7 +30,7 @@ export const useAddressField = () => { const { setDraftValue } = useRecordFieldInput(); - const draftValue = useAtomComponentStateValue( + const recordFieldInputDraftValue = useAtomComponentStateValue( recordFieldInputDraftValueComponentState, ); @@ -38,7 +38,7 @@ export const useAddressField = () => { fieldDefinition, fieldValue, setFieldValue, - draftValue, + draftValue: recordFieldInputDraftValue, setDraftValue, }; }; diff --git a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useArrayField.ts b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useArrayField.ts index 18438432cb..21e17e57df 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useArrayField.ts +++ b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useArrayField.ts @@ -24,14 +24,14 @@ export const useArrayField = () => { const { setDraftValue } = useRecordFieldInput(); - const draftValue = useAtomComponentStateValue( + const recordFieldInputDraftValue = useAtomComponentStateValue( recordFieldInputDraftValueComponentState, ); return { fieldValue, fieldDefinition, - draftValue, + draftValue: recordFieldInputDraftValue, setFieldValue, setDraftValue, }; diff --git a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useChipField.ts b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useChipField.ts index 4a617dc483..0154d07296 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useChipField.ts +++ b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useChipField.ts @@ -17,10 +17,10 @@ export const useChipField = () => { ? fieldDefinition.metadata.objectMetadataNameSingular : undefined; - const record = useAtomFamilyStateValue(recordStoreFamilyState, recordId); + const recordStore = useAtomFamilyStateValue(recordStoreFamilyState, recordId); return { objectNameSingular, - record, + recordStore, }; }; diff --git a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useChipFieldDisplay.ts b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useChipFieldDisplay.ts index ff1ffbaaee..4f1db7e230 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useChipFieldDisplay.ts +++ b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useChipFieldDisplay.ts @@ -50,7 +50,7 @@ export const useChipFieldDisplay = () => { ? fieldDefinition.metadata.objectMetadataNameSingular : undefined; - const recordValue = useAtomFamilyStateValue(recordStoreFamilyState, recordId); + const recordStore = useAtomFamilyStateValue(recordStoreFamilyState, recordId); if (!isNonEmptyString(objectNameSingular)) { throw new Error('Object metadata name singular is not a non-empty string'); @@ -58,7 +58,7 @@ export const useChipFieldDisplay = () => { return { objectNameSingular, - recordValue, + recordStore, isLabelIdentifier, labelIdentifierLink, disableChipClick, diff --git a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useCurrencyField.ts b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useCurrencyField.ts index a7a7e1398c..276d228d3a 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useCurrencyField.ts +++ b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useCurrencyField.ts @@ -30,7 +30,7 @@ export const useCurrencyField = () => { const { setDraftValue } = useRecordFieldInput(); - const draftValue = useAtomComponentStateValue( + const recordFieldInputDraftValue = useAtomComponentStateValue( recordFieldInputDraftValueComponentState, ); @@ -42,7 +42,7 @@ export const useCurrencyField = () => { return { fieldDefinition, fieldValue, - draftValue, + draftValue: recordFieldInputDraftValue, setDraftValue, setFieldValue, defaultValue, diff --git a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useEmailsField.ts b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useEmailsField.ts index 86849a7704..a3426dbde8 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useEmailsField.ts +++ b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useEmailsField.ts @@ -26,14 +26,14 @@ export const useEmailsField = () => { const { setDraftValue } = useRecordFieldInput(); - const draftValue = useAtomComponentStateValue( + const recordFieldInputDraftValue = useAtomComponentStateValue( recordFieldInputDraftValueComponentState, ); return { fieldDefinition, fieldValue, - draftValue, + draftValue: recordFieldInputDraftValue, setDraftValue, setFieldValue, }; diff --git a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useFilesField.ts b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useFilesField.ts index d6a7d481a5..c4700a31b7 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useFilesField.ts +++ b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useFilesField.ts @@ -26,14 +26,14 @@ export const useFilesField = () => { const { setDraftValue } = useRecordFieldInput(); - const draftValue = useAtomComponentStateValue( + const recordFieldInputDraftValue = useAtomComponentStateValue( recordFieldInputDraftValueComponentState, ); return { fieldDefinition, fieldValue, - draftValue, + draftValue: recordFieldInputDraftValue, setDraftValue, setFieldValue, }; diff --git a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useFullNameField.ts b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useFullNameField.ts index 9e7b4c7ff2..4532ff82f4 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useFullNameField.ts +++ b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useFullNameField.ts @@ -29,7 +29,7 @@ export const useFullNameField = () => { const { setDraftValue } = useRecordFieldInput(); - const draftValue = useAtomComponentStateValue( + const recordFieldInputDraftValue = useAtomComponentStateValue( recordFieldInputDraftValueComponentState, ); @@ -37,7 +37,7 @@ export const useFullNameField = () => { fieldDefinition, fieldValue, setFieldValue, - draftValue, + draftValue: recordFieldInputDraftValue, setDraftValue, }; }; diff --git a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useJsonField.ts b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useJsonField.ts index ed54b34640..d4b9730ef5 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useJsonField.ts +++ b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useJsonField.ts @@ -31,16 +31,16 @@ export const useJsonField = () => { const { setDraftValue } = useRecordFieldInput(); - const draftValue = useAtomComponentStateValue( + const recordFieldInputDraftValue = useAtomComponentStateValue( recordFieldInputDraftValueComponentState, ); const precomputedDraftValue = usePrecomputedJsonDraftValue({ - draftValue, + draftValue: recordFieldInputDraftValue, }); return { - draftValue, + draftValue: recordFieldInputDraftValue, precomputedDraftValue, setDraftValue, maxWidth, diff --git a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useLinksField.ts b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useLinksField.ts index 799ba872ee..6dd9a104af 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useLinksField.ts +++ b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useLinksField.ts @@ -26,14 +26,14 @@ export const useLinksField = () => { const { setDraftValue } = useRecordFieldInput(); - const draftValue = useAtomComponentStateValue( + const recordFieldInputDraftValue = useAtomComponentStateValue( recordFieldInputDraftValueComponentState, ); return { fieldDefinition, fieldValue, - draftValue, + draftValue: recordFieldInputDraftValue, setDraftValue, setFieldValue, }; diff --git a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useMorphRelationField.ts b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useMorphRelationField.ts index 00c965d943..4b69897260 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useMorphRelationField.ts +++ b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useMorphRelationField.ts @@ -32,11 +32,11 @@ export const useMorphRelationField = < { recordId, fieldName }, ) as [FieldRelationValue, (value: FieldRelationValue) => void]; - const draftValue = useAtomComponentStateValue( + const recordFieldInputDraftValue = useAtomComponentStateValue( recordFieldInputDraftValueComponentState, ); - const initialSearchValue = draftValue; + const initialSearchValue = recordFieldInputDraftValue; return { fieldDefinition, diff --git a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useMultiSelectField.ts b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useMultiSelectField.ts index 0f61c72bac..d1ea51ddc1 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useMultiSelectField.ts +++ b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useMultiSelectField.ts @@ -34,7 +34,7 @@ export const useMultiSelectField = () => { const { setDraftValue } = useRecordFieldInput(); - const draftValue = useAtomComponentStateValue( + const recordFieldInputDraftValue = useAtomComponentStateValue( recordFieldInputDraftValueComponentState, ); @@ -42,7 +42,7 @@ export const useMultiSelectField = () => { recordId, fieldDefinition, fieldValues: fieldMultiSelectValues, - draftValue, + draftValue: recordFieldInputDraftValue, setDraftValue, setFieldValue, }; diff --git a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useNumberField.ts b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useNumberField.ts index fc58975ae5..53fb4accb1 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useNumberField.ts +++ b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useNumberField.ts @@ -26,14 +26,14 @@ export const useNumberField = () => { const { setDraftValue } = useRecordFieldInput(); - const draftValue = useAtomComponentStateValue( + const recordFieldInputDraftValue = useAtomComponentStateValue( recordFieldInputDraftValueComponentState, ); return { fieldDefinition, fieldValue, - draftValue, + draftValue: recordFieldInputDraftValue, setDraftValue, setFieldValue, }; diff --git a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/usePhonesField.ts b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/usePhonesField.ts index f60880535a..4594f8d1f3 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/usePhonesField.ts +++ b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/usePhonesField.ts @@ -26,14 +26,14 @@ export const usePhonesField = () => { const { setDraftValue } = useRecordFieldInput(); - const draftValue = useAtomComponentStateValue( + const recordFieldInputDraftValue = useAtomComponentStateValue( recordFieldInputDraftValueComponentState, ); return { fieldDefinition, fieldValue, - draftValue, + draftValue: recordFieldInputDraftValue, setDraftValue, setFieldValue, }; diff --git a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useRelationField.ts b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useRelationField.ts index 9766717f25..c1bc7bb12d 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useRelationField.ts +++ b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useRelationField.ts @@ -30,11 +30,11 @@ export const useRelationField = () => { { recordId, fieldName }, ) as [FieldRelationValue, (value: FieldRelationValue) => void]; - const draftValue = useAtomComponentStateValue( + const recordFieldInputDraftValue = useAtomComponentStateValue( recordFieldInputDraftValueComponentState, ); - const initialSearchValue = draftValue; + const initialSearchValue = recordFieldInputDraftValue; return { fieldDefinition, diff --git a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useSelectField.ts b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useSelectField.ts index 40047e93ee..0e9d154805 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useSelectField.ts +++ b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useSelectField.ts @@ -29,7 +29,7 @@ export const useSelectField = () => { const { setDraftValue } = useRecordFieldInput(); - const draftValue = useAtomComponentStateValue( + const recordFieldInputDraftValue = useAtomComponentStateValue( recordFieldInputDraftValueComponentState, ); @@ -37,7 +37,7 @@ export const useSelectField = () => { recordId, fieldDefinition, fieldValue: fieldSelectValue, - draftValue, + draftValue: recordFieldInputDraftValue, setDraftValue, setFieldValue, }; diff --git a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useTextField.ts b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useTextField.ts index de086f977b..f37e0fb039 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useTextField.ts +++ b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/hooks/useTextField.ts @@ -27,12 +27,12 @@ export const useTextField = () => { const { setDraftValue } = useRecordFieldInput(); - const draftValue = useAtomComponentStateValue( + const recordFieldInputDraftValue = useAtomComponentStateValue( recordFieldInputDraftValueComponentState, ); return { - draftValue, + draftValue: recordFieldInputDraftValue, setDraftValue, maxWidth, fieldDefinition, diff --git a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/EmailsFieldInput.tsx b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/EmailsFieldInput.tsx index c156dd8ec4..a193b4bbd6 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/EmailsFieldInput.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/EmailsFieldInput.tsx @@ -68,12 +68,12 @@ export const EmailsFieldInput = () => { index === 0 && emails.length > 1; const getShowSetAsPrimaryButton = (index: number) => index > 0; - const setIsFieldInError = useSetAtomComponentState( + const setRecordFieldInputIsFieldInError = useSetAtomComponentState( recordFieldInputIsFieldInErrorComponentState, ); const handleError = (hasError: boolean, values: any[]) => { - setIsFieldInError(hasError && values.length === 0); + setRecordFieldInputIsFieldInError(hasError && values.length === 0); }; const handleCopy = (email: string) => { diff --git a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/FilesFieldInput.tsx b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/FilesFieldInput.tsx index 271e7037cc..39bc8f8097 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/FilesFieldInput.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/FilesFieldInput.tsx @@ -122,12 +122,12 @@ export const FilesFieldInput = () => { fieldDefinition, ]); - const setIsFieldInError = useSetAtomComponentState( + const setRecordFieldInputIsFieldInError = useSetAtomComponentState( recordFieldInputIsFieldInErrorComponentState, ); const handleError = (hasError: boolean, values: FieldFilesValue[]) => { - setIsFieldInError(hasError && values.length === 0); + setRecordFieldInputIsFieldInError(hasError && values.length === 0); }; const handleClickOutside = ( diff --git a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/LinksFieldInput.tsx b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/LinksFieldInput.tsx index 593258fe70..4ff44c5ea6 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/LinksFieldInput.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/LinksFieldInput.tsx @@ -57,12 +57,12 @@ export const LinksFieldInput = () => { const getShowPrimaryIcon = (index: number) => index === 0 && links.length > 1; const getShowSetAsPrimaryButton = (index: number) => index > 0; - const setIsFieldInError = useSetAtomComponentState( + const setRecordFieldInputIsFieldInError = useSetAtomComponentState( recordFieldInputIsFieldInErrorComponentState, ); const handleError = (hasError: boolean, values: any[]) => { - setIsFieldInError(hasError && values.length === 0); + setRecordFieldInputIsFieldInError(hasError && values.length === 0); }; const handleClickOutside = ( diff --git a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/MorphRelationManyToOneFieldInput.tsx b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/MorphRelationManyToOneFieldInput.tsx index 40acfe42ad..2bdab5e8b9 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/MorphRelationManyToOneFieldInput.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/MorphRelationManyToOneFieldInput.tsx @@ -63,15 +63,15 @@ export const MorphRelationManyToOneFieldInput = () => { onCancel?.(); }; - const layoutDirection = useAtomComponentStateValue( + const recordFieldInputLayoutDirection = useAtomComponentStateValue( recordFieldInputLayoutDirectionComponentState, ); - const isLoading = useAtomComponentStateValue( + const recordFieldInputLayoutDirectionLoading = useAtomComponentStateValue( recordFieldInputLayoutDirectionLoadingComponentState, ); - if (isLoading) { + if (recordFieldInputLayoutDirectionLoading) { return <>; } @@ -95,7 +95,7 @@ export const MorphRelationManyToOneFieldInput = () => { objectNameSingulars={objectNameSingulars} recordPickerInstanceId={instanceId} layoutDirection={ - layoutDirection === 'downward' + recordFieldInputLayoutDirection === 'downward' ? 'search-bar-on-top' : 'search-bar-on-bottom' } diff --git a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/MorphRelationOneToManyFieldInput.tsx b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/MorphRelationOneToManyFieldInput.tsx index 700c33cd54..6934e7647d 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/MorphRelationOneToManyFieldInput.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/MorphRelationOneToManyFieldInput.tsx @@ -23,7 +23,7 @@ export const MorphRelationOneToManyFieldInput = () => { onSubmit?.({ skipPersist: true }); }; - const layoutDirection = useAtomComponentStateValue( + const recordFieldInputLayoutDirection = useAtomComponentStateValue( recordFieldInputLayoutDirectionComponentState, ); @@ -37,7 +37,7 @@ export const MorphRelationOneToManyFieldInput = () => { }} onClickOutside={handleSubmit} layoutDirection={ - layoutDirection === 'downward' + recordFieldInputLayoutDirection === 'downward' ? 'search-bar-on-top' : 'search-bar-on-bottom' } diff --git a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/PhonesFieldInput.tsx b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/PhonesFieldInput.tsx index 9bc3ced547..84008ede03 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/PhonesFieldInput.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/PhonesFieldInput.tsx @@ -128,12 +128,12 @@ export const PhonesFieldInput = () => { index === 0 && phones.length > 1; const getShowSetAsPrimaryButton = (index: number) => index > 0; - const setIsFieldInError = useSetAtomComponentState( + const setRecordFieldInputIsFieldInError = useSetAtomComponentState( recordFieldInputIsFieldInErrorComponentState, ); const handleError = (hasError: boolean, values: any[]) => { - setIsFieldInError(hasError && values.length === 0); + setRecordFieldInputIsFieldInError(hasError && values.length === 0); }; const handleClickOutside = ( diff --git a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/RelationManyToOneFieldInput.tsx b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/RelationManyToOneFieldInput.tsx index ba7228bd4a..5500d67e89 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/RelationManyToOneFieldInput.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/RelationManyToOneFieldInput.tsx @@ -77,11 +77,11 @@ export const RelationManyToOneFieldInput = () => { recordId, }); - const layoutDirection = useAtomComponentStateValue( + const recordFieldInputLayoutDirection = useAtomComponentStateValue( recordFieldInputLayoutDirectionComponentState, ); - const isLoading = useAtomComponentStateValue( + const recordFieldInputLayoutDirectionLoading = useAtomComponentStateValue( recordFieldInputLayoutDirectionLoadingComponentState, instanceId, ); @@ -99,7 +99,7 @@ export const RelationManyToOneFieldInput = () => { } }; - if (isLoading) { + if (recordFieldInputLayoutDirectionLoading) { return <>; } const fieldLabel = fieldDefinition.label; @@ -122,7 +122,7 @@ export const RelationManyToOneFieldInput = () => { ]} recordPickerInstanceId={instanceId} layoutDirection={ - layoutDirection === 'downward' + recordFieldInputLayoutDirection === 'downward' ? 'search-bar-on-top' : 'search-bar-on-bottom' } diff --git a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/RelationOneToManyFieldInput.tsx b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/RelationOneToManyFieldInput.tsx index 34e491aed6..4a30c98848 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/RelationOneToManyFieldInput.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/RelationOneToManyFieldInput.tsx @@ -158,7 +158,7 @@ export const RelationOneToManyFieldInput = () => { relationFieldDefinition.metadata.relationObjectMetadataNameSingular, }); - const layoutDirection = useAtomComponentStateValue( + const recordFieldInputLayoutDirection = useAtomComponentStateValue( recordFieldInputLayoutDirectionComponentState, ); @@ -329,7 +329,7 @@ export const RelationOneToManyFieldInput = () => { objectMetadataItemIdForCreate={objectMetadataItemIdForCreate} onClickOutside={handleSubmit} layoutDirection={ - layoutDirection === 'downward' + recordFieldInputLayoutDirection === 'downward' ? 'search-bar-on-top' : 'search-bar-on-bottom' } diff --git a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/__stories__/BooleanFieldInput.stories.tsx b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/__stories__/BooleanFieldInput.stories.tsx index 6797fa00a1..ce9576bb29 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/__stories__/BooleanFieldInput.stories.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field/ui/meta-types/input/components/__stories__/BooleanFieldInput.stories.tsx @@ -23,11 +23,14 @@ const BooleanFieldValueSetterEffect = ({ value: boolean; recordId: string; }) => { - const setField = useSetAtomFamilyState(recordStoreFamilyState, recordId); + const setRecordStore = useSetAtomFamilyState( + recordStoreFamilyState, + recordId, + ); useEffect(() => { - setField({ id: recordId, Boolean: value, __typename: 'Person' }); - }, [recordId, setField, value]); + setRecordStore({ id: recordId, Boolean: value, __typename: 'Person' }); + }, [recordId, setRecordStore, value]); return <>; }; diff --git a/packages/twenty-front/src/modules/object-record/record-group/components/RecordGroupMenuItemDraggable.tsx b/packages/twenty-front/src/modules/object-record/record-group/components/RecordGroupMenuItemDraggable.tsx index 40332d06f3..047eff4cc7 100644 --- a/packages/twenty-front/src/modules/object-record/record-group/components/RecordGroupMenuItemDraggable.tsx +++ b/packages/twenty-front/src/modules/object-record/record-group/components/RecordGroupMenuItemDraggable.tsx @@ -14,7 +14,7 @@ type RecordGroupMenuItemDraggableProps = { recordGroupId: string; showDragGrip?: boolean; isDraggable?: boolean; - onVisibilityChange: (recordGroup: RecordGroupDefinition) => void; + onVisibilityChange: (recordGroupDefinition: RecordGroupDefinition) => void; isVisibleLimitReached?: boolean; }; @@ -25,37 +25,38 @@ export const RecordGroupMenuItemDraggable = ({ onVisibilityChange, isVisibleLimitReached = false, }: RecordGroupMenuItemDraggableProps) => { - const recordGroup = useAtomFamilyStateValue( + const recordGroupDefinition = useAtomFamilyStateValue( recordGroupDefinitionFamilyState, recordGroupId, ); - if (!isDefined(recordGroup)) { + if (!isDefined(recordGroupDefinition)) { return null; } - const isNoValue = recordGroup.type === RecordGroupDefinitionType.NoValue; + const isNoValue = + recordGroupDefinition.type === RecordGroupDefinitionType.NoValue; - const getIconButtons = (recordGroup: RecordGroupDefinition) => { - const groupValue = recordGroup.value; + const getIconButtons = (recordGroupDefinition: RecordGroupDefinition) => { + const groupValue = recordGroupDefinition.value; - if (!recordGroup.isVisible && isVisibleLimitReached) { + if (!recordGroupDefinition.isVisible && isVisibleLimitReached) { return undefined; } const iconButtons = [ { - Icon: recordGroup.isVisible ? IconEyeOff : IconEye, - ariaLabel: recordGroup.isVisible + Icon: recordGroupDefinition.isVisible ? IconEyeOff : IconEye, + ariaLabel: recordGroupDefinition.isVisible ? t`Hide group ${groupValue}` : t`Show group ${groupValue}`, - dataTestId: recordGroup.isVisible - ? `hide-group-${recordGroup.value?.toLowerCase().replace(' ', '-') ?? ''}` - : `show-group-${recordGroup.value?.toLowerCase().replace(' ', '-') ?? ''}`, + dataTestId: recordGroupDefinition.isVisible + ? `hide-group-${recordGroupDefinition.value?.toLowerCase().replace(' ', '-') ?? ''}` + : `show-group-${recordGroupDefinition.value?.toLowerCase().replace(' ', '-') ?? ''}`, onClick: () => onVisibilityChange({ - ...recordGroup, - isVisible: !recordGroup.isVisible, + ...recordGroupDefinition, + isVisible: !recordGroupDefinition.isVisible, }), }, ].filter(isDefined); @@ -65,29 +66,29 @@ export const RecordGroupMenuItemDraggable = ({ return ( } accent={isNoValue || showDragGrip ? 'placeholder' : 'default'} - iconButtons={getIconButtons(recordGroup)} + iconButtons={getIconButtons(recordGroupDefinition)} gripMode={isNoValue || showDragGrip ? 'always' : 'never'} isDragDisabled={!isDraggable} /> diff --git a/packages/twenty-front/src/modules/object-record/record-group/components/RecordGroupReorderConfirmationModal.tsx b/packages/twenty-front/src/modules/object-record/record-group/components/RecordGroupReorderConfirmationModal.tsx index 04b331e932..9977208905 100644 --- a/packages/twenty-front/src/modules/object-record/record-group/components/RecordGroupReorderConfirmationModal.tsx +++ b/packages/twenty-front/src/modules/object-record/record-group/components/RecordGroupReorderConfirmationModal.tsx @@ -13,7 +13,7 @@ type RecordGroupReorderConfirmationModalProps = { export const RecordGroupReorderConfirmationModal = ({ onConfirmClick, }: RecordGroupReorderConfirmationModalProps): ReactNode => { - const recordGroupSort = useAtomComponentStateValue( + const recordIndexRecordGroupSort = useAtomComponentStateValue( recordIndexRecordGroupSortComponentState, ); @@ -23,7 +23,7 @@ export const RecordGroupReorderConfirmationModal = ({ , diff --git a/packages/twenty-front/src/modules/object-record/record-group/hooks/useRecordGroupFilter.ts b/packages/twenty-front/src/modules/object-record/record-group/hooks/useRecordGroupFilter.ts index 6bfc93487b..fb4358a4b8 100644 --- a/packages/twenty-front/src/modules/object-record/record-group/hooks/useRecordGroupFilter.ts +++ b/packages/twenty-front/src/modules/object-record/record-group/hooks/useRecordGroupFilter.ts @@ -7,19 +7,20 @@ import { isDefined } from 'twenty-shared/utils'; export const useRecordGroupFilter = (fields: FieldMetadataItem[]) => { const currentRecordGroupDefinition = useCurrentRecordGroupDefinition(); - const groupFieldMetadata = useAtomComponentStateValue( + const recordIndexGroupFieldMetadataItem = useAtomComponentStateValue( recordIndexGroupFieldMetadataItemComponentState, ); const recordGroupFilter = useMemo(() => { if (isDefined(currentRecordGroupDefinition)) { const fieldMetadataItem = fields.find( - (fieldMetadataItem) => fieldMetadataItem.id === groupFieldMetadata?.id, + (fieldMetadataItem) => + fieldMetadataItem.id === recordIndexGroupFieldMetadataItem?.id, ); if (!fieldMetadataItem) { throw new Error( - `Field metadata item with id ${groupFieldMetadata?.id} not found`, + `Field metadata item with id ${recordIndexGroupFieldMetadataItem?.id} not found`, ); } @@ -35,7 +36,11 @@ export const useRecordGroupFilter = (fields: FieldMetadataItem[]) => { } return {}; - }, [currentRecordGroupDefinition, fields, groupFieldMetadata?.id]); + }, [ + currentRecordGroupDefinition, + fields, + recordIndexGroupFieldMetadataItem?.id, + ]); return { recordGroupFilter }; }; diff --git a/packages/twenty-front/src/modules/object-record/record-group/hooks/useRecordGroupReorderConfirmationModal.ts b/packages/twenty-front/src/modules/object-record/record-group/hooks/useRecordGroupReorderConfirmationModal.ts index a5feb2eca3..b5ee2eca70 100644 --- a/packages/twenty-front/src/modules/object-record/record-group/hooks/useRecordGroupReorderConfirmationModal.ts +++ b/packages/twenty-front/src/modules/object-record/record-group/hooks/useRecordGroupReorderConfirmationModal.ts @@ -52,7 +52,7 @@ export const useRecordGroupReorderConfirmationModal = ({ recordIndexId, ); - const [, setRecordGroupSort] = useAtomComponentState( + const [, setRecordIndexRecordGroupSort] = useAtomComponentState( recordIndexRecordGroupSortComponentState, ); const { closeAnyOpenDropdown } = useCloseAnyOpenDropdown(); @@ -73,7 +73,7 @@ export const useRecordGroupReorderConfirmationModal = ({ throw new Error('pendingDragEndReorder is not set'); } - setRecordGroupSort(RecordGroupSort.Manual); + setRecordIndexRecordGroupSort(RecordGroupSort.Manual); setPendingDragEndHandlerParams(null); handleDragEnd(...pendingDragEndHandlerParams); goBackToPreviousDropdownFocusId(); diff --git a/packages/twenty-front/src/modules/object-record/record-group/hooks/useReorderRecordGroups.ts b/packages/twenty-front/src/modules/object-record/record-group/hooks/useReorderRecordGroups.ts index 84b03116ae..a061f6b926 100644 --- a/packages/twenty-front/src/modules/object-record/record-group/hooks/useReorderRecordGroups.ts +++ b/packages/twenty-front/src/modules/object-record/record-group/hooks/useReorderRecordGroups.ts @@ -42,7 +42,7 @@ export const useReorderRecordGroups = ({ const { saveViewGroups } = useSaveCurrentViewGroups(); - const groupFieldMetadata = useAtomComponentStateValue( + const recordIndexGroupFieldMetadataItem = useAtomComponentStateValue( recordIndexGroupFieldMetadataItemComponentState, ); @@ -86,12 +86,12 @@ export const useReorderRecordGroups = ({ ]; }, []); - if (!isDefined(groupFieldMetadata?.id)) { + if (!isDefined(recordIndexGroupFieldMetadataItem?.id)) { throw new Error('mainGroupByFieldMetadataId is required'); } setRecordGroups({ - mainGroupByFieldMetadataId: groupFieldMetadata?.id, + mainGroupByFieldMetadataId: recordIndexGroupFieldMetadataItem?.id, recordGroups: updatedRecordGroups, recordIndexId, objectMetadataItemId: objectMetadataItem.id, @@ -102,7 +102,7 @@ export const useReorderRecordGroups = ({ }, [ objectMetadataItem.id, - groupFieldMetadata?.id, + recordIndexGroupFieldMetadataItem?.id, recordIndexId, saveViewGroups, setRecordGroups, diff --git a/packages/twenty-front/src/modules/object-record/record-group/hooks/useShouldHideRecordGroup.ts b/packages/twenty-front/src/modules/object-record/record-group/hooks/useShouldHideRecordGroup.ts index 5b42c6c1ce..3db359e3de 100644 --- a/packages/twenty-front/src/modules/object-record/record-group/hooks/useShouldHideRecordGroup.ts +++ b/packages/twenty-front/src/modules/object-record/record-group/hooks/useShouldHideRecordGroup.ts @@ -4,14 +4,14 @@ import { useAtomComponentFamilyStateValue } from '@/ui/utilities/state/jotai/hoo import { useAtomComponentStateValue } from '@/ui/utilities/state/jotai/hooks/useAtomComponentStateValue'; export const useShouldHideRecordGroup = (recordGroupId: string): boolean => { - const shouldHideEmptyRecordGroups = useAtomComponentStateValue( + const recordIndexShouldHideEmptyRecordGroups = useAtomComponentStateValue( recordIndexShouldHideEmptyRecordGroupsComponentState, ); - const isRecordGroupEmpty = useAtomComponentFamilyStateValue( + const emptyRecordGroupById = useAtomComponentFamilyStateValue( emptyRecordGroupByIdComponentFamilyState, recordGroupId, ); - return shouldHideEmptyRecordGroups && isRecordGroupEmpty; + return recordIndexShouldHideEmptyRecordGroups && emptyRecordGroupById; }; diff --git a/packages/twenty-front/src/modules/object-record/record-index/components/RecordIndexFiltersToContextStoreEffect.tsx b/packages/twenty-front/src/modules/object-record/record-index/components/RecordIndexFiltersToContextStoreEffect.tsx index de99147973..6b98b4c192 100644 --- a/packages/twenty-front/src/modules/object-record/record-index/components/RecordIndexFiltersToContextStoreEffect.tsx +++ b/packages/twenty-front/src/modules/object-record/record-index/components/RecordIndexFiltersToContextStoreEffect.tsx @@ -27,12 +27,12 @@ export const RecordIndexFiltersToContextStoreEffect = () => { const store = useStore(); - const recordIndexFilters = useAtomComponentStateValue( + const currentRecordFilters = useAtomComponentStateValue( currentRecordFiltersComponentState, recordIndexId, ); - const recordIndexFilterGroups = useAtomComponentStateValue( + const currentRecordFilterGroups = useAtomComponentStateValue( currentRecordFilterGroupsComponentState, recordIndexId, ); @@ -173,8 +173,8 @@ export const RecordIndexFiltersToContextStoreEffect = () => { useEffect(() => { store.set(syncWriteAtom, { - filters: recordIndexFilters, - filterGroups: recordIndexFilterGroups, + filters: currentRecordFilters, + filterGroups: currentRecordFilterGroups, anyFieldFilterValue, }); @@ -182,8 +182,8 @@ export const RecordIndexFiltersToContextStoreEffect = () => { store.set(resetWriteAtom); }; }, [ - recordIndexFilters, - recordIndexFilterGroups, + currentRecordFilters, + currentRecordFilterGroups, anyFieldFilterValue, store, syncWriteAtom, diff --git a/packages/twenty-front/src/modules/object-record/record-index/components/RecordIndexTableContainer.tsx b/packages/twenty-front/src/modules/object-record/record-index/components/RecordIndexTableContainer.tsx index 00ad5d8449..c272c9eccb 100644 --- a/packages/twenty-front/src/modules/object-record/record-index/components/RecordIndexTableContainer.tsx +++ b/packages/twenty-front/src/modules/object-record/record-index/components/RecordIndexTableContainer.tsx @@ -17,7 +17,7 @@ export const RecordIndexTableContainer = ({ const { objectNameSingular, viewBarInstanceId } = useRecordIndexContextOrThrow(); - const isRecordIndexRemoveSortingModalOpened = useAtomComponentStateValue( + const isModalOpened = useAtomComponentStateValue( isModalOpenedComponentState, RECORD_INDEX_REMOVE_SORTING_MODAL_ID, ); @@ -40,9 +40,7 @@ export const RecordIndexTableContainer = ({ viewBarId={viewBarInstanceId} updateRecordMutation={updateEntity} /> - {isRecordIndexRemoveSortingModalOpened && ( - - )} + {isModalOpened && } ); }; diff --git a/packages/twenty-front/src/modules/object-record/record-index/export/hooks/useRecordIndexLazyFetchRecords.ts b/packages/twenty-front/src/modules/object-record/record-index/export/hooks/useRecordIndexLazyFetchRecords.ts index 6dd8189f58..1ea16f16ad 100644 --- a/packages/twenty-front/src/modules/object-record/record-index/export/hooks/useRecordIndexLazyFetchRecords.ts +++ b/packages/twenty-front/src/modules/object-record/record-index/export/hooks/useRecordIndexLazyFetchRecords.ts @@ -59,13 +59,14 @@ export const useRecordIndexLazyFetchRecords = ({ viewBarId: recordIndexId, }); - const recordGroupFieldMetadata = useAtomComponentStateValue( + const recordIndexGroupFieldMetadataItem = useAtomComponentStateValue( recordIndexGroupFieldMetadataItemComponentState, recordIndexId, ); const hiddenKanbanFieldColumn = hiddenBoardFields.find( - (column) => column.metadata.fieldName === recordGroupFieldMetadata?.name, + (column) => + column.metadata.fieldName === recordIndexGroupFieldMetadataItem?.name, ); const contextStoreTargetedRecordsRule = useAtomComponentStateValue( diff --git a/packages/twenty-front/src/modules/object-record/record-index/hooks/useHandleIndexIdentifierClick.ts b/packages/twenty-front/src/modules/object-record/record-index/hooks/useHandleIndexIdentifierClick.ts index 2d6b369263..a13f1ef981 100644 --- a/packages/twenty-front/src/modules/object-record/record-index/hooks/useHandleIndexIdentifierClick.ts +++ b/packages/twenty-front/src/modules/object-record/record-index/hooks/useHandleIndexIdentifierClick.ts @@ -9,7 +9,7 @@ export const useHandleIndexIdentifierClick = ({ }: { objectMetadataItem: ObjectMetadataItem; }) => { - const currentViewId = useAtomComponentStateValue( + const contextStoreCurrentViewId = useAtomComponentStateValue( contextStoreCurrentViewIdComponentState, ); @@ -21,7 +21,7 @@ export const useHandleIndexIdentifierClick = ({ objectRecordId: recordId, }, { - viewId: currentViewId, + viewId: contextStoreCurrentViewId, }, ); }; diff --git a/packages/twenty-front/src/modules/object-record/record-index/hooks/useRecordIndexGroupCommonQueryVariables.ts b/packages/twenty-front/src/modules/object-record/record-index/hooks/useRecordIndexGroupCommonQueryVariables.ts index 11cab8d143..351cd15929 100644 --- a/packages/twenty-front/src/modules/object-record/record-index/hooks/useRecordIndexGroupCommonQueryVariables.ts +++ b/packages/twenty-front/src/modules/object-record/record-index/hooks/useRecordIndexGroupCommonQueryVariables.ts @@ -59,13 +59,13 @@ export const useRecordIndexGroupCommonQueryVariables = () => { objectMetadataItems, ); - const recordGroupFieldMetadata = useAtomComponentStateValue( + const recordIndexGroupFieldMetadataItem = useAtomComponentStateValue( recordIndexGroupFieldMetadataItemComponentState, ); const recordGqlFields = useRecordsFieldVisibleGqlFields({ objectMetadataItem, - additionalFieldMetadataId: recordGroupFieldMetadata?.id, + additionalFieldMetadataId: recordIndexGroupFieldMetadataItem?.id, }); const recordGroupDefinitions = useAtomComponentSelectorValue( @@ -81,7 +81,7 @@ export const useRecordIndexGroupCommonQueryVariables = () => { ); const recordGroupOptionsFilter = computeRecordGroupOptionsFilter({ - recordGroupFieldMetadata, + recordGroupFieldMetadata: recordIndexGroupFieldMetadataItem, recordGroupValues, }); diff --git a/packages/twenty-front/src/modules/object-record/record-inline-cell/components/RecordInlineCellEditMode.tsx b/packages/twenty-front/src/modules/object-record/record-inline-cell/components/RecordInlineCellEditMode.tsx index 483c59949d..eb960474f0 100644 --- a/packages/twenty-front/src/modules/object-record/record-inline-cell/components/RecordInlineCellEditMode.tsx +++ b/packages/twenty-front/src/modules/object-record/record-inline-cell/components/RecordInlineCellEditMode.tsx @@ -42,12 +42,12 @@ export const RecordInlineCellEditMode = ({ RecordFieldComponentInstanceContext, ); - const setFieldInputLayoutDirection = useSetAtomComponentState( + const setRecordFieldInputLayoutDirection = useSetAtomComponentState( recordFieldInputLayoutDirectionComponentState, recordFieldComponentInstanceId, ); - const setFieldInputLayoutDirectionLoading = useSetAtomComponentState( + const setRecordFieldInputLayoutDirectionLoading = useSetAtomComponentState( recordFieldInputLayoutDirectionLoadingComponentState, recordFieldComponentInstanceId, ); @@ -55,15 +55,15 @@ export const RecordInlineCellEditMode = ({ const setFieldInputLayoutDirectionMiddleware = { name: 'middleware', fn: async (state: MiddlewareState) => { - setFieldInputLayoutDirection( + setRecordFieldInputLayoutDirection( state.placement.startsWith('bottom') ? 'downward' : 'upward', ); - setFieldInputLayoutDirectionLoading(false); + setRecordFieldInputLayoutDirectionLoading(false); return {}; }, }; - const isFieldInError = useAtomComponentStateValue( + const recordFieldInputIsFieldInError = useAtomComponentStateValue( recordFieldInputIsFieldInErrorComponentState, ); @@ -98,7 +98,7 @@ export const RecordInlineCellEditMode = ({ ref={refs.setFloating} style={floatingStyles} borderRadius="sm" - hasDangerBorder={isFieldInError} + hasDangerBorder={recordFieldInputIsFieldInError} > {children} , diff --git a/packages/twenty-front/src/modules/object-record/record-merge/hooks/useMergeRecordsActions.ts b/packages/twenty-front/src/modules/object-record/record-merge/hooks/useMergeRecordsActions.ts index fd78f0c38b..056d1e6fe3 100644 --- a/packages/twenty-front/src/modules/object-record/record-merge/hooks/useMergeRecordsActions.ts +++ b/packages/twenty-front/src/modules/object-record/record-merge/hooks/useMergeRecordsActions.ts @@ -26,7 +26,7 @@ export const useMergeRecordsActions = ({ objectNameSingular, }); - const setMergeInProgress = useSetAtomState(isMergeInProgressState); + const setIsMergeInProgress = useSetAtomState(isMergeInProgressState); const { t } = useLingui(); const { enqueueSuccessSnackBar, enqueueErrorSnackBar } = useSnackBar(); @@ -34,7 +34,7 @@ export const useMergeRecordsActions = ({ const navigate = useNavigateApp(); const handleMergeRecords = async () => { - setMergeInProgress(true); + setIsMergeInProgress(true); try { const mergedRecord = await mergeManyRecords({ recordIds: selectedRecords.map((record) => record.id), @@ -65,7 +65,7 @@ export const useMergeRecordsActions = ({ : t`Failed to merge records. Please try again.`, }); } finally { - setMergeInProgress(false); + setIsMergeInProgress(false); } }; diff --git a/packages/twenty-front/src/modules/object-record/record-picker/hooks/useRecordPickerGetSearchRecordAndObjectMetadataItemFromRecordId.ts b/packages/twenty-front/src/modules/object-record/record-picker/hooks/useRecordPickerGetSearchRecordAndObjectMetadataItemFromRecordId.ts index 45c6098591..c4cd6d5204 100644 --- a/packages/twenty-front/src/modules/object-record/record-picker/hooks/useRecordPickerGetSearchRecordAndObjectMetadataItemFromRecordId.ts +++ b/packages/twenty-front/src/modules/object-record/record-picker/hooks/useRecordPickerGetSearchRecordAndObjectMetadataItemFromRecordId.ts @@ -20,12 +20,12 @@ export const useRecordPickerGetSearchRecordAndObjectMetadataItemFromRecordId = recordId, ); - const searchRecord = useAtomFamilyStateValue( + const searchRecordStore = useAtomFamilyStateValue( searchRecordStoreFamilyState, recordId, ); - if (!isDefined(pickableMorphItem) || !isDefined(searchRecord)) { + if (!isDefined(pickableMorphItem) || !isDefined(searchRecordStore)) { return { searchRecord: null, objectMetadataItem: null }; } @@ -38,5 +38,5 @@ export const useRecordPickerGetSearchRecordAndObjectMetadataItemFromRecordId = return { searchRecord: null, objectMetadataItem: null }; } - return { searchRecord, objectMetadataItem }; + return { searchRecord: searchRecordStore, objectMetadataItem }; }; diff --git a/packages/twenty-front/src/modules/object-record/record-picker/multiple-record-picker/components/MultipleRecordPickerFetchMoreLoader.tsx b/packages/twenty-front/src/modules/object-record/record-picker/multiple-record-picker/components/MultipleRecordPickerFetchMoreLoader.tsx index efd9c8b100..ef602b99f9 100644 --- a/packages/twenty-front/src/modules/object-record/record-picker/multiple-record-picker/components/MultipleRecordPickerFetchMoreLoader.tsx +++ b/packages/twenty-front/src/modules/object-record/record-picker/multiple-record-picker/components/MultipleRecordPickerFetchMoreLoader.tsx @@ -49,12 +49,12 @@ export const MultipleRecordPickerFetchMoreLoader = () => { componentInstanceId, ); - const isLoading = useAtomComponentStateValue( + const multipleRecordPickerIsLoading = useAtomComponentStateValue( multipleRecordPickerIsLoadingComponentState, componentInstanceId, ); - const searchFilter = useAtomComponentStateValue( + const multipleRecordPickerSearchFilter = useAtomComponentStateValue( multipleRecordPickerSearchFilterComponentState, componentInstanceId, ); @@ -77,16 +77,22 @@ export const MultipleRecordPickerFetchMoreLoader = () => { }), ); - if (isLoading || !currentPaginationState.hasNextPage) { + if (multipleRecordPickerIsLoading || !currentPaginationState.hasNextPage) { return; } await performSearch({ multipleRecordPickerInstanceId: componentInstanceId, - forceSearchFilter: searchFilter, + forceSearchFilter: multipleRecordPickerSearchFilter, loadMore: true, }); - }, [componentInstanceId, performSearch, searchFilter, isLoading, store]); + }, [ + componentInstanceId, + performSearch, + multipleRecordPickerSearchFilter, + multipleRecordPickerIsLoading, + store, + ]); const { ref } = useInView({ onChange: useCallback( @@ -107,7 +113,7 @@ export const MultipleRecordPickerFetchMoreLoader = () => { !paginationState.hasNextPage || multipleRecordPickerShouldShowInitialLoading || multipleRecordPickerShouldShowSkeleton || - (isLoading && !multipleRecordPickerIsFetchingMore) + (multipleRecordPickerIsLoading && !multipleRecordPickerIsFetchingMore) ) { return null; } diff --git a/packages/twenty-front/src/modules/object-record/record-picker/multiple-record-picker/components/MultipleRecordPickerLoadingEffect.tsx b/packages/twenty-front/src/modules/object-record/record-picker/multiple-record-picker/components/MultipleRecordPickerLoadingEffect.tsx index 74278b56de..ea30656ba6 100644 --- a/packages/twenty-front/src/modules/object-record/record-picker/multiple-record-picker/components/MultipleRecordPickerLoadingEffect.tsx +++ b/packages/twenty-front/src/modules/object-record/record-picker/multiple-record-picker/components/MultipleRecordPickerLoadingEffect.tsx @@ -10,11 +10,11 @@ import { useDebouncedCallback } from 'use-debounce'; export const MultipleRecordPickerLoadingEffect = () => { const [previousLoading, setPreviousLoading] = useState(false); - const loading = useAtomComponentStateValue( + const multipleRecordPickerIsLoading = useAtomComponentStateValue( multipleRecordPickerIsLoadingComponentState, ); - const setMultipleRecordPickerShowSkeleton = useSetAtomComponentState( + const setMultipleRecordPickerShouldShowSkeleton = useSetAtomComponentState( multipleRecordPickerShouldShowSkeletonComponentState, ); @@ -23,27 +23,27 @@ export const MultipleRecordPickerLoadingEffect = () => { ); const debouncedShowPickerSearchSkeleton = useDebouncedCallback( - () => setMultipleRecordPickerShowSkeleton(true), + () => setMultipleRecordPickerShouldShowSkeleton(true), 350, ); useEffect(() => { - if (previousLoading !== loading) { - setPreviousLoading(loading); + if (previousLoading !== multipleRecordPickerIsLoading) { + setPreviousLoading(multipleRecordPickerIsLoading); - if (loading) { + if (multipleRecordPickerIsLoading) { if (!multipleRecordPickerIsFetchingMore) { debouncedShowPickerSearchSkeleton(); } } else { debouncedShowPickerSearchSkeleton.cancel(); - setMultipleRecordPickerShowSkeleton(false); + setMultipleRecordPickerShouldShowSkeleton(false); } } }, [ - loading, + multipleRecordPickerIsLoading, previousLoading, - setMultipleRecordPickerShowSkeleton, + setMultipleRecordPickerShouldShowSkeleton, multipleRecordPickerIsFetchingMore, debouncedShowPickerSearchSkeleton, ]); diff --git a/packages/twenty-front/src/modules/object-record/record-picker/multiple-record-picker/components/MultipleRecordPickerMenuItemContent.tsx b/packages/twenty-front/src/modules/object-record/record-picker/multiple-record-picker/components/MultipleRecordPickerMenuItemContent.tsx index fd02609461..4655fbbdea 100644 --- a/packages/twenty-front/src/modules/object-record/record-picker/multiple-record-picker/components/MultipleRecordPickerMenuItemContent.tsx +++ b/packages/twenty-front/src/modules/object-record/record-picker/multiple-record-picker/components/MultipleRecordPickerMenuItemContent.tsx @@ -43,7 +43,7 @@ export const MultipleRecordPickerMenuItemContent = ({ const selectableListComponentInstanceId = getMultipleRecordPickerSelectableListId(componentInstanceId); - const isSelectedByKeyboard = useAtomComponentFamilyStateValue( + const isSelectedItemId = useAtomComponentFamilyStateValue( isSelectedItemIdComponentFamilyState, searchRecord.recordId, selectableListComponentInstanceId, @@ -68,12 +68,14 @@ export const MultipleRecordPickerMenuItemContent = ({ const displayText = searchRecord.label?.trim() || t`Untitled ${labelSingular}`; - const searchableObjectMetadataItems = useAtomComponentStateValue( - multipleRecordPickerSearchableObjectMetadataItemsComponentState, - componentInstanceId, - ); + const multipleRecordPickerSearchableObjectMetadataItems = + useAtomComponentStateValue( + multipleRecordPickerSearchableObjectMetadataItemsComponentState, + componentInstanceId, + ); - const showObjectName = searchableObjectMetadataItems.length > 1; + const showObjectName = + multipleRecordPickerSearchableObjectMetadataItems.length > 1; return ( handleSelectChange(isSelected)} - isKeySelected={isSelectedByKeyboard} + isKeySelected={isSelectedItemId} selected={isRecordSelectedWithObjectItem} avatar={ { MultipleRecordPickerComponentInstanceContext, ); - const [recordPickerSearchFilter, setRecordPickerSearchFilter] = - useAtomComponentState(multipleRecordPickerSearchFilterComponentState); + const [ + multipleRecordPickerSearchFilter, + setMultipleRecordPickerSearchFilter, + ] = useAtomComponentState(multipleRecordPickerSearchFilterComponentState); const { performSearch } = useMultipleRecordPickerPerformSearch(); @@ -43,13 +45,13 @@ export const MultipleRecordPickerSearchInput = () => { const handleFilterChange = (event: React.ChangeEvent) => { const newSearchFilter = event.currentTarget.value; - setRecordPickerSearchFilter(newSearchFilter); + setMultipleRecordPickerSearchFilter(newSearchFilter); debouncedSearch(newSearchFilter); }; return ( diff --git a/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/components/SingleRecordPicker.tsx b/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/components/SingleRecordPicker.tsx index fec6c91b22..00056e0a6a 100644 --- a/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/components/SingleRecordPicker.tsx +++ b/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/components/SingleRecordPicker.tsx @@ -33,13 +33,13 @@ export const SingleRecordPicker = ({ }: SingleRecordPickerProps) => { const containerRef = useRef(null); - const setRecordPickerSearchFilter = useSetAtomComponentState( + const setSingleRecordPickerSearchFilter = useSetAtomComponentState( singleRecordPickerSearchFilterComponentState, componentInstanceId, ); const handleCancel = () => { - setRecordPickerSearchFilter(''); + setSingleRecordPickerSearchFilter(''); onCancel?.(); }; @@ -47,7 +47,7 @@ export const SingleRecordPicker = ({ const handleMorphItemSelected = ( selectedMorphItem?: RecordPickerPickableMorphItem | undefined, ) => { - setRecordPickerSearchFilter(''); + setSingleRecordPickerSearchFilter(''); onMorphItemSelected?.(selectedMorphItem); }; diff --git a/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/components/SingleRecordPickerMenuItem.tsx b/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/components/SingleRecordPickerMenuItem.tsx index 5c90cbb3fd..73b6f29d8a 100644 --- a/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/components/SingleRecordPickerMenuItem.tsx +++ b/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/components/SingleRecordPickerMenuItem.tsx @@ -39,27 +39,29 @@ export const SingleRecordPickerMenuItem = ({ const selectableListComponentInstanceId = getSingleRecordPickerSelectableListId(recordPickerComponentInstanceId); - const isSelectedByKeyboard = useAtomComponentFamilyStateValue( + const isSelectedItemId = useAtomComponentFamilyStateValue( isSelectedItemIdComponentFamilyState, morphItem.recordId, selectableListComponentInstanceId, ); - const searchRecord = useAtomFamilyStateValue( + const searchRecordStore = useAtomFamilyStateValue( searchRecordStoreFamilyState, morphItem.recordId, ); - const searchableObjectMetadataItems = useAtomComponentStateValue( - singleRecordPickerSearchableObjectMetadataItemsComponentState, - recordPickerComponentInstanceId, - ); + const singleRecordPickerSearchableObjectMetadataItems = + useAtomComponentStateValue( + singleRecordPickerSearchableObjectMetadataItemsComponentState, + recordPickerComponentInstanceId, + ); - if (!isDefined(searchRecord)) { + if (!isDefined(searchRecordStore)) { return null; } - const showObjectName = searchableObjectMetadataItems.length > 1; + const showObjectName = + singleRecordPickerSearchableObjectMetadataItems.length > 1; return ( onMorphItemSelected(morphItem)} - text={searchRecord.label} + text={searchRecordStore.label} selected={isRecordSelected} - focused={isSelectedByKeyboard} + focused={isSelectedItemId} avatar={ } contextualText={ showObjectName - ? capitalize(searchRecord.objectLabelSingular) + ? capitalize(searchRecordStore.objectLabelSingular) : undefined } /> diff --git a/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/components/SingleRecordPickerMenuItems.tsx b/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/components/SingleRecordPickerMenuItems.tsx index e7426bb52a..be2aa60bda 100644 --- a/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/components/SingleRecordPickerMenuItems.tsx +++ b/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/components/SingleRecordPickerMenuItems.tsx @@ -53,7 +53,7 @@ export const SingleRecordPickerMenuItems = ({ selectableListComponentInstanceId, ); - const isSelectedSelectNoneButton = useAtomComponentFamilyStateValue( + const isSelectedItemId = useAtomComponentFamilyStateValue( isSelectedItemIdComponentFamilyState, selectableListComponentInstanceId, 'select-none', @@ -72,9 +72,8 @@ export const SingleRecordPickerMenuItems = ({ const selectableItemIds = pickableMorphItems.map( (morphItem) => morphItem.recordId, ); - const [selectedRecordId, setSelectedRecordId] = useAtomComponentState( - singleRecordPickerSelectedIdComponentState, - ); + const [singleRecordPickerSelectedId, setSingleRecordPickerSelectedId] = + useAtomComponentState(singleRecordPickerSelectedIdComponentState); const singleRecordPickerShouldShowSkeleton = useAtomComponentStateValue( singleRecordPickerShouldShowSkeletonComponentState, @@ -101,19 +100,19 @@ export const SingleRecordPickerMenuItems = ({ key="select-none" itemId="select-none" onEnter={() => { - setSelectedRecordId(undefined); + setSingleRecordPickerSelectedId(undefined); onMorphItemSelected(); }} > { - setSelectedRecordId(undefined); + setSingleRecordPickerSelectedId(undefined); onMorphItemSelected(); }} LeftIcon={EmptyIcon} text={emptyLabel} - selected={isUndefined(selectedRecordId)} - focused={isSelectedSelectNoneButton} + selected={isUndefined(singleRecordPickerSelectedId)} + focused={isSelectedItemId} /> )} @@ -127,7 +126,9 @@ export const SingleRecordPickerMenuItems = ({ key={morphItem.recordId} morphItem={morphItem} onMorphItemSelected={onMorphItemSelected} - isRecordSelected={selectedRecordId === morphItem.recordId} + isRecordSelected={ + singleRecordPickerSelectedId === morphItem.recordId + } /> )) )} diff --git a/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/components/SingleRecordPickerMenuItemsWithSearch.tsx b/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/components/SingleRecordPickerMenuItemsWithSearch.tsx index ec626f7d30..0a1acc3b57 100644 --- a/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/components/SingleRecordPickerMenuItemsWithSearch.tsx +++ b/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/components/SingleRecordPickerMenuItemsWithSearch.tsx @@ -49,7 +49,7 @@ export const SingleRecordPickerMenuItemsWithSearch = ({ SingleRecordPickerComponentInstanceContext, ); - const recordPickerSearchFilter = useAtomComponentStateValue( + const singleRecordPickerSearchFilter = useAtomComponentStateValue( singleRecordPickerSearchFilterComponentState, recordPickerInstanceId, ); @@ -75,7 +75,7 @@ export const SingleRecordPickerMenuItemsWithSearch = ({ ); const handleCreateNew = () => { - onCreate?.(recordPickerSearchFilter); + onCreate?.(singleRecordPickerSearchFilter); }; return ( diff --git a/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/hooks/__tests__/useSingleRecordPickerRecords.test.tsx b/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/hooks/__tests__/useSingleRecordPickerRecords.test.tsx index b2e27683d2..769a95a1ab 100644 --- a/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/hooks/__tests__/useSingleRecordPickerRecords.test.tsx +++ b/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/hooks/__tests__/useSingleRecordPickerRecords.test.tsx @@ -18,11 +18,11 @@ describe('useSingleRecordPickerRecords', () => { const { result } = renderHook( () => { const recordSelectSearchHook = useSingleRecordPickerSearch(instanceId); - const internallyStoredFilter = useAtomComponentStateValue( + const singleRecordPickerSearchFilter = useAtomComponentStateValue( singleRecordPickerSearchFilterComponentState, instanceId, ); - return { recordSelectSearchHook, internallyStoredFilter }; + return { recordSelectSearchHook, singleRecordPickerSearchFilter }; }, { wrapper: Wrapper, @@ -37,6 +37,6 @@ describe('useSingleRecordPickerRecords', () => { } as ChangeEvent); }); - expect(result.current.internallyStoredFilter).toBe(filter); + expect(result.current.singleRecordPickerSearchFilter).toBe(filter); }); }); diff --git a/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/hooks/useSingleRecordPickerRecords.ts b/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/hooks/useSingleRecordPickerRecords.ts index c5df06e6e4..84aa619efa 100644 --- a/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/hooks/useSingleRecordPickerRecords.ts +++ b/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/hooks/useSingleRecordPickerRecords.ts @@ -10,16 +10,18 @@ export const useSingleRecordPickerRecords = ({ objectNameSingulars: string[]; excludedRecordIds?: string[]; }) => { - const recordPickerSearchFilter = useAtomComponentStateValue( + const singleRecordPickerSearchFilter = useAtomComponentStateValue( singleRecordPickerSearchFilterComponentState, ); - const selectedRecordId = useAtomComponentStateValue( + const singleRecordPickerSelectedId = useAtomComponentStateValue( singleRecordPickerSelectedIdComponentState, ); const { pickableMorphItems, loading } = useSingleRecordPickerPerformSearch({ - searchFilter: recordPickerSearchFilter, - selectedIds: selectedRecordId ? [selectedRecordId] : [], + searchFilter: singleRecordPickerSearchFilter, + selectedIds: singleRecordPickerSelectedId + ? [singleRecordPickerSelectedId] + : [], excludedRecordIds: excludedRecordIds, objectNameSingulars, }); diff --git a/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/hooks/useSingleRecordPickerSearch.ts b/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/hooks/useSingleRecordPickerSearch.ts index 90aed183db..608ae23d88 100644 --- a/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/hooks/useSingleRecordPickerSearch.ts +++ b/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/hooks/useSingleRecordPickerSearch.ts @@ -14,18 +14,18 @@ export const useSingleRecordPickerSearch = ( recordPickerComponentInstanceIdFromProps, ); - const setRecordPickerSearchFilter = useSetAtomComponentState( + const setSingleRecordPickerSearchFilter = useSetAtomComponentState( singleRecordPickerSearchFilterComponentState, recordPickerComponentInstanceId, ); - const setRecordPickerSelectedId = useSetAtomComponentState( + const setSingleRecordPickerSelectedId = useSetAtomComponentState( singleRecordPickerSelectedIdComponentState, recordPickerComponentInstanceId, ); const debouncedSetSearchFilter = useDebouncedCallback( - setRecordPickerSearchFilter, + setSingleRecordPickerSearchFilter, 100, { leading: true, @@ -34,7 +34,7 @@ export const useSingleRecordPickerSearch = ( const resetSearchFilter = () => { debouncedSetSearchFilter(''); - setRecordPickerSelectedId(undefined); + setSingleRecordPickerSelectedId(undefined); }; const handleSearchFilterChange = ( diff --git a/packages/twenty-front/src/modules/object-record/record-store/hooks/__tests__/useUpsertRecordsInStore.test.tsx b/packages/twenty-front/src/modules/object-record/record-store/hooks/__tests__/useUpsertRecordsInStore.test.tsx index 97acb66ea7..f05a1752b6 100644 --- a/packages/twenty-front/src/modules/object-record/record-store/hooks/__tests__/useUpsertRecordsInStore.test.tsx +++ b/packages/twenty-front/src/modules/object-record/record-store/hooks/__tests__/useUpsertRecordsInStore.test.tsx @@ -12,23 +12,23 @@ const Wrapper = ({ children }: { children: ReactNode }) => ( ); describe('useUpsertRecordsInStore', () => { - it('should insert a new record when no current record exists', () => { + it('should insert a new recordStore when no current recordStore exists', () => { const recordId = 'test-record-1'; const { result } = renderHook( () => { - const record = useAtomFamilyStateValue( + const recordStore = useAtomFamilyStateValue( recordStoreFamilyState, recordId, ); const { upsertRecordsInStore } = useUpsertRecordsInStore(); - return { record, upsertRecordsInStore }; + return { recordStore, upsertRecordsInStore }; }, { wrapper: Wrapper }, ); - expect(result.current.record).toBeNull(); + expect(result.current.recordStore).toBeNull(); act(() => { result.current.upsertRecordsInStore({ @@ -43,7 +43,7 @@ describe('useUpsertRecordsInStore', () => { }); }); - expect(result.current.record).toEqual({ + expect(result.current.recordStore).toEqual({ id: recordId, __typename: 'Person', name: 'John Doe', @@ -51,18 +51,18 @@ describe('useUpsertRecordsInStore', () => { }); }); - it('should merge filtered partial record with existing record', () => { + it('should merge filtered partial recordStore with existing recordStore', () => { const recordId = 'test-record-2'; const { result } = renderHook( () => { - const record = useAtomFamilyStateValue( + const recordStore = useAtomFamilyStateValue( recordStoreFamilyState, recordId, ); const { upsertRecordsInStore } = useUpsertRecordsInStore(); - return { record, upsertRecordsInStore }; + return { recordStore, upsertRecordsInStore }; }, { wrapper: Wrapper }, ); @@ -80,7 +80,7 @@ describe('useUpsertRecordsInStore', () => { }); }); - expect(result.current.record).toEqual({ + expect(result.current.recordStore).toEqual({ id: recordId, __typename: 'Person', name: 'John Doe', @@ -104,7 +104,7 @@ describe('useUpsertRecordsInStore', () => { }); }); - expect(result.current.record).toEqual({ + expect(result.current.recordStore).toEqual({ id: recordId, __typename: 'Person', name: 'Jane Doe', @@ -117,13 +117,13 @@ describe('useUpsertRecordsInStore', () => { const { result } = renderHook( () => { - const record = useAtomFamilyStateValue( + const recordStore = useAtomFamilyStateValue( recordStoreFamilyState, recordId, ); const { upsertRecordsInStore } = useUpsertRecordsInStore(); - return { record, upsertRecordsInStore }; + return { recordStore, upsertRecordsInStore }; }, { wrapper: Wrapper }, ); @@ -141,7 +141,7 @@ describe('useUpsertRecordsInStore', () => { }); }); - const recordAfterFirstUpsert = result.current.record; + const recordAfterFirstUpsert = result.current.recordStore; act(() => { result.current.upsertRecordsInStore({ @@ -160,6 +160,6 @@ describe('useUpsertRecordsInStore', () => { }); }); - expect(result.current.record).toBe(recordAfterFirstUpsert); + expect(result.current.recordStore).toBe(recordAfterFirstUpsert); }); }); diff --git a/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableColumnWidthEffect.tsx b/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableColumnWidthEffect.tsx index 98e30682d0..390101294a 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableColumnWidthEffect.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableColumnWidthEffect.tsx @@ -21,7 +21,7 @@ import { useEffect } from 'react'; import { isDefined } from 'twenty-shared/utils'; export const RecordTableColumnWidthEffect = () => { - const [resizedFieldMetadataItemId] = useAtomComponentState( + const [resizedFieldMetadataId] = useAtomComponentState( resizedFieldMetadataIdComponentState, ); @@ -36,7 +36,7 @@ export const RecordTableColumnWidthEffect = () => { ); useEffect(() => { - if (isDefined(resizedFieldMetadataItemId)) { + if (isDefined(resizedFieldMetadataId)) { return; } @@ -98,7 +98,7 @@ export const RecordTableColumnWidthEffect = () => { ); } }, [ - resizedFieldMetadataItemId, + resizedFieldMetadataId, visibleRecordFields, recordTableWidth, shouldCompactRecordTableFirstColumn, diff --git a/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableRecordGroupRows.tsx b/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableRecordGroupRows.tsx index d0a2ef1586..495d3e0a7d 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableRecordGroupRows.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableRecordGroupRows.tsx @@ -22,7 +22,7 @@ export const RecordTableRecordGroupRows = () => { recordIndexAllRecordIdsComponentSelector, ); - const recordIdsByGroup = useAtomComponentFamilyStateValue( + const recordIndexRecordIdsByGroup = useAtomComponentFamilyStateValue( recordIndexRecordIdsByGroupComponentFamilyState, currentRecordGroupId, ); @@ -47,7 +47,7 @@ export const RecordTableRecordGroupRows = () => { return ( <> - {recordIdsByGroup.map((recordId, rowIndexInGroup) => { + {recordIndexRecordIdsByGroup.map((recordId, rowIndexInGroup) => { const rowIndex = rowIndexMap.get(recordId); if (!isDefined(rowIndex)) { diff --git a/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableScrollToFocusedCellEffect.tsx b/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableScrollToFocusedCellEffect.tsx index b0d05bc937..4040db1892 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableScrollToFocusedCellEffect.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableScrollToFocusedCellEffect.tsx @@ -14,7 +14,7 @@ export const RecordTableScrollToFocusedCellEffect = () => { recordTableId, ); - const focusPosition = useAtomComponentStateValue( + const recordTableFocusPosition = useAtomComponentStateValue( recordTableFocusPositionComponentState, recordTableId, ); @@ -25,19 +25,19 @@ export const RecordTableScrollToFocusedCellEffect = () => { return; } - if (!focusPosition) { + if (!recordTableFocusPosition) { return; } const focusElement = document.getElementById( - `record-table-cell-${focusPosition.column}-${focusPosition.row}`, + `record-table-cell-${recordTableFocusPosition.column}-${recordTableFocusPosition.row}`, ); if (!focusElement) { return; } - const isSecondColumn = focusPosition.column === 1; + const isSecondColumn = recordTableFocusPosition.column === 1; if (isSecondColumn) { const checkBoxColumnCell = document.getElementById( @@ -63,7 +63,7 @@ export const RecordTableScrollToFocusedCellEffect = () => { focusElement.style.scrollMarginBottom = ''; } }; - }, [focusPosition, isRecordTableCellFocusActive]); + }, [recordTableFocusPosition, isRecordTableCellFocusActive]); return null; }; diff --git a/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableScrollToFocusedRowEffect.tsx b/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableScrollToFocusedRowEffect.tsx index 023117ceed..58bbbc9b08 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableScrollToFocusedRowEffect.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableScrollToFocusedRowEffect.tsx @@ -11,12 +11,12 @@ import { isDefined } from 'twenty-shared/utils'; export const RecordTableScrollToFocusedRowEffect = () => { const { recordTableId } = useRecordTableContextOrThrow(); - const focusedRowIndex = useAtomComponentStateValue( + const focusedRecordTableRowIndex = useAtomComponentStateValue( focusedRecordTableRowIndexComponentState, recordTableId, ); - const isRowFocusActive = useAtomComponentStateValue( + const isRecordTableRowFocusActive = useAtomComponentStateValue( isRecordTableRowFocusActiveComponentState, recordTableId, ); @@ -28,21 +28,21 @@ export const RecordTableScrollToFocusedRowEffect = () => { useEffect(() => { if ( - !isRowFocusActive || - !isDefined(focusedRowIndex) || + !isRecordTableRowFocusActive || + !isDefined(focusedRecordTableRowIndex) || !allRecordIds?.length ) { return; } - const recordId = allRecordIds[focusedRowIndex]; + const recordId = allRecordIds[focusedRecordTableRowIndex]; if (!recordId) { return; } const focusElement = document.getElementById( - `record-table-cell-0-${focusedRowIndex}`, + `record-table-cell-0-${focusedRecordTableRowIndex}`, ); if (!focusElement) { @@ -59,7 +59,7 @@ export const RecordTableScrollToFocusedRowEffect = () => { focusElement.style.scrollMarginBottom = ''; } }; - }, [focusedRowIndex, isRowFocusActive, allRecordIds]); + }, [focusedRecordTableRowIndex, isRecordTableRowFocusActive, allRecordIds]); return null; }; diff --git a/packages/twenty-front/src/modules/object-record/record-table/components/__stories__/perf/RecordTableCell.perf.stories.tsx b/packages/twenty-front/src/modules/object-record/record-table/components/__stories__/perf/RecordTableCell.perf.stories.tsx index a5280f3eb5..7f965b6e35 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/components/__stories__/perf/RecordTableCell.perf.stories.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/components/__stories__/perf/RecordTableCell.perf.stories.tsx @@ -37,12 +37,13 @@ import { ComponentDecorator } from 'twenty-ui/testing'; import { generatedMockObjectMetadataItems } from '~/testing/utils/generatedMockObjectMetadataItems'; const RelationFieldValueSetterEffect = () => { - const setEntity = useSetAtomFamilyState( + const setRecordStore = useSetAtomFamilyState( recordStoreFamilyState, mockPerformance.recordId, ); - const setRelationEntity = useSetAtomFamilyState( + // eslint-disable-next-line twenty/matching-state-variable + const setRelationRecordStore = useSetAtomFamilyState( recordStoreFamilyState, mockPerformance.relationRecordId, ); @@ -55,8 +56,8 @@ const RelationFieldValueSetterEffect = () => { const [, setObjectMetadataItems] = useAtomState(objectMetadataItemsState); useEffect(() => { - setEntity(mockPerformance.entityValue); - setRelationEntity(mockPerformance.relationFieldValue); + setRecordStore(mockPerformance.entityValue); + setRelationRecordStore(mockPerformance.relationFieldValue); setCurrentRecordFields( mockPerformance.visibleTableColumns.map( (tableColumn) => @@ -72,8 +73,8 @@ const RelationFieldValueSetterEffect = () => { setObjectMetadataItems(generatedMockObjectMetadataItems); }, [ - setEntity, - setRelationEntity, + setRecordStore, + setRelationRecordStore, setObjectMetadataItems, setCurrentRecordFields, ]); diff --git a/packages/twenty-front/src/modules/object-record/record-table/empty-state/components/RecordTableEmptyState.tsx b/packages/twenty-front/src/modules/object-record/record-table/empty-state/components/RecordTableEmptyState.tsx index 8120a961c1..9580e42561 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/empty-state/components/RecordTableEmptyState.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/empty-state/components/RecordTableEmptyState.tsx @@ -18,7 +18,7 @@ export const RecordTableEmptyState = () => { const isRemote = objectMetadataItem.isRemote; - const isSoftDeleteActive = useAtomComponentStateValue( + const isSoftDeleteFilterActive = useAtomComponentStateValue( isSoftDeleteFilterActiveComponentState, recordTableId, ); @@ -35,7 +35,7 @@ export const RecordTableEmptyState = () => { if (isRemote) { return ; - } else if (isSoftDeleteActive === true) { + } else if (isSoftDeleteFilterActive === true) { return ; } else if (noRecordAtAll) { return ; diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableRecordGroupBodyEffect.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableRecordGroupBodyEffect.tsx index 2d5373148e..605324bdc8 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableRecordGroupBodyEffect.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-body/components/RecordTableRecordGroupBodyEffect.tsx @@ -32,7 +32,7 @@ export const RecordTableRecordGroupBodyEffect = () => { const { records, loading, hasNextPage } = useRecordIndexTableQuery(objectNameSingular); - const setHasRecordFetchedAllRecordsComponents = + const setRecordIndexHasFetchedAllRecordsByGroup = useSetAtomComponentFamilyState( recordIndexHasFetchedAllRecordsByGroupComponentState, recordGroupId, @@ -49,14 +49,14 @@ export const RecordTableRecordGroupBodyEffect = () => { currentRecordGroupId: recordGroupId, }); setIsRecordTableInitialLoading(false); - setHasRecordFetchedAllRecordsComponents(!hasNextPage); + setRecordIndexHasFetchedAllRecordsByGroup(!hasNextPage); } }, [ hasNextPage, loading, records, recordGroupId, - setHasRecordFetchedAllRecordsComponents, + setRecordIndexHasFetchedAllRecordsByGroup, setIsRecordTableInitialLoading, setRecordTableData, ]); diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellEditMode.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellEditMode.tsx index 3552e7c4d8..718f3a8b2b 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellEditMode.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellEditMode.tsx @@ -45,19 +45,19 @@ export type RecordTableCellEditModeProps = { export const RecordTableCellEditMode = ({ children, }: RecordTableCellEditModeProps) => { - const isFieldInError = useAtomComponentStateValue( + const recordFieldInputIsFieldInError = useAtomComponentStateValue( recordFieldInputIsFieldInErrorComponentState, ); const recordFieldComponentInstanceId = useAvailableComponentInstanceIdOrThrow( RecordFieldComponentInstanceContext, ); - const setFieldInputLayoutDirection = useSetAtomComponentState( + const setRecordFieldInputLayoutDirection = useSetAtomComponentState( recordFieldInputLayoutDirectionComponentState, recordFieldComponentInstanceId, ); - const setFieldInputLayoutDirectionLoading = useSetAtomComponentState( + const setRecordFieldInputLayoutDirectionLoading = useSetAtomComponentState( recordFieldInputLayoutDirectionLoadingComponentState, recordFieldComponentInstanceId, ); @@ -65,10 +65,10 @@ export const RecordTableCellEditMode = ({ const setFieldInputLayoutDirectionMiddleware = { name: 'middleware', fn: async (state: MiddlewareState) => { - setFieldInputLayoutDirection( + setRecordFieldInputLayoutDirection( state.placement.startsWith('bottom') ? 'downward' : 'upward', ); - setFieldInputLayoutDirectionLoading(false); + setRecordFieldInputLayoutDirectionLoading(false); return {}; }, }; @@ -112,7 +112,7 @@ export const RecordTableCellEditMode = ({ ref={refs.setFloating} style={floatingStyles} borderRadius="sm" - hasDangerBorder={isFieldInError} + hasDangerBorder={recordFieldInputIsFieldInError} > {children} diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellEditModePortal.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellEditModePortal.tsx index 1fa1852281..2bfc12f8c8 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellEditModePortal.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellEditModePortal.tsx @@ -14,11 +14,11 @@ import { recordTableFocusPositionComponentState } from '@/object-record/record-t import { isDefined } from 'twenty-shared/utils'; export const RecordTableCellEditModePortal = () => { - const focusedCellPosition = useAtomComponentStateValue( + const recordTableFocusPosition = useAtomComponentStateValue( recordTableFocusPositionComponentState, ); - const currentTableCellInEditModePosition = useAtomComponentStateValue( + const recordTableCellEditModePosition = useAtomComponentStateValue( recordTableCellEditModePositionComponentState, ); @@ -28,13 +28,13 @@ export const RecordTableCellEditModePortal = () => { const cellFocusId = useCurrentlyFocusedRecordTableCellFocusId(); - if (!isDefined(focusedCellPosition) || !isDefined(cellFocusId)) { + if (!isDefined(recordTableFocusPosition) || !isDefined(cellFocusId)) { return null; } return ( - - {currentTableCellInEditModePosition && ( + + {recordTableCellEditModePosition && ( | null)) => { const { theme } = useContext(ThemeContext); - const hoverPosition = useAtomComponentStateValue( + const recordTableHoverPosition = useAtomComponentStateValue( recordTableHoverPositionComponentState, ); - const focusPosition = useAtomComponentStateValue( + const recordTableFocusPosition = useAtomComponentStateValue( recordTableFocusPositionComponentState, ); const isFocusPortalOnThisCell = - focusPosition?.column === 0 && focusPosition.row === 0; + recordTableFocusPosition?.column === 0 && + recordTableFocusPosition.row === 0; const isHoveredPortalOnThisCell = - hoverPosition?.column === 0 && hoverPosition.row === 0; + recordTableHoverPosition?.column === 0 && + recordTableHoverPosition.row === 0; const [isRecordTableScrolledVertically] = useAtomComponentState( isRecordTableScrolledVerticallyComponentState, diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellFocusedPortal.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellFocusedPortal.tsx index 4fa10a9e1d..31231be3e8 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellFocusedPortal.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellFocusedPortal.tsx @@ -13,7 +13,7 @@ import { recordTableHoverPositionComponentState } from '@/object-record/record-t import { isDefined } from 'twenty-shared/utils'; export const RecordTableCellFocusedPortal = () => { - const focusPosition = useAtomComponentStateValue( + const recordTableFocusPosition = useAtomComponentStateValue( recordTableFocusPositionComponentState, ); @@ -29,22 +29,22 @@ export const RecordTableCellFocusedPortal = () => { hasRecordGroupsComponentSelector, ); - const hoverPosition = useAtomComponentStateValue( + const recordTableHoverPosition = useAtomComponentStateValue( recordTableHoverPositionComponentState, ); const isUnderHoveredPortal = - isDefined(hoverPosition) && - isDefined(focusPosition) && - hoverPosition.column === focusPosition.column && - hoverPosition.row === focusPosition.row; + isDefined(recordTableHoverPosition) && + isDefined(recordTableFocusPosition) && + recordTableHoverPosition.column === recordTableFocusPosition.column && + recordTableHoverPosition.row === recordTableFocusPosition.row; - if (!isDefined(focusPosition) || isUnderHoveredPortal) { + if (!isDefined(recordTableFocusPosition) || isUnderHoveredPortal) { return null; } - const isOnFirstScrollableColumn = focusPosition.column === 1; - const isOnLabelIdentifierStickyColumn = focusPosition.column === 0; + const isOnFirstScrollableColumn = recordTableFocusPosition.column === 1; + const isOnLabelIdentifierStickyColumn = recordTableFocusPosition.column === 0; const zIndexForHoveredPortalOnFirstScrollableColumnWithoutGroups = isRecordTableScrolledHorizontally && isRecordTableScrolledVertically @@ -141,7 +141,7 @@ export const RecordTableCellFocusedPortal = () => { : zIndexForHoveredPortalWithoutGroups; return ( - + diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellFocusedPortalContent.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellFocusedPortalContent.tsx index 84d010e560..d0416af17b 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellFocusedPortalContent.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellFocusedPortalContent.tsx @@ -14,12 +14,14 @@ import { isDefined } from 'twenty-shared/utils'; import { BORDER_COMMON } from 'twenty-ui/theme'; const StyledRecordTableCellFocusPortalContent = styled.div<{ - isRowActive: boolean; + isRecordTableRowActive: boolean; }>` align-items: center; background: ${({ theme }) => theme.background.transparent.secondary}; - background-color: ${({ theme, isRowActive }) => - isRowActive ? theme.accent.quaternary : theme.background.primary}; + background-color: ${({ theme, isRecordTableRowActive }) => + isRecordTableRowActive + ? theme.accent.quaternary + : theme.background.primary}; border-radius: ${BORDER_COMMON.radius.sm}; box-sizing: border-box; display: flex; @@ -35,32 +37,32 @@ export const RecordTableCellFocusedPortalContent = () => { const { rowIndex } = useRecordTableRowContextOrThrow(); const { onMoveHoverToCurrentCell } = useRecordTableBodyContextOrThrow(); - const focusPosition = useAtomComponentStateValue( + const recordTableFocusPosition = useAtomComponentStateValue( recordTableFocusPositionComponentState, ); - const isRowActive = useAtomComponentFamilyStateValue( + const isRecordTableRowActive = useAtomComponentFamilyStateValue( isRecordTableRowActiveComponentFamilyState, rowIndex, ); - const hoverPosition = useAtomComponentStateValue( + const recordTableHoverPosition = useAtomComponentStateValue( recordTableHoverPositionComponentState, ); const arePositionsDifferent = - hoverPosition?.row !== focusPosition?.row || - hoverPosition?.column !== focusPosition?.column; + recordTableHoverPosition?.row !== recordTableFocusPosition?.row || + recordTableHoverPosition?.column !== recordTableFocusPosition?.column; const handleContainerMouseMove = () => { - if (arePositionsDifferent && isDefined(focusPosition)) { - onMoveHoverToCurrentCell(focusPosition); + if (arePositionsDifferent && isDefined(recordTableFocusPosition)) { + onMoveHoverToCurrentCell(recordTableFocusPosition); } }; return ( diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellHoveredPortal.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellHoveredPortal.tsx index 2f72671d3b..196228c6b3 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellHoveredPortal.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellHoveredPortal.tsx @@ -12,7 +12,7 @@ import { isRecordTableScrolledVerticallyComponentState } from '@/object-record/r import { isDefined } from 'twenty-shared/utils'; export const RecordTableCellHoveredPortal = () => { - const hoverPosition = useAtomComponentStateValue( + const recordTableHoverPosition = useAtomComponentStateValue( recordTableHoverPositionComponentState, ); @@ -28,12 +28,12 @@ export const RecordTableCellHoveredPortal = () => { hasRecordGroupsComponentSelector, ); - if (!isDefined(hoverPosition)) { + if (!isDefined(recordTableHoverPosition)) { return null; } - const isOnFirstScrollableColumn = hoverPosition.column === 1; - const isOnLabelIdentifierStickyColumn = hoverPosition.column === 0; + const isOnFirstScrollableColumn = recordTableHoverPosition.column === 1; + const isOnLabelIdentifierStickyColumn = recordTableHoverPosition.column === 0; const zIndexForHoveredPortalOnFirstScrollableColumnWithoutGroups = isRecordTableScrolledHorizontally && isRecordTableScrolledVertically @@ -130,7 +130,7 @@ export const RecordTableCellHoveredPortal = () => { : zIndexForHoveredPortalWithoutGroups; return ( - + diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellHoveredPortalContent.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellHoveredPortalContent.tsx index 66dcfa5bae..2e18b316e2 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellHoveredPortalContent.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellHoveredPortalContent.tsx @@ -19,12 +19,14 @@ import { useIsMobile } from 'twenty-ui/utilities'; const StyledRecordTableCellHoveredPortalContent = styled.div<{ showInteractiveStyle: boolean; - isRowActive: boolean; + isRecordTableRowActive: boolean; }>` align-items: center; background: ${({ theme }) => theme.background.transparent.secondary}; - background-color: ${({ theme, isRowActive }) => - isRowActive ? theme.accent.quaternary : theme.background.primary}; + background-color: ${({ theme, isRecordTableRowActive }) => + isRecordTableRowActive + ? theme.accent.quaternary + : theme.background.primary}; border-radius: ${({ showInteractiveStyle }) => showInteractiveStyle ? BORDER_COMMON.radius.sm : 'none'}; box-sizing: border-box; @@ -34,8 +36,8 @@ const StyledRecordTableCellHoveredPortalContent = styled.div<{ height: ${RECORD_TABLE_ROW_HEIGHT}px; - outline: ${({ theme, showInteractiveStyle, isRowActive }) => - isRowActive + outline: ${({ theme, showInteractiveStyle, isRecordTableRowActive }) => + isRecordTableRowActive ? 'none' : showInteractiveStyle ? `1px solid ${theme.font.color.extraLight}` @@ -45,13 +47,13 @@ const StyledRecordTableCellHoveredPortalContent = styled.div<{ `; export const RecordTableCellHoveredPortalContent = () => { - const hoverPosition = useAtomComponentStateValue( + const recordTableHoverPosition = useAtomComponentStateValue( recordTableHoverPositionComponentState, ); const isMobile = useIsMobile(); - const isFirstColumn = hoverPosition?.column === 0; + const isFirstColumn = recordTableHoverPosition?.column === 0; const { isRecordFieldReadOnly: isReadOnly } = useContext(FieldContext); @@ -66,7 +68,7 @@ export const RecordTableCellHoveredPortalContent = () => { const { rowIndex } = useRecordTableRowContextOrThrow(); - const isRowActive = useAtomComponentFamilyStateValue( + const isRecordTableRowActive = useAtomComponentFamilyStateValue( isRecordTableRowActiveComponentFamilyState, rowIndex, ); @@ -74,7 +76,7 @@ export const RecordTableCellHoveredPortalContent = () => { return ( {isFieldInputOnly ? ( diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellPortals.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellPortals.tsx index 68f48e99ce..890c0501af 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellPortals.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellPortals.tsx @@ -11,7 +11,7 @@ import { isDefined } from 'twenty-shared/utils'; export const RecordTableCellPortals = () => { const { recordTableId } = useRecordTableContextOrThrow(); - const isRecordTableFocusActive = useAtomComponentStateValue( + const isRecordTableCellFocusActive = useAtomComponentStateValue( isRecordTableCellFocusActiveComponentState, recordTableId, ); @@ -22,7 +22,7 @@ export const RecordTableCellPortals = () => { <> - {isRecordTableFocusActive && ( + {isRecordTableCellFocusActive && ( <> {isDefined(recordTableCellFocusId) && ( diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/internal/__tests__/useCloseRecordTableCellInGroup.test.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/internal/__tests__/useCloseRecordTableCellInGroup.test.tsx index 4b85aa1c73..7b7e9bee4e 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/internal/__tests__/useCloseRecordTableCellInGroup.test.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/internal/__tests__/useCloseRecordTableCellInGroup.test.tsx @@ -73,14 +73,14 @@ describe('useCloseRecordTableCellInGroup', () => { it('should work as expected', async () => { const { result } = renderHook( () => { - const currentTableCellInEditModePosition = useAtomComponentStateValue( + const recordTableCellEditModePosition = useAtomComponentStateValue( recordTableCellEditModePositionComponentState, recordTableId, ); return { ...useCloseRecordTableCellInGroup(), ...useDragSelect(), - currentTableCellInEditModePosition, + recordTableCellEditModePosition, }; }, { @@ -93,6 +93,6 @@ describe('useCloseRecordTableCellInGroup', () => { }); expect(result.current.isDragSelectionStartEnabled()).toBe(true); - expect(result.current.currentTableCellInEditModePosition).toBe(null); + expect(result.current.recordTableCellEditModePosition).toBe(null); }); }); diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/internal/__tests__/useCloseRecordTableCellNoGroup.test.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/internal/__tests__/useCloseRecordTableCellNoGroup.test.tsx index 401c7b482c..106633da6c 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/internal/__tests__/useCloseRecordTableCellNoGroup.test.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/internal/__tests__/useCloseRecordTableCellNoGroup.test.tsx @@ -74,7 +74,7 @@ describe('useCloseRecordTableCellNoGroup', () => { it('should work as expected', async () => { const { result } = renderHook( () => { - const currentTableCellInEditModePosition = useAtomComponentStateValue( + const recordTableCellEditModePosition = useAtomComponentStateValue( recordTableCellEditModePositionComponentState, recordTableId, ); @@ -82,7 +82,7 @@ describe('useCloseRecordTableCellNoGroup', () => { return { ...useCloseRecordTableCellNoGroup(), ...useDragSelect(), - currentTableCellInEditModePosition, + recordTableCellEditModePosition, }; }, { @@ -95,6 +95,6 @@ describe('useCloseRecordTableCellNoGroup', () => { }); expect(result.current.isDragSelectionStartEnabled()).toBe(true); - expect(result.current.currentTableCellInEditModePosition).toBe(null); + expect(result.current.recordTableCellEditModePosition).toBe(null); }); }); diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/useCurrentlyFocusedRecordTableCellFocusId.ts b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/useCurrentlyFocusedRecordTableCellFocusId.ts index 5192692ffe..ee8bd4a671 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/useCurrentlyFocusedRecordTableCellFocusId.ts +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/useCurrentlyFocusedRecordTableCellFocusId.ts @@ -7,15 +7,15 @@ import { isDefined } from 'twenty-shared/utils'; export const useCurrentlyFocusedRecordTableCellFocusId = () => { const { recordTableId } = useRecordTableContextOrThrow(); - const focusPosition = useAtomComponentStateValue( + const recordTableFocusPosition = useAtomComponentStateValue( recordTableFocusPositionComponentState, recordTableId, ); - return isDefined(focusPosition) + return isDefined(recordTableFocusPosition) ? getRecordTableCellFocusId({ recordTableId, - cellPosition: focusPosition, + cellPosition: recordTableFocusPosition, }) : null; }; diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/useMoveHoverToCurrentCell.ts b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/useMoveHoverToCurrentCell.ts index 5c2a69603d..ed6e5f2c30 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/useMoveHoverToCurrentCell.ts +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/useMoveHoverToCurrentCell.ts @@ -9,7 +9,7 @@ import { useAtomComponentSelectorCallbackState } from '@/ui/utilities/state/jota import { useSetAtomComponentState } from '@/ui/utilities/state/jotai/hooks/useSetAtomComponentState'; export const useMoveHoverToCurrentCell = (recordTableId: string) => { - const setHoverPosition = useSetAtomComponentState( + const setRecordTableHoverPosition = useSetAtomComponentState( recordTableHoverPositionComponentState, recordTableId, ); @@ -26,10 +26,10 @@ export const useMoveHoverToCurrentCell = (recordTableId: string) => { const cellInEditMode = store.get(isSomeCellInEditMode); if (!cellInEditMode) { - setHoverPosition(cellPosition); + setRecordTableHoverPosition(cellPosition); } }, - [store, isSomeCellInEditMode, setHoverPosition], + [store, isSomeCellInEditMode, setRecordTableHoverPosition], ); return { moveHoverToCurrentCell }; diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/useOpenRecordTableCell.ts b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/useOpenRecordTableCell.ts index b8f01967bd..3f5de32e1c 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/useOpenRecordTableCell.ts +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/useOpenRecordTableCell.ts @@ -42,7 +42,7 @@ export const useOpenRecordTableCell = (recordTableId: string) => { const { scopeInstanceId } = useRecordFieldsScopeContextOrThrow(); const store = useStore(); - const setCurrentTableCellInEditModePosition = useSetAtomComponentState( + const setRecordTableCellEditModePosition = useSetAtomComponentState( recordTableCellEditModePositionComponentState, recordTableId, ); @@ -66,7 +66,7 @@ export const useOpenRecordTableCell = (recordTableId: string) => { const { unfocusRecordTableRow } = useFocusedRecordTableRow(recordTableId); - const setIsRowFocusActive = useSetAtomComponentState( + const setIsRecordTableRowFocusActive = useSetAtomComponentState( isRecordTableRowFocusActiveComponentState, recordTableId, ); @@ -129,7 +129,7 @@ export const useOpenRecordTableCell = (recordTableId: string) => { focusRecordTableCell(cellPosition); - setIsRowFocusActive(false); + setIsRecordTableRowFocusActive(false); setDragSelectionStartEnabled(false); @@ -139,7 +139,7 @@ export const useOpenRecordTableCell = (recordTableId: string) => { prefix: RECORD_TABLE_CELL_INPUT_ID_PREFIX, }); - setCurrentTableCellInEditModePosition(cellPosition); + setRecordTableCellEditModePosition(cellPosition); initDraftValue({ value: initialValue, @@ -166,10 +166,10 @@ export const useOpenRecordTableCell = (recordTableId: string) => { [ deactivateRecordTableRow, focusRecordTableCell, - setIsRowFocusActive, + setIsRecordTableRowFocusActive, setDragSelectionStartEnabled, openFieldInput, - setCurrentTableCellInEditModePosition, + setRecordTableCellEditModePosition, initDraftValue, toggleClickOutside, setActiveDropdownFocusIdAndMemorizePrevious, diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-footer/hooks/useAggregateRecordsForRecordTableColumnFooter.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-footer/hooks/useAggregateRecordsForRecordTableColumnFooter.tsx index b38c182b29..74b9579530 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-footer/hooks/useAggregateRecordsForRecordTableColumnFooter.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-footer/hooks/useAggregateRecordsForRecordTableColumnFooter.tsx @@ -65,27 +65,27 @@ export const useAggregateRecordsForRecordTableColumnFooter = ( // TODO: This shouldn't be set with impossible values, // see problem with view id not being set early enoughby Effect component in context store, // This happens here when switching from a view to another. - const aggregateOperationForViewFieldWithProbableImpossibleValues = - useAtomFamilyStateValue(viewFieldAggregateOperationState, { viewFieldId }); + const viewFieldAggregateOperation = useAtomFamilyStateValue( + viewFieldAggregateOperationState, + { viewFieldId }, + ); const isAggregateOperationImpossibleForDateField = isDefined(fieldMetadataItem) && isFieldMetadataDateKind(fieldMetadataItem.type) && - isDefined(aggregateOperationForViewFieldWithProbableImpossibleValues) && - (aggregateOperationForViewFieldWithProbableImpossibleValues === - AggregateOperations.MIN || - aggregateOperationForViewFieldWithProbableImpossibleValues === - AggregateOperations.MAX); + isDefined(viewFieldAggregateOperation) && + (viewFieldAggregateOperation === AggregateOperations.MIN || + viewFieldAggregateOperation === AggregateOperations.MAX); const aggregateOperationForViewField: | ExtendedAggregateOperations | undefined | null = isAggregateOperationImpossibleForDateField ? convertAggregateOperationToExtendedAggregateOperation( - aggregateOperationForViewFieldWithProbableImpossibleValues, + viewFieldAggregateOperation, fieldMetadataItem.type, ) - : aggregateOperationForViewFieldWithProbableImpossibleValues; + : viewFieldAggregateOperation; const fieldName = fieldMetadataItem?.name; diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-footer/hooks/useViewFieldAggregateOperation.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-footer/hooks/useViewFieldAggregateOperation.tsx index 2bb366eaf7..4e701b394f 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-footer/hooks/useViewFieldAggregateOperation.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-footer/hooks/useViewFieldAggregateOperation.tsx @@ -52,13 +52,13 @@ export const useViewFieldAggregateOperation = () => { refreshCoreViewsByObjectMetadataId(objectMetadataItem.id); }; - const currentViewFieldAggregateOperation = useAtomFamilyStateValue( + const viewFieldAggregateOperation = useAtomFamilyStateValue( viewFieldAggregateOperationState, { viewFieldId: currentViewField?.id ?? '' }, ); return { updateViewFieldAggregateOperation, - currentViewFieldAggregateOperation, + currentViewFieldAggregateOperation: viewFieldAggregateOperation, }; }; diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeaderAddColumnButton.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeaderAddColumnButton.tsx index ddca7ebf69..a8c5719ca6 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeaderAddColumnButton.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeaderAddColumnButton.tsx @@ -62,24 +62,25 @@ const StyledDropdownContainer = styled.div` export const RecordTableHeaderAddColumnButton = () => { const theme = useTheme(); - const isFirstRowActive = useAtomComponentFamilyStateValue( + const isRecordTableRowActive = useAtomComponentFamilyStateValue( isRecordTableRowActiveComponentFamilyState, 0, ); - const isFirstRowFocused = useAtomComponentFamilyStateValue( + const isRecordTableRowFocused = useAtomComponentFamilyStateValue( isRecordTableRowFocusedComponentFamilyState, 0, ); - const isRowFocusActive = useAtomComponentStateValue( + const isRecordTableRowFocusActive = useAtomComponentStateValue( isRecordTableRowFocusActiveComponentState, ); const isFirstRowActiveOrFocused = - isFirstRowActive || (isFirstRowFocused && isRowFocusActive); + isRecordTableRowActive || + (isRecordTableRowFocused && isRecordTableRowFocusActive); - const isScrolledVertically = useAtomComponentStateValue( + const isRecordTableScrolledVertically = useAtomComponentStateValue( isRecordTableScrolledVerticallyComponentState, ); @@ -88,7 +89,9 @@ export const RecordTableHeaderAddColumnButton = () => { ); const shouldDisplayBorderBottom = - hasRecordGroups || !isFirstRowActiveOrFocused || isScrolledVertically; + hasRecordGroups || + !isFirstRowActiveOrFocused || + isRecordTableScrolledVertically; const { visibleRecordFields } = useRecordTableContextOrThrow(); diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeaderCell.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeaderCell.tsx index 23372b4182..fadbc5ed89 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeaderCell.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeaderCell.tsx @@ -28,39 +28,42 @@ export const RecordTableHeaderCell = ({ }: RecordTableHeaderCellProps) => { const { objectMetadataItem } = useRecordTableContextOrThrow(); - const isFirstRowActive = useAtomComponentFamilyStateValue( + const isRecordTableRowActive = useAtomComponentFamilyStateValue( isRecordTableRowActiveComponentFamilyState, 0, ); - const isFirstRowFocused = useAtomComponentFamilyStateValue( + const isRecordTableRowFocused = useAtomComponentFamilyStateValue( isRecordTableRowFocusedComponentFamilyState, 0, ); - const isScrolledVertically = useAtomComponentStateValue( + const isRecordTableScrolledVertically = useAtomComponentStateValue( isRecordTableScrolledVerticallyComponentState, ); - const isRowFocusActive = useAtomComponentStateValue( + const isRecordTableRowFocusActive = useAtomComponentStateValue( isRecordTableRowFocusActiveComponentState, ); const isFirstRowActiveOrFocused = - isFirstRowActive || (isFirstRowFocused && isRowFocusActive); + isRecordTableRowActive || + (isRecordTableRowFocused && isRecordTableRowFocusActive); const hasRecordGroups = useAtomComponentSelectorValue( hasRecordGroupsComponentSelector, ); - const resizedFieldMetadataItemId = useAtomComponentStateValue( + const resizedFieldMetadataId = useAtomComponentStateValue( resizedFieldMetadataIdComponentState, ); - const isResizingAnyColumn = isDefined(resizedFieldMetadataItemId); + const isResizingAnyColumn = isDefined(resizedFieldMetadataId); const shouldDisplayBorderBottom = - hasRecordGroups || !isFirstRowActiveOrFocused || isScrolledVertically; + hasRecordGroups || + !isFirstRowActiveOrFocused || + isRecordTableScrolledVertically; return ( { } }; - const isFirstRowActive = useAtomComponentFamilyStateValue( + const isRecordTableRowActive = useAtomComponentFamilyStateValue( isRecordTableRowActiveComponentFamilyState, 0, ); - const isFirstRowFocused = useAtomComponentFamilyStateValue( + const isRecordTableRowFocused = useAtomComponentFamilyStateValue( isRecordTableRowFocusedComponentFamilyState, 0, ); - const isRowFocusActive = useAtomComponentStateValue( + const isRecordTableRowFocusActive = useAtomComponentStateValue( isRecordTableRowFocusActiveComponentState, ); const isFirstRowActiveOrFocused = - isFirstRowActive || (isFirstRowFocused && isRowFocusActive); + isRecordTableRowActive || + (isRecordTableRowFocused && isRecordTableRowFocusActive); - const isScrolledVertically = useAtomComponentStateValue( + const isRecordTableScrolledVertically = useAtomComponentStateValue( isRecordTableScrolledVerticallyComponentState, ); @@ -110,7 +111,9 @@ export const RecordTableHeaderCheckboxColumn = () => { ); const shouldDisplayBorderBottom = - hasRecordGroups || !isFirstRowActiveOrFocused || isScrolledVertically; + hasRecordGroups || + !isFirstRowActiveOrFocused || + isRecordTableScrolledVertically; return ( { const { theme } = useContext(ThemeContext); - const isScrolledVertically = useAtomComponentStateValue( + const isRecordTableScrolledVertically = useAtomComponentStateValue( isRecordTableScrolledVerticallyComponentState, ); - const isRowFocusActive = useAtomComponentStateValue( + const isRecordTableRowFocusActive = useAtomComponentStateValue( isRecordTableRowFocusActiveComponentState, ); - const isFirstRowActive = useAtomComponentFamilyStateValue( + const isRecordTableRowActive = useAtomComponentFamilyStateValue( isRecordTableRowActiveComponentFamilyState, 0, ); - const isFirstRowFocused = useAtomComponentFamilyStateValue( + const isRecordTableRowFocused = useAtomComponentFamilyStateValue( isRecordTableRowFocusedComponentFamilyState, 0, ); const isFirstRowActiveOrFocused = - isFirstRowActive || (isFirstRowFocused && isRowFocusActive); + isRecordTableRowActive || + (isRecordTableRowFocused && isRecordTableRowFocusActive); const hasRecordGroups = useAtomComponentSelectorValue( hasRecordGroupsComponentSelector, ); const shouldDisplayBorderBottom = - hasRecordGroups || !isFirstRowActiveOrFocused || isScrolledVertically; + hasRecordGroups || + !isFirstRowActiveOrFocused || + isRecordTableScrolledVertically; return ( { const [iconIsVisible, setIconIsVisible] = useState(false); - const isFirstRowActive = useAtomComponentFamilyStateValue( + const isRecordTableRowActive = useAtomComponentFamilyStateValue( isRecordTableRowActiveComponentFamilyState, 0, ); - const isFirstRowFocused = useAtomComponentFamilyStateValue( + const isRecordTableRowFocused = useAtomComponentFamilyStateValue( isRecordTableRowFocusedComponentFamilyState, 0, ); const recordField = getVisibleFieldWithLowestPosition(visibleRecordFields); - const isScrolledVertically = useAtomComponentStateValue( + const isRecordTableScrolledVertically = useAtomComponentStateValue( isRecordTableScrolledVerticallyComponentState, ); - const isRowFocusActive = useAtomComponentStateValue( + const isRecordTableRowFocusActive = useAtomComponentStateValue( isRecordTableRowFocusActiveComponentState, ); const isFirstRowActiveOrFocused = - isFirstRowActive || (isFirstRowFocused && isRowFocusActive); + isRecordTableRowActive || + (isRecordTableRowFocused && isRecordTableRowFocusActive); const hasRecordGroups = useAtomComponentSelectorValue( hasRecordGroupsComponentSelector, ); - const resizedFieldMetadataItemId = useAtomComponentStateValue( + const resizedFieldMetadataId = useAtomComponentStateValue( resizedFieldMetadataIdComponentState, ); - const isResizingAnyColumn = isDefined(resizedFieldMetadataItemId); + const isResizingAnyColumn = isDefined(resizedFieldMetadataId); const shouldDisplayBorderBottom = - hasRecordGroups || !isFirstRowActiveOrFocused || isScrolledVertically; + hasRecordGroups || + !isFirstRowActiveOrFocused || + isRecordTableScrolledVertically; if (!recordField) { return <>; diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeaderFirstScrollableCell.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeaderFirstScrollableCell.tsx index 0ea7dbfcb0..5c3cccf538 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeaderFirstScrollableCell.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeaderFirstScrollableCell.tsx @@ -25,12 +25,12 @@ export const RecordTableHeaderFirstScrollableCell = () => { const { objectMetadataItem, visibleRecordFields } = useRecordTableContextOrThrow(); - const isFirstRowActive = useAtomComponentFamilyStateValue( + const isRecordTableRowActive = useAtomComponentFamilyStateValue( isRecordTableRowActiveComponentFamilyState, 0, ); - const isFirstRowFocused = useAtomComponentFamilyStateValue( + const isRecordTableRowFocused = useAtomComponentFamilyStateValue( isRecordTableRowFocusedComponentFamilyState, 0, ); @@ -44,12 +44,13 @@ export const RecordTableHeaderFirstScrollableCell = () => { ), )[0] as RecordField | undefined; - const isRowFocusActive = useAtomComponentStateValue( + const isRecordTableRowFocusActive = useAtomComponentStateValue( isRecordTableRowFocusActiveComponentState, ); const isFirstRowActiveOrFocused = - isFirstRowActive || (isFirstRowFocused && isRowFocusActive); + isRecordTableRowActive || + (isRecordTableRowFocused && isRecordTableRowFocusActive); const isRecordTableScrolledVertically = useAtomComponentStateValue( isRecordTableScrolledVerticallyComponentState, @@ -89,18 +90,16 @@ export const RecordTableHeaderFirstScrollableCell = () => { const zIndex = hasRecordGroups ? zIndexWithGroups : zIndexWithoutGroups; - const isScrolledVertically = useAtomComponentStateValue( - isRecordTableScrolledVerticallyComponentState, - ); - const shouldDisplayBorderBottom = - hasRecordGroups || !isFirstRowActiveOrFocused || isScrolledVertically; + hasRecordGroups || + !isFirstRowActiveOrFocused || + isRecordTableScrolledVertically; - const resizedFieldMetadataItemId = useAtomComponentStateValue( + const resizedFieldMetadataId = useAtomComponentStateValue( resizedFieldMetadataIdComponentState, ); - const isResizingAnyColumn = isDefined(resizedFieldMetadataItemId); + const isResizingAnyColumn = isDefined(resizedFieldMetadataId); if (!recordField) { return <>; diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeaderLastEmptyColumn.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeaderLastEmptyColumn.tsx index 12677f879b..c931425cb9 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeaderLastEmptyColumn.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeaderLastEmptyColumn.tsx @@ -30,33 +30,36 @@ const StyledLastColumnHeader = styled.div<{ `; export const RecordTableHeaderLastEmptyColumn = () => { - const isScrolledVertically = useAtomComponentStateValue( + const isRecordTableScrolledVertically = useAtomComponentStateValue( isRecordTableScrolledVerticallyComponentState, ); - const isFirstRowActive = useAtomComponentFamilyStateValue( + const isRecordTableRowActive = useAtomComponentFamilyStateValue( isRecordTableRowActiveComponentFamilyState, 0, ); - const isFirstRowFocused = useAtomComponentFamilyStateValue( + const isRecordTableRowFocused = useAtomComponentFamilyStateValue( isRecordTableRowFocusedComponentFamilyState, 0, ); - const isRowFocusActive = useAtomComponentStateValue( + const isRecordTableRowFocusActive = useAtomComponentStateValue( isRecordTableRowFocusActiveComponentState, ); const isFirstRowActiveOrFocused = - isFirstRowActive || (isFirstRowFocused && isRowFocusActive); + isRecordTableRowActive || + (isRecordTableRowFocused && isRecordTableRowFocusActive); const hasRecordGroups = useAtomComponentSelectorValue( hasRecordGroupsComponentSelector, ); const shouldDisplayBorderBottom = - hasRecordGroups || !isFirstRowActiveOrFocused || isScrolledVertically; + hasRecordGroups || + !isFirstRowActiveOrFocused || + isRecordTableScrolledVertically; return ( { setDragSelectionStartEnabled(false); - setResizedFieldMetadataItemId(recordField?.fieldMetadataItemId); + setResizedFieldMetadataId(recordField?.fieldMetadataItemId); }; return ( diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-header/hooks/useResizeTableHeader.ts b/packages/twenty-front/src/modules/object-record/record-table/record-table-header/hooks/useResizeTableHeader.ts index 4bfcc1aead..0502642d51 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-header/hooks/useResizeTableHeader.ts +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-header/hooks/useResizeTableHeader.ts @@ -46,11 +46,11 @@ export const useResizeTableHeader = () => { number | null >(null); - const [resizedFieldMetadataItemId, setResizedFieldMetadataItemId] = + const [resizedFieldMetadataId, setResizedFieldMetadataId] = useAtomComponentState(resizedFieldMetadataIdComponentState); const recordField = visibleRecordFields.find( - findByProperty('fieldMetadataItemId', resizedFieldMetadataItemId), + findByProperty('fieldMetadataItemId', resizedFieldMetadataId), ); const { resetTableRowSelection } = useResetTableRowSelection(); @@ -144,7 +144,7 @@ export const useResizeTableHeader = () => { const handleResizeHandlerEnd = useCallback(async () => { throwIfNotDefined(recordField, 'recordField'); - if (!resizedFieldMetadataItemId) return; + if (!resizedFieldMetadataId) return; const currentResizeFieldOffset = store.get(resizeFieldOffset); @@ -157,10 +157,10 @@ export const useResizeTableHeader = () => { store.set(resizeFieldOffset, 0); setInitialPointerPositionX(null); - setResizedFieldMetadataItemId(null); + setResizedFieldMetadataId(null); if (nextWidth !== recordField.size) { - const updatedRecordField = updateRecordField(resizedFieldMetadataItemId, { + const updatedRecordField = updateRecordField(resizedFieldMetadataId, { size: nextWidth, }); @@ -170,17 +170,17 @@ export const useResizeTableHeader = () => { setDragSelectionStartEnabled(true); }, [ saveRecordFields, - resizedFieldMetadataItemId, + resizedFieldMetadataId, resizeFieldOffset, store, - setResizedFieldMetadataItemId, + setResizedFieldMetadataId, updateRecordField, setDragSelectionStartEnabled, recordField, ]); useTrackPointer({ - shouldTrackPointer: resizedFieldMetadataItemId !== null, + shouldTrackPointer: resizedFieldMetadataId !== null, onMouseDown: handleResizeHandlerStart, onMouseMove: handleResizeHandlerMove, onMouseUp: handleResizeHandlerEnd, diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-row/components/RecordTableDraggableTrFirstRowOfGroup.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-row/components/RecordTableDraggableTrFirstRowOfGroup.tsx index 27bbd89834..67bd892780 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-row/components/RecordTableDraggableTrFirstRowOfGroup.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-row/components/RecordTableDraggableTrFirstRowOfGroup.tsx @@ -33,7 +33,7 @@ export const RecordTableDraggableTrFirstRowOfGroup = ({ const { isSecondaryDragged } = useIsTableRowSecondaryDragged(recordId); - const isScrolledVertically = useAtomComponentStateValue( + const isRecordTableScrolledVertically = useAtomComponentStateValue( isRecordTableScrolledVerticallyComponentState, ); @@ -68,7 +68,7 @@ export const RecordTableDraggableTrFirstRowOfGroup = ({ data-selectable-id={recordId} onClick={onClick} isFirstRowOfGroup={true} - isScrolledVertically={isScrolledVertically} + isScrolledVertically={isRecordTableScrolledVertically} > { - const isScrolledVertically = useAtomComponentStateValue( + const isRecordTableScrolledVertically = useAtomComponentStateValue( isRecordTableScrolledVerticallyComponentState, ); @@ -48,7 +48,7 @@ export const RecordTableFirstRowOfGroup = forwardRef< data-next-row-active-or-focused={isNextRowActiveOrFocused} // eslint-disable-next-line react/jsx-props-no-spreading {...props} - isScrolledVertically={isScrolledVertically} + isScrolledVertically={isRecordTableScrolledVertically} isFirstRowOfGroup={true} > {children} diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-row/components/RecordTableRow.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-row/components/RecordTableRow.tsx index efdd244ed6..df39625f70 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-row/components/RecordTableRow.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-row/components/RecordTableRow.tsx @@ -29,11 +29,11 @@ export const RecordTableRow = ({ }: RecordTableRowProps) => { const { recordTableId } = useRecordTableContextOrThrow(); - const isFocused = useAtomComponentFamilyStateValue( + const isRecordTableRowFocused = useAtomComponentFamilyStateValue( isRecordTableRowFocusedComponentFamilyState, rowIndexForFocus, ); - const isRowFocusActive = useAtomComponentStateValue( + const isRecordTableRowFocusActive = useAtomComponentStateValue( isRecordTableRowFocusActiveComponentState, recordTableId, ); @@ -44,7 +44,7 @@ export const RecordTableRow = ({ draggableIndex={rowIndexForDrag} focusIndex={rowIndexForFocus} > - {isRowFocusActive && isFocused && ( + {isRecordTableRowFocusActive && isRecordTableRowFocused && ( <> @@ -62,7 +62,7 @@ export const RecordTableRow = ({ draggableIndex={rowIndexForDrag} focusIndex={rowIndexForFocus} > - {isRowFocusActive && isFocused && ( + {isRecordTableRowFocusActive && isRecordTableRowFocused && ( <> diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-row/components/RecordTableTr.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-row/components/RecordTableTr.tsx index c63ec91c61..a2cfdf4e20 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-row/components/RecordTableTr.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-row/components/RecordTableTr.tsx @@ -41,17 +41,18 @@ export const RecordTableTr = forwardRef( ) => { const { objectMetadataItem } = useRecordTableContextOrThrow(); - const currentRowSelected = useAtomComponentFamilyStateValue( + const isRowSelected = useAtomComponentFamilyStateValue( isRowSelectedComponentFamilyState, recordId, ); - const isActive = useAtomComponentFamilyStateValue( + const isRecordTableRowActive = useAtomComponentFamilyStateValue( isRecordTableRowActiveComponentFamilyState, focusIndex, ); - const isNextRowActive = useAtomComponentFamilyStateValue( + // eslint-disable-next-line twenty/matching-state-variable + const isNextRecordTableRowActive = useAtomComponentFamilyStateValue( isRecordTableRowActiveComponentFamilyState, focusIndex + 1, ); @@ -66,23 +67,25 @@ export const RecordTableTr = forwardRef( nextRecordId ?? '', ); - const isFocused = useAtomComponentFamilyStateValue( + const isRecordTableRowFocused = useAtomComponentFamilyStateValue( isRecordTableRowFocusedComponentFamilyState, focusIndex, ); - const isRowFocusActive = useAtomComponentStateValue( + const isRecordTableRowFocusActive = useAtomComponentStateValue( isRecordTableRowFocusActiveComponentState, ); - const isNextRowFocused = useAtomComponentFamilyStateValue( + // eslint-disable-next-line twenty/matching-state-variable + const isNextRecordTableRowFocused = useAtomComponentFamilyStateValue( isRecordTableRowFocusedComponentFamilyState, focusIndex + 1, ); const isNextRowActiveOrFocused = !isNextRecordIdFirstOfGroup && - ((isRowFocusActive && isNextRowFocused) || isNextRowActive); + ((isRecordTableRowFocusActive && isNextRecordTableRowFocused) || + isNextRecordTableRowActive); const isRecordReadOnly = useIsRecordReadOnly({ recordId, @@ -99,7 +102,7 @@ export const RecordTableTr = forwardRef( objectNameSingular: objectMetadataItem.nameSingular, }) + recordId, objectNameSingular: objectMetadataItem.nameSingular, - isSelected: currentRowSelected, + isSelected: isRowSelected, isRecordReadOnly, }} > @@ -109,13 +112,17 @@ export const RecordTableTr = forwardRef( data-virtualized-id={recordId} isDragging={isDragging} ref={ref} - data-active={isActive} - data-focused={isRowFocusActive && isFocused && !isActive} + data-active={isRecordTableRowActive} + data-focused={ + isRecordTableRowFocusActive && + isRecordTableRowFocused && + !isRecordTableRowActive + } data-next-row-active-or-focused={isNextRowActiveOrFocused} isNextRowActiveOrFocused={isNextRowActiveOrFocused} focusIndex={focusIndex} - isFocused={isFocused} - isRowFocusActive={isRowFocusActive} + isFocused={isRecordTableRowFocused} + isRowFocusActive={isRecordTableRowFocusActive} recordId={recordId} // eslint-disable-next-line react/jsx-props-no-spreading {...props} @@ -128,8 +135,12 @@ export const RecordTableTr = forwardRef( data-virtualized-id={recordId} isDragging={isDragging} ref={ref} - data-active={isActive} - data-focused={isRowFocusActive && isFocused && !isActive} + data-active={isRecordTableRowActive} + data-focused={ + isRecordTableRowFocusActive && + isRecordTableRowFocused && + !isRecordTableRowActive + } data-next-row-active-or-focused={isNextRowActiveOrFocused} // eslint-disable-next-line react/jsx-props-no-spreading {...props} diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-row/hooks/useIsRecordSecondaryDragged.ts b/packages/twenty-front/src/modules/object-record/record-table/record-table-row/hooks/useIsRecordSecondaryDragged.ts index dcde8188ad..b056697688 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-row/hooks/useIsRecordSecondaryDragged.ts +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-row/hooks/useIsRecordSecondaryDragged.ts @@ -3,12 +3,12 @@ import { useAtomComponentFamilyStateValue } from '@/ui/utilities/state/jotai/hoo import { type Nullable } from 'twenty-shared/types'; export const useIsTableRowSecondaryDragged = (recordId: Nullable) => { - const isSecondaryDragged = useAtomComponentFamilyStateValue( + const isRecordIdSecondaryDragMultiple = useAtomComponentFamilyStateValue( isRecordIdSecondaryDragMultipleComponentFamilyState, { recordId: recordId ?? '' }, ); return { - isSecondaryDragged, + isSecondaryDragged: isRecordIdSecondaryDragMultiple, }; }; diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-row/hooks/useRecordTableRowHotkeys.ts b/packages/twenty-front/src/modules/object-record/record-table/record-table-row/hooks/useRecordTableRowHotkeys.ts index 8b995b8d1f..3c7d2f1480 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-row/hooks/useRecordTableRowHotkeys.ts +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-row/hooks/useRecordTableRowHotkeys.ts @@ -27,7 +27,7 @@ export const useRecordTableRowHotkeys = (focusId: string) => { const { activateRecordTableRow } = useActiveRecordTableRow(); - const setIsRowFocusActive = useSetAtomComponentState( + const setIsRecordTableRowFocusActive = useSetAtomComponentState( isRecordTableRowFocusActiveComponentState, ); @@ -61,7 +61,7 @@ export const useRecordTableRowHotkeys = (focusId: string) => { }; const handleEnterRow = () => { - setIsRowFocusActive(false); + setIsRecordTableRowFocusActive(false); const cellPosition = { row: rowIndex, column: 0, diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-section/components/RecordTableRecordGroupSection.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-section/components/RecordTableRecordGroupSection.tsx index 1e95e404d8..afe9ff1169 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-section/components/RecordTableRecordGroupSection.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-section/components/RecordTableRecordGroupSection.tsx @@ -123,7 +123,7 @@ export const RecordTableRecordGroupSection = () => { const { objectMetadataItem } = useRecordTableContextOrThrow(); - const recordGroup = useAtomFamilyStateValue( + const recordGroupDefinition = useAtomFamilyStateValue( recordGroupDefinitionFamilyState, currentRecordGroupId, ); @@ -131,7 +131,7 @@ export const RecordTableRecordGroupSection = () => { const recordIndexAggregateDisplayValueForGroupValue = useAtomComponentFamilyStateValue( recordIndexAggregateDisplayValueForGroupValueComponentFamilyState, - { groupValue: recordGroup?.value ?? '' }, + { groupValue: recordGroupDefinition?.value ?? '' }, ); const recordIndexAggregateDisplayLabel = useAtomComponentStateValue( @@ -187,7 +187,7 @@ export const RecordTableRecordGroupSection = () => { return null; } - if (!isDefined(recordGroup)) { + if (!isDefined(recordGroupDefinition)) { return null; } @@ -209,16 +209,16 @@ export const RecordTableRecordGroupSection = () => { > { const currentRecordGroupId = useCurrentRecordGroupId(); - const recordGroup = useAtomFamilyStateValue( + const recordGroupDefinition = useAtomFamilyStateValue( recordGroupDefinitionFamilyState, currentRecordGroupId, ); - const mainGroupByFieldMetadata = useAtomComponentStateValue( + const recordIndexGroupFieldMetadataItem = useAtomComponentStateValue( recordIndexGroupFieldMetadataItemComponentState, ); @@ -29,7 +29,7 @@ export const RecordTableRecordGroupSectionAddNew = () => { }); const fieldMetadataItem = objectMetadataItem.fields.find( - (field) => field.id === mainGroupByFieldMetadata?.id, + (field) => field.id === recordIndexGroupFieldMetadataItem?.id, ); const objectPermissions = useObjectPermissionsForObject( @@ -53,7 +53,7 @@ export const RecordTableRecordGroupSectionAddNew = () => { createNewIndexRecord({ position: 'last', - [fieldMetadataItem.name]: recordGroup?.value, + [fieldMetadataItem.name]: recordGroupDefinition?.value, }); }} /> diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-section/components/RecordTableRecordGroupSectionLoadMore.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-section/components/RecordTableRecordGroupSectionLoadMore.tsx index 9429f3e43d..57a9c6ff1b 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-section/components/RecordTableRecordGroupSectionLoadMore.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-section/components/RecordTableRecordGroupSectionLoadMore.tsx @@ -15,16 +15,17 @@ export const RecordTableRecordGroupSectionLoadMore = () => { const { fetchMoreRecordsLazy } = useRecordIndexTableFetchMore(objectNameSingular); - const hasFetchedAllRecords = useAtomComponentFamilyStateValue( - recordIndexHasFetchedAllRecordsByGroupComponentState, - currentRecordGroupId, - ); + const recordIndexHasFetchedAllRecordsByGroup = + useAtomComponentFamilyStateValue( + recordIndexHasFetchedAllRecordsByGroupComponentState, + currentRecordGroupId, + ); const handleLoadMore = () => { fetchMoreRecordsLazy(); }; - if (hasFetchedAllRecords) { + if (recordIndexHasFetchedAllRecordsByGroup) { return null; } diff --git a/packages/twenty-front/src/modules/object-record/record-table/virtualization/components/RecordTableRowVirtualizedContainer.tsx b/packages/twenty-front/src/modules/object-record/record-table/virtualization/components/RecordTableRowVirtualizedContainer.tsx index d52bc4ff8f..57fbc26a6b 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/virtualization/components/RecordTableRowVirtualizedContainer.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/virtualization/components/RecordTableRowVirtualizedContainer.tsx @@ -26,7 +26,7 @@ type RecordTableRowVirtualizedContainerProps = { export const RecordTableRowVirtualizedContainer = ({ virtualIndex, }: RecordTableRowVirtualizedContainerProps) => { - const realIndex = useAtomComponentFamilyStateValue( + const realIndexByVirtualIndex = useAtomComponentFamilyStateValue( realIndexByVirtualIndexComponentFamilyState, { virtualIndex }, ); @@ -36,12 +36,16 @@ export const RecordTableRowVirtualizedContainer = ({ totalNumberOfRecordsToVirtualizeComponentState, ) ?? 0; - if (!isDefined(realIndex) || realIndex >= totalNumberOfRecordsToVirtualize) { + if ( + !isDefined(realIndexByVirtualIndex) || + realIndexByVirtualIndex >= totalNumberOfRecordsToVirtualize + ) { return null; } const pixelsFromTop = - realIndex * (RECORD_TABLE_ROW_HEIGHT + 1) + (RECORD_TABLE_ROW_HEIGHT + 1); + realIndexByVirtualIndex * (RECORD_TABLE_ROW_HEIGHT + 1) + + (RECORD_TABLE_ROW_HEIGHT + 1); return ( )} - + ); }; diff --git a/packages/twenty-front/src/modules/object-record/record-table/virtualization/components/RecordTableRowVirtualizedDebugRowHelper.tsx b/packages/twenty-front/src/modules/object-record/record-table/virtualization/components/RecordTableRowVirtualizedDebugRowHelper.tsx index 11c269d475..863501ba49 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/virtualization/components/RecordTableRowVirtualizedDebugRowHelper.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/virtualization/components/RecordTableRowVirtualizedDebugRowHelper.tsx @@ -46,26 +46,26 @@ type RecordTableRowVirtualizedDebugRowHelperProps = { export const RecordTableRowVirtualizedDebugRowHelper = ({ virtualIndex, }: RecordTableRowVirtualizedDebugRowHelperProps) => { - const realIndex = useAtomComponentFamilyStateValue( + const realIndexByVirtualIndex = useAtomComponentFamilyStateValue( realIndexByVirtualIndexComponentFamilyState, { virtualIndex }, ); const recordId = useAtomComponentFamilySelectorValue( recordIdByRealIndexComponentFamilySelector, - realIndex, + realIndexByVirtualIndex, ); const dataLoadingStatus = useAtomComponentFamilySelectorValue( dataLoadingStatusByRealIndexComponentFamilySelector, - realIndex, + realIndexByVirtualIndex, ); const pixelsFromTop = - (realIndex ?? 0) * (RECORD_TABLE_ROW_HEIGHT + 1) + + (realIndexByVirtualIndex ?? 0) * (RECORD_TABLE_ROW_HEIGHT + 1) + (RECORD_TABLE_ROW_HEIGHT + 1); - const record = useAtomFamilyStateValue( + const recordStore = useAtomFamilyStateValue( recordStoreFamilyState, recordId ?? '', ); @@ -73,16 +73,21 @@ export const RecordTableRowVirtualizedDebugRowHelper = ({ const labelIdentifierFieldMetadataItem = getLabelIdentifierFieldMetadataItem(objectMetadataItem); - const labelIdentifier = isDefined(record) - ? getLabelIdentifierFieldValue(record, labelIdentifierFieldMetadataItem) + const labelIdentifier = isDefined(recordStore) + ? getLabelIdentifierFieldValue( + recordStore, + labelIdentifierFieldMetadataItem, + ) : '-'; - const position = record?.position; + const position = recordStore?.position; return ( virtual :{virtualIndex} - real :{realIndex} + + real :{realIndexByVirtualIndex} + pos :{position} px: diff --git a/packages/twenty-front/src/modules/object-record/record-table/virtualization/components/RecordTableRowVirtualizedFullData.tsx b/packages/twenty-front/src/modules/object-record/record-table/virtualization/components/RecordTableRowVirtualizedFullData.tsx index 8f7c40a17c..8f8e0bab73 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/virtualization/components/RecordTableRowVirtualizedFullData.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/virtualization/components/RecordTableRowVirtualizedFullData.tsx @@ -27,12 +27,12 @@ export const RecordTableRowVirtualizedFullData = ({ }: RecordTableRowVirtualizedFullDataProps) => { const { recordTableId } = useRecordTableContextOrThrow(); - const isFocused = useAtomComponentFamilyStateValue( + const isRecordTableRowFocused = useAtomComponentFamilyStateValue( isRecordTableRowFocusedComponentFamilyState, realIndex, ); - const isRowFocusActive = useAtomComponentStateValue( + const isRecordTableRowFocusActive = useAtomComponentStateValue( isRecordTableRowFocusActiveComponentState, recordTableId, ); @@ -52,7 +52,7 @@ export const RecordTableRowVirtualizedFullData = ({ draggableIndex={realIndex} focusIndex={realIndex} > - {isRowFocusActive && isFocused && ( + {isRecordTableRowFocusActive && isRecordTableRowFocused && ( <> diff --git a/packages/twenty-front/src/modules/object-record/record-table/virtualization/components/RecordTableVirtualizedInitialDataLoadEffect.tsx b/packages/twenty-front/src/modules/object-record/record-table/virtualization/components/RecordTableVirtualizedInitialDataLoadEffect.tsx index 29a0473355..3c95c5e65e 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/virtualization/components/RecordTableVirtualizedInitialDataLoadEffect.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/virtualization/components/RecordTableVirtualizedInitialDataLoadEffect.tsx @@ -45,8 +45,8 @@ export const RecordTableVirtualizedInitialDataLoadEffect = () => { ] = useAtomComponentState(lastContextStoreVirtualizedViewIdComponentState); const [ - lastContextStoreVisibleRecordFields, - setLastContextStoreVisibleRecordFields, + lastContextStoreVirtualizedVisibleRecordFields, + setLastContextStoreVirtualizedVisibleRecordFields, ] = useAtomComponentState( lastContextStoreVirtualizedVisibleRecordFieldsComponentState, ); @@ -69,7 +69,7 @@ export const RecordTableVirtualizedInitialDataLoadEffect = () => { setLastContextStoreVirtualizedViewId(currentView?.id ?? null); setLastRecordTableQueryIdentifier(queryIdentifier); - setLastContextStoreVisibleRecordFields(visibleRecordFields); + setLastContextStoreVirtualizedVisibleRecordFields(visibleRecordFields); await triggerInitialRecordTableDataLoad(); } else if ( @@ -80,13 +80,13 @@ export const RecordTableVirtualizedInitialDataLoadEffect = () => { await triggerInitialRecordTableDataLoad(); } else if ( - JSON.stringify(lastContextStoreVisibleRecordFields) !== + JSON.stringify(lastContextStoreVirtualizedVisibleRecordFields) !== JSON.stringify(visibleRecordFields) ) { - const lastFields = lastContextStoreVisibleRecordFields || []; + const lastFields = lastContextStoreVirtualizedVisibleRecordFields || []; const currentFields = visibleRecordFields || []; - setLastContextStoreVisibleRecordFields(visibleRecordFields); + setLastContextStoreVirtualizedVisibleRecordFields(visibleRecordFields); const shouldRefetchData = currentFields.length > lastFields.length; @@ -107,8 +107,8 @@ export const RecordTableVirtualizedInitialDataLoadEffect = () => { currentView, lastContextStoreVirtualizedViewId, setLastContextStoreVirtualizedViewId, - lastContextStoreVisibleRecordFields, - setLastContextStoreVisibleRecordFields, + lastContextStoreVirtualizedVisibleRecordFields, + setLastContextStoreVirtualizedVisibleRecordFields, visibleRecordFields, ]); diff --git a/packages/twenty-front/src/modules/object-record/record-title-cell/components/RecordTitleCellTextFieldDisplay.tsx b/packages/twenty-front/src/modules/object-record/record-title-cell/components/RecordTitleCellTextFieldDisplay.tsx index bf8acf8b68..739e31eb55 100644 --- a/packages/twenty-front/src/modules/object-record/record-title-cell/components/RecordTitleCellTextFieldDisplay.tsx +++ b/packages/twenty-front/src/modules/object-record/record-title-cell/components/RecordTitleCellTextFieldDisplay.tsx @@ -39,10 +39,10 @@ export const RecordTitleCellSingleTextDisplayMode = ({ }) => { const { recordId, fieldDefinition } = useContext(FieldContext); - const recordValue = useAtomFamilyStateValue(recordStoreFamilyState, recordId); + const recordStore = useAtomFamilyStateValue(recordStoreFamilyState, recordId); const isEmpty = - recordValue?.[fieldDefinition.metadata.fieldName]?.trim() === ''; + recordStore?.[fieldDefinition.metadata.fieldName]?.trim() === ''; const { openRecordTitleCell } = useRecordTitleCell(); @@ -65,7 +65,7 @@ export const RecordTitleCellSingleTextDisplayMode = ({ ) : ( diff --git a/packages/twenty-front/src/modules/object-record/record-title-cell/components/RecordTitleCellUuidFieldDisplay.tsx b/packages/twenty-front/src/modules/object-record/record-title-cell/components/RecordTitleCellUuidFieldDisplay.tsx index edd2e3821f..0e2a66effc 100644 --- a/packages/twenty-front/src/modules/object-record/record-title-cell/components/RecordTitleCellUuidFieldDisplay.tsx +++ b/packages/twenty-front/src/modules/object-record/record-title-cell/components/RecordTitleCellUuidFieldDisplay.tsx @@ -27,9 +27,9 @@ export const RecordTitleCellUuidFieldDisplay = ({ }) => { const { recordId, fieldDefinition } = useContext(FieldContext); - const recordValue = useAtomFamilyStateValue(recordStoreFamilyState, recordId); + const recordStore = useAtomFamilyStateValue(recordStoreFamilyState, recordId); - const uuidValue = recordValue?.[fieldDefinition.metadata.fieldName] ?? ''; + const uuidValue = recordStore?.[fieldDefinition.metadata.fieldName] ?? ''; return ( diff --git a/packages/twenty-front/src/modules/object-record/spreadsheet-import/hooks/useOpenObjectRecordsSpreadsheetImportDialog.ts b/packages/twenty-front/src/modules/object-record/spreadsheet-import/hooks/useOpenObjectRecordsSpreadsheetImportDialog.ts index 8b83a5f0c5..d7c325d097 100644 --- a/packages/twenty-front/src/modules/object-record/spreadsheet-import/hooks/useOpenObjectRecordsSpreadsheetImportDialog.ts +++ b/packages/twenty-front/src/modules/object-record/spreadsheet-import/hooks/useOpenObjectRecordsSpreadsheetImportDialog.ts @@ -26,7 +26,7 @@ export const useOpenObjectRecordsSpreadsheetImportDialog = ( objectNameSingular, }); - const setCreatedRecordsProgress = useSetAtomState( + const setSpreadsheetImportCreatedRecordsProgress = useSetAtomState( spreadsheetImportCreatedRecordsProgressState, ); @@ -41,7 +41,7 @@ export const useOpenObjectRecordsSpreadsheetImportDialog = ( objectNameSingular, recordGqlFields, mutationBatchSize: SPREADSHEET_IMPORT_CREATE_RECORDS_BATCH_SIZE, - setBatchedRecordsCount: setCreatedRecordsProgress, + setBatchedRecordsCount: setSpreadsheetImportCreatedRecordsProgress, abortController, }); diff --git a/packages/twenty-front/src/modules/page-layout/components/PageLayoutGridLayout.tsx b/packages/twenty-front/src/modules/page-layout/components/PageLayoutGridLayout.tsx index fb610670bf..8676845ced 100644 --- a/packages/twenty-front/src/modules/page-layout/components/PageLayoutGridLayout.tsx +++ b/packages/twenty-front/src/modules/page-layout/components/PageLayoutGridLayout.tsx @@ -104,11 +104,11 @@ export const PageLayoutGridLayout = ({ tabId }: PageLayoutGridLayoutProps) => { pageLayoutCurrentBreakpointComponentState, ); - const setDraggingWidgetId = useSetAtomComponentState( + const setPageLayoutDraggingWidgetId = useSetAtomComponentState( pageLayoutDraggingWidgetIdComponentState, ); - const setResizingWidgetId = useSetAtomComponentState( + const setPageLayoutResizingWidgetId = useSetAtomComponentState( pageLayoutResizingWidgetIdComponentState, ); @@ -137,7 +137,7 @@ export const PageLayoutGridLayout = ({ tabId }: PageLayoutGridLayoutProps) => { const pageLayoutDraggedArea = useAtomComponentStateValue( pageLayoutDraggedAreaComponentState, ); - const draggingWidgetId = useAtomComponentStateValue( + const pageLayoutDraggingWidgetId = useAtomComponentStateValue( pageLayoutDraggingWidgetIdComponentState, ); @@ -167,7 +167,7 @@ export const PageLayoutGridLayout = ({ tabId }: PageLayoutGridLayoutProps) => { [activeTabWidgets, hasPendingPlaceholder], ); - const shouldDisableTransitions = !isDefined(draggingWidgetId); + const shouldDisableTransitions = !isDefined(pageLayoutDraggingWidgetId); return ( { } resizeHandles={['n', 's', 'e', 'w', 'ne', 'nw', 'se', 'sw']} onDragStart={(_layout, _oldItem, newItem) => { - setDraggingWidgetId(newItem.i); + setPageLayoutDraggingWidgetId(newItem.i); }} onDragStop={() => { - setDraggingWidgetId(null); + setPageLayoutDraggingWidgetId(null); }} onResizeStart={(_layout, _oldItem, newItem) => { - setResizingWidgetId(newItem.i); + setPageLayoutResizingWidgetId(newItem.i); }} onResizeStop={() => { - setResizingWidgetId(null); + setPageLayoutResizingWidgetId(null); }} onLayoutChange={handleLayoutChangeWithoutPendingPlaceholder} onBreakpointChange={(newBreakpoint) => diff --git a/packages/twenty-front/src/modules/page-layout/components/PageLayoutInitializationQueryEffect.tsx b/packages/twenty-front/src/modules/page-layout/components/PageLayoutInitializationQueryEffect.tsx index 5985a0d8df..8376e0dab8 100644 --- a/packages/twenty-front/src/modules/page-layout/components/PageLayoutInitializationQueryEffect.tsx +++ b/packages/twenty-front/src/modules/page-layout/components/PageLayoutInitializationQueryEffect.tsx @@ -22,9 +22,8 @@ export const PageLayoutInitializationQueryEffect = ({ pageLayoutId, onInitialized, }: PageLayoutInitializationQueryEffectProps) => { - const [isInitialized, setIsInitialized] = useAtomComponentState( - pageLayoutIsInitializedComponentState, - ); + const [pageLayoutIsInitialized, setPageLayoutIsInitialized] = + useAtomComponentState(pageLayoutIsInitializedComponentState); const basePageLayout = useBasePageLayout(pageLayoutId); @@ -70,17 +69,17 @@ export const PageLayoutInitializationQueryEffect = ({ ); useEffect(() => { - if (!isInitialized && isDefined(pageLayout)) { + if (!pageLayoutIsInitialized && isDefined(pageLayout)) { initializePageLayout(pageLayout); onInitialized?.(pageLayout); - setIsInitialized(true); + setPageLayoutIsInitialized(true); } }, [ initializePageLayout, - isInitialized, + pageLayoutIsInitialized, pageLayout, onInitialized, - setIsInitialized, + setPageLayoutIsInitialized, ]); return null; diff --git a/packages/twenty-front/src/modules/page-layout/components/PageLayoutRelationWidgetsSyncEffect.tsx b/packages/twenty-front/src/modules/page-layout/components/PageLayoutRelationWidgetsSyncEffect.tsx index e51a3be83e..9119a0f9c7 100644 --- a/packages/twenty-front/src/modules/page-layout/components/PageLayoutRelationWidgetsSyncEffect.tsx +++ b/packages/twenty-front/src/modules/page-layout/components/PageLayoutRelationWidgetsSyncEffect.tsx @@ -25,7 +25,7 @@ export const PageLayoutRelationWidgetsSyncEffect = ({ }: PageLayoutRelationWidgetsSyncEffectProps) => { const { targetRecordIdentifier, layoutType } = useLayoutRenderingContext(); - const isInitialized = useAtomComponentStateValue( + const pageLayoutIsInitialized = useAtomComponentStateValue( pageLayoutIsInitializedComponentState, ); @@ -75,7 +75,7 @@ export const PageLayoutRelationWidgetsSyncEffect = ({ ); useEffect(() => { - if (!isInitialized) { + if (!pageLayoutIsInitialized) { return; } @@ -97,7 +97,7 @@ export const PageLayoutRelationWidgetsSyncEffect = ({ }, [ basePageLayout, boxedRelationFieldMetadataItems, - isInitialized, + pageLayoutIsInitialized, layoutType, syncPageLayoutWithRelationWidgets, ]); diff --git a/packages/twenty-front/src/modules/page-layout/components/PageLayoutRendererContent.tsx b/packages/twenty-front/src/modules/page-layout/components/PageLayoutRendererContent.tsx index adb32ce234..682726aa26 100644 --- a/packages/twenty-front/src/modules/page-layout/components/PageLayoutRendererContent.tsx +++ b/packages/twenty-front/src/modules/page-layout/components/PageLayoutRendererContent.tsx @@ -63,7 +63,7 @@ export const PageLayoutRendererContent = () => { const { createPageLayoutTab } = useCreatePageLayoutTab(currentPageLayout?.id); const { reorderTabs } = useReorderPageLayoutTabs(currentPageLayout?.id ?? ''); - const setTabSettingsOpenTabId = useSetAtomComponentState( + const setPageLayoutTabSettingsOpenTabId = useSetAtomComponentState( pageLayoutTabSettingsOpenTabIdComponentState, ); const { navigatePageLayoutCommandMenu } = useNavigatePageLayoutCommandMenu(); @@ -79,7 +79,7 @@ export const PageLayoutRendererContent = () => { shouldEnableTabEditingFeatures(currentPageLayout.type) ? () => { const newTabId = createPageLayoutTab(t`Untitled`); - setTabSettingsOpenTabId(newTabId); + setPageLayoutTabSettingsOpenTabId(newTabId); navigatePageLayoutCommandMenu({ commandMenuPage: CommandMenuPages.PageLayoutTabSettings, focusTitleInput: true, diff --git a/packages/twenty-front/src/modules/page-layout/components/PageLayoutTabList.tsx b/packages/twenty-front/src/modules/page-layout/components/PageLayoutTabList.tsx index bbb26a2ae0..6be8c2a20f 100644 --- a/packages/twenty-front/src/modules/page-layout/components/PageLayoutTabList.tsx +++ b/packages/twenty-front/src/modules/page-layout/components/PageLayoutTabList.tsx @@ -143,7 +143,7 @@ export const PageLayoutTabList = ({ const { openDropdown } = useOpenDropdown(); const { toggleClickOutside } = useClickOutsideListener(dropdownId); - const setIsTabDragging = useSetAtomComponentState( + const setIsPageLayoutTabDragging = useSetAtomComponentState( isPageLayoutTabDraggingComponentState, componentInstanceId, ); @@ -188,9 +188,9 @@ export const PageLayoutTabList = ({ }; const handleDragStart = useCallback(() => { - setIsTabDragging(true); + setIsPageLayoutTabDragging(true); toggleClickOutside(false); - }, [setIsTabDragging, toggleClickOutside]); + }, [setIsPageLayoutTabDragging, toggleClickOutside]); const handleDragEnd = useCallback( (result, provided) => { @@ -199,7 +199,7 @@ export const PageLayoutTabList = ({ PAGE_LAYOUT_TAB_LIST_DROPPABLE_IDS.OVERFLOW_TABS; if (!droppedInOverflow) { - setIsTabDragging(false); + setIsPageLayoutTabDragging(false); } toggleClickOutside(true); @@ -216,18 +216,24 @@ export const PageLayoutTabList = ({ }); } }, - [onReorder, setIsTabDragging, toggleClickOutside, openDropdown, dropdownId], + [ + onReorder, + setIsPageLayoutTabDragging, + toggleClickOutside, + openDropdown, + dropdownId, + ], ); const isPageLayoutInEditMode = useAtomComponentStateValue( isPageLayoutInEditModeComponentState, pageLayoutId, ); - const tabSettingsOpenTabId = useAtomComponentStateValue( + const pageLayoutTabSettingsOpenTabId = useAtomComponentStateValue( pageLayoutTabSettingsOpenTabIdComponentState, pageLayoutId, ); - const setTabSettingsOpenTabId = useSetAtomComponentState( + const setPageLayoutTabSettingsOpenTabId = useSetAtomComponentState( pageLayoutTabSettingsOpenTabIdComponentState, pageLayoutId, ); @@ -235,16 +241,16 @@ export const PageLayoutTabList = ({ const openTabSettings = useCallback( (tabId: string) => { - setTabSettingsOpenTabId(tabId); + setPageLayoutTabSettingsOpenTabId(tabId); navigatePageLayoutCommandMenu({ commandMenuPage: CommandMenuPages.PageLayoutTabSettings, resetNavigationStack: true, }); }, - [setTabSettingsOpenTabId, navigatePageLayoutCommandMenu], + [setPageLayoutTabSettingsOpenTabId, navigatePageLayoutCommandMenu], ); - const isTabSettingsOpen = isDefined(tabSettingsOpenTabId); + const isTabSettingsOpen = isDefined(pageLayoutTabSettingsOpenTabId); const handleSelectTab = useCallback( (tabId: string) => { diff --git a/packages/twenty-front/src/modules/page-layout/components/PageLayoutTabListReorderableOverflowDropdown.tsx b/packages/twenty-front/src/modules/page-layout/components/PageLayoutTabListReorderableOverflowDropdown.tsx index 8445e7ed28..89bdd818db 100644 --- a/packages/twenty-front/src/modules/page-layout/components/PageLayoutTabListReorderableOverflowDropdown.tsx +++ b/packages/twenty-front/src/modules/page-layout/components/PageLayoutTabListReorderableOverflowDropdown.tsx @@ -81,17 +81,17 @@ export const PageLayoutTabListReorderableOverflowDropdown = ({ const shouldShowEditButton = isPageLayoutInEditMode && shouldEnableTabEditingFeatures(pageLayoutType); - const isTabDragging = useAtomComponentStateValue( + const isPageLayoutTabDragging = useAtomComponentStateValue( isPageLayoutTabDraggingComponentState, instanceId, ); - const setIsTabDragging = useSetAtomComponentState( + const setIsPageLayoutTabDragging = useSetAtomComponentState( isPageLayoutTabDraggingComponentState, instanceId, ); - const setTabSettingsOpenTabId = useSetAtomComponentState( + const setPageLayoutTabSettingsOpenTabId = useSetAtomComponentState( pageLayoutTabSettingsOpenTabIdComponentState, pageLayoutId, ); @@ -99,19 +99,19 @@ export const PageLayoutTabListReorderableOverflowDropdown = ({ const { navigatePageLayoutCommandMenu } = useNavigatePageLayoutCommandMenu(); const handleClose = () => { - if (!isTabDragging) { + if (!isPageLayoutTabDragging) { onClose(); } }; const handleTabSelect = (tabId: string) => { - setIsTabDragging(false); + setIsPageLayoutTabDragging(false); onSelect(tabId); handleClose(); }; const handleEditClick = (tabId: string) => { - setTabSettingsOpenTabId(tabId); + setPageLayoutTabSettingsOpenTabId(tabId); navigatePageLayoutCommandMenu({ commandMenuPage: CommandMenuPages.PageLayoutTabSettings, }); diff --git a/packages/twenty-front/src/modules/page-layout/components/PageLayoutTabListReorderableTab.tsx b/packages/twenty-front/src/modules/page-layout/components/PageLayoutTabListReorderableTab.tsx index f8d4ea6a55..796910d163 100644 --- a/packages/twenty-front/src/modules/page-layout/components/PageLayoutTabListReorderableTab.tsx +++ b/packages/twenty-front/src/modules/page-layout/components/PageLayoutTabListReorderableTab.tsx @@ -27,11 +27,11 @@ export const PageLayoutTabListReorderableTab = ({ disabled, onSelect, }: PageLayoutTabListReorderableTabProps) => { - const tabSettingsOpenTabId = useAtomComponentStateValue( + const pageLayoutTabSettingsOpenTabId = useAtomComponentStateValue( pageLayoutTabSettingsOpenTabIdComponentState, ); - const isSettingsOpenForThisTab = tabSettingsOpenTabId === tab.id; + const isSettingsOpenForThisTab = pageLayoutTabSettingsOpenTabId === tab.id; return ( {(draggableProvided, draggableSnapshot) => ( diff --git a/packages/twenty-front/src/modules/page-layout/components/PageLayoutVerticalListEditor.tsx b/packages/twenty-front/src/modules/page-layout/components/PageLayoutVerticalListEditor.tsx index de9bdbc177..2cc8bc9bb7 100644 --- a/packages/twenty-front/src/modules/page-layout/components/PageLayoutVerticalListEditor.tsx +++ b/packages/twenty-front/src/modules/page-layout/components/PageLayoutVerticalListEditor.tsx @@ -61,17 +61,17 @@ export const PageLayoutVerticalListEditor = ({ isInRightDrawer, }); - const setDraggingWidgetId = useSetAtomComponentState( + const setPageLayoutDraggingWidgetId = useSetAtomComponentState( pageLayoutDraggingWidgetIdComponentState, ); return ( { - setDraggingWidgetId(result.draggableId); + setPageLayoutDraggingWidgetId(result.draggableId); }} onDragEnd={(result) => { - setDraggingWidgetId(null); + setPageLayoutDraggingWidgetId(null); onReorder(result); }} > diff --git a/packages/twenty-front/src/modules/page-layout/hooks/__tests__/useCreatePageLayoutTab.test.tsx b/packages/twenty-front/src/modules/page-layout/hooks/__tests__/useCreatePageLayoutTab.test.tsx index e4e7142b94..0369934760 100644 --- a/packages/twenty-front/src/modules/page-layout/hooks/__tests__/useCreatePageLayoutTab.test.tsx +++ b/packages/twenty-front/src/modules/page-layout/hooks/__tests__/useCreatePageLayoutTab.test.tsx @@ -174,13 +174,13 @@ describe('useCreatePageLayoutTab', () => { const { result } = renderHook( () => { - const getActiveTabId = useAtomComponentStateValue( + const activeTabId = useAtomComponentStateValue( activeTabIdComponentState, `${PAGE_LAYOUT_TEST_INSTANCE_ID}-tab-list`, ); return { createTab: useCreatePageLayoutTab(PAGE_LAYOUT_TEST_INSTANCE_ID), - activeTabId: getActiveTabId, + activeTabId: activeTabId, }; }, { diff --git a/packages/twenty-front/src/modules/page-layout/hooks/useDuplicatePageLayoutTab.ts b/packages/twenty-front/src/modules/page-layout/hooks/useDuplicatePageLayoutTab.ts index 8dcab8c72f..3a9d4c8599 100644 --- a/packages/twenty-front/src/modules/page-layout/hooks/useDuplicatePageLayoutTab.ts +++ b/packages/twenty-front/src/modules/page-layout/hooks/useDuplicatePageLayoutTab.ts @@ -43,7 +43,7 @@ export const useDuplicatePageLayoutTab = (pageLayoutIdFromProps?: string) => { tabListInstanceId, ); - const setTabSettingsOpenTabId = useSetAtomComponentState( + const setPageLayoutTabSettingsOpenTabId = useSetAtomComponentState( pageLayoutTabSettingsOpenTabIdComponentState, pageLayoutId, ); @@ -128,7 +128,7 @@ export const useDuplicatePageLayoutTab = (pageLayoutIdFromProps?: string) => { setActiveTabId(newTabId); - setTabSettingsOpenTabId(newTabId); + setPageLayoutTabSettingsOpenTabId(newTabId); navigatePageLayoutCommandMenu({ commandMenuPage: CommandMenuPages.PageLayoutTabSettings, @@ -144,7 +144,7 @@ export const useDuplicatePageLayoutTab = (pageLayoutIdFromProps?: string) => { pageLayoutCurrentLayouts, pageLayoutDraft, setActiveTabId, - setTabSettingsOpenTabId, + setPageLayoutTabSettingsOpenTabId, store, ], ); diff --git a/packages/twenty-front/src/modules/page-layout/hooks/useDuplicatePageLayoutWidget.ts b/packages/twenty-front/src/modules/page-layout/hooks/useDuplicatePageLayoutWidget.ts index c8ba2ccf9b..35af390b28 100644 --- a/packages/twenty-front/src/modules/page-layout/hooks/useDuplicatePageLayoutWidget.ts +++ b/packages/twenty-front/src/modules/page-layout/hooks/useDuplicatePageLayoutWidget.ts @@ -34,7 +34,7 @@ export const useDuplicatePageLayoutWidget = ( pageLayoutId, ); - const setEditingWidgetId = useSetAtomComponentState( + const setPageLayoutEditingWidgetId = useSetAtomComponentState( pageLayoutEditingWidgetIdComponentState, pageLayoutId, ); @@ -115,7 +115,7 @@ export const useDuplicatePageLayoutWidget = ( tabs: addWidgetToTab(prev.tabs, sourceTab.id, clonedWidget), })); - setEditingWidgetId(newWidgetId); + setPageLayoutEditingWidgetId(newWidgetId); const { scrollWrapperElement } = getScrollWrapperElement(); @@ -139,7 +139,7 @@ export const useDuplicatePageLayoutWidget = ( [ pageLayoutCurrentLayoutsState, pageLayoutDraftState, - setEditingWidgetId, + setPageLayoutEditingWidgetId, getScrollWrapperElement, store, ], diff --git a/packages/twenty-front/src/modules/page-layout/widgets/components/WidgetRenderer.tsx b/packages/twenty-front/src/modules/page-layout/widgets/components/WidgetRenderer.tsx index 1f9d584fc3..126d60f58e 100644 --- a/packages/twenty-front/src/modules/page-layout/widgets/components/WidgetRenderer.tsx +++ b/packages/twenty-front/src/modules/page-layout/widgets/components/WidgetRenderer.tsx @@ -54,23 +54,23 @@ export const WidgetRenderer = ({ widget }: WidgetRendererProps) => { isPageLayoutInEditModeComponentState, ); - const draggingWidgetId = useAtomComponentStateValue( + const pageLayoutDraggingWidgetId = useAtomComponentStateValue( pageLayoutDraggingWidgetIdComponentState, ); - const resizingWidgetId = useAtomComponentStateValue( + const pageLayoutResizingWidgetId = useAtomComponentStateValue( pageLayoutResizingWidgetIdComponentState, ); - const currentlyEditingWidgetId = useAtomComponentStateValue( + const pageLayoutEditingWidgetId = useAtomComponentStateValue( pageLayoutEditingWidgetIdComponentState, ); - const isEditing = currentlyEditingWidgetId === widget.id; + const isEditing = pageLayoutEditingWidgetId === widget.id; - const isDragging = draggingWidgetId === widget.id; + const isDragging = pageLayoutDraggingWidgetId === widget.id; - const isResizing = resizingWidgetId === widget.id; + const isResizing = pageLayoutResizingWidgetId === widget.id; const { hasAccess, restriction } = useWidgetPermissions(widget); @@ -109,17 +109,17 @@ export const WidgetRenderer = ({ widget }: WidgetRendererProps) => { deletePageLayoutWidget(widget.id); }; - const setIsHovered = useSetAtomComponentFamilyState( + const setWidgetCardHovered = useSetAtomComponentFamilyState( widgetCardHoveredComponentFamilyState, widget.id, ); const handleMouseEnter = () => { - setIsHovered(true); + setWidgetCardHovered(true); }; const handleMouseLeave = () => { - setIsHovered(false); + setWidgetCardHovered(false); }; const variant = getWidgetCardVariant({ diff --git a/packages/twenty-front/src/modules/page-layout/widgets/field/components/FieldWidgetCellEditModePortal.tsx b/packages/twenty-front/src/modules/page-layout/widgets/field/components/FieldWidgetCellEditModePortal.tsx index 40b6e49d0a..a4ae0c8249 100644 --- a/packages/twenty-front/src/modules/page-layout/widgets/field/components/FieldWidgetCellEditModePortal.tsx +++ b/packages/twenty-front/src/modules/page-layout/widgets/field/components/FieldWidgetCellEditModePortal.tsx @@ -24,12 +24,14 @@ export const FieldWidgetCellEditModePortal = ({ }: FieldWidgetCellEditModePortalProps) => { const { isEditing } = useIsFieldWidgetEditing(); - const setIsHovered = useSetAtomComponentState(fieldWidgetHoverComponentState); + const setFieldWidgetHover = useSetAtomComponentState( + fieldWidgetHoverComponentState, + ); const { closeFieldInput } = useOpenFieldWidgetFieldInputEditMode(); const handleCloseEditMode = () => { - setIsHovered(false); + setFieldWidgetHover(false); closeFieldInput(); }; diff --git a/packages/twenty-front/src/modules/page-layout/widgets/field/components/FieldWidgetDisplay.tsx b/packages/twenty-front/src/modules/page-layout/widgets/field/components/FieldWidgetDisplay.tsx index 2f96994672..1ade1d33ba 100644 --- a/packages/twenty-front/src/modules/page-layout/widgets/field/components/FieldWidgetDisplay.tsx +++ b/packages/twenty-front/src/modules/page-layout/widgets/field/components/FieldWidgetDisplay.tsx @@ -41,7 +41,7 @@ export const FieldWidgetDisplay = ({ }: FieldWidgetDisplayProps) => { const widget = useCurrentWidget(); - const [isHovered, setIsHovered] = useAtomComponentState( + const [fieldWidgetHover, setFieldWidgetHover] = useAtomComponentState( fieldWidgetHoverComponentState, ); @@ -63,8 +63,8 @@ export const FieldWidgetDisplay = ({ objectMetadataId: objectMetadataItem.id, }); - const handleMouseEnter = () => setIsHovered(true); - const handleMouseLeave = () => setIsHovered(false); + const handleMouseEnter = () => setFieldWidgetHover(true); + const handleMouseLeave = () => setFieldWidgetHover(false); return ( @@ -116,7 +116,7 @@ export const FieldWidgetDisplay = ({ fieldMetadataItem={fieldMetadataItem} recordId={recordId} instanceId={instanceId} - isHovered={isHovered} + isHovered={fieldWidgetHover} onMouseLeave={handleMouseLeave} /> { - const allDraftGroups = useAtomComponentStateValue( + const fieldsWidgetGroupsDraft = useAtomComponentStateValue( fieldsWidgetGroupsDraftComponentState, pageLayoutId, ); const draftGroups = useMemo( - () => allDraftGroups[widgetId] ?? [], - [allDraftGroups, widgetId], + () => fieldsWidgetGroupsDraft[widgetId] ?? [], + [fieldsWidgetGroupsDraft, widgetId], ); return { draftGroups }; diff --git a/packages/twenty-front/src/modules/page-layout/widgets/fields/hooks/useFieldsWidgetGroupsForDisplay.ts b/packages/twenty-front/src/modules/page-layout/widgets/fields/hooks/useFieldsWidgetGroupsForDisplay.ts index e3a1428bd2..e94a46649d 100644 --- a/packages/twenty-front/src/modules/page-layout/widgets/fields/hooks/useFieldsWidgetGroupsForDisplay.ts +++ b/packages/twenty-front/src/modules/page-layout/widgets/fields/hooks/useFieldsWidgetGroupsForDisplay.ts @@ -22,7 +22,7 @@ export const useFieldsWidgetGroupsForDisplay = ({ isPageLayoutInEditModeComponentState, ); - const allDraftGroups = useAtomComponentStateValue( + const fieldsWidgetGroupsDraft = useAtomComponentStateValue( fieldsWidgetGroupsDraftComponentState, ); @@ -31,7 +31,7 @@ export const useFieldsWidgetGroupsForDisplay = ({ objectNameSingular, }); - const draftGroupsForWidget = allDraftGroups[widgetId]; + const draftGroupsForWidget = fieldsWidgetGroupsDraft[widgetId]; const hasDraftGroups = isDefined(draftGroupsForWidget) && draftGroupsForWidget.length > 0; diff --git a/packages/twenty-front/src/modules/page-layout/widgets/graph/components/GraphWidgetLegend.tsx b/packages/twenty-front/src/modules/page-layout/widgets/graph/components/GraphWidgetLegend.tsx index 89568cbb0b..6b62e06948 100644 --- a/packages/twenty-front/src/modules/page-layout/widgets/graph/components/GraphWidgetLegend.tsx +++ b/packages/twenty-front/src/modules/page-layout/widgets/graph/components/GraphWidgetLegend.tsx @@ -152,13 +152,12 @@ export const GraphWidgetLegend = ({ const isInteractive = !isPageLayoutInEditMode; - const setHighlightedLegendId = useSetAtomComponentState( + const setGraphWidgetHighlightedLegendId = useSetAtomComponentState( graphWidgetHighlightedLegendIdComponentState, ); - const [hiddenLegendIds, setHiddenLegendIds] = useAtomComponentState( - graphWidgetHiddenLegendIdsComponentState, - ); + const [graphWidgetHiddenLegendIds, setGraphWidgetHiddenLegendIds] = + useAtomComponentState(graphWidgetHiddenLegendIdsComponentState); const itemIds = items.map((item) => item.id); @@ -167,22 +166,22 @@ export const GraphWidgetLegend = ({ isInteractive, }); - if (isPageLayoutInEditMode && hiddenLegendIds.length > 0) { - setHiddenLegendIds([]); + if (isPageLayoutInEditMode && graphWidgetHiddenLegendIds.length > 0) { + setGraphWidgetHiddenLegendIds([]); } const handleLegendItemMouseEnter = (itemId: string) => { if (!isInteractive) { return; } - setHighlightedLegendId(itemId); + setGraphWidgetHighlightedLegendId(itemId); }; const handleLegendItemMouseLeave = () => { if (!isInteractive) { return; } - setHighlightedLegendId(null); + setGraphWidgetHighlightedLegendId(null); }; const shouldShowLegend = show && items.length > 1; @@ -302,7 +301,9 @@ export const GraphWidgetLegend = ({ centered={!needsPagination} > {visibleItems.map((item) => { - const isHidden = hiddenLegendIds.includes(item.id); + const isHidden = graphWidgetHiddenLegendIds.includes( + item.id, + ); return ( { const theme = useTheme(); - const highlightedLegendId = useAtomComponentStateValue( + const graphWidgetHighlightedLegendId = useAtomComponentStateValue( graphWidgetHighlightedLegendIdComponentState, ); @@ -225,7 +225,7 @@ export const BarChart = ({ groupMode={groupMode} hasNegativeValues={hasNegativeValues} hasNoData={hasNoData} - highlightedLegendId={highlightedLegendId} + highlightedLegendId={graphWidgetHighlightedLegendId} hoveredSlice={hoveredSlice} innerHeight={innerHeight} innerWidth={innerWidth} diff --git a/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetBarChart/components/BarChartTooltip.tsx b/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetBarChart/components/BarChartTooltip.tsx index 6a2ed94877..a6589ffe6b 100644 --- a/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetBarChart/components/BarChartTooltip.tsx +++ b/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetBarChart/components/BarChartTooltip.tsx @@ -30,7 +30,7 @@ export const BarChartTooltip = ({ onMouseEnter, onMouseLeave, }: BarChartTooltipProps) => { - const tooltipState = useAtomComponentStateValue( + const graphWidgetBarTooltip = useAtomComponentStateValue( graphWidgetBarTooltipComponentState, ); @@ -41,27 +41,27 @@ export const BarChartTooltip = ({ const handleTooltipClick: (() => void) | undefined = isDefined(onSliceClick) ? () => { - if (isDefined(tooltipState)) { - onSliceClick(tooltipState.slice); + if (isDefined(graphWidgetBarTooltip)) { + onSliceClick(graphWidgetBarTooltip.slice); } } : undefined; - const tooltipData = !isDefined(tooltipState) + const tooltipData = !isDefined(graphWidgetBarTooltip) ? null : getBarChartTooltipData({ - slice: tooltipState.slice, + slice: graphWidgetBarTooltip.slice, dataByIndexValue, enrichedKeys, formatOptions, }); - const reference = !isDefined(tooltipState) + const reference = !isDefined(graphWidgetBarTooltip) ? null : createVirtualElementFromContainerOffset( containerElement, - tooltipState.offsetLeft, - tooltipState.offsetTop, + graphWidgetBarTooltip.offsetLeft, + graphWidgetBarTooltip.offsetTop, ); return ( diff --git a/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetBarChart/components/GraphWidgetBarChart.tsx b/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetBarChart/components/GraphWidgetBarChart.tsx index bd671acb89..b4dc7ab728 100644 --- a/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetBarChart/components/GraphWidgetBarChart.tsx +++ b/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetBarChart/components/GraphWidgetBarChart.tsx @@ -91,30 +91,32 @@ export const GraphWidgetBarChart = ({ const [chartHeight, setChartHeight] = useState(0); const containerRef = useRef(null); - const setActiveBarTooltip = useSetAtomComponentState( + const setGraphWidgetBarTooltip = useSetAtomComponentState( graphWidgetBarTooltipComponentState, ); - const setHoveredSliceIndex = useSetAtomComponentState( + const setGraphWidgetHoveredSliceIndex = useSetAtomComponentState( graphWidgetHoveredSliceIndexComponentState, ); - const hoveredSliceIndexValue = useAtomComponentStateValue( + const graphWidgetHoveredSliceIndex = useAtomComponentStateValue( graphWidgetHoveredSliceIndexComponentState, ); - const draggingWidgetId = useAtomComponentStateValue( + const pageLayoutDraggingWidgetId = useAtomComponentStateValue( pageLayoutDraggingWidgetIdComponentState, ); - const resizingWidgetId = useAtomComponentStateValue( + const pageLayoutResizingWidgetId = useAtomComponentStateValue( pageLayoutResizingWidgetIdComponentState, ); const isSidePanelAnimating = useAtomStateValue(isSidePanelAnimatingState); const isLayoutAnimating = - isSidePanelAnimating || draggingWidgetId === id || resizingWidgetId === id; + isSidePanelAnimating || + pageLayoutDraggingWidgetId === id || + pageLayoutResizingWidgetId === id; const allowDataTransitions = !isLayoutAnimating; @@ -157,8 +159,8 @@ export const GraphWidgetBarChart = ({ const hasClickableItems = isDefined(onSliceClick); const hideTooltip = () => { - setActiveBarTooltip(null); - setHoveredSliceIndex(null); + setGraphWidgetBarTooltip(null); + setGraphWidgetHoveredSliceIndex(null); }; const debouncedHideTooltip = useDebouncedCallback(hideTooltip, 300); @@ -172,8 +174,8 @@ export const GraphWidgetBarChart = ({ const handleSliceHover = (sliceData: BarChartSliceHoverData | null) => { if (isDefined(sliceData)) { debouncedHideTooltip.cancel(); - setHoveredSliceIndex(sliceData.slice.indexValue); - setActiveBarTooltip({ + setGraphWidgetHoveredSliceIndex(sliceData.slice.indexValue); + setGraphWidgetBarTooltip({ offsetLeft: sliceData.offsetLeft, offsetTop: sliceData.offsetTop, slice: sliceData.slice, @@ -224,7 +226,7 @@ export const GraphWidgetBarChart = ({ formatOptions={formatOptions} groupMode={groupMode} hasNoData={hasNoData} - hoveredSliceIndexValue={hoveredSliceIndexValue} + hoveredSliceIndexValue={graphWidgetHoveredSliceIndex} indexBy={indexBy} keys={orderedKeys} layout={layout} diff --git a/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetBarChart/hooks/useBarChartData.ts b/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetBarChart/hooks/useBarChartData.ts index 0290b6401d..90d5e06cef 100644 --- a/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetBarChart/hooks/useBarChartData.ts +++ b/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetBarChart/hooks/useBarChartData.ts @@ -24,7 +24,7 @@ export const useBarChartData = ({ seriesLabels, colorMode, }: UseBarChartDataProps) => { - const hiddenLegendIds = useAtomComponentStateValue( + const graphWidgetHiddenLegendIds = useAtomComponentStateValue( graphWidgetHiddenLegendIdsComponentState, ); @@ -62,10 +62,12 @@ export const useBarChartData = ({ color: item.colorScheme.solid, })); - const visibleKeys = keys.filter((key) => !hiddenLegendIds.includes(key)); + const visibleKeys = keys.filter( + (key) => !graphWidgetHiddenLegendIds.includes(key), + ); const enrichedKeys = allEnrichedKeys.filter( - (item) => !hiddenLegendIds.includes(item.key), + (item) => !graphWidgetHiddenLegendIds.includes(item.key), ); const enrichedKeysMap = useMemo( diff --git a/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetLineChart/components/CustomCrosshairLayer.tsx b/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetLineChart/components/CustomCrosshairLayer.tsx index 16f0cb9dfe..d9a44d1752 100644 --- a/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetLineChart/components/CustomCrosshairLayer.tsx +++ b/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetLineChart/components/CustomCrosshairLayer.tsx @@ -41,7 +41,7 @@ export const CustomCrosshairLayer = ({ onRectLeave, }: CustomCrosshairLayerProps) => { const theme = useTheme(); - const crosshairX = useAtomComponentStateValue( + const graphWidgetLineCrosshairX = useAtomComponentStateValue( graphWidgetLineCrosshairXComponentState, ); @@ -109,7 +109,7 @@ export const CustomCrosshairLayer = ({ return; } - if (sliceData.sliceX === crosshairX) { + if (sliceData.sliceX === graphWidgetLineCrosshairX) { return; } @@ -140,18 +140,26 @@ export const CustomCrosshairLayer = ({ return ( - {isDefined(crosshairX) && ( + {isDefined(graphWidgetLineCrosshairX) && ( { const animatedPath = useAnimatedPath(path); - const highlightedLegendId = useAtomComponentStateValue( + const graphWidgetHighlightedLegendId = useAtomComponentStateValue( graphWidgetHighlightedLegendIdComponentState, ); - const isDimmed = isDefined(highlightedLegendId) && highlightedLegendId !== id; + const isDimmed = + isDefined(graphWidgetHighlightedLegendId) && + graphWidgetHighlightedLegendId !== id; return ( { - const tooltipState = useAtomComponentStateValue( + const graphWidgetLineTooltip = useAtomComponentStateValue( graphWidgetLineTooltipComponentState, ); @@ -40,11 +40,12 @@ export const GraphLineChartTooltip = ({ const handleTooltipClick: (() => void) | undefined = isDefined(onSliceClick) ? () => { - if (!isDefined(tooltipState)) return; + if (!isDefined(graphWidgetLineTooltip)) return; - const highlightedPoint = tooltipState.slice.points.find( + const highlightedPoint = graphWidgetLineTooltip.slice.points.find( (point) => - String(point.seriesId) === tooltipState.highlightedSeriesId, + String(point.seriesId) === + graphWidgetLineTooltip.highlightedSeriesId, ); if (!isDefined(highlightedPoint)) return; @@ -53,21 +54,21 @@ export const GraphLineChartTooltip = ({ } : undefined; - const tooltipData = !isDefined(tooltipState) + const tooltipData = !isDefined(graphWidgetLineTooltip) ? null : getLineChartTooltipData({ - slice: tooltipState.slice, + slice: graphWidgetLineTooltip.slice, enrichedSeries, formatOptions, isStacked, }); - const reference = !isDefined(tooltipState) + const reference = !isDefined(graphWidgetLineTooltip) ? null : createVirtualElementFromContainerOffset( containerElement, - tooltipState.offsetLeft, - tooltipState.offsetTop, + graphWidgetLineTooltip.offsetLeft, + graphWidgetLineTooltip.offsetTop, ); return ( @@ -77,7 +78,7 @@ export const GraphLineChartTooltip = ({ tooltipOffsetFromAnchorInPx={LINE_CHART_CONSTANTS.TOOLTIP_OFFSET_PX} items={tooltipData?.items ?? []} indexLabel={tooltipData?.indexLabel} - highlightedKey={tooltipState?.highlightedSeriesId} + highlightedKey={graphWidgetLineTooltip?.highlightedSeriesId} onGraphWidgetTooltipClick={handleTooltipClick} onMouseEnter={onMouseEnter} onMouseLeave={onMouseLeave} diff --git a/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetLineChart/components/GraphWidgetLineChart.tsx b/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetLineChart/components/GraphWidgetLineChart.tsx index c9ca88cd3b..524050ca25 100644 --- a/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetLineChart/components/GraphWidgetLineChart.tsx +++ b/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetLineChart/components/GraphWidgetLineChart.tsx @@ -131,18 +131,18 @@ export const GraphWidgetLineChart = ({ const hasClickableItems = isDefined(onSliceClick); - const setActiveLineTooltip = useSetAtomComponentState( + const setGraphWidgetLineTooltip = useSetAtomComponentState( graphWidgetLineTooltipComponentState, ); - const setCrosshairX = useSetAtomComponentState( + const setGraphWidgetLineCrosshairX = useSetAtomComponentState( graphWidgetLineCrosshairXComponentState, ); const hideTooltip = useCallback(() => { - setActiveLineTooltip(null); - setCrosshairX(null); - }, [setActiveLineTooltip, setCrosshairX]); + setGraphWidgetLineTooltip(null); + setGraphWidgetLineCrosshairX(null); + }, [setGraphWidgetLineTooltip, setGraphWidgetLineCrosshairX]); const debouncedHideTooltip = useDebouncedCallback(hideTooltip, 300); @@ -189,8 +189,8 @@ export const GraphWidgetLineChart = ({ const offsetTop = sliceData.mouseY + margins.top; debouncedHideTooltip.cancel(); - setCrosshairX(sliceData.sliceX); - setActiveLineTooltip({ + setGraphWidgetLineCrosshairX(sliceData.sliceX); + setGraphWidgetLineTooltip({ slice, offsetLeft, offsetTop, diff --git a/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetLineChart/components/LineAnimatedAreaPath.tsx b/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetLineChart/components/LineAnimatedAreaPath.tsx index a02706c40c..e528e52f69 100644 --- a/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetLineChart/components/LineAnimatedAreaPath.tsx +++ b/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetLineChart/components/LineAnimatedAreaPath.tsx @@ -18,11 +18,13 @@ export const LineAnimatedAreaPath = ({ }: LineAnimatedAreaPathProps) => { const animatedPath = useAnimatedPath(path); - const highlightedLegendId = useAtomComponentStateValue( + const graphWidgetHighlightedLegendId = useAtomComponentStateValue( graphWidgetHighlightedLegendIdComponentState, ); - const isDimmed = isDefined(highlightedLegendId) && highlightedLegendId !== id; + const isDimmed = + isDefined(graphWidgetHighlightedLegendId) && + graphWidgetHighlightedLegendId !== id; return ( { - const hiddenLegendIds = useAtomComponentStateValue( + const graphWidgetHiddenLegendIds = useAtomComponentStateValue( graphWidgetHiddenLegendIdsComponentState, ); @@ -55,11 +55,11 @@ export const useLineChartData = ({ ); const visibleData = data.filter( - (series) => !hiddenLegendIds.includes(series.id), + (series) => !graphWidgetHiddenLegendIds.includes(series.id), ); const enrichedSeries = allEnrichedSeries.filter( - (series) => !hiddenLegendIds.includes(series.id), + (series) => !graphWidgetHiddenLegendIds.includes(series.id), ); const nivoData: LineSeries[] = visibleData.map((series) => ({ diff --git a/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetPieChart/components/CustomArcsLayer.tsx b/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetPieChart/components/CustomArcsLayer.tsx index 4bb8f0035f..4cb5703315 100644 --- a/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetPieChart/components/CustomArcsLayer.tsx +++ b/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetPieChart/components/CustomArcsLayer.tsx @@ -27,7 +27,7 @@ export const CustomArcsLayer = ({ onMouseLeave, onClick, }: CustomArcsLayerProps) => { - const highlightedLegendId = useAtomComponentStateValue( + const graphWidgetHighlightedLegendId = useAtomComponentStateValue( graphWidgetHighlightedLegendIdComponentState, ); @@ -37,8 +37,8 @@ export const CustomArcsLayer = ({ {transition((_, datum) => { const isDimmed = - isDefined(highlightedLegendId) && - String(highlightedLegendId) !== String(datum.id); + isDefined(graphWidgetHighlightedLegendId) && + String(graphWidgetHighlightedLegendId) !== String(datum.id); const arcLength = datum.arc.endAngle - datum.arc.startAngle; const padAngleRadians = (padAngle * Math.PI) / 180; const clampedPadAngle = Math.min( diff --git a/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetPieChart/components/GraphPieChartTooltip.tsx b/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetPieChart/components/GraphPieChartTooltip.tsx index 548d3af9a3..8e25629474 100644 --- a/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetPieChart/components/GraphPieChartTooltip.tsx +++ b/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetPieChart/components/GraphPieChartTooltip.tsx @@ -25,7 +25,7 @@ export const GraphPieChartTooltip = ({ displayType, onSliceClick, }: GraphPieChartTooltipProps) => { - const tooltipState = useAtomComponentStateValue( + const graphWidgetPieTooltip = useAtomComponentStateValue( graphWidgetPieTooltipComponentState, ); @@ -34,10 +34,10 @@ export const GraphPieChartTooltip = ({ return null; } - const tooltipData = !isDefined(tooltipState) + const tooltipData = !isDefined(graphWidgetPieTooltip) ? null : getPieChartTooltipData({ - datum: tooltipState.datum, + datum: graphWidgetPieTooltip.datum, enrichedData, formatOptions, displayType, @@ -45,18 +45,18 @@ export const GraphPieChartTooltip = ({ const handleTooltipClick: (() => void) | undefined = isDefined(onSliceClick) ? () => { - if (isDefined(tooltipState)) { - onSliceClick(tooltipState.datum.data); + if (isDefined(graphWidgetPieTooltip)) { + onSliceClick(graphWidgetPieTooltip.datum.data); } } : undefined; - const reference = !isDefined(tooltipState) + const reference = !isDefined(graphWidgetPieTooltip) ? null : createVirtualElementFromContainerOffset( containerElement, - tooltipState.offsetLeft, - tooltipState.offsetTop, + graphWidgetPieTooltip.offsetLeft, + graphWidgetPieTooltip.offsetTop, ); return ( diff --git a/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetPieChart/components/GraphWidgetPieChart.tsx b/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetPieChart/components/GraphWidgetPieChart.tsx index bb78d3b056..ef8d7c4612 100644 --- a/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetPieChart/components/GraphWidgetPieChart.tsx +++ b/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetPieChart/components/GraphWidgetPieChart.tsx @@ -91,7 +91,7 @@ export const GraphWidgetPieChart = ({ const theme = useTheme(); const colorRegistry = createGraphColorRegistry(theme); const containerRef = useRef(null); - const setActivePieTooltip = useSetAtomComponentState( + const setGraphWidgetPieTooltip = useSetAtomComponentState( graphWidgetPieTooltipComponentState, ); @@ -117,18 +117,18 @@ export const GraphWidgetPieChart = ({ if (!isDefined(containerRef.current)) return; const containerRect = containerRef.current.getBoundingClientRect(); - setActivePieTooltip({ + setGraphWidgetPieTooltip({ datum, offsetLeft: event.clientX - containerRect.left, offsetTop: event.clientY - containerRect.top, }); }, - [setActivePieTooltip], + [setGraphWidgetPieTooltip], ); const handleSliceLeave = useCallback(() => { - setActivePieTooltip(null); - }, [setActivePieTooltip]); + setGraphWidgetPieTooltip(null); + }, [setGraphWidgetPieTooltip]); const hasNoData = useMemo( () => diff --git a/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetPieChart/hooks/usePieChartData.ts b/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetPieChart/hooks/usePieChartData.ts index 7b2dc73bd2..cfc776ad46 100644 --- a/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetPieChart/hooks/usePieChartData.ts +++ b/packages/twenty-front/src/modules/page-layout/widgets/graph/graphWidgetPieChart/hooks/usePieChartData.ts @@ -20,7 +20,7 @@ export const usePieChartData = ({ colorRegistry, colorMode, }: UsePieChartDataProps) => { - const hiddenLegendIds = useAtomComponentStateValue( + const graphWidgetHiddenLegendIds = useAtomComponentStateValue( graphWidgetHiddenLegendIdsComponentState, ); @@ -54,7 +54,7 @@ export const usePieChartData = ({ })); const enrichedData = allEnrichedData.filter( - (item) => !hiddenLegendIds.includes(item.id), + (item) => !graphWidgetHiddenLegendIds.includes(item.id), ); const enrichedDataMap = useMemo( diff --git a/packages/twenty-front/src/modules/page-layout/widgets/graph/hooks/useLegendItemToggle.ts b/packages/twenty-front/src/modules/page-layout/widgets/graph/hooks/useLegendItemToggle.ts index d39c62b8f9..7fe8083acd 100644 --- a/packages/twenty-front/src/modules/page-layout/widgets/graph/hooks/useLegendItemToggle.ts +++ b/packages/twenty-front/src/modules/page-layout/widgets/graph/hooks/useLegendItemToggle.ts @@ -11,7 +11,7 @@ export const useLegendItemToggle = ({ itemIds, isInteractive, }: UseLegendItemToggleProps) => { - const setHiddenLegendIds = useSetAtomComponentState( + const setGraphWidgetHiddenLegendIds = useSetAtomComponentState( graphWidgetHiddenLegendIdsComponentState, ); @@ -19,7 +19,7 @@ export const useLegendItemToggle = ({ (itemId: string) => { if (!isInteractive) return; - setHiddenLegendIds((previousHiddenIds) => { + setGraphWidgetHiddenLegendIds((previousHiddenIds) => { const hasStaleIds = previousHiddenIds.some( (id) => !itemIds.includes(id), ); @@ -40,7 +40,7 @@ export const useLegendItemToggle = ({ return [...validHiddenIds, itemId]; }); }, - [isInteractive, itemIds, setHiddenLegendIds], + [isInteractive, itemIds, setGraphWidgetHiddenLegendIds], ); return { toggleLegendItem }; diff --git a/packages/twenty-front/src/modules/page-layout/widgets/standalone-rich-text/components/StandaloneRichTextWidget.tsx b/packages/twenty-front/src/modules/page-layout/widgets/standalone-rich-text/components/StandaloneRichTextWidget.tsx index a2937c1820..b9f727b09a 100644 --- a/packages/twenty-front/src/modules/page-layout/widgets/standalone-rich-text/components/StandaloneRichTextWidget.tsx +++ b/packages/twenty-front/src/modules/page-layout/widgets/standalone-rich-text/components/StandaloneRichTextWidget.tsx @@ -43,7 +43,7 @@ export const StandaloneRichTextWidget = ({ isPageLayoutInEditModeComponentState, ); - const editingWidgetId = useAtomComponentStateValue( + const pageLayoutEditingWidgetId = useAtomComponentStateValue( pageLayoutEditingWidgetIdComponentState, ); @@ -73,7 +73,7 @@ export const StandaloneRichTextWidget = ({ skip: !isDefined(dashboardId), }); - const isThisWidgetBeingEdited = editingWidgetId === widget.id; + const isThisWidgetBeingEdited = pageLayoutEditingWidgetId === widget.id; const isEditable = isPageLayoutInEditMode && isThisWidgetBeingEdited; if (!isDefined(dashboardId)) { diff --git a/packages/twenty-front/src/modules/page-layout/widgets/widget-card/components/WidgetCardHeader.tsx b/packages/twenty-front/src/modules/page-layout/widgets/widget-card/components/WidgetCardHeader.tsx index 314cd61a51..a2ebaea68c 100644 --- a/packages/twenty-front/src/modules/page-layout/widgets/widget-card/components/WidgetCardHeader.tsx +++ b/packages/twenty-front/src/modules/page-layout/widgets/widget-card/components/WidgetCardHeader.tsx @@ -90,7 +90,7 @@ export const WidgetCardHeader = ({ }: WidgetCardHeaderProps) => { const theme = useTheme(); - const isWidgetCardHovered = useAtomComponentFamilyStateValue( + const widgetCardHovered = useAtomComponentFamilyStateValue( widgetCardHoveredComponentFamilyState, widgetId, ); @@ -123,7 +123,7 @@ export const WidgetCardHeader = ({ isInEditMode && isDeletingWidgetEnabled && onRemove && - isWidgetCardHovered && ( + widgetCardHovered && ( { const { objectMetadataItems } = useObjectMetadataItems(); - const setIsPrefetchFavoritesLoaded = useSetAtomFamilyState( + const setPrefetchIsLoaded = useSetAtomFamilyState( prefetchIsLoadedFamilyState, PrefetchKey.AllFavorites, ); - const setIsPrefetchFavoritesFoldersLoaded = useSetAtomFamilyState( + // eslint-disable-next-line twenty/matching-state-variable + const setPrefetchIsLoadedFolders = useSetAtomFamilyState( prefetchIsLoadedFamilyState, PrefetchKey.AllFavoritesFolders, ); - const setFavoritesState = useSetAtomState(prefetchFavoritesState); - const setFavoriteFoldersState = useSetAtomState(prefetchFavoriteFoldersState); + const setPrefetchFavorites = useSetAtomState(prefetchFavoritesState); + const setPrefetchFavoriteFolders = useSetAtomState( + prefetchFavoriteFoldersState, + ); const { objectMetadataItem: favoriteObjectMetadataItem } = useObjectMetadataItem({ @@ -90,10 +93,10 @@ export const PrefetchRunFavoriteQueriesEffect = () => { (newFavorites: Favorite[]) => { const existingFavorites = store.get(prefetchFavoritesState.atom); if (!isDeeplyEqual(existingFavorites, newFavorites)) { - setFavoritesState(newFavorites); + setPrefetchFavorites(newFavorites); } }, - [setFavoritesState, store], + [setPrefetchFavorites, store], ); const setPrefetchFavoriteFoldersStateIfChanged = useCallback( @@ -102,34 +105,30 @@ export const PrefetchRunFavoriteQueriesEffect = () => { prefetchFavoriteFoldersState.atom, ); if (!isDeeplyEqual(existingFavoriteFolders, newFavoriteFolders)) { - setFavoriteFoldersState(newFavoriteFolders); + setPrefetchFavoriteFolders(newFavoriteFolders); } }, - [setFavoriteFoldersState, store], + [setPrefetchFavoriteFolders, store], ); useEffect(() => { if (isDefined(favorites)) { setPrefetchFavoritesStateIfChanged(favorites as Favorite[]); - setIsPrefetchFavoritesLoaded(true); + setPrefetchIsLoaded(true); } - }, [ - favorites, - setPrefetchFavoritesStateIfChanged, - setIsPrefetchFavoritesLoaded, - ]); + }, [favorites, setPrefetchFavoritesStateIfChanged, setPrefetchIsLoaded]); useEffect(() => { if (isDefined(favoriteFolders)) { setPrefetchFavoriteFoldersStateIfChanged( favoriteFolders as FavoriteFolder[], ); - setIsPrefetchFavoritesFoldersLoaded(true); + setPrefetchIsLoadedFolders(true); } }, [ favoriteFolders, setPrefetchFavoriteFoldersStateIfChanged, - setIsPrefetchFavoritesFoldersLoaded, + setPrefetchIsLoadedFolders, ]); return <>; diff --git a/packages/twenty-front/src/modules/prefetch/components/PrefetchRunNavigationMenuItemQueriesEffect.tsx b/packages/twenty-front/src/modules/prefetch/components/PrefetchRunNavigationMenuItemQueriesEffect.tsx index c763aed596..6448c58f37 100644 --- a/packages/twenty-front/src/modules/prefetch/components/PrefetchRunNavigationMenuItemQueriesEffect.tsx +++ b/packages/twenty-front/src/modules/prefetch/components/PrefetchRunNavigationMenuItemQueriesEffect.tsx @@ -31,12 +31,12 @@ export const PrefetchRunNavigationMenuItemQueriesEffect = () => { const isWorkspaceActive = currentWorkspace?.activationStatus === WorkspaceActivationStatus.ACTIVE; - const setIsPrefetchNavigationMenuItemsLoaded = useSetAtomFamilyState( + const setPrefetchIsLoaded = useSetAtomFamilyState( prefetchIsLoadedFamilyState, PrefetchKey.AllNavigationMenuItems, ); - const setNavigationMenuItemsState = useSetAtomState( + const setPrefetchNavigationMenuItems = useSetAtomState( prefetchNavigationMenuItemsState, ); @@ -55,22 +55,22 @@ export const PrefetchRunNavigationMenuItemQueriesEffect = () => { prefetchNavigationMenuItemsState.atom, ); if (!isDeeplyEqual(existingNavigationMenuItems, navigationMenuItems)) { - setNavigationMenuItemsState(navigationMenuItems); + setPrefetchNavigationMenuItems(navigationMenuItems); } }, - [setNavigationMenuItemsState, store], + [setPrefetchNavigationMenuItems, store], ); useEffect(() => { if (!loading && isDefined(data?.navigationMenuItems)) { setPrefetchNavigationMenuItemsStateIfChanged(data.navigationMenuItems); - setIsPrefetchNavigationMenuItemsLoaded(true); + setPrefetchIsLoaded(true); } }, [ data, loading, setPrefetchNavigationMenuItemsStateIfChanged, - setIsPrefetchNavigationMenuItemsLoaded, + setPrefetchIsLoaded, ]); return <>; diff --git a/packages/twenty-front/src/modules/prefetch/hooks/useIsPrefetchLoading.ts b/packages/twenty-front/src/modules/prefetch/hooks/useIsPrefetchLoading.ts index a3e5cde866..aec33a28bf 100644 --- a/packages/twenty-front/src/modules/prefetch/hooks/useIsPrefetchLoading.ts +++ b/packages/twenty-front/src/modules/prefetch/hooks/useIsPrefetchLoading.ts @@ -8,18 +8,16 @@ export const useIsPrefetchLoading = () => { const isWorkspaceActive = useIsWorkspaceActivationStatusEqualsTo( WorkspaceActivationStatus.ACTIVE, ); - const isFavoriteFoldersPrefetched = useAtomFamilyStateValue( + const prefetchIsLoaded = useAtomFamilyStateValue( prefetchIsLoadedFamilyState, PrefetchKey.AllFavoritesFolders, ); - const areFavoritesPrefetched = useAtomFamilyStateValue( + // eslint-disable-next-line twenty/matching-state-variable + const prefetchIsLoadedFavorites = useAtomFamilyStateValue( prefetchIsLoadedFamilyState, PrefetchKey.AllFavorites, ); - return ( - isWorkspaceActive && - (!areFavoritesPrefetched || !isFavoriteFoldersPrefetched) - ); + return isWorkspaceActive && (!prefetchIsLoadedFavorites || !prefetchIsLoaded); }; diff --git a/packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsMessageChannelsContainer.tsx b/packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsMessageChannelsContainer.tsx index cb4f636a5a..e5006b5708 100644 --- a/packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsMessageChannelsContainer.tsx +++ b/packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsMessageChannelsContainer.tsx @@ -31,7 +31,7 @@ export const SettingsAccountsMessageChannelsContainer = () => { SETTINGS_ACCOUNT_MESSAGE_CHANNELS_TAB_LIST_COMPONENT_ID, ); const currentWorkspaceMember = useAtomStateValue(currentWorkspaceMemberState); - const setSelectedMessageChannel = useSetAtomState( + const setSettingsAccountsSelectedMessageChannel = useSetAtomState( settingsAccountsSelectedMessageChannelState, ); @@ -68,7 +68,7 @@ export const SettingsAccountsMessageChannelsContainer = () => { }, recordGqlFields, onCompleted: (data) => { - setSelectedMessageChannel(data[0]); + setSettingsAccountsSelectedMessageChannel(data[0]); }, skip: !accounts.length, }); @@ -84,10 +84,10 @@ export const SettingsAccountsMessageChannelsContainer = () => { (channel) => channel.id === tabId, ); if (isDefined(selectedMessageChannel)) { - setSelectedMessageChannel(selectedMessageChannel); + setSettingsAccountsSelectedMessageChannel(selectedMessageChannel); } }, - [messageChannels, setSelectedMessageChannel], + [messageChannels, setSettingsAccountsSelectedMessageChannel], ); if (!messageChannels.length) { diff --git a/packages/twenty-front/src/modules/settings/data-model/fields/preview/components/SettingsDataModelSetLabelIdentifierRecordEffect.tsx b/packages/twenty-front/src/modules/settings/data-model/fields/preview/components/SettingsDataModelSetLabelIdentifierRecordEffect.tsx index 9ebcfd8b91..5370c332c6 100644 --- a/packages/twenty-front/src/modules/settings/data-model/fields/preview/components/SettingsDataModelSetLabelIdentifierRecordEffect.tsx +++ b/packages/twenty-front/src/modules/settings/data-model/fields/preview/components/SettingsDataModelSetLabelIdentifierRecordEffect.tsx @@ -16,11 +16,14 @@ export const SettingsDataModelSetLabelIdentifierRecordEffect = ({ objectNameSingular: objectNameSingular, }); - const setRecord = useSetAtomFamilyState(recordStoreFamilyState, recordId); + const setRecordStore = useSetAtomFamilyState( + recordStoreFamilyState, + recordId, + ); useEffect(() => { - setRecord(recordPreviewForLabelIdentifier); - }, [recordPreviewForLabelIdentifier, setRecord, recordId]); + setRecordStore(recordPreviewForLabelIdentifier); + }, [recordPreviewForLabelIdentifier, setRecordStore, recordId]); return null; }; diff --git a/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldItemTableRow.tsx b/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldItemTableRow.tsx index 5df162e4a3..e8a0e7001d 100644 --- a/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldItemTableRow.tsx +++ b/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldItemTableRow.tsx @@ -139,13 +139,13 @@ export const SettingsObjectFieldItemTableRow = ({ const { deleteOneFieldMetadataItem } = useDeleteOneFieldMetadataItem(); - const setActiveSettingsObjectFields = useSetAtomFamilyState( + const setSettingsObjectFields = useSetAtomFamilyState( settingsObjectFieldsFamilyState, { objectMetadataItemId: objectMetadataItem.id }, ); const handleToggleField = () => { - setActiveSettingsObjectFields((previousFields) => { + setSettingsObjectFields((previousFields) => { const newFields = isDefined(previousFields) ? previousFields?.map((field) => field.id === fieldMetadataItem.id diff --git a/packages/twenty-front/src/modules/settings/roles/role-assignment/components/stories/SettingsRoleAssignment.stories.tsx b/packages/twenty-front/src/modules/settings/roles/role-assignment/components/stories/SettingsRoleAssignment.stories.tsx index 0c7fe76c7a..625b04e215 100644 --- a/packages/twenty-front/src/modules/settings/roles/role-assignment/components/stories/SettingsRoleAssignment.stories.tsx +++ b/packages/twenty-front/src/modules/settings/roles/role-assignment/components/stories/SettingsRoleAssignment.stories.tsx @@ -9,7 +9,7 @@ import { getRolesMock } from '~/testing/mock-data/roles'; const SettingsRoleAssignmentWrapper = ( args: React.ComponentProps, ) => { - const setDraftRole = useSetAtomFamilyState( + const setSettingsDraftRole = useSetAtomFamilyState( settingsDraftRoleFamilyState, args.roleId, ); @@ -17,7 +17,7 @@ const SettingsRoleAssignmentWrapper = ( const role = getRolesMock().find((role) => role.id === args.roleId); if (isDefined(role)) { - setDraftRole(role); + setSettingsDraftRole(role); } return ; diff --git a/packages/twenty-front/src/modules/settings/roles/role-permissions/components/stories/SettingsRolePermissions.stories.tsx b/packages/twenty-front/src/modules/settings/roles/role-permissions/components/stories/SettingsRolePermissions.stories.tsx index 8220a1df14..6c3de310b8 100644 --- a/packages/twenty-front/src/modules/settings/roles/role-permissions/components/stories/SettingsRolePermissions.stories.tsx +++ b/packages/twenty-front/src/modules/settings/roles/role-permissions/components/stories/SettingsRolePermissions.stories.tsx @@ -9,7 +9,7 @@ import { getRolesMock } from '~/testing/mock-data/roles'; const SettingsRolePermissionsWrapper = ( args: React.ComponentProps, ) => { - const setDraftRole = useSetAtomFamilyState( + const setSettingsDraftRole = useSetAtomFamilyState( settingsDraftRoleFamilyState, args.roleId, ); @@ -17,7 +17,7 @@ const SettingsRolePermissionsWrapper = ( const role = getRolesMock().find((role) => role.id === args.roleId); if (isDefined(role)) { - setDraftRole(role); + setSettingsDraftRole(role); } return ( diff --git a/packages/twenty-front/src/modules/settings/roles/role-settings/components/stories/SettingsRoleSettings.stories.tsx b/packages/twenty-front/src/modules/settings/roles/role-settings/components/stories/SettingsRoleSettings.stories.tsx index 3b32289aa0..11b615ab59 100644 --- a/packages/twenty-front/src/modules/settings/roles/role-settings/components/stories/SettingsRoleSettings.stories.tsx +++ b/packages/twenty-front/src/modules/settings/roles/role-settings/components/stories/SettingsRoleSettings.stories.tsx @@ -9,7 +9,7 @@ import { getRolesMock } from '~/testing/mock-data/roles'; const SettingsRoleSettingsWrapper = ( args: React.ComponentProps, ) => { - const setDraftRole = useSetAtomFamilyState( + const setSettingsDraftRole = useSetAtomFamilyState( settingsDraftRoleFamilyState, args.roleId, ); @@ -17,7 +17,7 @@ const SettingsRoleSettingsWrapper = ( const role = getRolesMock().find((role) => role.id === args.roleId); if (isDefined(role)) { - setDraftRole(role); + setSettingsDraftRole(role); } return ( diff --git a/packages/twenty-front/src/modules/settings/roles/role/components/SettingsRoleEditEffect.tsx b/packages/twenty-front/src/modules/settings/roles/role/components/SettingsRoleEditEffect.tsx index 92449c1682..659c05188b 100644 --- a/packages/twenty-front/src/modules/settings/roles/role/components/SettingsRoleEditEffect.tsx +++ b/packages/twenty-front/src/modules/settings/roles/role/components/SettingsRoleEditEffect.tsx @@ -19,7 +19,7 @@ export const SettingsRoleEditEffect = ({ }: SettingsRoleEditEffectProps) => { const [isInitialized, setIsInitialized] = useState(false); - const role = useAtomFamilyStateValue( + const settingsPersistedRole = useAtomFamilyStateValue( settingsPersistedRoleFamilyState, roleId, ); @@ -44,14 +44,19 @@ export const SettingsRoleEditEffect = ({ ); useEffect(() => { - if (isInitialized || !isDefined(role)) { + if (isInitialized || !isDefined(settingsPersistedRole)) { return; } setActiveTabId(SETTINGS_ROLE_DETAIL_TABS.TABS_IDS.PERMISSIONS); - updateDraftRoleIfNeeded(role); + updateDraftRoleIfNeeded(settingsPersistedRole); setIsInitialized(true); - }, [isInitialized, role, setActiveTabId, updateDraftRoleIfNeeded]); + }, [ + isInitialized, + settingsPersistedRole, + setActiveTabId, + updateDraftRoleIfNeeded, + ]); return <>; }; diff --git a/packages/twenty-front/src/modules/sign-in-background-mock/components/SignInBackgroundMockContainer.tsx b/packages/twenty-front/src/modules/sign-in-background-mock/components/SignInBackgroundMockContainer.tsx index a3329ee035..239b2ecc86 100644 --- a/packages/twenty-front/src/modules/sign-in-background-mock/components/SignInBackgroundMockContainer.tsx +++ b/packages/twenty-front/src/modules/sign-in-background-mock/components/SignInBackgroundMockContainer.tsx @@ -31,13 +31,14 @@ export const SignInBackgroundMockContainer = () => { const objectMetadataItems = useAtomStateValue(objectMetadataItemsState); - const objectMetadataItemId = useAtomComponentStateValue( + const contextStoreCurrentObjectMetadataItemId = useAtomComponentStateValue( contextStoreCurrentObjectMetadataItemIdComponentState, MAIN_CONTEXT_STORE_INSTANCE_ID, ); const objectMetadataItem = objectMetadataItems.find( - (objectMetadataItem) => objectMetadataItem.id === objectMetadataItemId, + (objectMetadataItem) => + objectMetadataItem.id === contextStoreCurrentObjectMetadataItemId, ); const { diff --git a/packages/twenty-front/src/modules/spreadsheet-import/hooks/useOpenSpreadsheetImportDialog.ts b/packages/twenty-front/src/modules/spreadsheet-import/hooks/useOpenSpreadsheetImportDialog.ts index 5090d5cc0e..9acf9e5133 100644 --- a/packages/twenty-front/src/modules/spreadsheet-import/hooks/useOpenSpreadsheetImportDialog.ts +++ b/packages/twenty-front/src/modules/spreadsheet-import/hooks/useOpenSpreadsheetImportDialog.ts @@ -5,7 +5,9 @@ import { useModal } from '@/ui/layout/modal/hooks/useModal'; import { useSetAtomState } from '@/ui/utilities/state/jotai/hooks/useSetAtomState'; export const useOpenSpreadsheetImportDialog = () => { - const setSpreadSheetImport = useSetAtomState(spreadsheetImportDialogState); + const setSpreadsheetImportDialog = useSetAtomState( + spreadsheetImportDialogState, + ); const { openModal } = useModal(); @@ -13,7 +15,7 @@ export const useOpenSpreadsheetImportDialog = () => { options: Omit, ) => { openModal(SPREADSHEET_IMPORT_MODAL_ID); - setSpreadSheetImport({ + setSpreadsheetImportDialog({ isOpen: true, isStepBarVisible: true, options, diff --git a/packages/twenty-front/src/modules/spreadsheet-import/provider/components/SpreadsheetImportProvider.tsx b/packages/twenty-front/src/modules/spreadsheet-import/provider/components/SpreadsheetImportProvider.tsx index 568efa6b81..3ab2ba8d14 100644 --- a/packages/twenty-front/src/modules/spreadsheet-import/provider/components/SpreadsheetImportProvider.tsx +++ b/packages/twenty-front/src/modules/spreadsheet-import/provider/components/SpreadsheetImportProvider.tsx @@ -39,7 +39,7 @@ export const SpreadsheetImportProvider = ( spreadsheetImportDialogState, ); - const setMatchColumnsState = useSetAtomState(matchColumnsState); + const setMatchColumns = useSetAtomState(matchColumnsState); const { closeModal } = useModal(); @@ -53,7 +53,7 @@ export const SpreadsheetImportProvider = ( closeModal(SPREADSHEET_IMPORT_MODAL_ID); - setMatchColumnsState([]); + setMatchColumns([]); }; return ( diff --git a/packages/twenty-front/src/modules/ui/input/components/IconPicker.tsx b/packages/twenty-front/src/modules/ui/input/components/IconPicker.tsx index e9b33f5e2c..8583630297 100644 --- a/packages/twenty-front/src/modules/ui/input/components/IconPicker.tsx +++ b/packages/twenty-front/src/modules/ui/input/components/IconPicker.tsx @@ -103,7 +103,7 @@ const IconPickerIcon = ({ Icon, focusedIconKey, }: IconPickerIconProps) => { - const isSelectedItemId = useAtomComponentStateValue( + const selectedItemId = useAtomComponentStateValue( selectedItemIdComponentState, iconKey, ); @@ -116,7 +116,7 @@ const IconPickerIcon = ({ aria-label={convertIconKeyToLabel(iconKey)} size="medium" title={iconKey} - isSelected={iconKey === selectedIconKey || !!isSelectedItemId} + isSelected={iconKey === selectedIconKey || !!selectedItemId} isFocused={iconKey === focusedIconKey} Icon={Icon} onClick={onSelect} diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/hooks/__tests__/useCloseDropdown.test.tsx b/packages/twenty-front/src/modules/ui/layout/dropdown/hooks/__tests__/useCloseDropdown.test.tsx index 8079bfa14b..a71c691930 100644 --- a/packages/twenty-front/src/modules/ui/layout/dropdown/hooks/__tests__/useCloseDropdown.test.tsx +++ b/packages/twenty-front/src/modules/ui/layout/dropdown/hooks/__tests__/useCloseDropdown.test.tsx @@ -44,12 +44,13 @@ describe('useCloseDropdown', () => { it('should close dropdown from inside component instance context', async () => { const { result } = renderHook( () => { + // eslint-disable-next-line twenty/matching-state-variable const isOutsideDropdownOpen = useAtomComponentStateValue( isDropdownOpenComponentState, outsideDropdownId, ); - const isInsideDropdownOpen = useAtomComponentStateValue( + const isDropdownOpen = useAtomComponentStateValue( isDropdownOpenComponentState, ); @@ -58,7 +59,7 @@ describe('useCloseDropdown', () => { return { isOutsideDropdownOpen, - isInsideDropdownOpen, + isDropdownOpen, closeDropdown, openDropdown, }; @@ -72,26 +73,27 @@ describe('useCloseDropdown', () => { result.current.openDropdown(); }); - expect(result.current.isInsideDropdownOpen).toBe(true); + expect(result.current.isDropdownOpen).toBe(true); expect(result.current.isOutsideDropdownOpen).toBe(false); act(() => { result.current.closeDropdown(); }); - expect(result.current.isInsideDropdownOpen).toBe(false); + expect(result.current.isDropdownOpen).toBe(false); expect(result.current.isOutsideDropdownOpen).toBe(false); }); it('should close dropdown from outside component instance context', async () => { const { result } = renderHook( () => { + // eslint-disable-next-line twenty/matching-state-variable const isOutsideDropdownOpen = useAtomComponentStateValue( isDropdownOpenComponentState, outsideDropdownId, ); - const isInsideDropdownOpen = useAtomComponentStateValue( + const isDropdownOpen = useAtomComponentStateValue( isDropdownOpenComponentState, ); @@ -100,7 +102,7 @@ describe('useCloseDropdown', () => { return { isOutsideDropdownOpen, - isInsideDropdownOpen, + isDropdownOpen, closeDropdown, openDropdown, }; @@ -116,14 +118,14 @@ describe('useCloseDropdown', () => { }); }); - expect(result.current.isInsideDropdownOpen).toBe(false); + expect(result.current.isDropdownOpen).toBe(false); expect(result.current.isOutsideDropdownOpen).toBe(true); act(() => { result.current.closeDropdown(outsideDropdownId); }); - expect(result.current.isInsideDropdownOpen).toBe(false); + expect(result.current.isDropdownOpen).toBe(false); expect(result.current.isOutsideDropdownOpen).toBe(false); }); }); diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/hooks/__tests__/useOpenDropdown.test.tsx b/packages/twenty-front/src/modules/ui/layout/dropdown/hooks/__tests__/useOpenDropdown.test.tsx index 7b90d9a314..c44b42b3a9 100644 --- a/packages/twenty-front/src/modules/ui/layout/dropdown/hooks/__tests__/useOpenDropdown.test.tsx +++ b/packages/twenty-front/src/modules/ui/layout/dropdown/hooks/__tests__/useOpenDropdown.test.tsx @@ -42,57 +42,59 @@ describe('useOpenDropdown', () => { it('should open dropdown from inside component instance context', async () => { const { result } = renderHook( () => { + // eslint-disable-next-line twenty/matching-state-variable const isOutsideDropdownOpen = useAtomComponentStateValue( isDropdownOpenComponentState, outsideDropdownId, ); - const isInsideDropdownOpen = useAtomComponentStateValue( + const isDropdownOpen = useAtomComponentStateValue( isDropdownOpenComponentState, ); const { openDropdown } = useOpenDropdown(); - return { isOutsideDropdownOpen, isInsideDropdownOpen, openDropdown }; + return { isOutsideDropdownOpen, isDropdownOpen, openDropdown }; }, { wrapper: Wrapper, }, ); - expect(result.current.isInsideDropdownOpen).toBe(false); + expect(result.current.isDropdownOpen).toBe(false); expect(result.current.isOutsideDropdownOpen).toBe(false); act(() => { result.current.openDropdown(); }); - expect(result.current.isInsideDropdownOpen).toBe(true); + expect(result.current.isDropdownOpen).toBe(true); expect(result.current.isOutsideDropdownOpen).toBe(false); }); it('should open dropdown from outside component instance context', async () => { const { result } = renderHook( () => { + // eslint-disable-next-line twenty/matching-state-variable const isOutsideDropdownOpen = useAtomComponentStateValue( isDropdownOpenComponentState, outsideDropdownId, ); - const isInsideDropdownOpen = useAtomComponentStateValue( + const isDropdownOpen = useAtomComponentStateValue( isDropdownOpenComponentState, ); const { openDropdown } = useOpenDropdown(); - return { isInsideDropdownOpen, isOutsideDropdownOpen, openDropdown }; + return { isDropdownOpen, isOutsideDropdownOpen, openDropdown }; }, { wrapper: Wrapper, }, ); - expect(result.current.isInsideDropdownOpen).toBe(false); + expect(result.current.isDropdownOpen).toBe(false); expect(result.current.isOutsideDropdownOpen).toBe(false); act(() => { @@ -101,7 +103,7 @@ describe('useOpenDropdown', () => { }); }); - expect(result.current.isInsideDropdownOpen).toBe(false); + expect(result.current.isDropdownOpen).toBe(false); expect(result.current.isOutsideDropdownOpen).toBe(true); }); }); diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/hooks/__tests__/useToggleDropdown.test.tsx b/packages/twenty-front/src/modules/ui/layout/dropdown/hooks/__tests__/useToggleDropdown.test.tsx index 3b3047c4c2..1e3ea7ceff 100644 --- a/packages/twenty-front/src/modules/ui/layout/dropdown/hooks/__tests__/useToggleDropdown.test.tsx +++ b/packages/twenty-front/src/modules/ui/layout/dropdown/hooks/__tests__/useToggleDropdown.test.tsx @@ -43,69 +43,71 @@ describe('useToggleDropdown', () => { it('should toggle dropdown from inside component instance context', async () => { const { result } = renderHook( () => { + // eslint-disable-next-line twenty/matching-state-variable const isOutsideDropdownOpen = useAtomComponentStateValue( isDropdownOpenComponentState, outsideDropdownId, ); - const isInsideDropdownOpen = useAtomComponentStateValue( + const isDropdownOpen = useAtomComponentStateValue( isDropdownOpenComponentState, ); const { toggleDropdown } = useToggleDropdown(); - return { isOutsideDropdownOpen, isInsideDropdownOpen, toggleDropdown }; + return { isOutsideDropdownOpen, isDropdownOpen, toggleDropdown }; }, { wrapper: Wrapper, }, ); - expect(result.current.isInsideDropdownOpen).toBe(false); + expect(result.current.isDropdownOpen).toBe(false); expect(result.current.isOutsideDropdownOpen).toBe(false); act(() => { result.current.toggleDropdown(); }); - expect(result.current.isInsideDropdownOpen).toBe(true); + expect(result.current.isDropdownOpen).toBe(true); expect(result.current.isOutsideDropdownOpen).toBe(false); act(() => { result.current.toggleDropdown(); }); - expect(result.current.isInsideDropdownOpen).toBe(false); + expect(result.current.isDropdownOpen).toBe(false); expect(result.current.isOutsideDropdownOpen).toBe(false); act(() => { result.current.toggleDropdown(); }); - expect(result.current.isInsideDropdownOpen).toBe(true); + expect(result.current.isDropdownOpen).toBe(true); expect(result.current.isOutsideDropdownOpen).toBe(false); }); it('should toggle dropdown from outside component instance context', async () => { const { result } = renderHook( () => { + // eslint-disable-next-line twenty/matching-state-variable const isOutsideDropdownOpen = useAtomComponentStateValue( isDropdownOpenComponentState, outsideDropdownId, ); - const isInsideDropdownOpen = useAtomComponentStateValue( + const isDropdownOpen = useAtomComponentStateValue( isDropdownOpenComponentState, ); const { toggleDropdown } = useToggleDropdown(); - return { isOutsideDropdownOpen, isInsideDropdownOpen, toggleDropdown }; + return { isOutsideDropdownOpen, isDropdownOpen, toggleDropdown }; }, { wrapper: Wrapper, }, ); - expect(result.current.isInsideDropdownOpen).toBe(false); + expect(result.current.isDropdownOpen).toBe(false); expect(result.current.isOutsideDropdownOpen).toBe(false); act(() => { @@ -114,7 +116,7 @@ describe('useToggleDropdown', () => { }); }); - expect(result.current.isInsideDropdownOpen).toBe(false); + expect(result.current.isDropdownOpen).toBe(false); expect(result.current.isOutsideDropdownOpen).toBe(true); act(() => { @@ -123,7 +125,7 @@ describe('useToggleDropdown', () => { }); }); - expect(result.current.isInsideDropdownOpen).toBe(false); + expect(result.current.isDropdownOpen).toBe(false); expect(result.current.isOutsideDropdownOpen).toBe(false); act(() => { @@ -132,7 +134,7 @@ describe('useToggleDropdown', () => { }); }); - expect(result.current.isInsideDropdownOpen).toBe(false); + expect(result.current.isDropdownOpen).toBe(false); expect(result.current.isOutsideDropdownOpen).toBe(true); }); }); diff --git a/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/MultiWorkspaceDropdown/internal/MultiWorkspaceDropdownDefaultComponents.tsx b/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/MultiWorkspaceDropdown/internal/MultiWorkspaceDropdownDefaultComponents.tsx index 8e47627310..e287ca5610 100644 --- a/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/MultiWorkspaceDropdown/internal/MultiWorkspaceDropdownDefaultComponents.tsx +++ b/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/MultiWorkspaceDropdown/internal/MultiWorkspaceDropdownDefaultComponents.tsx @@ -75,7 +75,7 @@ export const MultiWorkspaceDropdownDefaultComponents = () => { const [signUpInNewWorkspaceMutation] = useSignUpInNewWorkspaceMutation(); - const setMultiWorkspaceDropdownState = useSetAtomState( + const setMultiWorkspaceDropdown = useSetAtomState( multiWorkspaceDropdownState, ); @@ -195,9 +195,7 @@ export const MultiWorkspaceDropdownDefaultComponents = () => { - setMultiWorkspaceDropdownState('workspaces-list') - } + onClick={() => setMultiWorkspaceDropdown('workspaces-list')} hasSubMenu={true} /> )} @@ -215,7 +213,7 @@ export const MultiWorkspaceDropdownDefaultComponents = () => { } hasSubMenu={true} - onClick={() => setMultiWorkspaceDropdownState('themes')} + onClick={() => setMultiWorkspaceDropdown('themes')} /> { const { setColorScheme, colorScheme, colorSchemeList } = useColorScheme(); - const setMultiWorkspaceDropdownState = useSetAtomState( + const setMultiWorkspaceDropdown = useSetAtomState( multiWorkspaceDropdownState, ); @@ -23,7 +23,7 @@ export const MultiWorkspaceDropdownThemesComponents = () => { setMultiWorkspaceDropdownState('default')} + onClick={() => setMultiWorkspaceDropdown('default')} Icon={IconChevronLeft} /> } diff --git a/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/MultiWorkspaceDropdown/internal/MultiWorkspaceDropdownWorkspacesListComponents.tsx b/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/MultiWorkspaceDropdown/internal/MultiWorkspaceDropdownWorkspacesListComponents.tsx index 683b83fd5c..6b208dd0b9 100644 --- a/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/MultiWorkspaceDropdown/internal/MultiWorkspaceDropdownWorkspacesListComponents.tsx +++ b/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/MultiWorkspaceDropdown/internal/MultiWorkspaceDropdownWorkspacesListComponents.tsx @@ -19,7 +19,7 @@ export const MultiWorkspaceDropdownWorkspacesListComponents = () => { const availableWorkspaces = useAtomStateValue(availableWorkspacesState); - const setMultiWorkspaceDropdownState = useSetAtomState( + const setMultiWorkspaceDropdown = useSetAtomState( multiWorkspaceDropdownState, ); const [searchValue, setSearchValue] = useState(''); @@ -29,7 +29,7 @@ export const MultiWorkspaceDropdownWorkspacesListComponents = () => { setMultiWorkspaceDropdownState('default')} + onClick={() => setMultiWorkspaceDropdown('default')} Icon={IconChevronLeft} /> } diff --git a/packages/twenty-front/src/modules/ui/utilities/scroll/components/ScrollWrapper.tsx b/packages/twenty-front/src/modules/ui/utilities/scroll/components/ScrollWrapper.tsx index 3f14da2be8..5653c96d52 100644 --- a/packages/twenty-front/src/modules/ui/utilities/scroll/components/ScrollWrapper.tsx +++ b/packages/twenty-front/src/modules/ui/utilities/scroll/components/ScrollWrapper.tsx @@ -35,26 +35,26 @@ export const ScrollWrapper = ({ defaultEnableXScroll = true, defaultEnableYScroll = true, }: ScrollWrapperProps) => { - const setScrollTop = useSetAtomComponentState( + const setScrollWrapperScrollTop = useSetAtomComponentState( scrollWrapperScrollTopComponentState, componentInstanceId, ); - const setScrollLeft = useSetAtomComponentState( + const setScrollWrapperScrollLeft = useSetAtomComponentState( scrollWrapperScrollLeftComponentState, componentInstanceId, ); - const setScrollBottom = useSetAtomComponentState( + const setScrollWrapperScrollBottom = useSetAtomComponentState( scrollWrapperScrollBottomComponentState, componentInstanceId, ); const handleScroll = (event: React.UIEvent) => { const target = event.currentTarget; - setScrollTop(target.scrollTop); - setScrollLeft(target.scrollLeft); - setScrollBottom( + setScrollWrapperScrollTop(target.scrollTop); + setScrollWrapperScrollLeft(target.scrollLeft); + setScrollWrapperScrollBottom( target.scrollHeight - target.clientHeight - target.scrollTop, ); }; diff --git a/packages/twenty-front/src/modules/ui/utilities/scroll/hooks/useScrollRestoration.ts b/packages/twenty-front/src/modules/ui/utilities/scroll/hooks/useScrollRestoration.ts index b47a02b1ae..cc46948b26 100644 --- a/packages/twenty-front/src/modules/ui/utilities/scroll/hooks/useScrollRestoration.ts +++ b/packages/twenty-front/src/modules/ui/utilities/scroll/hooks/useScrollRestoration.ts @@ -10,7 +10,7 @@ export const useScrollRestoration = (componentInstanceId: string) => { const storageKey = `scroll-${location.pathname}`; const [isRestoring, setIsRestoring] = useState(false); - const scrollTop = useAtomComponentStateValue( + const scrollWrapperScrollTop = useAtomComponentStateValue( scrollWrapperScrollTopComponentState, componentInstanceId, ); @@ -46,13 +46,13 @@ export const useScrollRestoration = (componentInstanceId: string) => { useEffect(() => { if (isRestoring) return; - if (scrollTop <= SCROLL_RESTORATION_TOP_THRESHOLD_PX) { + if (scrollWrapperScrollTop <= SCROLL_RESTORATION_TOP_THRESHOLD_PX) { sessionStorage.removeItem(storageKey); return; } - sessionStorage.setItem(storageKey, scrollTop.toString()); - }, [scrollTop, storageKey, isRestoring]); + sessionStorage.setItem(storageKey, scrollWrapperScrollTop.toString()); + }, [scrollWrapperScrollTop, storageKey, isRestoring]); useEffect(() => { const savedPosition = sessionStorage.getItem(storageKey); diff --git a/packages/twenty-front/src/modules/views/components/UpdateViewButtonGroup.tsx b/packages/twenty-front/src/modules/views/components/UpdateViewButtonGroup.tsx index f5b8d6b98d..fd43a35034 100644 --- a/packages/twenty-front/src/modules/views/components/UpdateViewButtonGroup.tsx +++ b/packages/twenty-front/src/modules/views/components/UpdateViewButtonGroup.tsx @@ -45,7 +45,7 @@ export const UpdateViewButtonGroup = () => { const { setViewPickerMode } = useViewPickerMode(); - const currentViewId = useAtomComponentStateValue( + const contextStoreCurrentViewId = useAtomComponentStateValue( contextStoreCurrentViewIdComponentState, ); @@ -58,14 +58,14 @@ export const UpdateViewButtonGroup = () => { ); const openViewPickerInCreateMode = () => { - if (!currentViewId) { + if (!contextStoreCurrentViewId) { return; } openViewPickerDropdown({ dropdownComponentInstanceIdFromProps: VIEW_PICKER_DROPDOWN_ID, }); - setViewPickerReferenceViewId(currentViewId); + setViewPickerReferenceViewId(contextStoreCurrentViewId); setViewPickerMode('create-from-current'); closeUpdateViewButtonDropdown(UPDATE_VIEW_BUTTON_DROPDOWN_ID); diff --git a/packages/twenty-front/src/modules/views/components/ViewBarAnyFieldFilterEffect.tsx b/packages/twenty-front/src/modules/views/components/ViewBarAnyFieldFilterEffect.tsx index b65b900e9e..3a11249aa8 100644 --- a/packages/twenty-front/src/modules/views/components/ViewBarAnyFieldFilterEffect.tsx +++ b/packages/twenty-front/src/modules/views/components/ViewBarAnyFieldFilterEffect.tsx @@ -11,7 +11,7 @@ import { useEffect } from 'react'; import { isDefined } from 'twenty-shared/utils'; export const ViewBarAnyFieldFilterEffect = () => { - const currentViewId = useAtomComponentStateValue( + const contextStoreCurrentViewId = useAtomComponentStateValue( contextStoreCurrentViewIdComponentState, ); @@ -20,7 +20,7 @@ export const ViewBarAnyFieldFilterEffect = () => { const currentView = useAtomFamilySelectorValue( coreViewFromViewIdFamilySelector, { - viewId: currentViewId ?? '', + viewId: contextStoreCurrentViewId ?? '', }, ); @@ -28,7 +28,7 @@ export const ViewBarAnyFieldFilterEffect = () => { useAtomComponentFamilyState( hasInitializedAnyFieldFilterComponentFamilyState, { - viewId: currentViewId ?? undefined, + viewId: contextStoreCurrentViewId ?? undefined, }, ); @@ -49,7 +49,7 @@ export const ViewBarAnyFieldFilterEffect = () => { } }, [ setAnyFieldFilterValue, - currentViewId, + contextStoreCurrentViewId, hasInitializedAnyFieldFilter, setHasInitializedAnyFieldFilter, currentView, diff --git a/packages/twenty-front/src/modules/views/components/ViewBarDetails.tsx b/packages/twenty-front/src/modules/views/components/ViewBarDetails.tsx index e684dc236a..c63a066be1 100644 --- a/packages/twenty-front/src/modules/views/components/ViewBarDetails.tsx +++ b/packages/twenty-front/src/modules/views/components/ViewBarDetails.tsx @@ -189,7 +189,7 @@ export const ViewBarDetails = ({ const shouldShowAdvancedFilterDropdownButton = currentRecordFilterGroups.length > 0; - const isAnyFieldSearchDropdownOpen = useAtomComponentStateValue( + const isDropdownOpen = useAtomComponentStateValue( isDropdownOpenComponentState, ANY_FIELD_SEARCH_DROPDOWN_ID, ); @@ -202,7 +202,7 @@ export const ViewBarDetails = ({ !hasFiltersQueryParams; const shouldShowAnyFieldSearchChip = - isNonEmptyString(anyFieldFilterValue) || isAnyFieldSearchDropdownOpen; + isNonEmptyString(anyFieldFilterValue) || isDropdownOpen; const shouldExpandViewBar = shouldShowAnyFieldSearchChip || diff --git a/packages/twenty-front/src/modules/views/components/ViewBarFilterDropdownAdvancedFilterButton.tsx b/packages/twenty-front/src/modules/views/components/ViewBarFilterDropdownAdvancedFilterButton.tsx index 223191aaaa..ec5a1c6172 100644 --- a/packages/twenty-front/src/modules/views/components/ViewBarFilterDropdownAdvancedFilterButton.tsx +++ b/packages/twenty-front/src/modules/views/components/ViewBarFilterDropdownAdvancedFilterButton.tsx @@ -35,7 +35,7 @@ export const ViewBarFilterDropdownAdvancedFilterButton = () => { const { t } = useLingui(); - const isSelected = useAtomComponentFamilyStateValue( + const isSelectedItemId = useAtomComponentFamilyStateValue( isSelectedItemIdComponentFamilyState, VIEW_BAR_FILTER_BOTTOM_MENU_ITEM_IDS.ADVANCED_FILTER, ); @@ -130,7 +130,7 @@ export const ViewBarFilterDropdownAdvancedFilterButton = () => { text={t`Advanced filter`} onClick={handleClick} LeftIcon={IconFilter} - focused={isSelected} + focused={isSelectedItemId} /> {advancedFilterQuerySubFilterCount > 0 && ( diff --git a/packages/twenty-front/src/modules/views/components/ViewBarFilterDropdownAnyFieldSearchButtonMenuItem.tsx b/packages/twenty-front/src/modules/views/components/ViewBarFilterDropdownAnyFieldSearchButtonMenuItem.tsx index 9041094f82..4a19b51397 100644 --- a/packages/twenty-front/src/modules/views/components/ViewBarFilterDropdownAnyFieldSearchButtonMenuItem.tsx +++ b/packages/twenty-front/src/modules/views/components/ViewBarFilterDropdownAnyFieldSearchButtonMenuItem.tsx @@ -29,7 +29,7 @@ export const ViewBarFilterDropdownAnyFieldSearchButtonMenuItem = ({ objectFilterDropdownSearchInputComponentState, ); - const isSelected = useAtomComponentFamilyStateValue( + const isSelectedItemId = useAtomComponentFamilyStateValue( isSelectedItemIdComponentFamilyState, VIEW_BAR_FILTER_BOTTOM_MENU_ITEM_IDS.SEARCH, ); @@ -40,7 +40,7 @@ export const ViewBarFilterDropdownAnyFieldSearchButtonMenuItem = ({ onEnter={onClick} > { const { resetSelectedItem } = useSelectableList(FILTER_FIELD_LIST_ID); - const isSelectedItem = useAtomComponentFamilyStateValue( + const isSelectedItemId = useAtomComponentFamilyStateValue( isSelectedItemIdComponentFamilyState, fieldMetadataItemToSelect.id, ); @@ -43,7 +43,7 @@ export const ViewBarFilterDropdownFieldSelectMenuItem = ({ onEnter={handleClick} > { - const currentViewId = useAtomComponentStateValue( + const contextStoreCurrentViewId = useAtomComponentStateValue( contextStoreCurrentViewIdComponentState, ); @@ -21,7 +21,7 @@ export const ViewBarRecordFieldEffect = () => { const currentView = useAtomFamilySelectorValue( coreViewFromViewIdFamilySelector, { - viewId: currentViewId ?? '', + viewId: contextStoreCurrentViewId ?? '', }, ); @@ -31,7 +31,7 @@ export const ViewBarRecordFieldEffect = () => { ] = useAtomComponentFamilyState( hasInitializedCurrentRecordFieldsComponentFamilyState, { - viewId: currentViewId ?? undefined, + viewId: contextStoreCurrentViewId ?? undefined, }, ); @@ -54,7 +54,7 @@ export const ViewBarRecordFieldEffect = () => { setHasInitializedCurrentRecordFields(true); } }, [ - currentViewId, + contextStoreCurrentViewId, setCurrentRecordFields, hasInitializedCurrentRecordFields, setHasInitializedCurrentRecordFields, diff --git a/packages/twenty-front/src/modules/views/components/ViewBarRecordFilterEffect.tsx b/packages/twenty-front/src/modules/views/components/ViewBarRecordFilterEffect.tsx index bd9ff224a3..28fcdd518d 100644 --- a/packages/twenty-front/src/modules/views/components/ViewBarRecordFilterEffect.tsx +++ b/packages/twenty-front/src/modules/views/components/ViewBarRecordFilterEffect.tsx @@ -12,7 +12,7 @@ import { useEffect } from 'react'; import { isDefined } from 'twenty-shared/utils'; export const ViewBarRecordFilterEffect = () => { - const currentViewId = useAtomComponentStateValue( + const contextStoreCurrentViewId = useAtomComponentStateValue( contextStoreCurrentViewIdComponentState, ); @@ -21,7 +21,7 @@ export const ViewBarRecordFilterEffect = () => { const currentView = useAtomFamilySelectorValue( coreViewFromViewIdFamilySelector, { - viewId: currentViewId ?? '', + viewId: contextStoreCurrentViewId ?? '', }, ); @@ -31,7 +31,7 @@ export const ViewBarRecordFilterEffect = () => { ] = useAtomComponentFamilyState( hasInitializedCurrentRecordFiltersComponentFamilyState, { - viewId: currentViewId ?? undefined, + viewId: contextStoreCurrentViewId ?? undefined, }, ); @@ -55,7 +55,7 @@ export const ViewBarRecordFilterEffect = () => { setHasInitializedCurrentRecordFilters(true); } }, [ - currentViewId, + contextStoreCurrentViewId, setCurrentRecordFilters, mapViewFiltersToRecordFilters, hasInitializedCurrentRecordFilters, diff --git a/packages/twenty-front/src/modules/views/components/ViewBarRecordFilterGroupEffect.tsx b/packages/twenty-front/src/modules/views/components/ViewBarRecordFilterGroupEffect.tsx index c6a3e4ba73..69d9d7ca35 100644 --- a/packages/twenty-front/src/modules/views/components/ViewBarRecordFilterGroupEffect.tsx +++ b/packages/twenty-front/src/modules/views/components/ViewBarRecordFilterGroupEffect.tsx @@ -12,7 +12,7 @@ import { useEffect } from 'react'; import { isDefined } from 'twenty-shared/utils'; export const ViewBarRecordFilterGroupEffect = () => { - const currentViewId = useAtomComponentStateValue( + const contextStoreCurrentViewId = useAtomComponentStateValue( contextStoreCurrentViewIdComponentState, ); @@ -21,7 +21,7 @@ export const ViewBarRecordFilterGroupEffect = () => { const currentView = useAtomFamilySelectorValue( coreViewFromViewIdFamilySelector, { - viewId: currentViewId ?? '', + viewId: contextStoreCurrentViewId ?? '', }, ); @@ -31,7 +31,7 @@ export const ViewBarRecordFilterGroupEffect = () => { ] = useAtomComponentFamilyState( hasInitializedCurrentRecordFilterGroupsComponentFamilyState, { - viewId: currentViewId ?? undefined, + viewId: contextStoreCurrentViewId ?? undefined, }, ); @@ -57,7 +57,7 @@ export const ViewBarRecordFilterGroupEffect = () => { } } }, [ - currentViewId, + contextStoreCurrentViewId, setCurrentRecordFilterGroups, hasInitializedCurrentRecordFilterGroups, setHasInitializedCurrentRecordFilterGroups, diff --git a/packages/twenty-front/src/modules/views/components/ViewBarRecordSortEffect.tsx b/packages/twenty-front/src/modules/views/components/ViewBarRecordSortEffect.tsx index 522891cced..b83a057fc5 100644 --- a/packages/twenty-front/src/modules/views/components/ViewBarRecordSortEffect.tsx +++ b/packages/twenty-front/src/modules/views/components/ViewBarRecordSortEffect.tsx @@ -11,7 +11,7 @@ import { useEffect } from 'react'; import { isDefined } from 'twenty-shared/utils'; export const ViewBarRecordSortEffect = () => { - const currentViewId = useAtomComponentStateValue( + const contextStoreCurrentViewId = useAtomComponentStateValue( contextStoreCurrentViewIdComponentState, ); @@ -20,7 +20,7 @@ export const ViewBarRecordSortEffect = () => { const currentView = useAtomFamilySelectorValue( coreViewFromViewIdFamilySelector, { - viewId: currentViewId ?? '', + viewId: contextStoreCurrentViewId ?? '', }, ); @@ -30,7 +30,7 @@ export const ViewBarRecordSortEffect = () => { ] = useAtomComponentFamilyState( hasInitializedCurrentRecordSortsComponentFamilyState, { - viewId: currentViewId ?? undefined, + viewId: contextStoreCurrentViewId ?? undefined, }, ); diff --git a/packages/twenty-front/src/modules/views/components/__stories__/ViewBarFilterDropdown.stories.tsx b/packages/twenty-front/src/modules/views/components/__stories__/ViewBarFilterDropdown.stories.tsx index 5d71658b3c..ba7842ef49 100644 --- a/packages/twenty-front/src/modules/views/components/__stories__/ViewBarFilterDropdown.stories.tsx +++ b/packages/twenty-front/src/modules/views/components/__stories__/ViewBarFilterDropdown.stories.tsx @@ -47,7 +47,7 @@ const meta: Meta = { const mockCoreView = mockedCoreViewsData[0]; - const setCurrentViewId = useSetAtomComponentState( + const setContextStoreCurrentViewId = useSetAtomComponentState( contextStoreCurrentViewIdComponentState, MAIN_CONTEXT_STORE_INSTANCE_ID, ); @@ -71,12 +71,12 @@ const meta: Meta = { useEffect(() => { setCoreViews([mockCoreView]); - setCurrentViewId(mockCoreView.id); + setContextStoreCurrentViewId(mockCoreView.id); setCurrentRecordFields(columns); setIsLoaded(true); }, [ setCoreViews, - setCurrentViewId, + setContextStoreCurrentViewId, setCurrentRecordFields, mockCoreView, columns, diff --git a/packages/twenty-front/src/modules/views/hooks/__tests__/useApplyCurrentViewFiltersToCurrentRecordFilters.test.tsx b/packages/twenty-front/src/modules/views/hooks/__tests__/useApplyCurrentViewFiltersToCurrentRecordFilters.test.tsx index 04a0005d76..48badad166 100644 --- a/packages/twenty-front/src/modules/views/hooks/__tests__/useApplyCurrentViewFiltersToCurrentRecordFilters.test.tsx +++ b/packages/twenty-front/src/modules/views/hooks/__tests__/useApplyCurrentViewFiltersToCurrentRecordFilters.test.tsx @@ -97,14 +97,14 @@ describe('useApplyCurrentViewFiltersToCurrentRecordFilters', () => { const { applyCurrentViewFiltersToCurrentRecordFilters } = useApplyCurrentViewFiltersToCurrentRecordFilters(); - const currentFilters = useAtomComponentStateValue( + const currentRecordFilters = useAtomComponentStateValue( currentRecordFiltersComponentState, 'recordIndexId', ); return { applyCurrentViewFiltersToCurrentRecordFilters, - currentFilters, + currentRecordFilters, }; }, { @@ -122,7 +122,7 @@ describe('useApplyCurrentViewFiltersToCurrentRecordFilters', () => { result.current.applyCurrentViewFiltersToCurrentRecordFilters(); }); - expect(result.current.currentFilters).toEqual([ + expect(result.current.currentRecordFilters).toEqual([ { id: mockViewFilter.id, fieldMetadataId: mockViewFilter.fieldMetadataId, @@ -146,14 +146,14 @@ describe('useApplyCurrentViewFiltersToCurrentRecordFilters', () => { const { applyCurrentViewFiltersToCurrentRecordFilters } = useApplyCurrentViewFiltersToCurrentRecordFilters(); - const currentFilters = useAtomComponentStateValue( + const currentRecordFilters = useAtomComponentStateValue( currentRecordFiltersComponentState, 'recordIndexId', ); return { applyCurrentViewFiltersToCurrentRecordFilters, - currentFilters, + currentRecordFilters, }; }, { @@ -178,7 +178,7 @@ describe('useApplyCurrentViewFiltersToCurrentRecordFilters', () => { result.current.applyCurrentViewFiltersToCurrentRecordFilters(); }); - expect(result.current.currentFilters).toEqual([]); + expect(result.current.currentRecordFilters).toEqual([]); }); it('should handle view with empty filters', () => { @@ -189,14 +189,14 @@ describe('useApplyCurrentViewFiltersToCurrentRecordFilters', () => { const { applyCurrentViewFiltersToCurrentRecordFilters } = useApplyCurrentViewFiltersToCurrentRecordFilters(); - const currentFilters = useAtomComponentStateValue( + const currentRecordFilters = useAtomComponentStateValue( currentRecordFiltersComponentState, 'recordIndexId', ); return { applyCurrentViewFiltersToCurrentRecordFilters, - currentFilters, + currentRecordFilters, }; }, { @@ -221,6 +221,6 @@ describe('useApplyCurrentViewFiltersToCurrentRecordFilters', () => { result.current.applyCurrentViewFiltersToCurrentRecordFilters(); }); - expect(result.current.currentFilters).toEqual([]); + expect(result.current.currentRecordFilters).toEqual([]); }); }); diff --git a/packages/twenty-front/src/modules/views/hooks/__tests__/useApplyCurrentViewSortsToCurrentRecordSorts.test.tsx b/packages/twenty-front/src/modules/views/hooks/__tests__/useApplyCurrentViewSortsToCurrentRecordSorts.test.tsx index 0d8bd61eda..d12fdb446f 100644 --- a/packages/twenty-front/src/modules/views/hooks/__tests__/useApplyCurrentViewSortsToCurrentRecordSorts.test.tsx +++ b/packages/twenty-front/src/modules/views/hooks/__tests__/useApplyCurrentViewSortsToCurrentRecordSorts.test.tsx @@ -84,14 +84,14 @@ describe('useApplyCurrentViewSortsToCurrentRecordSorts', () => { const { applyCurrentViewSortsToCurrentRecordSorts } = useApplyCurrentViewSortsToCurrentRecordSorts(); - const currentSorts = useAtomComponentStateValue( + const currentRecordSorts = useAtomComponentStateValue( currentRecordSortsComponentState, 'recordIndexId', ); return { applyCurrentViewSortsToCurrentRecordSorts, - currentSorts, + currentRecordSorts, }; }, { @@ -109,7 +109,7 @@ describe('useApplyCurrentViewSortsToCurrentRecordSorts', () => { result.current.applyCurrentViewSortsToCurrentRecordSorts(); }); - expect(result.current.currentSorts).toEqual([ + expect(result.current.currentRecordSorts).toEqual([ { id: mockViewSort.id, fieldMetadataId: mockViewSort.fieldMetadataId, @@ -126,14 +126,14 @@ describe('useApplyCurrentViewSortsToCurrentRecordSorts', () => { const { applyCurrentViewSortsToCurrentRecordSorts } = useApplyCurrentViewSortsToCurrentRecordSorts(); - const currentSorts = useAtomComponentStateValue( + const currentRecordSorts = useAtomComponentStateValue( currentRecordSortsComponentState, 'recordIndexId', ); return { applyCurrentViewSortsToCurrentRecordSorts, - currentSorts, + currentRecordSorts, }; }, { @@ -158,7 +158,7 @@ describe('useApplyCurrentViewSortsToCurrentRecordSorts', () => { result.current.applyCurrentViewSortsToCurrentRecordSorts(); }); - expect(result.current.currentSorts).toEqual([]); + expect(result.current.currentRecordSorts).toEqual([]); }); it('should handle view with empty sorts', () => { @@ -174,14 +174,14 @@ describe('useApplyCurrentViewSortsToCurrentRecordSorts', () => { const { applyCurrentViewSortsToCurrentRecordSorts } = useApplyCurrentViewSortsToCurrentRecordSorts(); - const currentSorts = useAtomComponentStateValue( + const currentRecordSorts = useAtomComponentStateValue( currentRecordSortsComponentState, 'recordIndexId', ); return { applyCurrentViewSortsToCurrentRecordSorts, - currentSorts, + currentRecordSorts, }; }, { @@ -206,6 +206,6 @@ describe('useApplyCurrentViewSortsToCurrentRecordSorts', () => { result.current.applyCurrentViewSortsToCurrentRecordSorts(); }); - expect(result.current.currentSorts).toEqual([]); + expect(result.current.currentRecordSorts).toEqual([]); }); }); diff --git a/packages/twenty-front/src/modules/views/hooks/__tests__/useApplyViewFiltersToCurrentRecordFilters.test.tsx b/packages/twenty-front/src/modules/views/hooks/__tests__/useApplyViewFiltersToCurrentRecordFilters.test.tsx index 8991c04ba5..196012f2b2 100644 --- a/packages/twenty-front/src/modules/views/hooks/__tests__/useApplyViewFiltersToCurrentRecordFilters.test.tsx +++ b/packages/twenty-front/src/modules/views/hooks/__tests__/useApplyViewFiltersToCurrentRecordFilters.test.tsx @@ -42,11 +42,11 @@ describe('useApplyViewFiltersToCurrentRecordFilters', () => { const { applyViewFiltersToCurrentRecordFilters } = useApplyViewFiltersToCurrentRecordFilters(); - const currentFilters = useAtomComponentStateValue( + const currentRecordFilters = useAtomComponentStateValue( currentRecordFiltersComponentState, ); - return { applyViewFiltersToCurrentRecordFilters, currentFilters }; + return { applyViewFiltersToCurrentRecordFilters, currentRecordFilters }; }, { wrapper: getJestMetadataAndApolloMocksAndActionMenuWrapper({ @@ -62,7 +62,7 @@ describe('useApplyViewFiltersToCurrentRecordFilters', () => { result.current.applyViewFiltersToCurrentRecordFilters([mockViewFilter]); }); - expect(result.current.currentFilters).toEqual([ + expect(result.current.currentRecordFilters).toEqual([ { id: mockViewFilter.id, fieldMetadataId: mockViewFilter.fieldMetadataId, @@ -83,11 +83,11 @@ describe('useApplyViewFiltersToCurrentRecordFilters', () => { const { applyViewFiltersToCurrentRecordFilters } = useApplyViewFiltersToCurrentRecordFilters(); - const currentFilters = useAtomComponentStateValue( + const currentRecordFilters = useAtomComponentStateValue( currentRecordFiltersComponentState, ); - return { applyViewFiltersToCurrentRecordFilters, currentFilters }; + return { applyViewFiltersToCurrentRecordFilters, currentRecordFilters }; }, { wrapper: getJestMetadataAndApolloMocksAndActionMenuWrapper({ @@ -103,6 +103,6 @@ describe('useApplyViewFiltersToCurrentRecordFilters', () => { result.current.applyViewFiltersToCurrentRecordFilters([]); }); - expect(result.current.currentFilters).toEqual([]); + expect(result.current.currentRecordFilters).toEqual([]); }); }); diff --git a/packages/twenty-front/src/modules/views/hooks/__tests__/useApplyViewSortsToCurrentRecordSorts.test.tsx b/packages/twenty-front/src/modules/views/hooks/__tests__/useApplyViewSortsToCurrentRecordSorts.test.tsx index ebcc60fa43..53274867cb 100644 --- a/packages/twenty-front/src/modules/views/hooks/__tests__/useApplyViewSortsToCurrentRecordSorts.test.tsx +++ b/packages/twenty-front/src/modules/views/hooks/__tests__/useApplyViewSortsToCurrentRecordSorts.test.tsx @@ -45,11 +45,11 @@ describe('useApplyViewSortsToCurrentRecordSorts', () => { const { applyViewSortsToCurrentRecordSorts } = useApplyViewSortsToCurrentRecordSorts(); - const currentSorts = useAtomComponentStateValue( + const currentRecordSorts = useAtomComponentStateValue( currentRecordSortsComponentState, ); - return { applyViewSortsToCurrentRecordSorts, currentSorts }; + return { applyViewSortsToCurrentRecordSorts, currentRecordSorts }; }, { wrapper: getJestMetadataAndApolloMocksAndActionMenuWrapper({ @@ -65,7 +65,7 @@ describe('useApplyViewSortsToCurrentRecordSorts', () => { result.current.applyViewSortsToCurrentRecordSorts([mockViewSort]); }); - expect(result.current.currentSorts).toEqual([ + expect(result.current.currentRecordSorts).toEqual([ { id: mockViewSort.id, fieldMetadataId: mockViewSort.fieldMetadataId, @@ -80,11 +80,11 @@ describe('useApplyViewSortsToCurrentRecordSorts', () => { const { applyViewSortsToCurrentRecordSorts } = useApplyViewSortsToCurrentRecordSorts(); - const currentSorts = useAtomComponentStateValue( + const currentRecordSorts = useAtomComponentStateValue( currentRecordSortsComponentState, ); - return { applyViewSortsToCurrentRecordSorts, currentSorts }; + return { applyViewSortsToCurrentRecordSorts, currentRecordSorts }; }, { wrapper: getJestMetadataAndApolloMocksAndActionMenuWrapper({ @@ -100,6 +100,6 @@ describe('useApplyViewSortsToCurrentRecordSorts', () => { result.current.applyViewSortsToCurrentRecordSorts([]); }); - expect(result.current.currentSorts).toEqual([]); + expect(result.current.currentRecordSorts).toEqual([]); }); }); diff --git a/packages/twenty-front/src/modules/views/hooks/useApplyCurrentViewAnyFieldFilterToAnyFieldFilter.ts b/packages/twenty-front/src/modules/views/hooks/useApplyCurrentViewAnyFieldFilterToAnyFieldFilter.ts index c78733517d..3f4c609d8b 100644 --- a/packages/twenty-front/src/modules/views/hooks/useApplyCurrentViewAnyFieldFilterToAnyFieldFilter.ts +++ b/packages/twenty-front/src/modules/views/hooks/useApplyCurrentViewAnyFieldFilterToAnyFieldFilter.ts @@ -8,7 +8,7 @@ import { useCallback } from 'react'; import { isDefined } from 'twenty-shared/utils'; export const useApplyCurrentViewAnyFieldFilterToAnyFieldFilter = () => { - const currentViewId = useAtomComponentStateValue( + const contextStoreCurrentViewId = useAtomComponentStateValue( contextStoreCurrentViewIdComponentState, ); @@ -21,14 +21,14 @@ export const useApplyCurrentViewAnyFieldFilterToAnyFieldFilter = () => { const applyCurrentViewAnyFieldFilterToAnyFieldFilter = useCallback(() => { const currentView = store.get( coreViewFromViewIdFamilySelector.selectorFamily({ - viewId: currentViewId ?? '', + viewId: contextStoreCurrentViewId ?? '', }), ); if (isDefined(currentView)) { setAnyFieldFilterValue(currentView.anyFieldFilterValue ?? ''); } - }, [currentViewId, setAnyFieldFilterValue, store]); + }, [contextStoreCurrentViewId, setAnyFieldFilterValue, store]); return { applyCurrentViewAnyFieldFilterToAnyFieldFilter, diff --git a/packages/twenty-front/src/modules/views/hooks/useApplyCurrentViewFilterGroupsToCurrentRecordFilterGroups.ts b/packages/twenty-front/src/modules/views/hooks/useApplyCurrentViewFilterGroupsToCurrentRecordFilterGroups.ts index a8a9f5bddc..09a74126ff 100644 --- a/packages/twenty-front/src/modules/views/hooks/useApplyCurrentViewFilterGroupsToCurrentRecordFilterGroups.ts +++ b/packages/twenty-front/src/modules/views/hooks/useApplyCurrentViewFilterGroupsToCurrentRecordFilterGroups.ts @@ -12,7 +12,7 @@ import { isDeeplyEqual } from '~/utils/isDeeplyEqual'; export const useApplyCurrentViewFilterGroupsToCurrentRecordFilterGroups = () => { - const currentViewId = useAtomComponentStateValue( + const contextStoreCurrentViewId = useAtomComponentStateValue( contextStoreCurrentViewIdComponentState, ); @@ -30,7 +30,7 @@ export const useApplyCurrentViewFilterGroupsToCurrentRecordFilterGroups = useCallback(() => { const currentView = store.get( coreViewFromViewIdFamilySelector.selectorFamily({ - viewId: currentViewId ?? '', + viewId: contextStoreCurrentViewId ?? '', }), ); @@ -50,7 +50,7 @@ export const useApplyCurrentViewFilterGroupsToCurrentRecordFilterGroups = } } }, [ - currentViewId, + contextStoreCurrentViewId, setCurrentRecordFilterGroups, currentRecordFilterGroups, store, diff --git a/packages/twenty-front/src/modules/views/hooks/useApplyCurrentViewFiltersToCurrentRecordFilters.ts b/packages/twenty-front/src/modules/views/hooks/useApplyCurrentViewFiltersToCurrentRecordFilters.ts index 6ac6746ee7..080112a472 100644 --- a/packages/twenty-front/src/modules/views/hooks/useApplyCurrentViewFiltersToCurrentRecordFilters.ts +++ b/packages/twenty-front/src/modules/views/hooks/useApplyCurrentViewFiltersToCurrentRecordFilters.ts @@ -9,7 +9,7 @@ import { isDefined } from 'twenty-shared/utils'; import { useMapViewFiltersToFilters } from './useMapViewFiltersToFilters'; export const useApplyCurrentViewFiltersToCurrentRecordFilters = () => { - const currentViewId = useAtomComponentStateValue( + const contextStoreCurrentViewId = useAtomComponentStateValue( contextStoreCurrentViewIdComponentState, ); @@ -24,7 +24,7 @@ export const useApplyCurrentViewFiltersToCurrentRecordFilters = () => { const applyCurrentViewFiltersToCurrentRecordFilters = useCallback(() => { const currentView = store.get( coreViewFromViewIdFamilySelector.selectorFamily({ - viewId: currentViewId ?? '', + viewId: contextStoreCurrentViewId ?? '', }), ); @@ -34,7 +34,7 @@ export const useApplyCurrentViewFiltersToCurrentRecordFilters = () => { ); } }, [ - currentViewId, + contextStoreCurrentViewId, mapViewFiltersToRecordFilters, setCurrentRecordFilters, store, diff --git a/packages/twenty-front/src/modules/views/hooks/useApplyCurrentViewSortsToCurrentRecordSorts.ts b/packages/twenty-front/src/modules/views/hooks/useApplyCurrentViewSortsToCurrentRecordSorts.ts index 06da42f9ea..b76d69f9c8 100644 --- a/packages/twenty-front/src/modules/views/hooks/useApplyCurrentViewSortsToCurrentRecordSorts.ts +++ b/packages/twenty-front/src/modules/views/hooks/useApplyCurrentViewSortsToCurrentRecordSorts.ts @@ -7,14 +7,14 @@ import { coreViewFromViewIdFamilySelector } from '@/views/states/selectors/coreV import { isDefined } from 'twenty-shared/utils'; export const useApplyCurrentViewSortsToCurrentRecordSorts = () => { - const currentViewId = useAtomComponentStateValue( + const contextStoreCurrentViewId = useAtomComponentStateValue( contextStoreCurrentViewIdComponentState, ); const currentView = useAtomFamilySelectorValue( coreViewFromViewIdFamilySelector, { - viewId: currentViewId ?? '', + viewId: contextStoreCurrentViewId ?? '', }, ); diff --git a/packages/twenty-front/src/modules/views/hooks/useGetCurrentViewOnly.ts b/packages/twenty-front/src/modules/views/hooks/useGetCurrentViewOnly.ts index f69faa2765..2a4ea021a5 100644 --- a/packages/twenty-front/src/modules/views/hooks/useGetCurrentViewOnly.ts +++ b/packages/twenty-front/src/modules/views/hooks/useGetCurrentViewOnly.ts @@ -4,14 +4,14 @@ import { useAtomFamilySelectorValue } from '@/ui/utilities/state/jotai/hooks/use import { coreViewFromViewIdFamilySelector } from '@/views/states/selectors/coreViewFromViewIdFamilySelector'; export const useGetCurrentViewOnly = () => { - const currentViewId = useAtomComponentStateValue( + const contextStoreCurrentViewId = useAtomComponentStateValue( contextStoreCurrentViewIdComponentState, ); const currentView = useAtomFamilySelectorValue( coreViewFromViewIdFamilySelector, { - viewId: currentViewId ?? '', + viewId: contextStoreCurrentViewId ?? '', }, ); diff --git a/packages/twenty-front/src/modules/views/hooks/useOpenAnyFieldSearchFilterFromViewBar.ts b/packages/twenty-front/src/modules/views/hooks/useOpenAnyFieldSearchFilterFromViewBar.ts index 80090ae0d5..f68d73fdee 100644 --- a/packages/twenty-front/src/modules/views/hooks/useOpenAnyFieldSearchFilterFromViewBar.ts +++ b/packages/twenty-front/src/modules/views/hooks/useOpenAnyFieldSearchFilterFromViewBar.ts @@ -14,7 +14,7 @@ export const useOpenAnyFieldSearchFilterFromViewBar = () => { const { objectMetadataItem } = useRecordIndexContextOrThrow(); - const setObjectFilterDropdownAnyFieldSearchIsSelectedComponentState = + const setObjectFilterDropdownAnyFieldSearchIsSelected = useSetAtomComponentState( objectFilterDropdownAnyFieldSearchIsSelectedComponentState, ); @@ -48,7 +48,7 @@ export const useOpenAnyFieldSearchFilterFromViewBar = () => { setAnyFieldFilterValue(filterValue); } - setObjectFilterDropdownAnyFieldSearchIsSelectedComponentState(true); + setObjectFilterDropdownAnyFieldSearchIsSelected(true); }; return { diff --git a/packages/twenty-front/src/modules/views/hooks/useQueryVariablesFromParentView.ts b/packages/twenty-front/src/modules/views/hooks/useQueryVariablesFromParentView.ts index 1e0fc511bc..f1698713e2 100644 --- a/packages/twenty-front/src/modules/views/hooks/useQueryVariablesFromParentView.ts +++ b/packages/twenty-front/src/modules/views/hooks/useQueryVariablesFromParentView.ts @@ -13,7 +13,7 @@ export const useQueryVariablesFromParentView = ({ }) => { const { objectMetadataItems } = useObjectMetadataItems(); - const recordShowParentView = useAtomComponentStateValue( + const contextStoreRecordShowParentView = useAtomComponentStateValue( contextStoreRecordShowParentViewComponentState, MAIN_CONTEXT_STORE_INSTANCE_ID, ); @@ -21,9 +21,10 @@ export const useQueryVariablesFromParentView = ({ const { filterValueDependencies } = useFilterValueDependencies(); const { filter, orderBy } = getQueryVariablesFromFiltersAndSorts({ - recordFilterGroups: recordShowParentView?.parentViewFilterGroups ?? [], - recordFilters: recordShowParentView?.parentViewFilters ?? [], - recordSorts: recordShowParentView?.parentViewSorts ?? [], + recordFilterGroups: + contextStoreRecordShowParentView?.parentViewFilterGroups ?? [], + recordFilters: contextStoreRecordShowParentView?.parentViewFilters ?? [], + recordSorts: contextStoreRecordShowParentView?.parentViewSorts ?? [], objectMetadataItem, objectMetadataItems, filterValueDependencies, diff --git a/packages/twenty-front/src/modules/views/hooks/useUpdateViewAggregate.ts b/packages/twenty-front/src/modules/views/hooks/useUpdateViewAggregate.ts index 60052dc674..30e508dbad 100644 --- a/packages/twenty-front/src/modules/views/hooks/useUpdateViewAggregate.ts +++ b/packages/twenty-front/src/modules/views/hooks/useUpdateViewAggregate.ts @@ -19,7 +19,7 @@ import { useStore } from 'jotai'; export const useUpdateViewAggregate = () => { const store = useStore(); const { canPersistChanges } = useCanPersistViewChanges(); - const currentViewId = useAtomComponentStateValue( + const contextStoreCurrentViewId = useAtomComponentStateValue( contextStoreCurrentViewIdComponentState, ); const { performViewAPIUpdate } = usePerformViewAPIUpdate(); @@ -47,12 +47,12 @@ export const useUpdateViewAggregate = () => { ) : null; - if (!isDefined(currentViewId)) { + if (!isDefined(contextStoreCurrentViewId)) { return; } const updatedViewResult = await performViewAPIUpdate({ - id: currentViewId, + id: contextStoreCurrentViewId, input: { kanbanAggregateOperationFieldMetadataId, kanbanAggregateOperation: convertedKanbanAggregateOperation, @@ -81,7 +81,7 @@ export const useUpdateViewAggregate = () => { }, [ canPersistChanges, - currentViewId, + contextStoreCurrentViewId, performViewAPIUpdate, loadRecordIndexStates, store, diff --git a/packages/twenty-front/src/modules/workflow/hooks/useWorkflowRunIdOrThrow.ts b/packages/twenty-front/src/modules/workflow/hooks/useWorkflowRunIdOrThrow.ts index 2c5e0433e1..5715755abc 100644 --- a/packages/twenty-front/src/modules/workflow/hooks/useWorkflowRunIdOrThrow.ts +++ b/packages/twenty-front/src/modules/workflow/hooks/useWorkflowRunIdOrThrow.ts @@ -3,13 +3,13 @@ import { workflowVisualizerWorkflowRunIdComponentState } from '@/workflow/states import { isDefined } from 'twenty-shared/utils'; export const useWorkflowRunIdOrThrow = () => { - const workflowRunId = useAtomComponentStateValue( + const workflowVisualizerWorkflowRunId = useAtomComponentStateValue( workflowVisualizerWorkflowRunIdComponentState, ); - if (!isDefined(workflowRunId)) { + if (!isDefined(workflowVisualizerWorkflowRunId)) { throw new Error('Expected the workflow run ID to be defined'); } - return workflowRunId; + return workflowVisualizerWorkflowRunId; }; diff --git a/packages/twenty-front/src/modules/workflow/hooks/useWorkflowVersionIdOrThrow.ts b/packages/twenty-front/src/modules/workflow/hooks/useWorkflowVersionIdOrThrow.ts index 0d8ff64712..5d1fb926c1 100644 --- a/packages/twenty-front/src/modules/workflow/hooks/useWorkflowVersionIdOrThrow.ts +++ b/packages/twenty-front/src/modules/workflow/hooks/useWorkflowVersionIdOrThrow.ts @@ -3,13 +3,13 @@ import { workflowVisualizerWorkflowVersionIdComponentState } from '@/workflow/st import { isDefined } from 'twenty-shared/utils'; export const useWorkflowVersionIdOrThrow = () => { - const workflowVersionId = useAtomComponentStateValue( + const workflowVisualizerWorkflowVersionId = useAtomComponentStateValue( workflowVisualizerWorkflowVersionIdComponentState, ); - if (!isDefined(workflowVersionId)) { + if (!isDefined(workflowVisualizerWorkflowVersionId)) { throw new Error('Expected the workflow version ID to be defined'); } - return workflowVersionId; + return workflowVisualizerWorkflowVersionId; }; diff --git a/packages/twenty-front/src/modules/workflow/workflow-diagram/components/WorkflowDiagramCanvasBase.tsx b/packages/twenty-front/src/modules/workflow/workflow-diagram/components/WorkflowDiagramCanvasBase.tsx index 895745d337..041477e904 100644 --- a/packages/twenty-front/src/modules/workflow/workflow-diagram/components/WorkflowDiagramCanvasBase.tsx +++ b/packages/twenty-front/src/modules/workflow/workflow-diagram/components/WorkflowDiagramCanvasBase.tsx @@ -170,13 +170,13 @@ export const WorkflowDiagramCanvasBase = ({ const reactflow = useReactFlow(); - const currentWorkflowDiagram = useAtomComponentStateValue( + const workflowDiagram = useAtomComponentStateValue( workflowDiagramComponentState, ); const workflowDiagramPanOnDrag = useAtomComponentStateValue( workflowDiagramPanOnDragComponentState, ); - const workflowDiagram = useAtomComponentStateCallbackState( + const workflowDiagramCallbackState = useAtomComponentStateCallbackState( workflowDiagramComponentState, ); const setWorkflowDiagram = useSetAtomComponentState( @@ -213,12 +213,12 @@ export const WorkflowDiagramCanvasBase = ({ } | null>(null); const { nodes, edges } = useMemo(() => { - if (!isDefined(currentWorkflowDiagram)) { + if (!isDefined(workflowDiagram)) { return { nodes: [], edges: [] }; } - const nodes = [...currentWorkflowDiagram.nodes]; - const edges = [...currentWorkflowDiagram.edges]; + const nodes = [...workflowDiagram.nodes]; + const edges = [...workflowDiagram.edges]; if ( isDefined(workflowInsertStepIds.position) && @@ -255,7 +255,7 @@ export const WorkflowDiagramCanvasBase = ({ } return { nodes, edges }; - }, [currentWorkflowDiagram, workflowInsertStepIds]); + }, [workflowDiagram, workflowInsertStepIds]); const isCommandMenuOpened = useAtomStateValue(isCommandMenuOpenedState); const { isInRightDrawer } = useContext(ActionMenuContext); @@ -357,10 +357,10 @@ export const WorkflowDiagramCanvasBase = ({ isInRightDrawer, isCommandMenuOpened, workflowDiagramFlowInitialized, - workflowDiagram: store.get(workflowDiagram), + workflowDiagram: store.get(workflowDiagramCallbackState), }); }, - [setFlowViewport, workflowDiagram, store], + [setFlowViewport, workflowDiagramCallbackState, store], ); useEffect(() => { @@ -378,7 +378,7 @@ export const WorkflowDiagramCanvasBase = ({ const handleNodesChanges = useCallback( (changes: NodeChange[]) => { - const existingWorkflowDiagram = store.get(workflowDiagram); + const existingWorkflowDiagram = store.get(workflowDiagramCallbackState); const filteredChanges = changes.filter( (change) => @@ -399,7 +399,7 @@ export const WorkflowDiagramCanvasBase = ({ }; } - store.set(workflowDiagram, updatedWorkflowDiagram); + store.set(workflowDiagramCallbackState, updatedWorkflowDiagram); const currentWorkflowDiagramWaitingNodesDimensions = store.get( workflowDiagramWaitingNodesDimensions, @@ -419,7 +419,7 @@ export const WorkflowDiagramCanvasBase = ({ isCommandMenuOpened, setFlowViewport, workflowDiagramFlowInitialized, - workflowDiagram, + workflowDiagramCallbackState, workflowDiagramWaitingNodesDimensions, isInRightDrawer, store, diff --git a/packages/twenty-front/src/modules/workflow/workflow-diagram/components/WorkflowRunVisualizerEffect.tsx b/packages/twenty-front/src/modules/workflow/workflow-diagram/components/WorkflowRunVisualizerEffect.tsx index 0b27af8750..490a8d63f5 100644 --- a/packages/twenty-front/src/modules/workflow/workflow-diagram/components/WorkflowRunVisualizerEffect.tsx +++ b/packages/twenty-front/src/modules/workflow/workflow-diagram/components/WorkflowRunVisualizerEffect.tsx @@ -30,7 +30,7 @@ export const WorkflowRunVisualizerEffect = ({ const { getIcon } = useIcons(); const workflowRun = useWorkflowRun({ workflowRunId }); - const setWorkflowRunId = useSetAtomComponentState( + const setWorkflowVisualizerWorkflowRunId = useSetAtomComponentState( workflowVisualizerWorkflowRunIdComponentState, ); @@ -72,8 +72,8 @@ export const WorkflowRunVisualizerEffect = ({ const store = useStore(); useEffect(() => { - setWorkflowRunId(workflowRunId); - }, [setWorkflowRunId, workflowRunId]); + setWorkflowVisualizerWorkflowRunId(workflowRunId); + }, [setWorkflowVisualizerWorkflowRunId, workflowRunId]); useEffect(() => { if (!isDefined(workflowRun)) { diff --git a/packages/twenty-front/src/modules/workflow/workflow-diagram/workflow-nodes/components/WorkflowRunDiagramStepNode.tsx b/packages/twenty-front/src/modules/workflow/workflow-diagram/workflow-nodes/components/WorkflowRunDiagramStepNode.tsx index 3c63724892..cb56c72723 100644 --- a/packages/twenty-front/src/modules/workflow/workflow-diagram/workflow-nodes/components/WorkflowRunDiagramStepNode.tsx +++ b/packages/twenty-front/src/modules/workflow/workflow-diagram/workflow-nodes/components/WorkflowRunDiagramStepNode.tsx @@ -87,7 +87,7 @@ export const WorkflowRunDiagramStepNode = ({ const { getIcon } = useIcons(); const theme = useTheme(); - const workflowId = useAtomComponentStateValue( + const workflowVisualizerWorkflowId = useAtomComponentStateValue( workflowVisualizerWorkflowIdComponentState, ); const workflowRunId = useWorkflowRunIdOrThrow(); @@ -116,7 +116,7 @@ export const WorkflowRunDiagramStepNode = ({ : 0; const handleClick = () => { - if (!isDefined(workflowId)) { + if (!isDefined(workflowVisualizerWorkflowId)) { throw new Error('Workflow ID must be defined'); } @@ -127,7 +127,7 @@ export const WorkflowRunDiagramStepNode = ({ setWorkflowSelectedNode(id); openWorkflowRunViewStepInCommandMenu({ - workflowId, + workflowId: workflowVisualizerWorkflowId, workflowRunId, title: data.name, icon: getIcon(getWorkflowNodeIconKey(data)), diff --git a/packages/twenty-front/src/modules/workflow/workflow-steps/filters/hooks/useChildStepFiltersAndChildStepFilterGroups.ts b/packages/twenty-front/src/modules/workflow/workflow-steps/filters/hooks/useChildStepFiltersAndChildStepFilterGroups.ts index ffd305201a..633a8d62bc 100644 --- a/packages/twenty-front/src/modules/workflow/workflow-steps/filters/hooks/useChildStepFiltersAndChildStepFilterGroups.ts +++ b/packages/twenty-front/src/modules/workflow/workflow-steps/filters/hooks/useChildStepFiltersAndChildStepFilterGroups.ts @@ -9,15 +9,15 @@ export const useChildStepFiltersAndChildStepFilterGroups = ({ }: { stepFilterGroupId: string; }) => { - const stepFilterGroups = useAtomComponentStateValue( + const currentStepFilterGroups = useAtomComponentStateValue( currentStepFilterGroupsComponentState, ); - const stepFilters = useAtomComponentStateValue( + const currentStepFilters = useAtomComponentStateValue( currentStepFiltersComponentState, ); - const currentStepFilterGroup = stepFilterGroups?.find( + const currentStepFilterGroup = currentStepFilterGroups?.find( (stepFilterGroup) => stepFilterGroup.id === stepFilterGroupId, ); @@ -33,11 +33,11 @@ export const useChildStepFiltersAndChildStepFilterGroups = ({ }; } - const childStepFilters = stepFilters?.filter( + const childStepFilters = currentStepFilters?.filter( (filter) => filter.stepFilterGroupId === currentStepFilterGroup.id, ); - const childStepFilterGroups = stepFilterGroups?.filter( + const childStepFilterGroups = currentStepFilterGroups?.filter( (filterGroup) => filterGroup.parentStepFilterGroupId === currentStepFilterGroup.id, ); diff --git a/packages/twenty-front/src/modules/workflow/workflow-steps/workflow-actions/ai-agent-action/hooks/useResetWorkflowAiAgentPermissionsStateOnCommandMenuClose.ts b/packages/twenty-front/src/modules/workflow/workflow-steps/workflow-actions/ai-agent-action/hooks/useResetWorkflowAiAgentPermissionsStateOnCommandMenuClose.ts index 704b69d8e6..219692fc25 100644 --- a/packages/twenty-front/src/modules/workflow/workflow-steps/workflow-actions/ai-agent-action/hooks/useResetWorkflowAiAgentPermissionsStateOnCommandMenuClose.ts +++ b/packages/twenty-front/src/modules/workflow/workflow-steps/workflow-actions/ai-agent-action/hooks/useResetWorkflowAiAgentPermissionsStateOnCommandMenuClose.ts @@ -5,18 +5,20 @@ import { workflowAiAgentPermissionsIsAddingPermissionState } from '@/workflow/wo import { workflowAiAgentPermissionsSelectedObjectIdState } from '@/workflow/workflow-steps/workflow-actions/ai-agent-action/states/workflowAiAgentPermissionsSelectedObjectIdState'; export const useResetWorkflowAiAgentPermissionsStateOnCommandMenuClose = () => { - const setSelectedObjectId = useSetAtomState( + const setWorkflowAiAgentPermissionsSelectedObjectId = useSetAtomState( workflowAiAgentPermissionsSelectedObjectIdState, ); - const setIsAddingPermission = useSetAtomState( + const setWorkflowAiAgentPermissionsIsAddingPermission = useSetAtomState( workflowAiAgentPermissionsIsAddingPermissionState, ); - const setAgentState = useSetAtomState(workflowAiAgentActionAgentState); + const setWorkflowAiAgentActionAgent = useSetAtomState( + workflowAiAgentActionAgentState, + ); const resetPermissionState = () => { - setSelectedObjectId(undefined); - setIsAddingPermission(false); - setAgentState(undefined); + setWorkflowAiAgentPermissionsSelectedObjectId(undefined); + setWorkflowAiAgentPermissionsIsAddingPermission(false); + setWorkflowAiAgentActionAgent(undefined); }; useListenToSidePanelClosing(resetPermissionState); diff --git a/packages/twenty-front/src/pages/object-record/RecordShowPageTitle.tsx b/packages/twenty-front/src/pages/object-record/RecordShowPageTitle.tsx index 7863afe982..e81a2ecaec 100644 --- a/packages/twenty-front/src/pages/object-record/RecordShowPageTitle.tsx +++ b/packages/twenty-front/src/pages/object-record/RecordShowPageTitle.tsx @@ -18,13 +18,16 @@ export const RecordShowPageTitle = ({ const { objectMetadataItem } = useObjectMetadataItem({ objectNameSingular }); - const record = useAtomFamilyStateValue( + const recordStore = useAtomFamilyStateValue( recordStoreFamilyState, objectRecordId, ); - const pageName = isDefined(record) - ? getLabelIdentifierFieldValue(record, labelIdentifierFieldMetadataItem) + const pageName = isDefined(recordStore) + ? getLabelIdentifierFieldValue( + recordStore, + labelIdentifierFieldMetadataItem, + ) : ''; const pageTitle = pageName.trim() diff --git a/packages/twenty-front/src/pages/settings/accounts/SettingsAccountsConfiguration.tsx b/packages/twenty-front/src/pages/settings/accounts/SettingsAccountsConfiguration.tsx index 97539f490e..3f7df92219 100644 --- a/packages/twenty-front/src/pages/settings/accounts/SettingsAccountsConfiguration.tsx +++ b/packages/twenty-front/src/pages/settings/accounts/SettingsAccountsConfiguration.tsx @@ -30,7 +30,7 @@ export const SettingsAccountsConfiguration = () => { const { enqueueSuccessSnackBar, enqueueErrorSnackBar } = useSnackBar(); const [startChannelSyncMutation, { loading: isSubmitting }] = useStartChannelSyncMutation(); - const setSelectedMessageChannel = useSetAtomState( + const setSettingsAccountsSelectedMessageChannel = useSetAtomState( settingsAccountsSelectedMessageChannelState, ); @@ -55,7 +55,7 @@ export const SettingsAccountsConfiguration = () => { recordGqlFields, onCompleted: (data) => { if (isDefined(data[0])) { - setSelectedMessageChannel(data[0]); + setSettingsAccountsSelectedMessageChannel(data[0]); } }, skip: !connectedAccountId, diff --git a/packages/twenty-front/src/pages/settings/applications/tabs/SettingsApplicationPermissionsTab.tsx b/packages/twenty-front/src/pages/settings/applications/tabs/SettingsApplicationPermissionsTab.tsx index 67c4cd3ce4..8646be4a1b 100644 --- a/packages/twenty-front/src/pages/settings/applications/tabs/SettingsApplicationPermissionsTab.tsx +++ b/packages/twenty-front/src/pages/settings/applications/tabs/SettingsApplicationPermissionsTab.tsx @@ -284,7 +284,7 @@ const MarketplaceRoleEffect = ({ ) => void; }) => { const objectMetadataItems = useAtomStateValue(objectMetadataItemsState); - const setDraftRole = useSetAtomFamilyState( + const setSettingsDraftRole = useSetAtomFamilyState( settingsDraftRoleFamilyState, defaultRole.id, ); @@ -310,8 +310,8 @@ const MarketplaceRoleEffect = ({ }, [defaultRole, objectMetadataItems, marketplaceAppObjects]); useEffect(() => { - setDraftRole(resolvedRole); - }, [resolvedRole, setDraftRole]); + setSettingsDraftRole(resolvedRole); + }, [resolvedRole, setSettingsDraftRole]); useEffect(() => { onObjectMetadataItemsFromMarketplaceApp( diff --git a/packages/twenty-front/src/pages/settings/roles/SettingsRoleEdit.tsx b/packages/twenty-front/src/pages/settings/roles/SettingsRoleEdit.tsx index a11c11ff89..09770592de 100644 --- a/packages/twenty-front/src/pages/settings/roles/SettingsRoleEdit.tsx +++ b/packages/twenty-front/src/pages/settings/roles/SettingsRoleEdit.tsx @@ -10,7 +10,7 @@ import { settingsPersistedRoleFamilyState } from '~/modules/settings/roles/state export const SettingsRoleEdit = () => { const { roleId } = useParams(); - const persistedRole = useAtomFamilyStateValue( + const settingsPersistedRole = useAtomFamilyStateValue( settingsPersistedRoleFamilyState, roleId ?? '', ); @@ -19,7 +19,7 @@ export const SettingsRoleEdit = () => { return ; } - const isCreateMode = !isDefined(persistedRole?.id); + const isCreateMode = !isDefined(settingsPersistedRole?.id); return ( <> diff --git a/packages/twenty-front/src/testing/decorators/ContextStoreDecorator.tsx b/packages/twenty-front/src/testing/decorators/ContextStoreDecorator.tsx index d5e9eb2998..55e4fed904 100644 --- a/packages/twenty-front/src/testing/decorators/ContextStoreDecorator.tsx +++ b/packages/twenty-front/src/testing/decorators/ContextStoreDecorator.tsx @@ -17,7 +17,7 @@ export const ContextStoreDecorator: Decorator = (Story, context) => { componentInstanceId = MAIN_CONTEXT_STORE_INSTANCE_ID; } - const setCurrentObjectMetadataItemId = useSetAtomComponentState( + const setContextStoreCurrentObjectMetadataItemId = useSetAtomComponentState( contextStoreCurrentObjectMetadataItemIdComponentState, componentInstanceId, ); @@ -27,9 +27,9 @@ export const ContextStoreDecorator: Decorator = (Story, context) => { const objectMetadataItem = getMockCompanyObjectMetadataItem(); useEffect(() => { - setCurrentObjectMetadataItemId(objectMetadataItem.id); + setContextStoreCurrentObjectMetadataItemId(objectMetadataItem.id); setIsLoaded(true); - }, [setCurrentObjectMetadataItemId, objectMetadataItem]); + }, [setContextStoreCurrentObjectMetadataItemId, objectMetadataItem]); return ( { - const setAreFavoritesPrefetched = useSetAtomFamilyState( + const setPrefetchIsLoaded = useSetAtomFamilyState( prefetchIsLoadedFamilyState, PrefetchKey.AllFavorites, ); - const setAreFavoritesFoldersPrefetched = useSetAtomFamilyState( + // eslint-disable-next-line twenty/matching-state-variable + const setPrefetchIsLoadedFolders = useSetAtomFamilyState( prefetchIsLoadedFamilyState, PrefetchKey.AllFavoritesFolders, ); - setAreFavoritesPrefetched(true); - setAreFavoritesFoldersPrefetched(true); + setPrefetchIsLoaded(true); + setPrefetchIsLoadedFolders(true); return ; }; diff --git a/packages/twenty-front/src/testing/decorators/PrefetchLoadingDecorator.tsx b/packages/twenty-front/src/testing/decorators/PrefetchLoadingDecorator.tsx index e231eb62bd..c8ebfa33a5 100644 --- a/packages/twenty-front/src/testing/decorators/PrefetchLoadingDecorator.tsx +++ b/packages/twenty-front/src/testing/decorators/PrefetchLoadingDecorator.tsx @@ -10,12 +10,13 @@ export const PrefetchLoadingDecorator: Decorator = (Story, context) => { const prefetchLoadingSetDelay = parameters.prefetchLoadingSetDelay ?? 0; - const setAreFavoritesFoldersPrefetched = useSetAtomFamilyState( + const setPrefetchIsLoaded = useSetAtomFamilyState( prefetchIsLoadedFamilyState, PrefetchKey.AllFavoritesFolders, ); - const setAreFavoritesPrefetched = useSetAtomFamilyState( + // eslint-disable-next-line twenty/matching-state-variable + const setPrefetchIsLoadedFavorites = useSetAtomFamilyState( prefetchIsLoadedFamilyState, PrefetchKey.AllFavorites, ); @@ -30,14 +31,14 @@ export const PrefetchLoadingDecorator: Decorator = (Story, context) => { setIsInitialized(true); setTimeout(() => { - setAreFavoritesPrefetched(false); - setAreFavoritesFoldersPrefetched(false); + setPrefetchIsLoadedFavorites(false); + setPrefetchIsLoaded(false); }, prefetchLoadingSetDelay); }, [ isInitialized, prefetchLoadingSetDelay, - setAreFavoritesFoldersPrefetched, - setAreFavoritesPrefetched, + setPrefetchIsLoaded, + setPrefetchIsLoadedFavorites, ]); return ; diff --git a/packages/twenty-front/src/testing/jest/JestContextStoreSetter.tsx b/packages/twenty-front/src/testing/jest/JestContextStoreSetter.tsx index de583e0324..c4ae490a6f 100644 --- a/packages/twenty-front/src/testing/jest/JestContextStoreSetter.tsx +++ b/packages/twenty-front/src/testing/jest/JestContextStoreSetter.tsx @@ -64,12 +64,12 @@ export const JestContextStoreSetter = ({ instanceId, ); - const setContextStoreFiltersComponentState = useSetAtomComponentState( + const setContextStoreFilters = useSetAtomComponentState( contextStoreFiltersComponentState, instanceId, ); - const setContextStoreFilterGroupsComponentState = useSetAtomComponentState( + const setContextStoreFilterGroups = useSetAtomComponentState( contextStoreFilterGroupsComponentState, instanceId, ); @@ -96,8 +96,8 @@ export const JestContextStoreSetter = ({ setContextStoreTargetedRecordsRule(contextStoreTargetedRecordsRule); setContextStoreCurrentObjectMetadataItemId(objectMetadataItem.id); setContextStoreNumberOfSelectedRecords(contextStoreNumberOfSelectedRecords); - setContextStoreFiltersComponentState(contextStoreFilters); - setContextStoreFilterGroupsComponentState(contextStoreFilterGroups); + setContextStoreFilters(contextStoreFilters); + setContextStoreFilterGroups(contextStoreFilterGroups); setContextStoreCurrentViewType(contextStoreCurrentViewType ?? null); setIsLoaded(true); }, [ @@ -107,14 +107,14 @@ export const JestContextStoreSetter = ({ contextStoreCurrentObjectMetadataId, setContextStoreNumberOfSelectedRecords, contextStoreNumberOfSelectedRecords, - setContextStoreFiltersComponentState, + setContextStoreFilters, contextStoreFilters, objectMetadataItem, setContextStoreCurrentViewId, contextStoreCurrentViewId, setContextStoreCurrentViewType, contextStoreCurrentViewType, - setContextStoreFilterGroupsComponentState, + setContextStoreFilterGroups, contextStoreFilterGroups, ]);