diff --git a/packages/twenty-front/src/modules/action-menu/actions/record-actions/components/ExportRecordsActionEffect.tsx b/packages/twenty-front/src/modules/action-menu/actions/record-actions/components/ExportRecordsActionEffect.tsx index 870eb85a8..6bdc2e648 100644 --- a/packages/twenty-front/src/modules/action-menu/actions/record-actions/components/ExportRecordsActionEffect.tsx +++ b/packages/twenty-front/src/modules/action-menu/actions/record-actions/components/ExportRecordsActionEffect.tsx @@ -1,13 +1,13 @@ import { useActionMenuEntries } from '@/action-menu/hooks/useActionMenuEntries'; -import { - displayedExportProgress, - useExportRecordData, -} from '@/action-menu/hooks/useExportRecordData'; import { contextStoreNumberOfSelectedRecordsComponentState } from '@/context-store/states/contextStoreNumberOfSelectedRecordsComponentState'; import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem'; import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2'; import { IconDatabaseExport } from 'twenty-ui'; +import { + displayedExportProgress, + useExportRecords, +} from '@/object-record/record-index/export/hooks/useExportRecords'; import { useEffect } from 'react'; export const ExportRecordsActionEffect = ({ @@ -22,7 +22,7 @@ export const ExportRecordsActionEffect = ({ contextStoreNumberOfSelectedRecordsComponentState, ); - const { progress, download } = useExportRecordData({ + const { progress, download } = useExportRecords({ delayMs: 100, objectMetadataItem, recordIndexId: objectMetadataItem.namePlural, diff --git a/packages/twenty-front/src/modules/object-record/record-index/components/RecordIndexContainer.tsx b/packages/twenty-front/src/modules/object-record/record-index/components/RecordIndexContainer.tsx index 14e1d9f72..68a3b8e65 100644 --- a/packages/twenty-front/src/modules/object-record/record-index/components/RecordIndexContainer.tsx +++ b/packages/twenty-front/src/modules/object-record/record-index/components/RecordIndexContainer.tsx @@ -26,6 +26,7 @@ import { RecordIndexActionMenu } from '@/action-menu/components/RecordIndexActio import { contextStoreTargetedRecordsRuleComponentState } from '@/context-store/states/contextStoreTargetedRecordsRuleComponentState'; import { useRecordBoard } from '@/object-record/record-board/hooks/useRecordBoard'; import { recordGroupDefinitionsComponentState } from '@/object-record/record-group/states/recordGroupDefinitionsComponentState'; +import { RecordIndexFiltersToContextStoreEffect } from '@/object-record/record-index/components/RecordIndexFiltersToContextStoreEffect'; import { recordIndexViewFilterGroupsState } from '@/object-record/record-index/states/recordIndexViewFilterGroupsState'; import { useRecoilComponentCallbackStateV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentCallbackStateV2'; import { useSetRecoilComponentStateV2 } from '@/ui/utilities/state/component-state/hooks/useSetRecoilComponentStateV2'; @@ -207,7 +208,7 @@ export const RecordIndexContainer = () => { viewBarId={recordIndexId} /> - + {recordIndexViewType === ViewType.Table && ( <> { + const { recordIndexId } = useContext(RecordIndexRootPropsContext); + + const recordIndexFilters = useRecoilValue(recordIndexFiltersState); + + const setContextStoreTargetedRecords = useSetRecoilComponentStateV2( + contextStoreTargetedRecordsRuleComponentState, + ); + + const hasUserSelectedAllRows = useRecoilComponentValueV2( + hasUserSelectedAllRowsComponentState, + recordIndexId, + ); + + const selectedRowIds = useRecoilComponentValueV2( + selectedRowIdsComponentSelector, + recordIndexId, + ); + const unselectedRowIds = useRecoilComponentValueV2( + unselectedRowIdsComponentSelector, + recordIndexId, + ); + + useEffect(() => { + if (hasUserSelectedAllRows) { + setContextStoreTargetedRecords({ + mode: 'exclusion', + excludedRecordIds: unselectedRowIds, + }); + } else { + setContextStoreTargetedRecords({ + mode: 'selection', + selectedRecordIds: selectedRowIds, + }); + } + + return () => { + setContextStoreTargetedRecords({ + mode: 'selection', + selectedRecordIds: [], + }); + }; + }, [ + hasUserSelectedAllRows, + selectedRowIds, + setContextStoreTargetedRecords, + unselectedRowIds, + ]); + + const setContextStoreFilters = useSetRecoilComponentStateV2( + contextStoreFiltersComponentState, + ); + + useEffect(() => { + setContextStoreFilters(recordIndexFilters); + + return () => { + setContextStoreFilters([]); + }; + }, [recordIndexFilters, setContextStoreFilters]); + + return <>; +}; diff --git a/packages/twenty-front/src/modules/object-record/record-index/components/RecordIndexTableContainerEffect.tsx b/packages/twenty-front/src/modules/object-record/record-index/components/RecordIndexTableContainerEffect.tsx index 314b66cef..2ff744268 100644 --- a/packages/twenty-front/src/modules/object-record/record-index/components/RecordIndexTableContainerEffect.tsx +++ b/packages/twenty-front/src/modules/object-record/record-index/components/RecordIndexTableContainerEffect.tsx @@ -1,21 +1,12 @@ import { useContext, useEffect } from 'react'; -import { contextStoreFiltersComponentState } from '@/context-store/states/contextStoreFiltersComponentState'; -import { contextStoreTargetedRecordsRuleComponentState } from '@/context-store/states/contextStoreTargetedRecordsRuleComponentState'; import { useColumnDefinitionsFromFieldMetadata } from '@/object-metadata/hooks/useColumnDefinitionsFromFieldMetadata'; import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem'; import { RecordIndexRootPropsContext } from '@/object-record/record-index/contexts/RecordIndexRootPropsContext'; import { useHandleToggleColumnFilter } from '@/object-record/record-index/hooks/useHandleToggleColumnFilter'; import { useHandleToggleColumnSort } from '@/object-record/record-index/hooks/useHandleToggleColumnSort'; -import { recordIndexFiltersState } from '@/object-record/record-index/states/recordIndexFiltersState'; import { useRecordTable } from '@/object-record/record-table/hooks/useRecordTable'; -import { hasUserSelectedAllRowsComponentState } from '@/object-record/record-table/record-table-row/states/hasUserSelectedAllRowsFamilyState'; -import { selectedRowIdsComponentSelector } from '@/object-record/record-table/states/selectors/selectedRowIdsComponentSelector'; -import { unselectedRowIdsComponentSelector } from '@/object-record/record-table/states/selectors/unselectedRowIdsComponentSelector'; -import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2'; -import { useSetRecoilComponentStateV2 } from '@/ui/utilities/state/component-state/hooks/useSetRecoilComponentStateV2'; import { useSetRecordCountInCurrentView } from '@/views/hooks/useSetRecordCountInCurrentView'; -import { useRecoilValue } from 'recoil'; export const RecordIndexTableContainerEffect = () => { const { recordIndexId, objectNameSingular } = useContext( @@ -77,61 +68,5 @@ export const RecordIndexTableContainerEffect = () => { ); }, [setRecordCountInCurrentView, setOnEntityCountChange]); - const setContextStoreTargetedRecords = useSetRecoilComponentStateV2( - contextStoreTargetedRecordsRuleComponentState, - ); - const hasUserSelectedAllRows = useRecoilComponentValueV2( - hasUserSelectedAllRowsComponentState, - recordIndexId, - ); - const selectedRowIds = useRecoilComponentValueV2( - selectedRowIdsComponentSelector, - recordIndexId, - ); - const unselectedRowIds = useRecoilComponentValueV2( - unselectedRowIdsComponentSelector, - recordIndexId, - ); - - const recordIndexFilters = useRecoilValue(recordIndexFiltersState); - - useEffect(() => { - if (hasUserSelectedAllRows) { - setContextStoreTargetedRecords({ - mode: 'exclusion', - excludedRecordIds: unselectedRowIds, - }); - } else { - setContextStoreTargetedRecords({ - mode: 'selection', - selectedRecordIds: selectedRowIds, - }); - } - - return () => { - setContextStoreTargetedRecords({ - mode: 'selection', - selectedRecordIds: [], - }); - }; - }, [ - hasUserSelectedAllRows, - selectedRowIds, - setContextStoreTargetedRecords, - unselectedRowIds, - ]); - - const setContextStoreFilters = useSetRecoilComponentStateV2( - contextStoreFiltersComponentState, - ); - - useEffect(() => { - setContextStoreFilters(recordIndexFilters); - - return () => { - setContextStoreFilters([]); - }; - }, [recordIndexFilters, setContextStoreFilters]); - return <>; }; diff --git a/packages/twenty-front/src/modules/object-record/record-index/options/hooks/__tests__/useRecordData.test.tsx b/packages/twenty-front/src/modules/object-record/record-index/export/hooks/__tests__/useExportFetchRecords.test.ts similarity index 97% rename from packages/twenty-front/src/modules/object-record/record-index/options/hooks/__tests__/useRecordData.test.tsx rename to packages/twenty-front/src/modules/object-record/record-index/export/hooks/__tests__/useExportFetchRecords.test.ts index 4190d08b1..c759d7f3f 100644 --- a/packages/twenty-front/src/modules/object-record/record-index/options/hooks/__tests__/useRecordData.test.tsx +++ b/packages/twenty-front/src/modules/object-record/record-index/export/hooks/__tests__/useExportFetchRecords.test.ts @@ -1,6 +1,10 @@ import { renderHook, waitFor } from '@testing-library/react'; import { act } from 'react'; -import { percentage, sleep, useRecordData } from '../useRecordData'; +import { + percentage, + sleep, + useExportFetchRecords, +} from '../useExportFetchRecords'; import { PERSON_FRAGMENT_WITH_DEPTH_ZERO_RELATIONS } from '@/object-record/hooks/__mocks__/personFragments'; import { useRecordBoard } from '@/object-record/record-board/hooks/useRecordBoard'; @@ -9,6 +13,7 @@ import { useRecordIndexOptionsForBoard } from '@/object-record/record-index/opti import { extractComponentState } from '@/ui/utilities/state/component-state/utils/extractComponentState'; import { ViewType } from '@/views/types/ViewType'; import { MockedResponse } from '@apollo/client/testing'; +import { expect } from '@storybook/test'; import gql from 'graphql-tag'; import { useRecoilValue } from 'recoil'; import { getJestMetadataAndApolloMocksAndContextStoreWrapper } from '~/testing/jest/getJestMetadataAndApolloMocksAndContextStoreWrapper'; @@ -178,7 +183,7 @@ describe('useRecordData', () => { const { result } = renderHook( () => - useRecordData({ + useExportFetchRecords({ recordIndexId, objectMetadataItem, pageSize: 30, @@ -204,7 +209,7 @@ describe('useRecordData', () => { const callback = jest.fn(); const { result } = renderHook( () => - useRecordData({ + useExportFetchRecords({ recordIndexId, objectMetadataItem, callback, @@ -232,7 +237,7 @@ describe('useRecordData', () => { recordIndexId, ); return { - tableData: useRecordData({ + tableData: useExportFetchRecords({ recordIndexId, objectMetadataItem, callback, @@ -325,7 +330,7 @@ describe('useRecordData', () => { recordIndexId, ); return { - tableData: useRecordData({ + tableData: useExportFetchRecords({ recordIndexId, objectMetadataItem, callback, diff --git a/packages/twenty-front/src/modules/action-menu/hooks/__tests__/useExportRecordData.test.ts b/packages/twenty-front/src/modules/object-record/record-index/export/hooks/__tests__/useExportRecords.test.ts similarity index 99% rename from packages/twenty-front/src/modules/action-menu/hooks/__tests__/useExportRecordData.test.ts rename to packages/twenty-front/src/modules/object-record/record-index/export/hooks/__tests__/useExportRecords.test.ts index 34f9aab74..4ec40323f 100644 --- a/packages/twenty-front/src/modules/action-menu/hooks/__tests__/useExportRecordData.test.ts +++ b/packages/twenty-front/src/modules/object-record/record-index/export/hooks/__tests__/useExportRecords.test.ts @@ -7,7 +7,7 @@ import { displayedExportProgress, download, generateCsv, -} from '../useExportRecordData'; +} from '../useExportRecords'; jest.useFakeTimers(); diff --git a/packages/twenty-front/src/modules/object-record/record-index/options/hooks/useRecordData.ts b/packages/twenty-front/src/modules/object-record/record-index/export/hooks/useExportFetchRecords.ts similarity index 99% rename from packages/twenty-front/src/modules/object-record/record-index/options/hooks/useRecordData.ts rename to packages/twenty-front/src/modules/object-record/record-index/export/hooks/useExportFetchRecords.ts index a541d65b2..469173de4 100644 --- a/packages/twenty-front/src/modules/object-record/record-index/options/hooks/useRecordData.ts +++ b/packages/twenty-front/src/modules/object-record/record-index/export/hooks/useExportFetchRecords.ts @@ -45,7 +45,7 @@ type ExportProgress = { displayType: 'percentage' | 'number'; }; -export const useRecordData = ({ +export const useExportFetchRecords = ({ objectMetadataItem, delayMs, maximumRequests = 100, diff --git a/packages/twenty-front/src/modules/object-record/record-index/options/hooks/useProcessRecordsForCSVExport.ts b/packages/twenty-front/src/modules/object-record/record-index/export/hooks/useExportProcessRecordsForCSV.ts similarity index 95% rename from packages/twenty-front/src/modules/object-record/record-index/options/hooks/useProcessRecordsForCSVExport.ts rename to packages/twenty-front/src/modules/object-record/record-index/export/hooks/useExportProcessRecordsForCSV.ts index 41eff23af..491b96bb3 100644 --- a/packages/twenty-front/src/modules/object-record/record-index/options/hooks/useProcessRecordsForCSVExport.ts +++ b/packages/twenty-front/src/modules/object-record/record-index/export/hooks/useExportProcessRecordsForCSV.ts @@ -5,7 +5,7 @@ import { isDefined } from 'twenty-ui'; import { FieldMetadataType } from '~/generated-metadata/graphql'; import { convertCurrencyMicrosToCurrencyAmount } from '~/utils/convertCurrencyToCurrencyMicros'; -export const useProcessRecordsForCSVExport = (objectNameSingular: string) => { +export const useExportProcessRecordsForCSV = (objectNameSingular: string) => { const { objectMetadataItem } = useObjectMetadataItem({ objectNameSingular, }); diff --git a/packages/twenty-front/src/modules/action-menu/hooks/useExportRecordData.ts b/packages/twenty-front/src/modules/object-record/record-index/export/hooks/useExportRecords.ts similarity index 92% rename from packages/twenty-front/src/modules/action-menu/hooks/useExportRecordData.ts rename to packages/twenty-front/src/modules/object-record/record-index/export/hooks/useExportRecords.ts index 7ae40eb4d..1ecadcc07 100644 --- a/packages/twenty-front/src/modules/action-menu/hooks/useExportRecordData.ts +++ b/packages/twenty-front/src/modules/object-record/record-index/export/hooks/useExportRecords.ts @@ -2,13 +2,12 @@ import { json2csv } from 'json-2-csv'; import { useMemo } from 'react'; import { FieldMetadata } from '@/object-record/record-field/types/FieldMetadata'; -import { EXPORT_TABLE_DATA_DEFAULT_PAGE_SIZE } from '@/object-record/record-index/options/constants/ExportTableDataDefaultPageSize'; -import { useProcessRecordsForCSVExport } from '@/object-record/record-index/options/hooks/useProcessRecordsForCSVExport'; - import { UseRecordDataOptions, - useRecordData, -} from '@/object-record/record-index/options/hooks/useRecordData'; + useExportFetchRecords, +} from '@/object-record/record-index/export/hooks/useExportFetchRecords'; +import { useExportProcessRecordsForCSV } from '@/object-record/record-index/export/hooks/useExportProcessRecordsForCSV'; +import { EXPORT_TABLE_DATA_DEFAULT_PAGE_SIZE } from '@/object-record/record-index/options/constants/ExportTableDataDefaultPageSize'; import { ColumnDefinition } from '@/object-record/record-table/types/ColumnDefinition'; import { ObjectRecord } from '@/object-record/types/ObjectRecord'; import { RelationDefinitionType } from '~/generated-metadata/graphql'; @@ -142,7 +141,7 @@ type UseExportTableDataOptions = Omit & { filename: string; }; -export const useExportRecordData = ({ +export const useExportRecords = ({ delayMs, filename, maximumRequests = 100, @@ -151,7 +150,7 @@ export const useExportRecordData = ({ recordIndexId, viewType, }: UseExportTableDataOptions) => { - const { processRecordsForCSVExport } = useProcessRecordsForCSVExport( + const { processRecordsForCSVExport } = useExportProcessRecordsForCSV( objectMetadataItem.nameSingular, ); @@ -165,7 +164,7 @@ export const useExportRecordData = ({ [filename, processRecordsForCSVExport], ); - const { getTableData: download, progress } = useRecordData({ + const { getTableData: download, progress } = useExportFetchRecords({ delayMs, maximumRequests, objectMetadataItem, diff --git a/packages/twenty-front/src/modules/object-record/record-index/options/components/RecordIndexOptionsDropdownContent.tsx b/packages/twenty-front/src/modules/object-record/record-index/options/components/RecordIndexOptionsDropdownContent.tsx index 1ed208d4e..882d4bf1c 100644 --- a/packages/twenty-front/src/modules/object-record/record-index/options/components/RecordIndexOptionsDropdownContent.tsx +++ b/packages/twenty-front/src/modules/object-record/record-index/options/components/RecordIndexOptionsDropdownContent.tsx @@ -20,15 +20,15 @@ import { useObjectNamePluralFromSingular } from '@/object-metadata/hooks/useObje import { useHandleToggleTrashColumnFilter } from '@/object-record/record-index/hooks/useHandleToggleTrashColumnFilter'; import { RECORD_INDEX_OPTIONS_DROPDOWN_ID } from '@/object-record/record-index/options/constants/RecordIndexOptionsDropdownId'; -import { - displayedExportProgress, - useExportRecordData, -} from '@/action-menu/hooks/useExportRecordData'; import { contextStoreNumberOfSelectedRecordsComponentState } from '@/context-store/states/contextStoreNumberOfSelectedRecordsComponentState'; import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem'; import { useRecordGroupReorder } from '@/object-record/record-group/hooks/useRecordGroupReorder'; -import { useRecordGroups } from '@/object-record/record-group/hooks/useRecordGroups'; import { useRecordGroupVisibility } from '@/object-record/record-group/hooks/useRecordGroupVisibility'; +import { useRecordGroups } from '@/object-record/record-group/hooks/useRecordGroups'; +import { + displayedExportProgress, + useExportRecords, +} from '@/object-record/record-index/export/hooks/useExportRecords'; import { useRecordIndexOptionsForBoard } from '@/object-record/record-index/options/hooks/useRecordIndexOptionsForBoard'; import { useRecordIndexOptionsForTable } from '@/object-record/record-index/options/hooks/useRecordIndexOptionsForTable'; import { TableOptionsHotkeyScope } from '@/object-record/record-table/types/TableOptionsHotkeyScope'; @@ -167,7 +167,7 @@ export const RecordIndexOptionsDropdownContent = ({ const { openObjectRecordsSpreasheetImportDialog } = useOpenObjectRecordsSpreasheetImportDialog(objectMetadataItem.nameSingular); - const { progress, download } = useExportRecordData({ + const { progress, download } = useExportRecords({ delayMs: 100, filename: `${objectMetadataItem.nameSingular}.csv`, objectMetadataItem, diff --git a/packages/twenty-ui/src/display/index.ts b/packages/twenty-ui/src/display/index.ts index b0f67a365..c33d5373e 100644 --- a/packages/twenty-ui/src/display/index.ts +++ b/packages/twenty-ui/src/display/index.ts @@ -40,8 +40,8 @@ export * from './icon/components/IllustrationIconToggle'; export * from './icon/components/IllustrationIconUid'; export * from './icon/components/IllustrationIconUser'; export * from './icon/components/IllustrationIconWrapper'; -export * from './icon/components/llustrationIconLink'; export * from './icon/components/TablerIcons'; +export * from './icon/components/llustrationIconLink'; export * from './icon/hooks/useIcons'; export * from './icon/providers/IconsProvider'; export * from './icon/states/iconsState';