@scalemule/nextjs 0.1.22 → 0.1.23

package/dist/index.d.mts

@@ -898,7 +898,7 @@ interface NarrationPlayerProps {
     providerLabel?: string;
     narrationLabel?: string;
     refreshing?: boolean;
-    onRefresh?: () => void;
+    onRefresh?: () => void | Promise<void>;
     onPlaybackError?: () => void;
 }
 declare function NarrationPlayer({ audio, className, providerLabel, narrationLabel, refreshing, onRefresh, onPlaybackError, }: NarrationPlayerProps): react_jsx_runtime.JSX.Element | null;

package/dist/index.d.ts

@@ -898,7 +898,7 @@ interface NarrationPlayerProps {
     providerLabel?: string;
     narrationLabel?: string;
     refreshing?: boolean;
-    onRefresh?: () => void;
+    onRefresh?: () => void | Promise<void>;
     onPlaybackError?: () => void;
 }
 declare function NarrationPlayer({ audio, className, providerLabel, narrationLabel, refreshing, onRefresh, onPlaybackError, }: NarrationPlayerProps): react_jsx_runtime.JSX.Element | null;

package/dist/index.js

@@ -11289,6 +11289,7 @@ function FeedbackWidget(props) {
   ] });
 }
 var SPEEDS = [1, 1.25, 1.5, 2];
