Revert "Session version" (#1649)

* Revert "refactor: add version to session endpoint"

This reverts commit cd40a6e55e.

* Revert "Remove public event feature (#1645)"

This reverts commit 08d9e24871.

* Revert "Fix: rearrange playing event (#1640)"

This reverts commit 0649678dca.

* Revert "refactor: style tweaks to edit css modal"

This reverts commit a00ec2d02a.

* Revert "refactor: remove usages of framer-motion"

This reverts commit 54a74ccc2a.

* Revert "Upgrade expressjs (#1633)"

This reverts commit 6f3ab274bd.

* Revert "Refactor: require trigger in all events objects (#1636)"

This reverts commit 90870ecfb6.

* Revert "Fix: Correct boundary condition in applyDelay"

This reverts commit b640e0e181.

* Revert "let vite be the proxy to the dev server (#1630)"

This reverts commit c41fe824cf.

* Revert "refactor: migrate custom fields to transactions"

This reverts commit 62c8319d70.

* Revert "refactor: simplify validations"

This reverts commit b1d23467a2.

* Revert "refactor: create transaction system and apply to adding entry (#1620)"

This reverts commit 9a62daf047.

* Revert "Refactor: better rounding (#1594)"

This reverts commit b9ab1c6fd7.

* Revert "refactor: improve reorder logic"

This reverts commit c1054711b0.

* Revert "chore: simplify URLs"

This reverts commit a4d4f29a37.

* Revert "refactor: order is single source of truth"

This reverts commit 2793aadea0.

* Revert "refactor: refetch targets is enum"

This reverts commit e7cfb7d9d9.

* Revert "refactor: small ux improvements"

This reverts commit 256a851c9b.

* Revert "refactor: remove trivially inferred numEvents"

This reverts commit 4ab9c81cb8.

* Revert "feat: duplicate groups"

This reverts commit 2f13d6c89e.

* Revert "feat: create group from entry selection"

This reverts commit f1f7bad25e.

* Revert "feat: create block from rundown empty"

This reverts commit a8b52a48f7.

* Revert "fix: collapsed blocks dont render children"

This reverts commit cd0999b2ab.

* Revert "refactor: type cleanup and test improvements"

This reverts commit b4c60f3f04.

* Revert "feat: allow dissolving a block"

This reverts commit 5cefad3666.

* Revert "fix: uncontrolled prop on controlled component"

This reverts commit 7a6ecd8c34.

* Revert "refactor: improve return of reorder"

This reverts commit ba96ecfd91.

* Revert "refactor: mutations on batch elements must have IDs"

This reverts commit 7bed3757f2.

* Revert "chore: upgrade dependencies"

This reverts commit e2e755b1d2.

* Revert "refactor: extract utility to merge two arrays"

This reverts commit a77d23109d.

* Revert "refactor: change network mode defaults"

This reverts commit 0eb3b8d382.

* Revert "fix: delete nested events"

This reverts commit 0021185288.

* Revert "fix: add event at end of block"

This reverts commit 94c72ff4f6.

* Revert "refactor: make finder available in exported rundown"

This reverts commit e4c08dc9b2.

* Revert "assert non null and update test (#1604)"

This reverts commit ec74af0d62.

* Revert "Fix project renumber (#1597)"

This reverts commit b6d72dd082.

* Revert "Refactor: WebSocket from flush queue to one patch (#1595)"

This reverts commit 31c311daf0.

* Revert "Refactor: ms for api calls (#1593)"

This reverts commit e9b3cc6090.

* Revert "fix test (#1601)"

This reverts commit 543b04a097.

* Revert "fix: rebase master"

This reverts commit d39b85b6e6.

* Revert "chore: correct test path"

This reverts commit bbe107bb2b.

* Revert "refactor: extract rundown parsing"

This reverts commit c616240db1.

* Revert "chore: improve convention entry <> event"

This reverts commit 166be66ce3.

* Revert "refactor: maintain flat orders"

This reverts commit 4180d0a337.

* Revert "refactor: implement operations on nested events"

This reverts commit 78108e316c.

* Revert "refactor: process events in rundown"

This reverts commit 3bb8b70915.

* Revert "chore: improve convention entry <> event"

This reverts commit 1c4f13a0ed.

* Revert "chore: rename currentBlock > parent"

This reverts commit 3ca0abad53.

* Revert "refactor: fix delay positioning in gaps"

This reverts commit 030c8f897f.

* Revert "refactor(e2e): skip flaky test"

This reverts commit 68175cfa3b.

* Revert "refactor: improve project loading"

This reverts commit fd8f757851.

* Revert "refactor: gather group metadata"

This reverts commit 876d111c61.

* Revert "refactor: swap maintains schedule"

This reverts commit 730cb95c04.

* Revert "chore: rename files"

This reverts commit 3c388d4fb5.

* Revert "refactor: restructure model to contain an object of rundowns"

This reverts commit 2e23718d73.

* Revert "refactor: clearer relationship on rundown elements"

This reverts commit 89ea8c470b.

* Revert "refactor: use strict typing"

This reverts commit 178640bfc4.

* Revert "refactor: remove stop as a possible end action"

This reverts commit 4ed38340e0.

* Revert "refactor: restructure model to contain an object of rundowns"

This reverts commit 69eb9a5eff.

* Revert "chore: remove IDE files"

This reverts commit 351425127a.

* Revert "refactor: remove unused and legacy code"

This reverts commit 95f2ba37cc.

apps/client/src/features/rundown/Rundown.tsx

@@ -1,48 +1,36 @@
 import { Fragment, lazy, useCallback, useEffect, useRef, useState } from 'react';
+import { closestCenter, DndContext, DragEndEvent, PointerSensor, useSensor, useSensors } from '@dnd-kit/core';
+import { arrayMove, SortableContext, verticalListSortingStrategy } from '@dnd-kit/sortable';
+import { useHotkeys } from '@mantine/hooks';
 import {
-  closestCenter,
-  DndContext,
-  DragEndEvent,
-  DragOverEvent,
-  DragStartEvent,
-  PointerSensor,
-  useSensor,
-  useSensors,
-} from '@dnd-kit/core';
-import { SortableContext, verticalListSortingStrategy } from '@dnd-kit/sortable';
-import { useHotkeys, useSessionStorage } from '@mantine/hooks';
-import {
-  type EntryId,
-  type MaybeString,
-  type Rundown,
   isOntimeBlock,
   isOntimeEvent,
-  OntimeBlock,
-  OntimeEntry,
+  isPlayableEvent,
+  MaybeString,
+  PlayableEvent,
   Playback,
-  SupportedEntry,
+  RundownCached,
+  SupportedEvent,
 } from 'ontime-types';
 import {
+  checkIsNextDay,
   getFirstNormal,
   getLastNormal,
   getNextBlockNormal,
   getNextNormal,
   getPreviousBlockNormal,
   getPreviousNormal,
-  reorderArray,
+  isNewLatest,
 } from 'ontime-utils';
 
-import { type EventOptions, useEntryActions } from '../../common/hooks/useEntryAction';
+import { type EventOptions, useEventAction } from '../../common/hooks/useEventAction';
 import useFollowComponent from '../../common/hooks/useFollowComponent';
 import { useRundownEditor } from '../../common/hooks/useSocket';
 import { AppMode, useAppMode } from '../../common/stores/appModeStore';
 import { useEntryCopy } from '../../common/stores/entryCopyStore';
-import { cloneEvent } from '../../common/utils/clone';
+import { cloneEvent } from '../../common/utils/eventsManager';
 
-import BlockBlock from './block-block/BlockBlock';
-import BlockEnd from './block-block/BlockEnd';
 import QuickAddBlock from './quick-add-block/QuickAddBlock';
-import { makeRundownMetadata, makeSortableList, moveDown, moveUp } from './rundown.utils';
 import RundownEmpty from './RundownEmpty';
 import { useEventSelection } from './useEventSelection';
 
@@ -51,21 +39,15 @@ import style from './Rundown.module.scss';
 const RundownEntry = lazy(() => import('./RundownEntry'));
 
 interface RundownProps {
-  data: Rundown;
+  data: RundownCached;
 }
 
 export default function Rundown({ data }: RundownProps) {
-  const { order, entries, id } = data;
-  // we create a copy of the rundown with a data structured aligned with what dnd-kit needs
-  const featureData = useRundownEditor();
-  const [sortableData, setSortableData] = useState<EntryId[]>(() => makeSortableList(order, entries));
-  const [collapsedGroups, setCollapsedGroups] = useSessionStorage<EntryId[]>({
-    // we ensure that this is unique to the rundown
-    key: `rundown.${id}-editor-collapsed-groups`,
-    defaultValue: [],
-  });
+  const { order, rundown } = data;
+  const [statefulEntries, setStatefulEntries] = useState(order);
 
-  const { addEntry, reorderEntry, deleteEntry } = useEntryActions();
+  const featureData = useRundownEditor();
+  const { addEvent, reorderEvent, deleteEvent } = useEventAction();
 
   const { entryCopyId, setEntryCopyId } = useEntryCopy();
 
@@ -78,39 +60,39 @@ export default function Rundown({ data }: RundownProps) {
   useFollowComponent({ followRef: cursorRef, scrollRef, doFollow: appMode === AppMode.Run });
 
   // DND KIT
-  const sensors = useSensors(useSensor(PointerSensor, { activationConstraint: { distance: 10 } }));
+  const sensors = useSensors(useSensor(PointerSensor));
 
   const deleteAtCursor = useCallback(
     (cursor: string | null) => {
       if (!cursor) return;
-      const { entry, index } = getPreviousNormal(entries, order, cursor);
-      deleteEntry([cursor]);
+      const { entry, index } = getPreviousNormal(rundown, order, cursor);
+      deleteEvent([cursor]);
       if (entry && index !== null) {
         setSelectedEvents({ id: entry.id, selectMode: 'click', index });
       }
     },
-    [entries, order, deleteEntry, setSelectedEvents],
+    [rundown, order, deleteEvent, setSelectedEvents],
   );
 
   const insertCopyAtId = useCallback(
     (atId: string | null, copyId: string | null, above = false) => {
-      const adjustedCursor = above ? getPreviousNormal(entries, order, atId ?? '').entry?.id ?? null : atId;
+      const adjustedCursor = above ? getPreviousNormal(rundown, order, atId ?? '').entry?.id ?? null : atId;
       if (copyId === null) {
         // we cant clone without selection
         return;
       }
-      const cloneEntry = entries[copyId];
-      if (cloneEntry?.type === SupportedEntry.Event) {
+      const cloneEntry = rundown[copyId];
+      if (cloneEntry?.type === SupportedEvent.Event) {
         //if we don't have a cursor add the new event on top
         const newEvent = cloneEvent(cloneEntry);
-        addEntry(newEvent, { after: adjustedCursor ?? undefined });
+        addEvent(newEvent, { after: adjustedCursor ?? undefined });
       }
     },
-    [addEntry, order, entries],
+    [addEvent, order, rundown],
   );
 
   const insertAtId = useCallback(
-    (patch: Partial<OntimeEntry> & { type: SupportedEntry }, id: MaybeString, above = false) => {
+    (type: SupportedEvent, id: MaybeString, above = false) => {
       const options: EventOptions =
         id === null
           ? {}
@@ -119,12 +101,19 @@ export default function Rundown({ data }: RundownProps) {
               before: above ? id : undefined,
             };
 
-      if (!above && id) {
-        options.lastEventId = id;
+      if (type === SupportedEvent.Event) {
+        const newEvent = {
+          type: SupportedEvent.Event,
+        };
+        if (!above && id) {
+          options.lastEventId = id;
+        }
+        addEvent(newEvent, options);
+      } else {
+        addEvent({ type }, options);
       }
-      addEntry(patch, options);
     },
-    [addEntry],
+    [addEvent],
   );
 
   const selectBlock = useCallback(
@@ -135,7 +124,7 @@ export default function Rundown({ data }: RundownProps) {
       let newCursor = cursor;
       if (cursor === null) {
         // there is no cursor, we select the first or last depending on direction
-        const selected = direction === 'up' ? getLastNormal(entries, order) : getFirstNormal(entries, order);
+        const selected = direction === 'up' ? getLastNormal(rundown, order) : getFirstNormal(rundown, order);
 
         if (isOntimeBlock(selected)) {
           setSelectedEvents({ id: selected.id, selectMode: 'click', index: direction === 'up' ? order.length : 0 });
@@ -151,14 +140,14 @@ export default function Rundown({ data }: RundownProps) {
       // otherwise we select the next or previous
       const selected =
         direction === 'up'
-          ? getPreviousBlockNormal(entries, order, newCursor)
-          : getNextBlockNormal(entries, order, newCursor);
+          ? getPreviousBlockNormal(rundown, order, newCursor)
+          : getNextBlockNormal(rundown, order, newCursor);
 
       if (selected.entry !== null && selected.index !== null) {
         setSelectedEvents({ id: selected.entry.id, selectMode: 'click', index: selected.index });
       }
     },
-    [order, entries, setSelectedEvents],
+    [order, rundown, setSelectedEvents],
   );
 
   const selectEntry = useCallback(
@@ -169,7 +158,7 @@ export default function Rundown({ data }: RundownProps) {
 
       if (cursor === null) {
         // there is no cursor, we select the first or last depending on direction if it exists
-        const selected = direction === 'up' ? getLastNormal(entries, order) : getFirstNormal(entries, order);
+        const selected = direction === 'up' ? getLastNormal(rundown, order) : getFirstNormal(rundown, order);
         if (selected !== null) {
           setSelectedEvents({ id: selected.id, selectMode: 'click', index: direction === 'up' ? order.length : 0 });
         }
@@ -178,36 +167,29 @@ export default function Rundown({ data }: RundownProps) {
 
       // otherwise we select the next or previous
       const selected =
-        direction === 'up' ? getPreviousNormal(entries, order, cursor) : getNextNormal(entries, order, cursor);
+        direction === 'up' ? getPreviousNormal(rundown, order, cursor) : getNextNormal(rundown, order, cursor);
 
       if (selected.entry !== null && selected.index !== null) {
         setSelectedEvents({ id: selected.entry.id, selectMode: 'click', index: selected.index });
       }
     },
-    [order, entries, setSelectedEvents],
+    [order, rundown, setSelectedEvents],
   );
 
   const moveEntry = useCallback(
-    (cursor: EntryId | null, direction: 'up' | 'down') => {
-      if (sortableData.length < 2 || cursor == null) {
+    (cursor: string | null, direction: 'up' | 'down') => {
+      if (order.length < 2 || cursor == null) {
         return;
       }
+      const { index } =
+        direction === 'up' ? getPreviousNormal(rundown, order, cursor) : getNextNormal(rundown, order, cursor);
 
-      const { destinationId, order, isBlock } =
-        direction === 'up' ? moveUp(cursor, sortableData, entries) : moveDown(cursor, sortableData, entries);
-
-      if (!destinationId) {
-        return;
+      if (index !== null) {
+        const offsetIndex = direction === 'up' ? index + 1 : index - 1;
+        reorderEvent(cursor, offsetIndex, index);
       }
-
-      // if we are moving into a block, we need to make sure it is expanded
-      if (isBlock) {
-        handleCollapseGroup(false, destinationId);
-      }
-
-      reorderEntry(cursor, destinationId, order as 'before' | 'after' | 'insert');
     },
-    [sortableData, reorderEntry],
+    [order, reorderEvent, rundown],
   );
 
   // shortcuts
@@ -225,14 +207,14 @@ export default function Rundown({ data }: RundownProps) {
 
     ['mod + Backspace', () => deleteAtCursor(cursor), { preventDefault: true }],
 
-    ['alt + E', () => insertAtId({ type: SupportedEntry.Event }, cursor), { preventDefault: true }],
-    ['alt + shift + E', () => insertAtId({ type: SupportedEntry.Event }, cursor, true), { preventDefault: true }],
+    ['alt + E', () => insertAtId(SupportedEvent.Event, cursor), { preventDefault: true }],
+    ['alt + shift + E', () => insertAtId(SupportedEvent.Event, cursor, true), { preventDefault: true }],
 
-    ['alt + B', () => insertAtId({ type: SupportedEntry.Block }, cursor), { preventDefault: true }],
-    ['alt + shift + B', () => insertAtId({ type: SupportedEntry.Block }, cursor, true), { preventDefault: true }],
+    ['alt + B', () => insertAtId(SupportedEvent.Block, cursor), { preventDefault: true }],
+    ['alt + shift + B', () => insertAtId(SupportedEvent.Block, cursor, true), { preventDefault: true }],
 
-    ['alt + D', () => insertAtId({ type: SupportedEntry.Delay }, cursor), { preventDefault: true }],
-    ['alt + shift + D', () => insertAtId({ type: SupportedEntry.Delay }, cursor, true), { preventDefault: true }],
+    ['alt + D', () => insertAtId(SupportedEvent.Delay, cursor), { preventDefault: true }],
+    ['alt + shift + D', () => insertAtId(SupportedEvent.Delay, cursor, true), { preventDefault: true }],
 
     ['mod + C', () => setEntryCopyId(cursor)],
     ['mod + V', () => insertCopyAtId(cursor, entryCopyId)],
@@ -244,11 +226,11 @@ export default function Rundown({ data }: RundownProps) {
   // we copy the state from the store here
   // to workaround async updates on the drag mutations
   useEffect(() => {
-    setSortableData(makeSortableList(order, entries));
-  }, [order, entries]);
+    setStatefulEntries(order);
+  }, [order]);
 
-  // in run mode, we follow selection
   useEffect(() => {
+    // in run mode, we follow selection
     if (appMode !== AppMode.Run || !featureData?.selectedEventId) {
       return;
     }
@@ -256,235 +238,111 @@ export default function Rundown({ data }: RundownProps) {
     setSelectedEvents({ id: featureData.selectedEventId, selectMode: 'click', index });
   }, [appMode, featureData.selectedEventId, order, setSelectedEvents]);
 
-  /**
-   * Checks whether a block is collapsed
-   */
-  const getIsCollapsed = useCallback(
-    (blockId: EntryId): boolean => {
-      return Boolean(collapsedGroups.find((id) => id === blockId));
-    },
-    [collapsedGroups],
-  );
-
-  /**
-   * Handles logic for collapsing groups
-   */
-  const handleCollapseGroup = useCallback(
-    (collapsed: boolean, groupId: EntryId) => {
-      setCollapsedGroups((prev) => {
-        const isCollapsed = getIsCollapsed(groupId);
-        if (collapsed && !isCollapsed) {
-          const newSet = new Set(prev).add(groupId);
-          return [...newSet];
-        }
-        if (!collapsed && isCollapsed) {
-          return [...prev].filter((id) => id !== groupId);
-        }
-        return prev;
-      });
-    },
-    [getIsCollapsed, setCollapsedGroups],
-  );
-
-  /**
-   * On drag end, we reorder the events
-   */
   const handleOnDragEnd = (event: DragEndEvent) => {
     const { active, over } = event;
 
-    if (!over?.id || active.id === over.id) {
-      return;
-    }
-
-    const fromIndex = active.data.current?.sortable.index;
-    const toIndex = over.data.current?.sortable.index;
-
-    // we keep a copy of the state as a hack to handle inconsistencies between dnd-kit and async store updates
-    setSortableData((currentEntries) => {
-      return reorderArray(currentEntries, fromIndex, toIndex);
-    });
-
-    let destinationId = over.id as EntryId;
-    let order: 'before' | 'after' | 'insert' = fromIndex < toIndex ? 'after' : 'before';
-
-    /**
-     * We need to specially handle the end blocks
-     * Dragging before and end block will add the entry to the end of the block
-     * Dragging after an end block will add the event after the block itself
-     */
-    if (destinationId.startsWith('end-')) {
-      destinationId = destinationId.replace('end-', '');
-      // if we are moving before the end, we use the insert operation
-      order = 'insert';
-    }
-
-    reorderEntry(active.id as EntryId, destinationId, order);
-  };
-
-  /**
-   * When we drag a block, we force collapse it
-   * This avoids strange scenarios like dropping a block inside itself
-   */
-  const collapseDraggedBlocks = (event: DragStartEvent) => {
-    const isBlock = event.active.data.current?.type === 'block';
-    if (isBlock) {
-      handleCollapseGroup(true, event.active.id as EntryId);
+    if (over?.id) {
+      if (active.id !== over?.id) {
+        const fromIndex = active.data.current?.sortable.index;
+        const toIndex = over.data.current?.sortable.index;
+        // ugly hack to handle inconsistencies between dnd-kit and async store updates
+        setStatefulEntries((currentEntries) => {
+          return arrayMove(currentEntries, fromIndex, toIndex);
+        });
+        reorderEvent(String(active.id), fromIndex, toIndex);
+      }
     }
   };
 
-  /**
-   * When we drag over a block, we expand it if it is collapsed
-   */
-  const expandOverBlock = (event: DragOverEvent) => {
-    // if we are dragging a block, the drop operation is invalid so we dont expand
-    if (event.active.data.current?.type === 'block') {
-      return;
-    }
-    if (event.over?.data.current?.type !== 'block') {
-      return;
-    }
-    const blockId = event.over?.id as EntryId;
-    const isCollapsed = getIsCollapsed(blockId);
-    if (isCollapsed) {
-      handleCollapseGroup(false, blockId);
-    }
-  };
-
-  if (sortableData.length < 1) {
-    return <RundownEmpty handleAddNew={(type: SupportedEntry) => addEntry({ type })} />;
+  if (statefulEntries.length < 1) {
+    return <RundownEmpty handleAddNew={() => insertAtId(SupportedEvent.Event, cursor)} />;
   }
 
-  // 1. gather presentation options
+  // last event is used to calculate relative timings
+  let lastEvent: PlayableEvent | undefined; // used by indicators
+  let thisEvent: PlayableEvent | undefined;
+  // previous entry is used to infer position in the rundown for new events
+  let previousEntryId: string | undefined;
+  let thisId = previousEntryId;
+
+  let eventIndex = 0;
+  // all events before the current selected are in the past
+  let isPast = Boolean(featureData?.selectedEventId);
+  let isNextDay = false;
+  let totalGap = 0;
   const isEditMode = appMode === AppMode.Edit;
-
-  // 2. initialise rundown metadata
-  const { metadata, process } = makeRundownMetadata(featureData?.selectedEventId);
-  // keep a single reference to the metadata which we override for every entry
-  let rundownMetadata = metadata;
-
+  let isLinkedToLoaded = true; //check if the event can link all the way back to the currently playing event
   return (
     <div className={style.rundownContainer} ref={scrollRef} data-testid='rundown'>
-      <DndContext
-        onDragEnd={handleOnDragEnd}
-        onDragStart={collapseDraggedBlocks}
-        onDragOver={expandOverBlock}
-        sensors={sensors}
-        collisionDetection={closestCenter}
-      >
-        <SortableContext items={sortableData} strategy={verticalListSortingStrategy}>
+      <DndContext onDragEnd={handleOnDragEnd} sensors={sensors} collisionDetection={closestCenter}>
+        <SortableContext items={statefulEntries} strategy={verticalListSortingStrategy}>
           <div className={style.list}>
-            {sortableData.map((entryId, index) => {
-              const isFirst = index === 0;
-              const isLast = index === sortableData.length - 1;
-
-              // the entry might be a pseudo block-end which does not generate metadata and should not be processed
-              if (entryId.startsWith('end-')) {
-                const parentId = entryId.split('end-')[1];
-                const isBlockCollapsed = getIsCollapsed(parentId);
-
-                if (isBlockCollapsed && isEditMode && isLast) {
-                  return <QuickAddBlock key={entryId} previousEventId={parentId} parentBlock={null} />;
-                } else if (isBlockCollapsed) {
-                  return null;
-                } else {
-                  const parentColour = (entries[parentId] as OntimeBlock | undefined)?.colour;
-                  // if the previous element is selected, it will have its own QuickAddBlock
-                  // we use thisId instead of previousEntryId because the block end does not process
-                  // and it does not cause the reassignment of the iteration id to the previous entry
-                  const showPrependingQuickAdd = isEditMode && cursor !== rundownMetadata.thisId;
-                  return (
-                    <Fragment key={entryId}>
-                      {showPrependingQuickAdd && (
-                        <QuickAddBlock
-                          previousEventId={rundownMetadata.thisId}
-                          parentBlock={parentId}
-                          backgroundColor={parentColour}
-                        />
-                      )}
-                      <BlockEnd key={entryId} id={entryId} colour={parentColour} />
-                      {isEditMode && isLast && <QuickAddBlock previousEventId={parentId} parentBlock={null} />}
-                    </Fragment>
-                  );
-                }
-              }
-
-              // we iterate through a stateful copy of order to make the dnd operations smoother
+            {statefulEntries.map((entryId, index) => {
+              // we iterate through a stateful copy of order to make the operations smoother
               // this means that this can be out of sync with order until the useEffect runs
               // instead of writing all the logic guards, we simply short circuit rendering here
-              const entry = entries[entryId];
-              if (!entry) return null;
-              rundownMetadata = process(entry);
-
-              // if the entry has a parent, and it is collapsed, render nothing
-              if (
-                entry.type !== SupportedEntry.Block &&
-                rundownMetadata.groupId !== null &&
-                getIsCollapsed(rundownMetadata.groupId)
-              ) {
+              const entry = rundown[entryId];
+              if (!entry) {
                 return null;
               }
+              if (index === 0) {
+                eventIndex = 0;
+              }
+              isNextDay = false;
+              previousEntryId = thisId;
+              thisId = entryId;
+              if (isOntimeEvent(entry)) {
+                // event indexes are 1 based in frontend
+                eventIndex++;
+                lastEvent = thisEvent;
 
+                if (isPlayableEvent(entry)) {
+                  isNextDay = checkIsNextDay(entry, lastEvent);
+                  if (!isPast) {
+                    totalGap += entry.gap;
+                    // We also include countToEnd in this test as the behavior of a linked event coming after a countToEnd is simelar to an unlinked event
+                    isLinkedToLoaded = isLinkedToLoaded && entry.linkStart !== null && !lastEvent?.countToEnd;
+                  }
+                  if (isNewLatest(entry, lastEvent)) {
+                    // populate previous entry
+                    thisEvent = entry;
+                  }
+                }
+              }
+              const isFirst = index === 0;
+              const isLast = index === order.length - 1;
+              const isLoaded = featureData?.selectedEventId === entry.id;
               const isNext = featureData?.nextEventId === entry.id;
               const hasCursor = entry.id === cursor;
-
-              /**
-               * Outside a block, the value will be undefined
-               * If the colour is empty string ''
-               * ie: we are inside a block, but there is no defined colour
-               * we default to $gray-1050 #303030
-               */
-              const blockColour = rundownMetadata.groupColour === '' ? '#303030' : rundownMetadata.groupColour;
+              if (isLoaded) {
+                isPast = false;
+              }
 
               return (
                 <Fragment key={entry.id}>
-                  {isEditMode && (hasCursor || isFirst) && (
-                    <QuickAddBlock
-                      previousEventId={rundownMetadata.previousEntryId}
-                      parentBlock={isFirst ? null : rundownMetadata.groupId}
-                      backgroundColor={isFirst ? undefined : blockColour}
-                    />
-                  )}
-                  {isOntimeBlock(entry) ? (
-                    <BlockBlock
-                      data={entry}
-                      hasCursor={hasCursor}
-                      collapsed={getIsCollapsed(entry.id)}
-                      onCollapse={handleCollapseGroup}
-                    />
-                  ) : (
-                    <div
-                      className={style.entryWrapper}
-                      data-testid={`entry-${rundownMetadata.eventIndex}`}
-                      style={blockColour ? { '--user-bg': blockColour } : {}}
-                    >
-                      {isOntimeEvent(entry) && <div className={style.entryIndex}>{rundownMetadata.eventIndex}</div>}
-                      <div className={style.entry} key={entry.id} ref={hasCursor ? cursorRef : undefined}>
-                        <RundownEntry
-                          type={entry.type}
-                          isPast={rundownMetadata.isPast}
-                          eventIndex={rundownMetadata.eventIndex}
-                          data={entry}
-                          loaded={rundownMetadata.isLoaded}
-                          hasCursor={hasCursor}
-                          isNext={isNext}
-                          previousEntryId={rundownMetadata.previousEntryId}
-                          previousEventId={rundownMetadata.previousEvent?.id}
-                          playback={rundownMetadata.isLoaded ? featureData.playback : undefined}
-                          isRolling={featureData.playback === Playback.Roll}
-                          isNextDay={rundownMetadata.isNextDay}
-                          totalGap={rundownMetadata.totalGap}
-                          isLinkedToLoaded={rundownMetadata.isLinkedToLoaded}
-                        />
-                      </div>
+                  {isEditMode && (hasCursor || isFirst) && <QuickAddBlock previousEventId={previousEntryId} />}
+                  <div className={style.entryWrapper} data-testid={`entry-${eventIndex}`}>
+                    {isOntimeEvent(entry) && <div className={style.entryIndex}>{eventIndex}</div>}
+                    <div className={style.entry} key={entry.id} ref={hasCursor ? cursorRef : undefined}>
+                      <RundownEntry
+                        type={entry.type}
+                        isPast={isPast}
+                        eventIndex={eventIndex}
+                        data={entry}
+                        loaded={isLoaded}
+                        hasCursor={hasCursor}
+                        isNext={isNext}
+                        previousEntryId={previousEntryId}
+                        previousEventId={lastEvent?.id}
+                        playback={isLoaded ? featureData.playback : undefined}
+                        isRolling={featureData.playback === Playback.Roll}
+                        isNextDay={isNextDay}
+                        totalGap={totalGap}
+                        isLinkedToLoaded={isLinkedToLoaded}
+                      />
                     </div>
-                  )}
-                  {isEditMode && (hasCursor || isLast) && (
-                    <QuickAddBlock
-                      previousEventId={entry.id}
-                      parentBlock={rundownMetadata.groupId}
-                      backgroundColor={blockColour}
-                    />
-                  )}
+                  </div>
+                  {isEditMode && (hasCursor || isLast) && <QuickAddBlock previousEventId={entry.id} />}
                 </Fragment>
               );
             })}