diff --git a/client/src/features/editors/list/EventBlock.jsx b/client/src/features/editors/list/EventBlock.jsx index 7569cce53..f2827d59c 100644 --- a/client/src/features/editors/list/EventBlock.jsx +++ b/client/src/features/editors/list/EventBlock.jsx @@ -1,5 +1,5 @@ import Icon from '@chakra-ui/icon'; -import { FiChevronDown, FiChevronUp, FiMoreVertical } from 'react-icons/fi'; +import { FiChevronUp, FiMoreVertical } from 'react-icons/fi'; import { useMemo } from 'react'; import { Draggable } from 'react-beautiful-dnd'; import EventTimes from 'common/components/eventTimes/EventTimes'; @@ -86,13 +86,6 @@ const ExpandedBlock = (props) => { {`/ontime/goto ${eventIndex + 1} << OSC >> /ontime/gotoid ${oscid}`} - props.setCollapsed(true)} - />
{ } />
- props.setCollapsed(false)} - />
0 ? millisToMinutes(delay) : null; const handleCollapse = (isCollapsed) => { + console.log('setting collapsed', isCollapsed); setCollapsed({ [data.id]: isCollapsed }); }; @@ -187,6 +174,11 @@ export default function EventBlock(props) { {...provided.draggableProps} ref={provided.innerRef} > + handleCollapse(!collapsed)} + /> {collapsed ? ( ) : ( )}
diff --git a/client/src/features/editors/list/EventBlock.module.css b/client/src/features/editors/list/EventBlock.module.css index f74a78ed4..07a4a8aea 100644 --- a/client/src/features/editors/list/EventBlock.module.css +++ b/client/src/features/editors/list/EventBlock.module.css @@ -160,9 +160,24 @@ /* ================ MORE ================ */ -.more { +.moreExpanded, +.moreCollapsed { cursor: pointer; + color: #fff; + grid-area: more; + margin-top: 0.2em; } + +.moreExpanded { + transform: scaleY(-1); + transition: transform 0.3s; +} + +.moreCollapsed { + transform: scaleY(1); + transition: transform 0.3s; +} + /* ============== ACTION ================ */ .actionOverlay {