@flamingo-stack/openframe-frontend-core 0.0.558 → 0.0.559-1837.4923.1

package/src/components/features/__tests__/video-bites-shared.test.ts

@@ -0,0 +1,53 @@
+import { describe, expect, it } from 'vitest'
+import {
+  sortBitesByCreatedAtDesc,
+  sortBitesByFeaturedAtDesc,
+} from '../video-bites-shared'
+import type { VideoTeaser } from '../../../types/video-processing'
+
+const bite = (overrides: Partial<VideoTeaser>): VideoTeaser => ({
+  url: `https://cdn.example/${Math.abs(JSON.stringify(overrides).length)}.mp4`,
+  ...overrides,
+})
+
+describe('sortBitesByCreatedAtDesc', () => {
+  it('orders newest created_at first', () => {
+    const a = bite({ created_at: '2026-01-01T00:00:00Z' })
+    const b = bite({ created_at: '2026-02-01T00:00:00Z' })
+    expect([a, b].sort(sortBitesByCreatedAtDesc)).toEqual([b, a])
+  })
+
+  it('sorts bites without created_at last', () => {
+    const dated = bite({ created_at: '2026-01-01T00:00:00Z' })
+    const undated = bite({})
+    expect([undated, dated].sort(sortBitesByCreatedAtDesc)).toEqual([dated, undated])
+  })
+})
+
+describe('sortBitesByFeaturedAtDesc', () => {
+  it('ranks a recently-featured OLD bite above a newer un-restamped one', () => {
+    // The 2026-08-18 homepage regression: an old clip starred today must
+    // outrank clips created later but featured earlier.
+    const oldClipFeaturedToday = bite({
+      created_at: '2026-07-14T00:00:00Z',
+      featured_at: '2026-08-18T00:00:00Z',
+    })
+    const newerClipNoStamp = bite({ created_at: '2026-07-17T00:00:00Z' })
+    expect([newerClipNoStamp, oldClipFeaturedToday].sort(sortBitesByFeaturedAtDesc)).toEqual([
+      oldClipFeaturedToday,
+      newerClipNoStamp,
+    ])
+  })
+
+  it('falls back to created_at for legacy bites without featured_at', () => {
+    const a = bite({ created_at: '2026-01-01T00:00:00Z' })
+    const b = bite({ created_at: '2026-02-01T00:00:00Z' })
+    expect([a, b].sort(sortBitesByFeaturedAtDesc)).toEqual([b, a])
+  })
+
+  it('sorts bites with neither timestamp last', () => {
+    const stamped = bite({ featured_at: '2026-01-01T00:00:00Z' })
+    const bare = bite({})
+    expect([bare, stamped].sort(sortBitesByFeaturedAtDesc)).toEqual([stamped, bare])
+  })
+})

package/src/components/features/video-bites-shared.ts

@@ -60,3 +60,20 @@ export function sortBitesByCreatedAtDesc(a: VideoTeaser, b: VideoTeaser): number
   if (!b.created_at) return -1
   return new Date(b.created_at).getTime() - new Date(a.created_at).getTime()
 }
+
+/**
+ * FEATURED-recency comparator: `featured_at` (stamped when an admin stars the
+ * bite) with `created_at` fallback for bites featured before the stamp
+ * existed; missing dates sort last. The comparator FEATURED surfaces (the
+ * cross-entity aggregation + its strips) must use — ranking those surfaces by
+ * `created_at` made featuring any older bite a silent no-op once the surface
+ * cap filled with newer bites.
+ */
+export function sortBitesByFeaturedAtDesc(a: VideoTeaser, b: VideoTeaser): number {
+  const ta = a.featured_at ?? a.created_at
+  const tb = b.featured_at ?? b.created_at
+  if (!ta && !tb) return 0
+  if (!ta) return 1
+  if (!tb) return -1
+  return new Date(tb).getTime() - new Date(ta).getTime()
+}

package/src/components/features/video-bites-strip.tsx

@@ -88,6 +88,10 @@ export interface VideoBitesStripProps {
   showChevrons?: boolean;
   /** Section-level navigation fallback (per-bite `href`/`onNavigate` win). */
   onBiteNavigate?: (bite: VideoBiteStripItem, index: number) => void;
+  /** Ordering comparator. Default `sortBitesByCreatedAtDesc`; FEATURED
+   *  surfaces pass `sortBitesByFeaturedAtDesc` so display order matches the
+   *  featured-recency ranking their server aggregation is capped by. */
+  sortComparator?: (a: VideoBiteStripItem, b: VideoBiteStripItem) => number;
   className?: string;
 }
 
@@ -110,12 +114,13 @@ export function VideoBitesStrip({
   cardHeightMobile = 300,
   showChevrons = true,
   onBiteNavigate,
+  sortComparator = sortBitesByCreatedAtDesc,
   className,
 }: VideoBitesStripProps): React.ReactElement | null {
   const items = useMemo(() => {
     const filtered = filterPublished ? bites.filter(b => b.published) : [...bites];
-    return filtered.sort(sortBitesByCreatedAtDesc);
-  }, [bites, filterPublished]);
+    return filtered.sort(sortComparator);
+  }, [bites, filterPublished, sortComparator]);
 
   // Preconnect Mux/Supabase origins once so first hover starts fast.
   const warmup = useVideoWarmup<HTMLDivElement>({ videoUrl: items[0]?.url || null });

package/src/types/video-processing.ts

@@ -19,6 +19,7 @@ export interface VideoTeaser {
   thumbnail_url?: string // Optional thumbnail image URL for video preview. If not provided, video player will show first frame automatically.
   published?: boolean // Controls visibility on public preview page (default: false, admin must select)
   featured?: boolean // Opts the bite into cross-entity featured pulls (homepage/configured surfaces). Independent of `published`.
+  featured_at?: string // ISO timestamp stamped when an admin features the bite (cleared on unfeature). Featured surfaces rank by THIS (fallback created_at) — ranking by created_at alone made featuring an old bite invisible under the surface cap.
   source?: 'manual' | 'ai_generated' // Track origin of teaser
   created_at?: string // ISO timestamp for sorting (newer items first)
   start_time_ms?: number // Vizard extraction: clip start offset in the source video