@djangocfg/ui-nextjs 2.1.69 → 2.1.70

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@djangocfg/ui-nextjs",
-  "version": "2.1.69",
+  "version": "2.1.70",
   "description": "Next.js UI component library with Radix UI primitives, Tailwind CSS styling, charts, and form components",
   "keywords": [
     "ui-components",
@@ -58,8 +58,8 @@
     "check": "tsc --noEmit"
   },
   "peerDependencies": {
-    "@djangocfg/api": "^2.1.69",
-    "@djangocfg/ui-core": "^2.1.69",
+    "@djangocfg/api": "^2.1.70",
+    "@djangocfg/ui-core": "^2.1.70",
     "@types/react": "^19.1.0",
     "@types/react-dom": "^19.1.0",
     "consola": "^3.4.2",
@@ -110,7 +110,7 @@
     "wavesurfer.js": "^7.12.1"
   },
   "devDependencies": {
-    "@djangocfg/typescript-config": "^2.1.69",
+    "@djangocfg/typescript-config": "^2.1.70",
     "@types/node": "^24.7.2",
     "eslint": "^9.37.0",
     "tailwindcss-animate": "1.0.7",

package/src/stores/mediaCache.ts

@@ -29,8 +29,8 @@ interface EffectConfig {
   blur: string;
 }
 
-// Stream URL TTL (5 minutes)
-const STREAM_URL_TTL = 5 * 60 * 1000;
+// Stream URL TTL (30 seconds - shorter to avoid stale session/token issues)
+const STREAM_URL_TTL = 30 * 1000;
 
 interface MediaCacheState {
   // Blob URL cache (shared by Image, Audio, Video)

package/src/tools/VideoPlayer/providers/StreamProvider.tsx

@@ -86,15 +86,25 @@ export const StreamProvider = forwardRef<VideoPlayerRef, StreamProviderProps>(
     } = useVideoCache();
 
     // Retry function for error fallback
+    // Regenerates URL for stream sources to get fresh token/session
     const retry = useCallback(() => {
       setHasError(false);
       setIsLoading(true);
-      // Re-trigger source effect by forcing state update
+
+      // For stream sources, regenerate URL bypassing cache
+      if (source.type === 'stream') {
+        const streamSource = source as StreamSource;
+        const freshUrl = streamSource.getStreamUrl(streamSource.sessionId, streamSource.path);
+        setVideoUrl(freshUrl);
+        return;
+      }
+
+      // For other sources, just reload
       const video = videoRef.current;
       if (video && videoUrl) {
         video.load();
       }
-    }, [videoUrl]);
+    }, [source, videoUrl]);
 
     // Expose video element methods via ref
     useImperativeHandle(

package/src/tools/VideoPlayer/providers/VidstackProvider.tsx

@@ -20,17 +20,26 @@ import { useVideoCache } from '../../../stores/mediaCache';
 import type { MediaPlayerInstance } from '@vidstack/react';
 import type { VidstackProviderProps, VideoPlayerRef, ErrorFallbackProps } from '../types';
 
+/**
+ * Vidstack source type (string or object with type hint)
+ */
+type VidstackSrc = string | { src: string; type: string };
+
 /**
  * Convert source to Vidstack-compatible format
+ * Returns object with explicit type for HLS/DASH to ensure proper loader selection
  */
-function getVidstackSrc(source: VidstackProviderProps['source']): string {
+function getVidstackSrc(source: VidstackProviderProps['source']): VidstackSrc {
   switch (source.type) {
     case 'youtube':
       return `youtube/${source.id}`;
     case 'vimeo':
       return `vimeo/${source.id}`;
     case 'hls':
+      // Explicit type needed because URL may have query params that hide .m3u8 extension
+      return { src: source.url, type: 'application/x-mpegurl' };
     case 'dash':
+      return { src: source.url, type: 'application/dash+xml' };
     case 'url':
       return source.url;
     default: