feat(onboarding): seed the catalog when the first artist is added in setup (chat#1889 row 8)

components/Onboarding/AddArtistForm.tsx

@@ -4,7 +4,7 @@ import { useState } from "react";
 import { Plus } from "lucide-react";
 import { Button } from "@/components/ui/button";
 import SpotifyArtistSearch from "@/components/Artists/SpotifyArtistSearch";
-import { useAddRosterArtist } from "@/hooks/onboarding/useAddRosterArtist";
+import { useAddSpotifyArtist } from "@/hooks/useAddSpotifyArtist";
 import type { SpotifyArtistSearchResult } from "@/types/spotify";
 
 /**
@@ -15,16 +15,19 @@ import type { SpotifyArtistSearchResult } from "@/types/spotify";
  * structurally unreachable for anyone who arrived without a funnel valuation
  * (chat#1889). Picking a real Spotify artist resolves the id, profile URL, and
  * avatar in one step, reusing the same typeahead as verify-socials (chat#1882).
+ *
+ * Adds through `useAddSpotifyArtist` — the same hook the `/artists` dialog uses
+ * — because it also kicks `POST /api/valuation` for the picked artist when the
+ * account has no catalog yet. Without that seeding an account onboarded here
+ * finished setup with nothing to value, so the reward on the completion panel
+ * could only ever render its "Claim your catalog" fallback (chat#1889 row 8).
  */
 const AddArtistForm = () => {
-  const { addArtist, isAdding } = useAddRosterArtist();
+  const { add, isAdding } = useAddSpotifyArtist();
   const [isOpen, setIsOpen] = useState(false);
 
   const handleSelect = async (artist: SpotifyArtistSearchResult) => {
-    const added = await addArtist(artist.name, {
-      profileUrl: artist.external_urls.spotify,
-      image: artist.images?.[0]?.url,
-    });
+    const added = await add(artist);
     if (added) setIsOpen(false);
   };
 

components/Onboarding/MeasuringCatalogPanel.tsx

@@ -0,0 +1,31 @@
+"use client";
+
+import Link from "next/link";
+import { buttonVariants } from "@/components/ui/button";
+import { cn } from "@/lib/utils";
+
+/**
+ * Terminal state for `/setup/valuation` while a catalog exists but has no
+ * valuation yet.
+ *
+ * Seeding (chat#1889 row 8) creates the catalog seconds after the first artist
+ * is added and its measurements land later, so this window is routine. Without
+ * a state of its own the route could neither redirect (there IS a catalog) nor
+ * render the hero, and sat on a skeleton with no exit.
+ */
+const MeasuringCatalogPanel = () => (
+  <section className="mx-auto flex w-full max-w-xl flex-col items-center gap-4 px-6 py-8 text-center">
+    <h1 className="text-2xl font-semibold text-foreground">
+      Measuring your catalog
+    </h1>
+    <p className="text-sm text-muted-foreground">
+      We are pulling play counts for every track. This usually takes a minute.
+      Your baseline value appears here as soon as it is ready.
+    </p>
+    <Link href="/setup/tasks" className={cn(buttonVariants(), "min-w-[200px]")}>
+      Set up your weekly report
+    </Link>
+  </section>
+);
+
+export default MeasuringCatalogPanel;

components/Onboarding/SetupValuation.tsx

@@ -6,6 +6,7 @@ import { useRouter } from "next/navigation";
 import { buttonVariants } from "@/components/ui/button";
 import { Skeleton } from "@/components/ui/skeleton";
 import ValuationHero from "@/components/Home/ValuationHero";
+import MeasuringCatalogPanel from "@/components/Onboarding/MeasuringCatalogPanel";
 import useCatalogs from "@/hooks/useCatalogs";
 import useHomeValuation from "@/hooks/useHomeValuation";
 import { cn } from "@/lib/utils";
@@ -36,7 +37,7 @@ const SetupValuation = () => {
     if (!hasCatalog || isError) router.replace("/catalogs");
   }, [isPending, hasCatalog, isError, router]);
 
-  if (isPending || !valuation.show) {
+  if (isPending) {
     return (
       <div className="mx-auto flex w-full max-w-xl flex-col gap-4 px-6 py-8">
         <Skeleton className="h-8 w-1/2 rounded-lg" />
@@ -45,6 +46,10 @@ const SetupValuation = () => {
     );
   }
 
+  // A catalog exists but has no valuation yet: routine while a seeded
+  // valuation is still measuring (chat#1889 row 8).
+  if (!valuation.show) return <MeasuringCatalogPanel />;
+
   return (
     <section className="mx-auto flex w-full max-w-xl flex-col items-center gap-4 px-6 py-8">
       <ValuationHero

components/Onboarding/__tests__/AddArtistForm.test.tsx

@@ -4,18 +4,20 @@ import { fireEvent, render, screen } from "@testing-library/react";
 import { beforeEach, describe, expect, it, vi } from "vitest";
 import AddArtistForm from "@/components/Onboarding/AddArtistForm";
 
-const addArtist = vi.fn();
+const add = vi.fn();
 
 const SPOTIFY_RESULT = {
   id: "3TVXtAsR1Inumwj472S9r4",
   name: "Drake",
-  external_urls: { spotify: "https://open.spotify.com/artist/3TVXtAsR1Inumwj472S9r4" },
+  external_urls: {
+    spotify: "https://open.spotify.com/artist/3TVXtAsR1Inumwj472S9r4",
+  },
   images: [{ url: "https://i.scdn.co/image/drake.jpg" }],
   followers: { total: 92000000 },
 };
 
-vi.mock("@/hooks/onboarding/useAddRosterArtist", () => ({
-  useAddRosterArtist: () => ({ addArtist, isAdding: false }),
+vi.mock("@/hooks/useAddSpotifyArtist", () => ({
+  useAddSpotifyArtist: () => ({ add, isAdding: false }),
 }));
 
 vi.mock("@/hooks/useSpotifyArtistSearch", () => ({
@@ -27,8 +29,8 @@ vi.mock("@/hooks/useSpotifyArtistSearch", () => ({
 
 describe("AddArtistForm", () => {
   beforeEach(() => {
-    addArtist.mockClear();
-    addArtist.mockResolvedValue(true);
+    add.mockClear();
+    add.mockResolvedValue(true);
   });
 
   const openForm = () => {
@@ -46,13 +48,15 @@ describe("AddArtistForm", () => {
     expect(screen.getByLabelText(/search spotify for an artist/i)).toBeDefined();
   });
 
-  it("resolves the picked artist to its Spotify profile URL and avatar", () => {
+  // useAddSpotifyArtist seeds the onboarding catalog by kicking POST
+  // /api/valuation for the picked artist when the account has none yet.
+  // useAddRosterArtist never did, so an account onboarded here finished setup
+  // with no catalog and the valuation reward could only show its fallback
+  // (chat#1889 row 8).
+  it("adds through the hook that seeds the catalog, passing the whole Spotify result", () => {
     openForm();
     fireEvent.click(screen.getByRole("option", { name: /drake/i }));
 
-    expect(addArtist).toHaveBeenCalledWith("Drake", {
-      profileUrl: SPOTIFY_RESULT.external_urls.spotify,
-      image: SPOTIFY_RESULT.images[0].url,
-    });
+    expect(add).toHaveBeenCalledWith(SPOTIFY_RESULT);
   });
 });

components/Onboarding/__tests__/SetupValuation.test.tsx

@@ -94,4 +94,23 @@ describe("SetupValuation", () => {
     expect(getByText("hero")).toBeDefined();
     expect(replace).not.toHaveBeenCalled();
   });
+  // Seeding (chat#1889 row 8) creates the catalog seconds after the first
+  // artist is added, but its measurements land later — so this window is now
+  // routine, not theoretical. Without a terminal state the route renders a
+  // skeleton forever: the redirect cannot fire (there IS a catalog) and the
+  // hero cannot render (nothing measured yet).
+  it("shows a measuring state, not an endless skeleton, when the catalog has no valuation yet", () => {
+    catalogsResult = {
+      data: { catalogs: [{ id: "cat-1" }] },
+      isLoading: false,
+      isPending: false,
+      isError: false,
+    };
+    valuationResult = { show: false };
+
+    const { getByText } = render(<SetupValuation />);
+
+    expect(getByText(/measuring your catalog/i)).toBeDefined();
+    expect(replace).not.toHaveBeenCalled();
+  });
 });

hooks/useAddSpotifyArtist.ts

@@ -13,8 +13,9 @@ import type { SpotifyArtistSearchResult } from "@/types/spotify";
 
 /**
  * Adds a Spotify-searched artist to the roster and refreshes + selects it.
- * Wraps `addSpotifyArtist` with auth + the shared roster (ArtistProvider),
- * mirroring `useAddRosterArtist`.
+ * Wraps `addSpotifyArtist` with auth + the shared roster (ArtistProvider).
+ * The onboarding roster step adds through this hook too, so a first artist
+ * added during setup seeds the catalog the same way (chat#1889 row 8).
  *
  * On the **first** artist add (the account has no catalog yet) it also
  * fire-and-forget kicks `POST /api/valuation` for that artist's Spotify id —

lib/artists/__tests__/addSpotifyArtist.test.ts

@@ -56,4 +56,16 @@ describe("addSpotifyArtist", () => {
       profileUrls: { SPOTIFY: spotifyArtist.external_urls.spotify },
     });
   });
+
+  // POST /api/artists has already succeeded by the time enrichment runs, so a
+  // failing PATCH must not fail the whole add: the caller would report failure
+  // over an artist that exists, and picking again creates a duplicate
+  // (chat#1889, same defect fixed in useAddRosterArtist).
+  it("returns the created artist when enrichment fails", async () => {
+    vi.mocked(saveArtist).mockRejectedValue(new Error("Forbidden"));
+
+    const result = await addSpotifyArtist(token, spotifyArtist, "org-1");
+
+    expect(result.account_id).toBe("acc-1");
+  });
 });