Merge watchlist and watching into a single "Watching" status

The distinction between "Watchlist" and "Watching" added no value — the
progress bar already shows whether you've started. Now there are just two
visible states: Watching (amber) and Completed (green).

Adding a show via "+ Watchlist" now sets in_progress directly, and both
the old watchlist and in_progress DB values render as "Watching" for
backward compatibility.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

app/(pages)/titles/[id]/_components/actions.ts

@@ -24,7 +24,7 @@ async function getSessionUserId() {
 
 export async function updateTitleStatus(
   titleId: string,
-  status: "watchlist" | null,
+  status: "in_progress" | null,
 ) {
   const userId = await getSessionUserId();
   if (status === null) {

app/(pages)/titles/[id]/_components/title-interaction-provider.tsx

@@ -84,17 +84,10 @@ export function TitleInteractionProvider({
   const handleStatusChange = useCallback(
     async (status: string | null) => {
       const prev = userStatus;
-      setUserStatus(status);
+      setUserStatus(status === "watchlist" ? "in_progress" : status);
       try {
-        await updateTitleStatus(
-          titleId,
-          status === "watchlist" ? "watchlist" : null,
-        );
-        toast.success(
-          status === "watchlist"
-            ? "Added to watchlist"
-            : "Removed from library",
-        );
+        await updateTitleStatus(titleId, status ? "in_progress" : null);
+        toast.success(status ? "Added to watchlist" : "Removed from library");
       } catch {
         setUserStatus(prev);
         toast.error("Failed to update status");

components/status-button.tsx

@@ -1,7 +1,6 @@
 "use client";
 
 import {
-  IconBookmarkFilled,
   IconCheck,
   IconPlayerPlayFilled,
   IconPlus,
@@ -9,21 +8,17 @@ import {
 } from "@tabler/icons-react";
 import { AnimatePresence, motion } from "motion/react";
 
+const watchingStyle = {
+  label: "Watching",
+  icon: IconPlayerPlayFilled,
+  class: "text-status-watching",
+  bgClass: "bg-status-watching/10 hover:bg-status-watching/15",
+  borderClass: "ring-status-watching/20",
+};
+
 const statusConfig = {
-  watchlist: {
-    label: "Watchlist",
-    icon: IconBookmarkFilled,
-    class: "text-status-watchlist",
-    bgClass: "bg-status-watchlist/10 hover:bg-status-watchlist/15",
-    borderClass: "ring-status-watchlist/20",
-  },
-  in_progress: {
-    label: "Watching",
-    icon: IconPlayerPlayFilled,
-    class: "text-status-watching",
-    bgClass: "bg-status-watching/10 hover:bg-status-watching/15",
-    borderClass: "ring-status-watching/20",
-  },
+  watchlist: watchingStyle,
+  in_progress: watchingStyle,
   completed: {
     label: "Completed",
     icon: IconCheck,