fix: fix filter and sort position on board horizontal scroll (#1386)

Closes #1354
This commit is contained in:
Thaïs 2023-09-01 11:54:34 +02:00 committed by GitHub
parent 240edda25c
commit 5653b89114
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -30,8 +30,10 @@ import { BoardOptions } from '../types/BoardOptions';
import { EntityBoardColumn } from './EntityBoardColumn'; import { EntityBoardColumn } from './EntityBoardColumn';
const StyledCustomScrollWrapper = styled(ScrollWrapper)` const StyledWrapper = styled.div`
display: flex;
flex-direction: column; flex-direction: column;
width: 100%;
`; `;
export function EntityBoard({ export function EntityBoard({
@ -105,7 +107,7 @@ export function EntityBoard({
const boardRef = useRef<HTMLDivElement>(null); const boardRef = useRef<HTMLDivElement>(null);
return (boardColumns?.length ?? 0) > 0 ? ( return (boardColumns?.length ?? 0) > 0 ? (
<StyledCustomScrollWrapper> <StyledWrapper>
<BoardHeader <BoardHeader
viewName="All opportunities" viewName="All opportunities"
viewIcon={<IconList size={theme.icon.size.md} />} viewIcon={<IconList size={theme.icon.size.md} />}
@ -113,29 +115,31 @@ export function EntityBoard({
onSortsUpdate={updateSorts} onSortsUpdate={updateSorts}
context={CompanyBoardRecoilScopeContext} context={CompanyBoardRecoilScopeContext}
/> />
<StyledBoard ref={boardRef}> <ScrollWrapper>
<DragDropContext onDragEnd={onDragEnd}> <StyledBoard ref={boardRef}>
{sortedBoardColumns.map((column) => ( <DragDropContext onDragEnd={onDragEnd}>
<BoardColumnIdContext.Provider value={column.id} key={column.id}> {sortedBoardColumns.map((column) => (
<RecoilScope <BoardColumnIdContext.Provider value={column.id} key={column.id}>
SpecificContext={BoardColumnRecoilScopeContext} <RecoilScope
key={column.id} SpecificContext={BoardColumnRecoilScopeContext}
> key={column.id}
<EntityBoardColumn >
boardOptions={boardOptions} <EntityBoardColumn
column={column} boardOptions={boardOptions}
onEditColumnTitle={onEditColumnTitle} column={column}
/> onEditColumnTitle={onEditColumnTitle}
</RecoilScope> />
</BoardColumnIdContext.Provider> </RecoilScope>
))} </BoardColumnIdContext.Provider>
</DragDropContext> ))}
</StyledBoard> </DragDropContext>
</StyledBoard>
</ScrollWrapper>
<DragSelect <DragSelect
dragSelectable={boardRef} dragSelectable={boardRef}
onDragSelectionChange={setCardSelected} onDragSelectionChange={setCardSelected}
/> />
</StyledCustomScrollWrapper> </StyledWrapper>
) : ( ) : (
<></> <></>
); );