From ec4cfe6f864889ee081554e27d2fd2177e9a8179 Mon Sep 17 00:00:00 2001
From: Felix Roos <roos@entrecode.de>
Date: Tue, 23 Aug 2022 21:23:28 +0200
Subject: [PATCH] use new getTime callback in repl + mini repl

---
 packages/react/src/components/MiniRepl.jsx | 8 +++++++-
 repl/src/App.jsx                           | 7 ++++++-
 2 files changed, 13 insertions(+), 2 deletions(-)

diff --git a/packages/react/src/components/MiniRepl.jsx b/packages/react/src/components/MiniRepl.jsx
index d4807138..1d57e2a9 100644
--- a/packages/react/src/components/MiniRepl.jsx
+++ b/packages/react/src/components/MiniRepl.jsx
@@ -8,6 +8,7 @@ import 'tailwindcss/tailwind.css';
 import './style.css';
 import styles from './MiniRepl.module.css';
 import { Icon } from './Icon';
+import { Tone } from '@strudel.cycles/tone';
 
 export function MiniRepl({ tune, defaultSynth, hideOutsideView = false, theme, init, onEvent, enableKeyboard }) {
   const { code, setCode, pattern, activeCode, activateCode, evaluateOnly, error, cycle, dirty, togglePlay, stop } =
@@ -31,7 +32,12 @@ export function MiniRepl({ tune, defaultSynth, hideOutsideView = false, theme, i
     }
     return isVisible || wasVisible.current;
   }, [isVisible, hideOutsideView]);
-  useHighlighting({ view, pattern, active: cycle.started && !activeCode?.includes('strudel disable-highlighting') });
+  useHighlighting({
+    view,
+    pattern,
+    active: cycle.started && !activeCode?.includes('strudel disable-highlighting'),
+    getTime: () => Tone.getTransport().seconds,
+  });
 
   // set active pattern on ctrl+enter
   useLayoutEffect(() => {
diff --git a/repl/src/App.jsx b/repl/src/App.jsx
index e04e8b18..cf760100 100644
--- a/repl/src/App.jsx
+++ b/repl/src/App.jsx
@@ -144,7 +144,12 @@ function App() {
     return () => window.removeEventListener('keydown', handleKeyPress, true);
   }, [pattern, code, activateCode, cycle, view]);
 
-  useHighlighting({ view, pattern, active: cycle.started && !activeCode?.includes('strudel disable-highlighting') });
+  useHighlighting({
+    view,
+    pattern,
+    active: cycle.started && !activeCode?.includes('strudel disable-highlighting'),
+    getTime: () => Tone.getTransport().seconds,
+  });
 
   useWebMidi({
     ready: useCallback(