djkato/saleor-dashboard
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix column picker errors

Browse source
This commit is contained in:
dominik-zeglen 2020-01-31 16:20:14 +01:00
parent 679c193aab
commit 44d79897f2
2 changed files with 28 additions and 29 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

55
src/components/ColumnPicker/ColumnPicker.tsx
View file

@ -77,30 +77,27 @@ const ColumnPicker: React.FC<ColumnPickerProps> = props => {
}; };
return ( return (
<div ref={anchor} className={className}> <ClickAwayListener onClickAway={() => setExpansionState(false)}>
<ColumnPickerButton <div ref={anchor} className={className}>
active={isExpanded} <ColumnPickerButton
onClick={() => setExpansionState(prevState => !prevState)} active={isExpanded}
/> onClick={() => setExpansionState(prevState => !prevState)}
<Popper />
className={classes.popper} <Popper
open={isExpanded} className={classes.popper}
anchorEl={anchor.current} open={isExpanded}
transition anchorEl={anchor.current}
disablePortal transition
placement="bottom-end" disablePortal
> placement="bottom-end"
{({ TransitionProps, placement }) => ( >
<Grow {({ TransitionProps, placement }) => (
{...TransitionProps} <Grow
style={{ {...TransitionProps}
transformOrigin: style={{
placement === "bottom" ? "right bottom" : "right top" transformOrigin:
}} placement === "bottom" ? "right bottom" : "right top"
> }}
<ClickAwayListener
onClickAway={() => setExpansionState(false)}
mouseEvent="onClick"
> >
<ColumnPickerContent <ColumnPickerContent
columns={columns} columns={columns}
@ -114,11 +111,11 @@ const ColumnPicker: React.FC<ColumnPickerProps> = props => {
onReset={handleReset} onReset={handleReset}
onSave={handleSave} onSave={handleSave}
/> />
</ClickAwayListener> </Grow>
</Grow> )}
)} </Popper>
</Popper> </div>
</div> </ClickAwayListener>
); );
}; };

2
src/components/ColumnPicker/ColumnPickerContent.tsx
View file

@ -137,6 +137,7 @@ const ColumnPickerContent: React.FC<ColumnPickerContentProps> = props => {
name={column.value} name={column.value}
label={column.label} label={column.label}
onChange={() => onColumnToggle(column.value)} onChange={() => onColumnToggle(column.value)}
key={column.value}
/> />
))} ))}
{loading && ( {loading && (
@ -160,6 +161,7 @@ const ColumnPickerContent: React.FC<ColumnPickerContentProps> = props => {
name={column.value} name={column.value}
label={column.label} label={column.label}
onChange={() => onColumnToggle(column.value)} onChange={() => onColumnToggle(column.value)}
key={column.value}
/> />
))} ))}
</div> </div>