diff --git a/apps/client/src/common/hooks/useSocket.ts b/apps/client/src/common/hooks/useSocket.ts index d99ea84af..f36bf53e6 100644 --- a/apps/client/src/common/hooks/useSocket.ts +++ b/apps/client/src/common/hooks/useSocket.ts @@ -180,6 +180,8 @@ export const useRuntimePlaybackOverview = () => { numEvents: state.runtime.numEvents, selectedEventIndex: state.runtime.selectedEventIndex, offset: state.runtime.offset, + + currentBlock: state.currentBlock, }); return useRuntimeStore(featureSelector); diff --git a/apps/client/src/features/overview/Overview.tsx b/apps/client/src/features/overview/Overview.tsx index ccf457134..162e3e75a 100644 --- a/apps/client/src/features/overview/Overview.tsx +++ b/apps/client/src/features/overview/Overview.tsx @@ -33,6 +33,7 @@ function _EditorOverview({ children }: { children: React.ReactNode }) { +
@@ -94,6 +95,14 @@ function TitlesOverview() { ); } +function CurrentBlockOverview() { + const { currentBlock, clock } = useRuntimePlaybackOverview(); + + const timeInBlock = formatedTime(currentBlock.startedAt === null ? null : clock - currentBlock.startedAt); + + return ; +} + function TimerOverview() { const { current } = useTimer();