mirror of
https://github.com/twentyhq/twenty.git
synced 2024-12-24 20:42:05 +03:00
Fix focused cell view (#7451)
Fixes https://github.com/twentyhq/twenty/issues/5595 - The portal has been removed, and the focused cell is now rendered directly within the relevant div/container. - This ensures that the cell remains correctly positioned within the table and is properly hidden or unfocused when the user scrolls horizontally, fixing the issue of overlap or visibility on top of other elements. Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>
This commit is contained in:
parent
bb2e825cfa
commit
2c927cfd7e
@ -1,7 +1,6 @@
|
||||
import { ReactElement } from 'react';
|
||||
import { createPortal } from 'react-dom';
|
||||
import styled from '@emotion/styled';
|
||||
import { autoUpdate, flip, offset, useFloating } from '@floating-ui/react';
|
||||
import { ReactElement } from 'react';
|
||||
|
||||
const StyledEditableCellEditModeContainer = styled.div<RecordTableCellEditModeProps>`
|
||||
position: absolute;
|
||||
@ -44,12 +43,9 @@ export const RecordTableCellEditMode = ({
|
||||
ref={refs.setReference}
|
||||
data-testid="editable-cell-edit-mode-container"
|
||||
>
|
||||
{createPortal(
|
||||
<StyledTableCellInput ref={refs.setFloating} style={floatingStyles}>
|
||||
{children}
|
||||
</StyledTableCellInput>,
|
||||
document.body,
|
||||
)}
|
||||
<StyledTableCellInput ref={refs.setFloating} style={floatingStyles}>
|
||||
{children}
|
||||
</StyledTableCellInput>
|
||||
</StyledEditableCellEditModeContainer>
|
||||
);
|
||||
};
|
||||
|
Loading…
Reference in New Issue
Block a user