Harden the parsing, and mark unread changelog entries

Stress-testing the beta with request shapes we had not tried turned up two
more ways to hit the same class of bug. Roles were compared exactly, so a
client sending "Assistant" instead of "assistant" fell straight into the
dingus error. And content was assumed to be a string, so OpenAI's multipart
array form did the same. Roles are now compared case-insensitively and
content is flattened to text first; messages with no usable text are
skipped rather than mistaken for a slot. The slots are plain strings now,
so no caller can reach past them to a raw field again.

Separately: the Changelog button carries a dot when the current release
has not been opened yet, on the desktop button, the mobile menu item, and
the hamburger that hides it. The marker is the version in localStorage, so
every release brings it back on its own and reading it once clears it. The
version is a single constant now rather than being written in two places.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01NX2SsmUqQftWTZAY4BDuFa

src/app/api/proxy/route.ts

@@ -121,16 +121,16 @@ function removePersonaTags(content: string): string {
 function extractCardData(messages: Message[]): ExtractedCard {
   const { system, greeting, nameSlot } = selectMessageSlots(messages);
 
-  if (!system?.content) {
+  if (!system) {
     throw new Error("No system message: this request carries no character card.");
   }
-  if (!greeting?.content) {
+  if (!greeting) {
     throw new Error("No assistant message: this chat has no greeting to read.");
   }
 
-  const first_mes = greeting.content.replace(/{user}/g, "{{user}}");
+  const first_mes = greeting.replace(/{user}/g, "{{user}}");
 
-  const nameContent = nameSlot?.content ?? "";
+  const nameContent = nameSlot ?? "";
   // If the name slot is actually a token, ignore it for naming purposes
   const tokenInNameSlot = parseConversationToken(nameContent);
   const lastColonIndex = nameContent.lastIndexOf(": ");
@@ -140,7 +140,7 @@ function extractCardData(messages: Message[]): ExtractedCard {
     ? nameContent.substring(lastColonIndex + 2).trim()
     : "";
 
-  let content = system.content.replace(/{user}/g, "{{user}}");
+  let content = system.replace(/{user}/g, "{{user}}");
   const inferredName = extractPersonaName(content);
   content = removePersonaTags(content);
 

src/app/page.tsx

@@ -67,9 +67,36 @@ interface Card {
   initialVersion?: CardDataV2;
 }
 
+/** Bumped once per release; the changelog dot keys off it. */
+const APP_VERSION = "2.5";
+const CHANGELOG_SEEN_KEY = "sucker:changelog-seen";
+
 export default function Home() {
   const [cards, setCards] = useState<Card[]>([]);
+  // The changelog dot. Starts hidden so the server and the first client render
+  // agree; the effect below turns it on for anyone who has not opened the
+  // dialog since this version shipped.
+  const [changelogSeen, setChangelogSeen] = useState(true);
   const [dialogOpen, setDialogOpen] = useState(false);
+  useEffect(() => {
+    try {
+      setChangelogSeen(localStorage.getItem(CHANGELOG_SEEN_KEY) === APP_VERSION);
+    } catch {
+      // Private mode or blocked storage: just leave the dot off.
+    }
+  }, []);
+
+  /** Open the changelog and remember that this version has been read. */
+  const openChangelog = () => {
+    setChangelogDialogOpen(true);
+    setChangelogSeen(true);
+    try {
+      localStorage.setItem(CHANGELOG_SEEN_KEY, APP_VERSION);
+    } catch {
+      // Nothing to do; the dot simply comes back next time.
+    }
+  };
+
   const [selectedCardIndex, setSelectedCardIndex] = useState<number | null>(
     null
   );
@@ -373,15 +400,21 @@ export default function Home() {
           {/* Row 1: Title on left, Hamburger on right */}
           <div className="flex justify-between items-start mb-3">
             <div>
-              <h1 className="text-2xl font-bold">Sucker v2.5</h1>
+              <h1 className="text-2xl font-bold">Sucker v{APP_VERSION}</h1>
               <p className="text-xs text-muted-foreground">
                 New: a live CSS editor for your profile.
               </p>
             </div>
             <DropdownMenu>
               <DropdownMenuTrigger asChild>
-                <Button variant="outline" size="icon">
+                <Button variant="outline" size="icon" className="relative">
                   <Menu className="h-4 w-4" />
+                  {!changelogSeen && (
+                    <span
+                      aria-label="New changelog entry"
+                      className="absolute -top-1 -right-1 h-2.5 w-2.5 rounded-full bg-sky-500 ring-2 ring-background"
+                    />
+                  )}
                 </Button>
               </DropdownMenuTrigger>
               <DropdownMenuContent align="end">
@@ -391,8 +424,11 @@ export default function Home() {
                 <DropdownMenuItem onClick={() => setMirrorsDialogOpen(true)}>
                   Mirrors
                 </DropdownMenuItem>
-                <DropdownMenuItem onClick={() => setChangelogDialogOpen(true)}>
+                <DropdownMenuItem onClick={openChangelog}>
                   Changelog
+                  {!changelogSeen && (
+                    <span className="ml-2 h-2 w-2 rounded-full bg-sky-500" />
+                  )}
                 </DropdownMenuItem>
               </DropdownMenuContent>
             </DropdownMenu>
@@ -411,7 +447,7 @@ export default function Home() {
         {/* Desktop Layout */}
         <div className="hidden sm:flex justify-between items-center mb-4">
           <div>
-            <h1 className="text-3xl font-bold">Sucker v2.5</h1>
+            <h1 className="text-3xl font-bold">Sucker v{APP_VERSION}</h1>
             <p className="text-sm text-muted-foreground">
               New: a live CSS editor for your profile.
             </p>
@@ -430,10 +466,17 @@ export default function Home() {
               Mirrors
             </Button>
             <Button
-              onClick={() => setChangelogDialogOpen(true)}
+              onClick={openChangelog}
               variant="outline"
+              className="relative"
             >
               Changelog
+              {!changelogSeen && (
+                <span
+                  aria-label="New changelog entry"
+                  className="absolute -top-1 -right-1 h-2.5 w-2.5 rounded-full bg-sky-500 ring-2 ring-background"
+                />
+              )}
             </Button>
             <Button
               onClick={fetchCards}