+var EXPIRY_REFRESH_WINDOW_MS = 3e4;
 var styles = {
   root: {
     borderRadius: "1.75rem",
@@ -11466,6 +11467,9 @@ function NarrationPlayer({
 }) {
   const audioRef = React.useRef(null);
   const scrubRef = React.useRef(null);
+  const pendingResumeRef = React.useRef(false);
+  const pendingResumeTimeRef = React.useRef(null);
+  const recoveredUrlRef = React.useRef(null);
   const [playing, setPlaying] = React.useState(false);
   const [currentTime, setCurrentTime] = React.useState(0);
   const [duration, setDuration] = React.useState(audio.duration_ms ? audio.duration_ms / 1e3 : 0);
@@ -11480,10 +11484,26 @@ function NarrationPlayer({
   React.useEffect(() => {
     const element = audioRef.current;
     if (!element) return;
-    setCurrentTime(0);
+    recoveredUrlRef.current = null;
+    const resumeTime = pendingResumeTimeRef.current;
+    setCurrentTime(resumeTime ?? 0);
     setPlaying(false);
     element.pause();
-    element.currentTime = 0;
+    try {
+      element.currentTime = resumeTime ?? 0;
+    } catch {
+      element.currentTime = 0;
+    }
+    if (pendingResumeRef.current) {
+      pendingResumeRef.current = false;
+      pendingResumeTimeRef.current = null;
+      element.play().catch(() => {
+        setPlaying(false);
+        onPlaybackError?.();
+      });
+      return;
+    }
+    pendingResumeTimeRef.current = null;
   }, [audio.url]);
   React.useEffect(() => {
     const element = audioRef.current;
@@ -11491,10 +11511,49 @@ function NarrationPlayer({
     element.playbackRate = speed;
     element.preservesPitch = true;
   }, [speed]);
+  function isUrlExpiringSoon() {
+    if (!audio.expires_at) {
+      return false;
+    }
+    const expiresAtMs = Date.parse(audio.expires_at);
+    if (!Number.isFinite(expiresAtMs)) {
+      return false;
+    }
+    return expiresAtMs - Date.now() <= EXPIRY_REFRESH_WINDOW_MS;
+  }
+  async function refreshAndResume() {
+    if (!onRefresh || refreshing) {
+      return false;
+    }
+    if (recoveredUrlRef.current === (audio.url ?? null)) {
+      return false;
+    }
+    recoveredUrlRef.current = audio.url ?? null;
+    pendingResumeRef.current = true;
+    pendingResumeTimeRef.current = currentTime;
+    try {
+      await Promise.resolve(onRefresh());
+      return true;
+    } catch {
+      pendingResumeRef.current = false;
+      pendingResumeTimeRef.current = null;
+      onPlaybackError?.();
+      return false;
+    }
+  }
   function togglePlayback() {
     const element = audioRef.current;
     if (!element) return;
     if (element.paused) {
+      if (refreshing) {
+        pendingResumeRef.current = true;
+        pendingResumeTimeRef.current = currentTime;
+        return;
+      }
+      if (onRefresh && isUrlExpiringSoon()) {
+        void refreshAndResume();
+        return;
+      }
       element.play().catch(() => {
         setPlaying(false);
         onPlaybackError?.();
@@ -11537,7 +11596,17 @@ function NarrationPlayer({
         onPlay: () => setPlaying(true),
         onPause: () => setPlaying(false),
         onEnded: () => setPlaying(false),
-        onError: () => onPlaybackError?.()
+        onError: () => {
+          if (onRefresh) {
+            void refreshAndResume().then((didRefresh) => {
+              if (!didRefresh) {
+                onPlaybackError?.();
+              }
+            });
+            return;
+          }
+          onPlaybackError?.();
+        }
       }
     ),
     /* @__PURE__ */ jsxRuntime.jsxs("div", { style: styles.layout, children: [

package/dist/index.mjs

@@ -11269,6 +11269,7 @@ function FeedbackWidget(props) {
   ] });
 }
 var SPEEDS = [1, 1.25, 1.5, 2];
+var EXPIRY_REFRESH_WINDOW_MS = 3e4;
 var styles = {
   root: {
     borderRadius: "1.75rem",
@@ -11446,6 +11447,9 @@ function NarrationPlayer({
 }) {
   const audioRef = useRef(null);
   const scrubRef = useRef(null);
+  const pendingResumeRef = useRef(false);
+  const pendingResumeTimeRef = useRef(null);
+  const recoveredUrlRef = useRef(null);
   const [playing, setPlaying] = useState(false);
   const [currentTime, setCurrentTime] = useState(0);
   const [duration, setDuration] = useState(audio.duration_ms ? audio.duration_ms / 1e3 : 0);
@@ -11460,10 +11464,26 @@ function NarrationPlayer({
   useEffect(() => {
     const element = audioRef.current;
     if (!element) return;
-    setCurrentTime(0);
+    recoveredUrlRef.current = null;
+    const resumeTime = pendingResumeTimeRef.current;
+    setCurrentTime(resumeTime ?? 0);
     setPlaying(false);
     element.pause();
-    element.currentTime = 0;
+    try {
+      element.currentTime = resumeTime ?? 0;
+    } catch {
+      element.currentTime = 0;
+    }
+    if (pendingResumeRef.current) {
+      pendingResumeRef.current = false;
+      pendingResumeTimeRef.current = null;
+      element.play().catch(() => {
+        setPlaying(false);
+        onPlaybackError?.();
+      });
+      return;
+    }
+    pendingResumeTimeRef.current = null;
   }, [audio.url]);
   useEffect(() => {
     const element = audioRef.current;
@@ -11471,10 +11491,49 @@ function NarrationPlayer({
     element.playbackRate = speed;
     element.preservesPitch = true;
   }, [speed]);
+  function isUrlExpiringSoon() {
+    if (!audio.expires_at) {
+      return false;
+    }
+    const expiresAtMs = Date.parse(audio.expires_at);
+    if (!Number.isFinite(expiresAtMs)) {
+      return false;
+    }
+    return expiresAtMs - Date.now() <= EXPIRY_REFRESH_WINDOW_MS;
+  }
+  async function refreshAndResume() {
+    if (!onRefresh || refreshing) {
+      return false;
+    }
+    if (recoveredUrlRef.current === (audio.url ?? null)) {
+      return false;
+    }
+    recoveredUrlRef.current = audio.url ?? null;
+    pendingResumeRef.current = true;
+    pendingResumeTimeRef.current = currentTime;
+    try {
+      await Promise.resolve(onRefresh());
+      return true;
+    } catch {
+      pendingResumeRef.current = false;
+      pendingResumeTimeRef.current = null;
+      onPlaybackError?.();
+      return false;
+    }
+  }
   function togglePlayback() {
     const element = audioRef.current;
     if (!element) return;
     if (element.paused) {
+      if (refreshing) {
+        pendingResumeRef.current = true;
+        pendingResumeTimeRef.current = currentTime;
+        return;
+      }
+      if (onRefresh && isUrlExpiringSoon()) {
+        void refreshAndResume();
+        return;
+      }
       element.play().catch(() => {
         setPlaying(false);
         onPlaybackError?.();
@@ -11517,7 +11576,17 @@ function NarrationPlayer({
         onPlay: () => setPlaying(true),
         onPause: () => setPlaying(false),
         onEnded: () => setPlaying(false),
-        onError: () => onPlaybackError?.()
+        onError: () => {
+          if (onRefresh) {
+            void refreshAndResume().then((didRefresh) => {
+              if (!didRefresh) {
+                onPlaybackError?.();
+              }
+            });
+            return;
+          }
+          onPlaybackError?.();
+        }
       }
     ),
     /* @__PURE__ */ jsxs("div", { style: styles.layout, children: [

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@scalemule/nextjs",
-  "version": "0.1.22",
+  "version": "0.1.23",
   "description": "ScaleMule SDK for Next.js applications - authentication, storage, and user management",
   "main": "dist/index.js",
   "module": "dist/index.mjs",