feat: add link to context menu

apps/client/src/features/rundown/event-block/EventBlock.tsx

@@ -3,11 +3,13 @@ import { useSortable } from '@dnd-kit/sortable';
 import { CSS } from '@dnd-kit/utilities';
 import { IoAdd } from '@react-icons/all-files/io5/IoAdd';
 import { IoDuplicateOutline } from '@react-icons/all-files/io5/IoDuplicateOutline';
+import { IoLink } from '@react-icons/all-files/io5/IoLink';
 import { IoPeople } from '@react-icons/all-files/io5/IoPeople';
 import { IoPeopleOutline } from '@react-icons/all-files/io5/IoPeopleOutline';
 import { IoReorderTwo } from '@react-icons/all-files/io5/IoReorderTwo';
 import { IoSwapVertical } from '@react-icons/all-files/io5/IoSwapVertical';
 import { IoTrash } from '@react-icons/all-files/io5/IoTrash';
+import { IoUnlink } from '@react-icons/all-files/io5/IoUnlink';
 import { EndAction, MaybeString, OntimeEvent, Playback, TimerType, TimeStrategy } from 'ontime-types';
 
 import { useContextMenu } from '../../../common/hooks/useContextMenu';
@@ -93,6 +95,24 @@ export default function EventBlock(props: EventBlockProps) {
   const [onContextMenu] = useContextMenu<HTMLDivElement>(
     selectedEvents.size > 1
       ? [
+          {
+            label: 'Link to previous',
+            icon: IoLink,
+            onClick: () =>
+              actionHandler('update', {
+                field: 'linkStart',
+                value: 'true',
+              }),
+          },
+          {
+            label: 'Unlink from previous',
+            icon: IoUnlink,
+            onClick: () =>
+              actionHandler('update', {
+                field: 'linkStart',
+                value: null,
+              }),
+          },
           {
             label: 'Make public',
             icon: IoPeople,
@@ -101,6 +121,7 @@ export default function EventBlock(props: EventBlockProps) {
                 field: 'isPublic',
                 value: true,
               }),
+            withDivider: true,
           },
           {
             label: 'Make private',
@@ -114,6 +135,15 @@ export default function EventBlock(props: EventBlockProps) {
           { withDivider: true, label: 'Delete', icon: IoTrash, onClick: () => actionHandler('delete') },
         ]
       : [
+          {
+            label: 'Toggle link to previous',
+            icon: IoLink,
+            onClick: () =>
+              actionHandler('update', {
+                field: 'linkStart',
+                value: linkStart ? null : 'true',
+              }),
+          },
           {
             label: 'Toggle public',
             icon: IoPeopleOutline,
@@ -122,6 +152,7 @@ export default function EventBlock(props: EventBlockProps) {
                 field: 'isPublic',
                 value: !isPublic,
               }),
+            withDivider: true,
           },
           {
             label: 'Add to swap',

apps/client/src/features/rundown/time-input-flow/TimeInputFlow.tsx

@@ -5,7 +5,7 @@ import { IoLink } from '@react-icons/all-files/io5/IoLink';
 import { IoLockClosed } from '@react-icons/all-files/io5/IoLockClosed';
 import { IoLockOpenOutline } from '@react-icons/all-files/io5/IoLockOpenOutline';
 import { IoUnlink } from '@react-icons/all-files/io5/IoUnlink';
-import { MaybeString, OntimeEvent, TimeStrategy } from 'ontime-types';
+import { MaybeString, TimeStrategy } from 'ontime-types';
 
 import TimeInputWithButton from '../../../common/components/input/time-input/TimeInputWithButton';
 import { useEventAction } from '../../../common/hooks/useEventAction';
@@ -28,7 +28,7 @@ type TimeActions = 'timeStart' | 'timeEnd' | 'duration';
 
 const TimeInputFlow = (props: EventBlockTimerProps) => {
   const { eventId, timeStart, timeEnd, duration, timeStrategy, linkStart, delay } = props;
-  const { updateEvent, updateTimer, linkTimer } = useEventAction();
+  const { updateEvent, updateTimer } = useEventAction();
 
   // In sync with EventEditorTimes
   const handleSubmit = (field: TimeActions, value: string) => {
@@ -36,14 +36,11 @@ const TimeInputFlow = (props: EventBlockTimerProps) => {
   };
 
   const handleChangeStrategy = (timeStrategy: TimeStrategy) => {
-    const newEvent: Partial<OntimeEvent> = { id: eventId, timeStrategy };
-    updateEvent(newEvent);
+    updateEvent({ id: eventId, timeStrategy });
   };
 
   const handleLink = (doLink: boolean) => {
-    // the string doesnt mean much for now, not more than an intent to link
-    // we imagine that we can leverage this to create offsets p+10
-    linkTimer(eventId, doLink ? 'p' : null);
+    updateEvent({ id: eventId, linkStart: doLink ? 'true' : null });
   };
 
   const overMidnight = timeStart > timeEnd;