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

Fixed import modal content scroll bug (#9330)

Browse Source 
fixes #9297
This commit is contained in:
nitin
2025-01-03 18:35:51 +05:30
committed by GitHub
parent 8b7e4ddad1
commit 9da0a5df6f
1 changed files with 38 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

69
packages/twenty-front/src/modules/spreadsheet-import/steps/components/MatchColumnsStep/MatchColumnsStep.tsx
View File

@ -25,6 +25,7 @@ import { initialComputedColumnsSelector } from '@/spreadsheet-import/steps/compo
import { UnmatchColumn } from '@/spreadsheet-import/steps/components/MatchColumnsStep/components/UnmatchColumn'; import { UnmatchColumn } from '@/spreadsheet-import/steps/components/MatchColumnsStep/components/UnmatchColumn';
import { SpreadsheetImportStep } from '@/spreadsheet-import/steps/types/SpreadsheetImportStep'; import { SpreadsheetImportStep } from '@/spreadsheet-import/steps/types/SpreadsheetImportStep';
import { SpreadsheetImportStepType } from '@/spreadsheet-import/steps/types/SpreadsheetImportStepType'; import { SpreadsheetImportStepType } from '@/spreadsheet-import/steps/types/SpreadsheetImportStepType';
import { ScrollWrapper } from '@/ui/utilities/scroll/components/ScrollWrapper';
import { useRecoilState } from 'recoil'; import { useRecoilState } from 'recoil';
import { ColumnGrid } from './components/ColumnGrid'; import { ColumnGrid } from './components/ColumnGrid';
import { TemplateColumn } from './components/TemplateColumn'; import { TemplateColumn } from './components/TemplateColumn';
@ -326,37 +327,43 @@ export const MatchColumnsStep = <T extends string>({
return ( return (
<> <>
<StyledContent> <ScrollWrapper
<Heading contextProviderName="modalContent"
title="Match Columns" componentInstanceId="scroll-wrapper-modal-content"
description="Select the correct field for each column you'd like to import." heightMode="full"
/> >
<ColumnGrid <StyledContent>
columns={columns} <Heading
renderUserColumn={(columns, columnIndex) => ( title="Match Columns"
<UserTableColumn description="Select the correct field for each column you'd like to import."
column={columns[columnIndex]} />
importedRow={dataExample.map( <ColumnGrid
(row) => row[columns[columnIndex].index], columns={columns}
)} renderUserColumn={(columns, columnIndex) => (
/> <UserTableColumn
)} column={columns[columnIndex]}
renderTemplateColumn={(columns, columnIndex) => ( importedRow={dataExample.map(
<TemplateColumn (row) => row[columns[columnIndex].index],
columns={columns} )}
columnIndex={columnIndex} />
onChange={onChange} )}
/> renderTemplateColumn={(columns, columnIndex) => (
)} <TemplateColumn
renderUnmatchedColumn={(columns, columnIndex) => ( columns={columns}
<UnmatchColumn columnIndex={columnIndex}
columns={columns} onChange={onChange}
columnIndex={columnIndex} />
onSubChange={onSubChange} )}
/> renderUnmatchedColumn={(columns, columnIndex) => (
)} <UnmatchColumn
/> columns={columns}
</StyledContent> columnIndex={columnIndex}
onSubChange={onSubChange}
/>
)}
/>
</StyledContent>
</ScrollWrapper>
<StepNavigationButton <StepNavigationButton
onClick={handleOnContinue} onClick={handleOnContinue}
isLoading={isLoading} isLoading={isLoading}