Files
sofa/packages/core/test/upcoming.test.ts
T
4fc6b2f8d1 feat: add filtering and sorting across library, explore, and upcoming (#21)
* feat: add filtering and sorting across library, explore, and upcoming

Add comprehensive filtering and sorting to all list views on both web and mobile.

Library (new dedicated page):
- New /library route (web) with URL search param persistence
- New Library tab (5th tab, mobile) with FlashList grid
- Filters: status (multi-select), type, genre (library-only), user rating range,
  release year (decade presets + custom), content rating, available to stream
- Sort by: title, date added, release date, popularity, user rating, TMDB rating
- Text search within collection
- Filter popover (web) / bottom sheet with Apply (mobile)
- Remove old dashboard.library endpoint in favor of library.list

Explore/Discover:
- New Discover section on Explore page with inline filter controls
- TMDB filters: genre (now optional), year range, min rating, sort order,
  original language, streaming provider
- Watch provider list endpoint (WATCH_REGION env var, default "US")
- Default to popular content when no filters selected

Upcoming:
- Type filter (All/Movies/TV Shows) and status filter (All/Watching/Watchlist)
- Toggle chips on both web (URL params) and mobile
- Backend: mediaType and statusFilter params on upcoming endpoint

Navigation:
- Library added to web nav bar (desktop + mobile tab bar)
- Library added as 5th tab on mobile (between Home and Explore)
- Dashboard library section simplified to compact preview with "See all" link

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

* feat: add user streaming platform subscriptions and redesign filter UI

Replace the denormalized availabilityOffers table with a normalized
platforms + titleAvailability + userPlatforms schema. Users can now
declare which streaming services they subscribe to, enabling
personalized "On your services" availability display and filtered
library/explore results.

Backend: new platforms table seeded from TMDB provider data on startup,
new API endpoints (platforms.list, account.platforms, account.updatePlatforms),
title detail annotates availability with isUserSubscribed flag, library
"on my services" filter checks user's subscribed platforms.

Web UI: post-registration onboarding page for platform selection,
streaming services settings section, title detail split into "On your
services" / "Also available on", explore dropdown uses platforms table
with active filter highlighting. Library filters redesigned from
cluttered popover to clean collapsible inline strip with consolidated
dropdowns.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

* fix: address race conditions, stale state, and edge cases in platforms feature

- Fix debounced autosave race in streaming services settings: use ref
  for latest selection + counter guard so only the most recent save
  updates UI. Clean up timers on unmount.
- Fix explore provider dropdown desyncing from query filter when
  switching Movie/TV type: reset selectedPlatformId alongside providerId.
- Fix platformIdsExist rejecting duplicate valid IDs by deduplicating
  input before comparing against DB results.
- Fix stale platform metadata: always upsert name/logo on TMDB refresh
  instead of skipping when platform already exists.
- Fix invisible ratingMax filter: clear ratingMax when user changes
  ratingMin since the UI only exposes a single rating dropdown now.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

* fix: clear stale saved-state timer and preserve falsy filter values

- Clear previous savedTimerRef timeout before scheduling a new one in
  streaming-services-section, preventing an older timer from hiding the
  "Saved" indicator too early on rapid successive saves
- Replace `value || undefined` with explicit empty-value check in
  library filter handler so numeric 0 (e.g. ratingMin=0) is not
  incorrectly dropped

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

* feat: add TanStack Form and migrate auth + change password forms

Set up TanStack Form v1 composition layer with createFormHook, pre-bound
field components (TextField, TextareaField, CheckboxField, SwitchField,
SubmitButton), and migrate the two traditional submit-based forms:

- AuthForm: replace 4 useState calls with useAppForm, use form.Field
  for each input while preserving motion animation layout
- ChangePasswordDialog: replace 6 useState calls with useAppForm + Zod
  schema validation (cross-field password match, min length), per-field
  error display, form.reset() on dialog close

Also adds @tanstack/react-form to the monorepo catalog and updates both
web and native apps to reference it via catalog:.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

---------

Co-authored-by: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-03-24 09:07:14 -04:00

308 lines
11 KiB
TypeScript

import { afterAll, beforeAll, beforeEach, describe, expect, test, vi } from "vitest";
import {
clearAllTables,
insertPlatform,
insertTitleAvailability,
insertEpisodeWatch,
insertStatus,
insertTitle,
insertTvShow,
insertUser,
} from "@sofa/test/db";
import { getUpcomingFeed } from "../src/discovery";
const TEST_NOW = new Date("2026-03-01T12:00:00Z");
beforeAll(() => {
vi.useFakeTimers();
vi.setSystemTime(TEST_NOW);
});
afterAll(() => {
vi.useRealTimers();
});
function daysFromNow(offset: number): string {
const d = new Date(TEST_NOW);
d.setDate(d.getDate() + offset);
return `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, "0")}-${String(d.getDate()).padStart(2, "0")}`;
}
beforeEach(() => {
clearAllTables();
insertUser();
});
// ── Basic feed ──────────────────────────────────────────────────────
describe("getUpcomingFeed", () => {
test("returns upcoming episodes for tracked shows", () => {
const tomorrow = daysFromNow(1);
insertTvShow("tv-1", 100, 1, 2, {
title: "Breaking Bad",
airDates: [tomorrow, tomorrow],
});
insertStatus("user-1", "tv-1", "in_progress");
const result = getUpcomingFeed("user-1", { days: 7 });
expect(result.items).toHaveLength(2);
expect(result.items[0].titleName).toBe("Breaking Bad");
expect(result.items[0].titleType).toBe("tv");
expect(result.items[0].date).toBe(tomorrow);
});
test("returns upcoming movies for tracked titles", () => {
const nextWeek = daysFromNow(5);
insertTitle({ id: "m1", tmdbId: 1, type: "movie", title: "Dune 3", releaseDate: nextWeek });
insertStatus("user-1", "m1", "watchlist");
const result = getUpcomingFeed("user-1", { days: 7 });
expect(result.items).toHaveLength(1);
expect(result.items[0].titleName).toBe("Dune 3");
expect(result.items[0].titleType).toBe("movie");
expect(result.items[0].date).toBe(nextWeek);
});
test("includes items airing today", () => {
const today = daysFromNow(0);
insertTvShow("tv-1", 100, 1, 1, { airDates: [today] });
insertStatus("user-1", "tv-1", "in_progress");
const result = getUpcomingFeed("user-1", { days: 7 });
expect(result.items).toHaveLength(1);
expect(result.items[0].date).toBe(today);
});
test("excludes items beyond the days window", () => {
const farFuture = daysFromNow(91);
insertTvShow("tv-1", 100, 1, 1, { airDates: [farFuture] });
insertStatus("user-1", "tv-1", "in_progress");
const result = getUpcomingFeed("user-1", { days: 90 });
expect(result.items).toHaveLength(0);
});
test("excludes titles not in user's library", () => {
const tomorrow = daysFromNow(1);
insertTvShow("tv-1", 100, 1, 1, { airDates: [tomorrow] });
// No insertStatus — not tracked
const result = getUpcomingFeed("user-1", { days: 7 });
expect(result.items).toHaveLength(0);
});
test("returns empty when no upcoming items", () => {
const result = getUpcomingFeed("user-1", { days: 7 });
expect(result.items).toHaveLength(0);
expect(result.nextCursor).toBeNull();
});
});
// ── Sorting ─────────────────────────────────────────────────────────
describe("sorting", () => {
test("sorts by date ascending, then title name", () => {
const day1 = daysFromNow(1);
const day2 = daysFromNow(2);
insertTvShow("tv-z", 101, 1, 1, { title: "Zebra Show", airDates: [day1] });
insertTvShow("tv-a", 102, 1, 1, { title: "Alpha Show", airDates: [day2] });
insertTvShow("tv-b", 103, 1, 1, { title: "Alpha Show 2", airDates: [day1] });
insertStatus("user-1", "tv-z", "in_progress");
insertStatus("user-1", "tv-a", "in_progress");
insertStatus("user-1", "tv-b", "in_progress");
const result = getUpcomingFeed("user-1", { days: 7 });
expect(result.items.map((i) => i.titleName)).toEqual([
"Alpha Show 2",
"Zebra Show",
"Alpha Show",
]);
});
test("merges movies and episodes in date order", () => {
const day1 = daysFromNow(1);
const day2 = daysFromNow(2);
insertTitle({ id: "m1", tmdbId: 1, type: "movie", title: "A Movie", releaseDate: day2 });
insertTvShow("tv-1", 100, 1, 1, { title: "A Show", airDates: [day1] });
insertStatus("user-1", "m1", "watchlist");
insertStatus("user-1", "tv-1", "in_progress");
const result = getUpcomingFeed("user-1", { days: 7 });
expect(result.items[0].titleType).toBe("tv");
expect(result.items[1].titleType).toBe("movie");
});
});
// ── Batch collapse ──────────────────────────────────────────────────
describe("batch collapse", () => {
test("collapses 3+ same-day episodes from the same title", () => {
const tomorrow = daysFromNow(1);
insertTvShow("tv-1", 100, 1, 4, {
title: "Batch Show",
airDates: [tomorrow, tomorrow, tomorrow, tomorrow],
});
insertStatus("user-1", "tv-1", "in_progress");
const result = getUpcomingFeed("user-1", { days: 7 });
expect(result.items).toHaveLength(1);
expect(result.items[0].episodeCount).toBe(4);
expect(result.items[0].episodeName).toBeNull();
});
test("does not collapse fewer than 3 same-day episodes", () => {
const tomorrow = daysFromNow(1);
insertTvShow("tv-1", 100, 1, 2, {
title: "Small Drop",
airDates: [tomorrow, tomorrow],
});
insertStatus("user-1", "tv-1", "in_progress");
const result = getUpcomingFeed("user-1", { days: 7 });
expect(result.items).toHaveLength(2);
expect(result.items[0].episodeCount).toBe(1);
expect(result.items[0].episodeName).toBe("S1E1");
});
test("does not collapse episodes on different dates", () => {
const day1 = daysFromNow(1);
const day2 = daysFromNow(2);
const day3 = daysFromNow(3);
insertTvShow("tv-1", 100, 1, 3, {
title: "Spread Show",
airDates: [day1, day2, day3],
});
insertStatus("user-1", "tv-1", "in_progress");
const result = getUpcomingFeed("user-1", { days: 7 });
expect(result.items).toHaveLength(3);
});
});
// ── Cursor pagination ───────────────────────────────────────────────
describe("cursor pagination", () => {
test("paginates with limit and returns nextCursor", () => {
const day1 = daysFromNow(1);
const day2 = daysFromNow(2);
const day3 = daysFromNow(3);
insertTvShow("tv-a", 101, 1, 1, { title: "Show A", airDates: [day1] });
insertTvShow("tv-b", 102, 1, 1, { title: "Show B", airDates: [day2] });
insertTvShow("tv-c", 103, 1, 1, { title: "Show C", airDates: [day3] });
insertStatus("user-1", "tv-a", "in_progress");
insertStatus("user-1", "tv-b", "in_progress");
insertStatus("user-1", "tv-c", "in_progress");
const page1 = getUpcomingFeed("user-1", { days: 7, limit: 2 });
expect(page1.items).toHaveLength(2);
expect(page1.items[0].titleName).toBe("Show A");
expect(page1.items[1].titleName).toBe("Show B");
expect(page1.nextCursor).not.toBeNull();
const page2 = getUpcomingFeed("user-1", { days: 7, limit: 2, cursor: page1.nextCursor! });
expect(page2.items).toHaveLength(1);
expect(page2.items[0].titleName).toBe("Show C");
expect(page2.nextCursor).toBeNull();
});
test("handles invalid cursor gracefully", () => {
const tomorrow = daysFromNow(1);
insertTvShow("tv-1", 100, 1, 1, { airDates: [tomorrow] });
insertStatus("user-1", "tv-1", "in_progress");
const result = getUpcomingFeed("user-1", { days: 7, cursor: "not-valid-base64!" });
expect(result.items).toHaveLength(1);
});
});
// ── isNewSeason ─────────────────────────────────────────────────────
describe("isNewSeason", () => {
test("marks episode 1 as new season for caught_up shows", () => {
const yesterday = daysFromNow(-1);
const tomorrow = daysFromNow(1);
// 2 seasons, 1 ep each; S1E1 aired yesterday, S2E1 airs tomorrow
const { episodeIds } = insertTvShow("tv-1", 100, 2, 1, {
title: "Returning Show",
airDates: [yesterday, tomorrow],
status: "Returning Series",
});
insertStatus("user-1", "tv-1", "in_progress");
// Watch S1E1 (the only aired episode) → caught_up display status
insertEpisodeWatch("user-1", episodeIds[0]);
const result = getUpcomingFeed("user-1", { days: 7 });
expect(result.items).toHaveLength(1);
expect(result.items[0].isNewSeason).toBe(true);
});
test("does not mark non-episode-1 as new season", () => {
const yesterday = daysFromNow(-1);
const tomorrow = daysFromNow(1);
// 1 season, 3 episodes — ep 1 aired yesterday, ep 2 and 3 air tomorrow
const { episodeIds } = insertTvShow("tv-1", 100, 1, 3, {
title: "Mid Show",
airDates: [yesterday, tomorrow, tomorrow],
status: "Returning Series",
});
insertStatus("user-1", "tv-1", "in_progress");
// Watch ep 1 (only aired episode) → caught_up
insertEpisodeWatch("user-1", episodeIds[0]);
const result = getUpcomingFeed("user-1", { days: 7 });
// episodes 2 and 3 air tomorrow (not collapsed since only 2)
expect(result.items.every((i) => i.isNewSeason === false)).toBe(true);
});
test("does not mark episode 1 as new season for watching shows", () => {
const yesterday = daysFromNow(-1);
const tomorrow = daysFromNow(1);
// 2 seasons, 1 ep each; S1E1 aired yesterday, S2E1 airs tomorrow
insertTvShow("tv-1", 100, 2, 1, {
airDates: [yesterday, tomorrow],
status: "Returning Series",
});
insertStatus("user-1", "tv-1", "in_progress");
// No episodes watched → display status is "watching", not "caught_up"
const result = getUpcomingFeed("user-1", { days: 7 });
expect(result.items).toHaveLength(1);
expect(result.items[0].isNewSeason).toBe(false);
});
});
// ── Streaming provider ──────────────────────────────────────────────
describe("streaming provider", () => {
test("attaches flatrate streaming provider", () => {
const tomorrow = daysFromNow(1);
insertTvShow("tv-1", 100, 1, 1, { airDates: [tomorrow] });
insertStatus("user-1", "tv-1", "in_progress");
const pId = insertPlatform({ id: "p-netflix", name: "Netflix", tmdbProviderId: 8 });
insertTitleAvailability("tv-1", pId, { offerType: "flatrate" });
const result = getUpcomingFeed("user-1", { days: 7 });
expect(result.items[0].streamingProvider).toEqual({
platformId: "p-netflix",
providerName: "Netflix",
logoPath: "/logo.png",
});
});
test("returns null when no flatrate provider exists", () => {
const tomorrow = daysFromNow(1);
insertTvShow("tv-1", 100, 1, 1, { airDates: [tomorrow] });
insertStatus("user-1", "tv-1", "in_progress");
const pId = insertPlatform({ id: "p-rent", tmdbProviderId: 99 });
insertTitleAvailability("tv-1", pId, { offerType: "rent" });
const result = getUpcomingFeed("user-1", { days: 7 });
expect(result.items[0].streamingProvider).toBeNull();
});
});