fix: all cards in lists animate on label toggle at same time

This commit is contained in:
Jordan Knott
2020-07-16 20:26:21 -05:00
parent 8c610b11bf
commit 559fcbc0e4
3 changed files with 36 additions and 15 deletions

View File

@ -123,6 +123,11 @@ const SimpleLists: React.FC<SimpleProps> = ({
};
const [currentComposer, setCurrentComposer] = useState('');
const [toggleLabels, setToggleLabels] = useState(false);
const [toggleDirection, setToggleDirection] = useState<'shrink' | 'expand'>(
cardLabelVariant === 'large' ? 'shrink' : 'expand',
);
return (
<BoardContainer>
<BoardWrapper>
@ -162,12 +167,23 @@ const SimpleLists: React.FC<SimpleProps> = ({
{taskProvided => {
return (
<Card
toggleDirection={toggleDirection}
toggleLabels={toggleLabels}
labelVariant={cardLabelVariant}
wrapperProps={{
...taskProvided.draggableProps,
...taskProvided.dragHandleProps,
}}
onCardLabelClick={onCardLabelClick}
setToggleLabels={setToggleLabels}
onCardLabelClick={() => {
setToggleLabels(true);
setToggleDirection(
cardLabelVariant === 'large' ? 'shrink' : 'expand',
);
if (onCardLabelClick) {
onCardLabelClick();
}
}}
ref={taskProvided.innerRef}
taskID={task.id}
complete={task.complete ?? false}